import React from 'react';
import { Icon, Balloon, Dialog } from '@alifd/next';

const renderer = {
  toolTip(tips, follow, add) {
    return (
      <>
        {add || null}
        {tips ? (
          <Balloon.Tooltip trigger={<Icon type="info-r-o" size="small" />} pure>
            <pre>{tips}</pre>
          </Balloon.Tooltip>
        ) : null}
        {follow || null}
      </>
    );
  },

  /**
   * open a dialog with content
   *
   * @param {Object} con content
   * @param {Object} styles styles
   */
  dialog(con, styles = {}) {
    Dialog.show({
      closeable: true,
      content: (
        <div
          className="diagnose_dialog"
          style={{
            width: 1200,
            padding: '20px 20px',
            overflowY: 'auto',
            textAlign: 'center',
            ...styles
          }}
        >
          {con}
        </div>
      ),
      footer: false
    });
  }
};
export default renderer;
