@flatbiz/antd/dist/tips-wrapper-Bf9nfZq3.js

/*! @flatjs/forge MIT @flatbiz/antd */

import { b as _objectSpread2 } from './_rollupPluginBabelHelpers-BYm17lo8.js';
import { classNames } from '@dimjs/utils/class-names/class-names';
import _QuestionCircleOutlined from '@ant-design/icons/es/icons/QuestionCircleOutlined.js';
import { Fragment } from 'react';
import { Tooltip, Popover } from 'antd';
import { isUndefinedOrNull } from '@flatbiz/utils';
import { jsx, jsxs } from 'react/jsx-runtime';

/**
 * 为目标元素右侧添加Icon
 * ```
 * Icon有两种交互行为
 * 1. 鼠标悬浮显示提示效果;
 * 2. 为Icon添加点击事件
 *
 * 例如：
 * 1.
 * <TipsWrapper tipType="tooltip" tooltipProps={{ title:'说明文案' }}>ABC</TipsWrapper>
 * 2.
 * <TipsWrapper tipType="popover" popoverProps={{ title:'说明标题', content:'说明内容' }}>ABC</TipsWrapper>
 * 3.
 * <TipsWrapper onClick={noop}>ABC</TipsWrapper>
 * ```
 */
var TipsWrapper = function TipsWrapper(props) {
  var icon = props.icon || /*#__PURE__*/jsx(_QuestionCircleOutlined, {});
  var trigger = props.trigger || 'icon';
  var gap = isUndefinedOrNull(props.gap) ? 3 : props.gap;
  if (props.tipType === 'tooltip' && trigger === 'icon') {
    return /*#__PURE__*/jsxs("span", {
      className: classNames('tips-wrapper', props.className),
      style: props.style,
      children: [/*#__PURE__*/jsx("span", {
        className: "tips-wrapper-text",
        style: {
          marginRight: gap
        },
        children: props.children
      }), /*#__PURE__*/jsx(Tooltip, _objectSpread2(_objectSpread2({}, props.tooltipProps), {}, {
        children: /*#__PURE__*/jsx("span", {
          className: "tips-wrapper-icon",
          children: icon
        })
      }))]
    });
  }
  if (props.tipType === 'tooltip' && trigger === 'all') {
    return /*#__PURE__*/jsx(Tooltip, _objectSpread2(_objectSpread2({}, props.tooltipProps), {}, {
      children: /*#__PURE__*/jsxs("span", {
        className: classNames('tips-wrapper', props.className),
        style: props.style,
        children: [/*#__PURE__*/jsx("span", {
          className: "tips-wrapper-text",
          style: {
            marginRight: gap
          },
          children: props.children
        }), /*#__PURE__*/jsx("span", {
          className: "tips-wrapper-icon",
          children: icon
        })]
      })
    }));
  }
  if (props.tipType === 'popover' && trigger === 'icon') {
    return /*#__PURE__*/jsxs("span", {
      className: classNames('tips-wrapper', props.className),
      style: props.style,
      children: [/*#__PURE__*/jsx("span", {
        className: "tips-wrapper-text",
        style: {
          marginRight: gap
        },
        children: props.children
      }), /*#__PURE__*/jsx(Popover, _objectSpread2(_objectSpread2({}, props.popoverProps), {}, {
        children: /*#__PURE__*/jsx("span", {
          className: "tips-wrapper-icon",
          children: icon
        })
      }))]
    });
  }
  if (props.tipType === 'popover' && trigger === 'all') {
    return /*#__PURE__*/jsx(Popover, _objectSpread2(_objectSpread2({}, props.popoverProps), {}, {
      children: /*#__PURE__*/jsxs("span", {
        className: classNames('tips-wrapper', props.className),
        style: props.style,
        children: [/*#__PURE__*/jsx("span", {
          className: "tips-wrapper-text",
          style: {
            marginRight: gap
          },
          children: props.children
        }), /*#__PURE__*/jsx("span", {
          className: "tips-wrapper-icon",
          children: icon
        })]
      })
    }));
  }
  if (props.onClick && trigger === 'icon') {
    return /*#__PURE__*/jsxs("span", {
      className: classNames('tips-wrapper', props.className),
      style: props.style,
      children: [/*#__PURE__*/jsx("span", {
        className: "tips-wrapper-text",
        style: {
          marginRight: gap
        },
        children: props.children
      }), /*#__PURE__*/jsx("span", {
        onClick: props.onClick,
        className: "tips-wrapper-icon",
        children: icon
      })]
    });
  }
  if (props.onClick && trigger === 'all') {
    return /*#__PURE__*/jsxs("span", {
      className: classNames('tips-wrapper', props.className),
      style: props.style,
      onClick: props.onClick,
      children: [/*#__PURE__*/jsx("span", {
        className: "tips-wrapper-text",
        style: {
          marginRight: gap
        },
        children: props.children
      }), /*#__PURE__*/jsx("span", {
        className: "tips-wrapper-icon",
        children: icon
      })]
    });
  }
  if (props.icon) {
    return /*#__PURE__*/jsxs("span", {
      className: classNames('tips-wrapper', props.className),
      style: props.style,
      children: [/*#__PURE__*/jsx("span", {
        className: "tips-wrapper-text",
        style: {
          marginRight: gap
        },
        children: props.children
      }), /*#__PURE__*/jsx("span", {
        className: "tips-wrapper-icon",
        children: icon
      })]
    });
  }
  return /*#__PURE__*/jsx(Fragment, {
    children: props.children
  });
};

export { TipsWrapper as T };
//# sourceMappingURL=tips-wrapper-Bf9nfZq3.js.map