@seafile/sea-email-editor 0.0.1

package/dist/components/option/index.js

@@ -0,0 +1,39 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
+const Option = _ref => {
+  let {
+    option,
+    className,
+    children
+  } = _ref;
+  if (!option) return null;
+  const {
+    color,
+    text_color,
+    border_color = 'transparent',
+    name,
+    display_name
+  } = option;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    style: {
+      color: text_color,
+      borderColor: border_color,
+      backgroundColor: color
+    },
+    className: (0, _classnames.default)('sea-email-ui-option', className),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "sea-email-ui-option-name",
+      children: display_name || name
+    }), children]
+  });
+};
+var _default = exports.default = Option;

package/dist/components/options-editor/container/index.css

@@ -0,0 +1,49 @@
+.sea-email-option-editor-popover .sea-email-option-editor-container {
+  padding: 8px 0;
+  min-height: 40px;
+}
+
+.sea-email-option-editor-popover .sea-email-option-editor-selected-value-wrapper {
+  background-color: var(--sea-email-body-secondary-bg);
+  border-radius: 4px 4px 0 0;
+  line-height: 1;
+  max-height: 150px;
+  min-height: 28px;
+  overflow-y: auto;
+  padding: 8px 12px;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+}
+
+.sea-email-option-editor-popover .sea-email-option-editor-search-wrapper {
+  padding: 0 12px 8px 12px;
+}
+
+.sea-email-option-editor-container.search-enabled {
+  padding: 12px 0;
+}
+
+.sea-email-option-editor-container.search-enabled.small-size-option .sea-email-option-editor-option {
+  padding: 0 8px;
+}
+
+.sea-email-option-editor-container.selected-value-display.search-enabled {
+  padding-top: 0;
+}
+
+.sea-email-option-editor-container.search-enabled.add-search-result-enabled {
+  padding-bottom: 0;
+}
+
+.sea-email-option-editor-container.selected-value-display.search-enabled .sea-email-option-editor-search-wrapper {
+  padding-top: 12px;
+}
+
+.sea-email-option-editor-container.selected-value-display.search-enabled.small-size-option .sea-email-option-editor-search-wrapper {
+  padding-top: 8px;
+}
+
+.sea-email-option-editor-container:not(.search-enabled) .sea-email-option-editor-content {
+  padding: 0 8px;
+}

package/dist/components/options-editor/container/index.js

@@ -0,0 +1,122 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _searchInput = _interopRequireDefault(require("../../search-input"));
+var _search = require("@/utils/search");
+var _constants = require("@/constants");
+var _options = _interopRequireDefault(require("../options"));
+var _typeDetection = require("@/utils/type-detection");
+require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
+const SEARCH_SIZE = 30;
+const OptionEditorContainer = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+  let {
+    id,
+    isMultiple = false,
+    isSearchEnabled = true,
+    checkPlacement = 'right',
+    className,
+    optionClassName,
+    placeholder,
+    value: propsValue = '',
+    options = [],
+    maxHeight = 240,
+    optionHeight = 32,
+    children,
+    onChange,
+    onToggle,
+    onPressTab
+  } = _ref;
+  const [value, setValue] = (0, _react.useState)(propsValue || (isMultiple ? [] : ''));
+  const [searchValue, setSearchValue] = (0, _react.useState)('');
+  const [displayOptions, setDisplayOptions] = (0, _react.useState)(options);
+  const onSearchValueChange = (0, _react.useCallback)(newSearchValue => {
+    if (searchValue === newSearchValue) return;
+    setSearchValue(newSearchValue);
+  }, [searchValue]);
+  const toggleOption = (0, _react.useCallback)(optionValue => {
+    if (isMultiple) {
+      let newValue = Array.isArray(value) ? value.slice(0) : [];
+      const optionIndex = newValue.findIndex(v => v === optionValue);
+      if (optionIndex === -1) {
+        newValue.push(optionValue);
+      } else {
+        newValue.splice(optionIndex, 1);
+      }
+      setValue(newValue);
+      onChange && onChange(newValue);
+      return;
+    }
+    const newValue = optionValue === value ? '' : optionValue;
+    setValue(newValue);
+    onChange && onChange(newValue);
+    onToggle && onToggle();
+  }, [isMultiple, value, onChange, onToggle]);
+  const onKeyDown = (0, _react.useCallback)(event => {
+    if (event.keyCode === _constants.KeyCodes.ChineseInputMethod || event.keyCode === _constants.KeyCodes.LeftArrow || event.keyCode === _constants.KeyCodes.RightArrow) {
+      event.stopPropagation();
+    }
+  }, []);
+  (0, _react.useEffect)(() => {
+    setDisplayOptions((0, _search.searchOptions)(options, searchValue));
+  }, [searchValue, options]);
+  (0, _react.useImperativeHandle)(ref, () => ({
+    getValue: () => {
+      return value;
+    },
+    setValue: value => {
+      setValue(value);
+    }
+  }), [value]);
+  let validMaxHeight = maxHeight - (isSearchEnabled ? 26 : 18); // 26: padding-top(12/8) + padding-bottom(12/8) + border(2)
+  if (displayOptions.length > 0) {
+    validMaxHeight = Math.min(validMaxHeight, displayOptions.length * ((0, _typeDetection.isNumber)(optionHeight) ? optionHeight : 32));
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    id: id,
+    className: (0, _classnames.default)('sea-email-option-editor-container', className, {
+      'search-enabled': isSearchEnabled,
+      'selected-value-display': children,
+      'small-size-option': SEARCH_SIZE <= 30
+    }),
+    children: [children && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "sea-email-option-editor-selected-value-wrapper",
+      children: typeof children === 'function' ? children({
+        value,
+        onChange: toggleOption
+      }) : children
+    }), isSearchEnabled && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "sea-email-option-editor-search-wrapper",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_searchInput.default, {
+        isShowSearchIcon: false,
+        autoFocus: true,
+        value: searchValue,
+        size: SEARCH_SIZE,
+        placeholder: placeholder,
+        onKeyDown: onKeyDown,
+        onChange: onSearchValueChange
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_options.default, {
+      hasAvailableOptions: options.length > 0,
+      options: displayOptions,
+      maxHeight: validMaxHeight,
+      isSearchEnabled: isSearchEnabled,
+      searchValue: searchValue,
+      value: value,
+      checkPlacement: checkPlacement,
+      optionHeight: optionHeight,
+      optionClassName: optionClassName,
+      onToggleOption: toggleOption,
+      onPressTab: onPressTab,
+      onToggle: onToggle
+    })]
+  });
+});
+var _default = exports.default = OptionEditorContainer;

package/dist/components/options-editor/index.css

@@ -0,0 +1,26 @@
+.sea-email-option-editor-popover .popover {
+  left: 0;
+  min-height: auto;
+  position: absolute;
+  min-width: 100px;
+  width: fit-content;
+  max-width: 300px;
+  z-index: 9999;
+  filter: none !important;
+  background-color: #fff !important;
+  border: 1px solid var(--sea-email-border-secondary-color) !important;
+  border-radius: 8px !important;
+  box-shadow: 0 6px 14px rgba(000, 000, 000, 0.1) !important;
+}
+
+.sea-email-option-editor-popover .popover .popover-inner {
+  max-width: 100%;
+  width: 100%;
+  height: 100%;
+}
+
+.sea-email-option-editor-popover .popover.bs-popover-auto[data-popper-placement^=top],
+.sea-email-option-editor-popover .popover.bs-popover-top {
+  bottom: -4px !important;
+  margin-bottom: 0;
+}

package/dist/components/options-editor/index.js

@@ -0,0 +1,70 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _popover = _interopRequireDefault(require("../popover"));
+var _container = _interopRequireDefault(require("./container"));
+require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
+const OptionsEditor = _ref => {
+  let {
+    id,
+    target,
+    isMultiple = false,
+    isSearchEnabled = true,
+    sameWidthWithTarget = false,
+    checkPlacement = 'right',
+    optionClassName = '',
+    contentClassName = '',
+    placeholder,
+    placement,
+    value,
+    className,
+    options = [],
+    optionHeight,
+    modifiers,
+    onChange,
+    onToggle,
+    onCreate
+  } = _ref;
+  const containerRef = (0, _react.useRef)(null);
+  const handleClose = (0, _react.useCallback)(() => {
+    if (isMultiple) {
+      const value = containerRef.current.getValue();
+      onChange(value);
+    }
+    onToggle && onToggle();
+  }, [isMultiple, onChange, onToggle]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_popover.default, {
+    target: target,
+    className: (0, _classnames.default)('sea-email-option-editor-popover', className),
+    placement: placement,
+    modifiers: modifiers,
+    sameWidthWithTarget: sameWidthWithTarget,
+    hidePopover: handleClose,
+    hidePopoverWithEsc: handleClose,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_container.default, {
+      id: id,
+      ref: containerRef,
+      isMultiple: isMultiple,
+      placeholder: placeholder,
+      isSearchEnabled: isSearchEnabled,
+      checkPlacement: checkPlacement,
+      optionClassName: optionClassName,
+      className: contentClassName,
+      value: value,
+      options: options,
+      optionHeight: optionHeight,
+      onChange: onChange,
+      onToggle: onToggle,
+      onCreate: onCreate
+    })
+  });
+};
+var _default = exports.default = OptionsEditor;

package/dist/components/options-editor/options/index.css

@@ -0,0 +1,5 @@
+.sea-email-option-editor-content {
+  max-height: 200px;
+  overflow: auto;
+  padding: 0 12px;
+}

package/dist/components/options-editor/options/index.js

@@ -0,0 +1,138 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _typeDetection = require("@/utils/type-detection");
+var _hotkey = require("@/utils/hotkey");
+var _centeredLoading = _interopRequireDefault(require("../../centered-loading"));
+var _option = _interopRequireDefault(require("./option"));
+require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
+const Options = _ref => {
+  let {
+    isLoading = false,
+    options,
+    maxHeight,
+    value,
+    checkPlacement,
+    optionHeight,
+    optionClassName,
+    onToggleOption,
+    onPressTab,
+    onToggle
+  } = _ref;
+  const maxItemNum = (0, _react.useMemo)(() => (0, _typeDetection.isNumber)(optionHeight) ? Math.floor(parseInt(maxHeight) / parseInt(optionHeight)) - 1 : 30, [maxHeight, optionHeight]);
+  const optionsRef = (0, _react.useRef)(null);
+  const [highlightIndex, setHighlightIndex] = (0, _react.useState)(-1);
+  const onOptionMouseEnter = (0, _react.useCallback)(highlightIndex => {
+    setHighlightIndex(highlightIndex);
+  }, []);
+  const onOptionMouseLeave = (0, _react.useCallback)(() => {
+    setHighlightIndex(-1);
+  }, []);
+  const onEnter = (0, _react.useCallback)(event => {
+    event.preventDefault();
+    let option;
+    if (options.length === 1) {
+      option = options[0];
+    } else if (highlightIndex > -1) {
+      option = options[highlightIndex];
+    }
+    if (!option) return;
+    onToggleOption(option.value);
+  }, [options, highlightIndex, onToggleOption]);
+  const onUpArrow = (0, _react.useCallback)(event => {
+    event.preventDefault();
+    event.stopPropagation();
+    if (highlightIndex > 0) {
+      setHighlightIndex(highlightIndex - 1);
+      if (highlightIndex < options.length - maxItemNum) {
+        optionsRef.current.scrollTop -= (0, _typeDetection.isNumber)(optionHeight) ? optionHeight : 30;
+      }
+    } else {
+      setHighlightIndex(options.length - 1);
+      optionsRef.current.scrollTop = optionsRef.current.scrollHeight;
+    }
+  }, [optionsRef, highlightIndex, maxItemNum, options, optionHeight]);
+  const onDownArrow = (0, _react.useCallback)(event => {
+    event.preventDefault();
+    event.stopPropagation();
+    if (highlightIndex < options.length - 1) {
+      setHighlightIndex(highlightIndex + 1);
+      if (highlightIndex >= maxItemNum) {
+        optionsRef.current.scrollTop += (0, _typeDetection.isNumber)(optionHeight) ? optionHeight : 30;
+      }
+    } else {
+      setHighlightIndex(0);
+      optionsRef.current.scrollTop = 0;
+    }
+  }, [optionsRef, highlightIndex, maxItemNum, options, optionHeight]);
+  const onEsc = (0, _react.useCallback)(event => {
+    event.preventDefault();
+    event.stopPropagation();
+    onToggle && onToggle();
+  }, [onToggle]);
+  const onHotKey = (0, _react.useCallback)(event => {
+    if ((0, _hotkey.isEnter)(event)) {
+      onEnter(event);
+    } else if ((0, _hotkey.isUpArrow)(event)) {
+      onUpArrow(event);
+    } else if ((0, _hotkey.isDownArrow)(event)) {
+      onDownArrow(event);
+    } else if ((0, _hotkey.isTab)(event)) {
+      if ((0, _typeDetection.isFunction)(onPressTab)) {
+        onPressTab(event);
+      }
+    } else if ((0, _hotkey.isEsc)(event)) {
+      onEsc(event);
+    }
+  }, [onEnter, onUpArrow, onDownArrow, onPressTab, onEsc]);
+  (0, _react.useEffect)(() => {
+    document.addEventListener('keydown', onHotKey, true);
+    return () => {
+      document.removeEventListener('keydown', onHotKey, true);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [onHotKey]);
+  (0, _react.useEffect)(() => {
+    setHighlightIndex(-1);
+  }, [options]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classnames.default)('sea-email-option-editor-content', {
+      'empty': options.length === 0
+    }),
+    style: {
+      maxHeight,
+      minHeight: (0, _typeDetection.isNumber)(optionHeight) ? optionHeight : 20
+    },
+    ref: optionsRef,
+    children: [isLoading && /*#__PURE__*/(0, _jsxRuntime.jsx)(_centeredLoading.default, {
+      style: {
+        minHeight: '100px'
+      }
+    }), !isLoading && options.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: options.map((option, i) => {
+        const isSelected = value && Array.isArray(value) ? value.includes(option.value) : value === option.value;
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_option.default, {
+          className: optionClassName,
+          checkPlacement: checkPlacement,
+          highlight: highlightIndex === i,
+          isSelected: isSelected,
+          option: option,
+          height: optionHeight,
+          index: i,
+          onChange: onToggleOption,
+          onMouseEnter: onOptionMouseEnter,
+          onMouseLeave: onOptionMouseLeave
+        }, option.value);
+      })
+    })]
+  });
+};
+var _default = exports.default = Options;

package/dist/components/options-editor/options/option/index.css

@@ -0,0 +1,54 @@
+.sea-email-option-editor-option {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 14px;
+  height: 32px;
+  width: 100%;
+  padding: 0 12px;
+}
+
+.sea-email-option-editor-option:not(.disabled):hover,
+.sea-email-option-editor-option:not(.disabled).active {
+  background-color: var(--sea-email-option-bg-color);
+  cursor: pointer;
+  border-radius: 4px;
+}
+
+.sea-email-option-editor-option.disabled * {
+  color: var(--sea-email-disabled-color);
+}
+
+.sea-email-option-editor-option .sea-email-option-editor-option-content {
+  flex: 1;
+  overflow: hidden;
+  display: flex;
+  align-items: center;
+}
+
+.sea-email-option-editor-option .sea-email-option-editor-option-content .sea-email-option-editor-option-icon,
+.sea-email-option-editor-option .sea-email-option-editor-option-content .sea-email-option-editor-option-icon .sea-email-editor-icon-svg {
+  height: 16px;
+  width: 16px;
+  flex-shrink: 0;
+  overflow: hidden;
+}
+
+.sea-email-option-editor-option .sea-email-option-editor-option-check-btn,
+.sea-email-option-editor-option .sea-email-option-editor-option-check-btn .sea-email-editor-icon-svg {
+  height: 14px;
+  width: 14px;
+}
+
+/* check check-placement left */
+.sea-email-option-editor-option.check-placement-left {
+  justify-content: flex-start;
+  padding: 0 8px;
+}
+
+.sea-email-option-editor-option-divider {
+  height: 1px;
+  background-color: #eee;
+  margin: 8px 0;
+  width: 100%;
+}

package/dist/components/options-editor/options/option/index.js

@@ -0,0 +1,138 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _iconButton = _interopRequireDefault(require("../../../icon-button"));
+var _option = _interopRequireDefault(require("../../../option"));
+var _typeDetection = require("@/utils/type-detection");
+var _tooltip = _interopRequireDefault(require("../../../tooltip"));
+require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
+const Option = _ref => {
+  let {
+    disabled = false,
+    className,
+    checkPlacement,
+    highlight,
+    isSelected,
+    isShowSelectedStatus = true,
+    option,
+    height,
+    index,
+    onChange,
+    onMouseEnter,
+    onMouseLeave,
+    innerRef
+  } = _ref;
+  const optionRef = (0, _react.useRef)(null);
+  const validCheckPlacement = (0, _react.useMemo)(() => checkPlacement === 'left' ? 'left' : 'right', [checkPlacement]);
+  const {
+    icon,
+    img,
+    label,
+    value,
+    tooltip,
+    tooltipPlacement = 'right',
+    id,
+    selectedIcon
+  } = option;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    id: id,
+    className: (0, _classnames.default)('sea-email-option-editor-option', className, {
+      'active': highlight,
+      'disabled': disabled,
+      [`check-placement-${validCheckPlacement}`]: validCheckPlacement
+    }),
+    ref: innerRef || optionRef,
+    style: {
+      minHeight: height
+    },
+    onClick: event => onChange(value, event),
+    onMouseEnter: onMouseEnter ? () => onMouseEnter(index) : () => {},
+    onMouseLeave: onMouseLeave ? () => onMouseLeave(index) : () => {},
+    children: [validCheckPlacement === 'right' ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "sea-email-option-editor-option-content",
+        children: [option.icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButton.default, {
+          icon: icon,
+          className: "no-hover-bg sea-email-option-editor-option-icon",
+          style: {
+            marginLeft: 0,
+            marginRight: 8
+          }
+        }), option.img && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+          src: img,
+          alt: "",
+          className: "sea-email-option-editor-option-icon",
+          style: {
+            marginLeft: 0,
+            marginRight: 8
+          }
+        }), option.label ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+          children: (0, _typeDetection.isString)(label) ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "text-truncate",
+            title: label,
+            children: label
+          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+            children: label
+          })
+        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_option.default, {
+          option: option
+        })]
+      }), isShowSelectedStatus && /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButton.default, {
+        icon: selectedIcon || (isSelected ? 'check-mark-option' : ''),
+        className: "sea-email-option-editor-option-check-btn no-hover-bg",
+        style: {
+          marginLeft: 12
+        }
+      })]
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [isShowSelectedStatus && /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButton.default, {
+        icon: selectedIcon || (isSelected ? 'check-mark-option' : ''),
+        className: "sea-email-option-editor-option-check-btn no-hover-bg",
+        style: {
+          marginRight: 8
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "sea-email-option-editor-option-content",
+        children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButton.default, {
+          icon: icon,
+          className: "no-hover-bg sea-email-option-editor-option-icon",
+          style: {
+            marginLeft: 0,
+            marginRight: 8
+          }
+        }), img && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+          src: img,
+          alt: "",
+          className: "sea-email-option-editor-option-icon",
+          style: {
+            marginLeft: 0,
+            marginRight: 8
+          }
+        }), option.label ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+          children: (0, _typeDetection.isString)(label) ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "text-truncate",
+            title: label,
+            children: label
+          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+            children: label
+          })
+        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_option.default, {
+          option: option
+        })]
+      })]
+    }), tooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.default, {
+      placement: tooltipPlacement,
+      target: optionRef,
+      children: tooltip
+    })]
+  });
+};
+var _default = exports.default = Option;