tntd 2.7.29-beta.1 → 2.7.30

package/lib/tntd-select/rc-select/Select.js

@@ -1,4 +1,42 @@
 "use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _useMergedState5 = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState"));
+var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
+var React = _interopRequireWildcard(require("react"));
+var _BaseSelect = _interopRequireWildcard(require("./BaseSelect"));
+var _OptGroup = _interopRequireDefault(require("./OptGroup"));
+var _Option = _interopRequireDefault(require("./Option"));
+var _OptionList = _interopRequireDefault(require("./OptionList"));
+var _SelectContext = _interopRequireDefault(require("./SelectContext"));
+var _useCache3 = _interopRequireDefault(require("./hooks/useCache"));
+var _useFilterOptions = _interopRequireDefault(require("./hooks/useFilterOptions"));
+var _useId = _interopRequireDefault(require("./hooks/useId"));
+var _useOptions = _interopRequireDefault(require("./hooks/useOptions"));
+var _useRefFunc = _interopRequireDefault(require("./hooks/useRefFunc"));
+var _commonUtil = require("./utils/commonUtil");
+var _valueUtil = require("./utils/valueUtil");
+var _warningPropsUtil = _interopRequireWildcard(require("./utils/warningPropsUtil"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 /**
  * To match accessibility requirement, we always provide an input in the component.
  * Other element will not set `tabIndex` to avoid `onBlur` sequence problem.
@@ -29,428 +67,443 @@
  * - `combobox` mode trigger `onChange` will get `undefined` if no `value` match in Option
  * - `combobox` mode not support `optionLabelProp`
  */
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
 };
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const useMergedState_1 = __importDefault(require("rc-util/lib/hooks/useMergedState"));
-const warning_1 = __importDefault(require("rc-util/lib/warning"));
-const React = __importStar(require("react"));
-const BaseSelect_1 = __importStar(require("./BaseSelect"));
-const OptGroup_1 = __importDefault(require("./OptGroup"));
-const Option_1 = __importDefault(require("./Option"));
-const OptionList_1 = __importDefault(require("./OptionList"));
-const SelectContext_1 = __importDefault(require("./SelectContext"));
-const useCache_1 = __importDefault(require("./hooks/useCache"));
-const useFilterOptions_1 = __importDefault(require("./hooks/useFilterOptions"));
-const useId_1 = __importDefault(require("./hooks/useId"));
-const useOptions_1 = __importDefault(require("./hooks/useOptions"));
-const useRefFunc_1 = __importDefault(require("./hooks/useRefFunc"));
-const commonUtil_1 = require("./utils/commonUtil");
-const valueUtil_1 = require("./utils/valueUtil");
-const warningPropsUtil_1 = __importStar(require("./utils/warningPropsUtil"));
-const OMIT_DOM_PROPS = ['inputValue'];
+var OMIT_DOM_PROPS = ['inputValue'];
 function isRawValue(value) {
-    return !value || typeof value !== 'object';
+  return !value || _typeof(value) !== 'object';
 }
-const Select = React.forwardRef((props, ref) => {
-    const { id, mode, prefixCls = 'rc-select', backfill, fieldNames, 
-    // Search
-    inputValue, searchValue, onSearch, autoClearSearchValue = true, 
-    // Select
-    onSelect, onDeselect, dropdownMatchSelectWidth = true, 
-    // Options
-    filterOption, filterSort, optionFilterProp, optionLabelProp, options, optionRender, children, defaultActiveFirstOption, menuItemSelectedIcon, virtual, direction, listHeight = 200, listItemHeight = 20, 
-    // Value
-    value, defaultValue, labelInValue, onChange } = props, restProps = __rest(props, ["id", "mode", "prefixCls", "backfill", "fieldNames", "inputValue", "searchValue", "onSearch", "autoClearSearchValue", "onSelect", "onDeselect", "dropdownMatchSelectWidth", "filterOption", "filterSort", "optionFilterProp", "optionLabelProp", "options", "optionRender", "children", "defaultActiveFirstOption", "menuItemSelectedIcon", "virtual", "direction", "listHeight", "listItemHeight", "value", "defaultValue", "labelInValue", "onChange"]);
-    const mergedId = (0, useId_1.default)(id);
-    const multiple = (0, BaseSelect_1.isMultiple)(mode);
-    const childrenAsData = !!(!options && children);
-    const mergedFilterOption = React.useMemo(() => {
-        if (filterOption === undefined && mode === 'combobox') {
-            return false;
+var Select = React.forwardRef(function (props, ref) {
+  var id = props.id,
+    mode = props.mode,
+    _props$prefixCls = props.prefixCls,
+    prefixCls = _props$prefixCls === void 0 ? 'rc-select' : _props$prefixCls,
+    backfill = props.backfill,
+    fieldNames = props.fieldNames,
+    inputValue = props.inputValue,
+    searchValue = props.searchValue,
+    onSearch = props.onSearch,
+    _props$autoClearSearc = props.autoClearSearchValue,
+    autoClearSearchValue = _props$autoClearSearc === void 0 ? true : _props$autoClearSearc,
+    onSelect = props.onSelect,
+    onDeselect = props.onDeselect,
+    _props$dropdownMatchS = props.dropdownMatchSelectWidth,
+    dropdownMatchSelectWidth = _props$dropdownMatchS === void 0 ? true : _props$dropdownMatchS,
+    filterOption = props.filterOption,
+    filterSort = props.filterSort,
+    optionFilterProp = props.optionFilterProp,
+    optionLabelProp = props.optionLabelProp,
+    options = props.options,
+    optionRender = props.optionRender,
+    children = props.children,
+    defaultActiveFirstOption = props.defaultActiveFirstOption,
+    menuItemSelectedIcon = props.menuItemSelectedIcon,
+    virtual = props.virtual,
+    direction = props.direction,
+    _props$listHeight = props.listHeight,
+    listHeight = _props$listHeight === void 0 ? 200 : _props$listHeight,
+    _props$listItemHeight = props.listItemHeight,
+    listItemHeight = _props$listItemHeight === void 0 ? 20 : _props$listItemHeight,
+    value = props.value,
+    defaultValue = props.defaultValue,
+    labelInValue = props.labelInValue,
+    onChange = props.onChange,
+    restProps = __rest(props, ["id", "mode", "prefixCls", "backfill", "fieldNames", "inputValue", "searchValue", "onSearch", "autoClearSearchValue", "onSelect", "onDeselect", "dropdownMatchSelectWidth", "filterOption", "filterSort", "optionFilterProp", "optionLabelProp", "options", "optionRender", "children", "defaultActiveFirstOption", "menuItemSelectedIcon", "virtual", "direction", "listHeight", "listItemHeight", "value", "defaultValue", "labelInValue", "onChange"]);
+  var mergedId = (0, _useId["default"])(id);
+  var multiple = (0, _BaseSelect.isMultiple)(mode);
+  var childrenAsData = !!(!options && children);
+  var mergedFilterOption = React.useMemo(function () {
+    if (filterOption === undefined && mode === 'combobox') {
+      return false;
+    }
+    return filterOption;
+  }, [filterOption, mode]);
+  // ========================= FieldNames =========================
+  var mergedFieldNames = React.useMemo(function () {
+    return (0, _valueUtil.fillFieldNames)(fieldNames, childrenAsData);
+  }, /* eslint-disable react-hooks/exhaustive-deps */
+  [
+  // We stringify fieldNames to avoid unnecessary re-renders.
+  JSON.stringify(fieldNames), childrenAsData]);
+  // =========================== Search ===========================
+  var _useMergedState = (0, _useMergedState5["default"])('', {
+      value: searchValue !== undefined ? searchValue : inputValue,
+      postState: function postState(search) {
+        return search || '';
+      }
+    }),
+    _useMergedState2 = _slicedToArray(_useMergedState, 2),
+    mergedSearchValue = _useMergedState2[0],
+    setSearchValue = _useMergedState2[1];
+  // =========================== Option ===========================
+  var parsedOptions = (0, _useOptions["default"])(options, children, mergedFieldNames, optionFilterProp, optionLabelProp);
+  var valueOptions = parsedOptions.valueOptions,
+    labelOptions = parsedOptions.labelOptions,
+    mergedOptions = parsedOptions.options;
+  // ========================= Wrap Value =========================
+  var convert2LabelValues = React.useCallback(function (draftValues) {
+    // Convert to array
+    var valueList = (0, _commonUtil.toArray)(draftValues);
+    // Convert to labelInValue type
+    return valueList.map(function (val) {
+      var _a, _b;
+      var rawValue;
+      var rawLabel;
+      var rawKey;
+      var rawDisabled;
+      var rawTitle;
+      // Fill label & value
+      if (isRawValue(val)) {
+        rawValue = val;
+      } else {
+        rawKey = val.key;
+        rawLabel = val.label;
+        rawValue = (_a = val.value) !== null && _a !== void 0 ? _a : rawKey;
+      }
+      var option = valueOptions.get(rawValue);
+      if (option) {
+        // Fill missing props
+        if (rawLabel === undefined) rawLabel = option === null || option === void 0 ? void 0 : option[optionLabelProp || mergedFieldNames.label];
+        if (rawKey === undefined) rawKey = (_b = option === null || option === void 0 ? void 0 : option.key) !== null && _b !== void 0 ? _b : rawValue;
+        rawDisabled = option === null || option === void 0 ? void 0 : option.disabled;
+        rawTitle = option === null || option === void 0 ? void 0 : option.title;
+        // Warning if label not same as provided
+        if (process.env.NODE_ENV !== 'production' && !optionLabelProp) {
+          var optionLabel = option === null || option === void 0 ? void 0 : option[mergedFieldNames.label];
+          if (optionLabel !== undefined && !React.isValidElement(optionLabel) && !React.isValidElement(rawLabel) && optionLabel !== rawLabel) {
+            (0, _warning["default"])(false, '`label` of `value` is not same as `label` in Select options.');
+          }
         }
-        return filterOption;
-    }, [filterOption, mode]);
-    // ========================= FieldNames =========================
-    const mergedFieldNames = React.useMemo(() => (0, valueUtil_1.fillFieldNames)(fieldNames, childrenAsData), 
-    /* eslint-disable react-hooks/exhaustive-deps */
-    [
-        // We stringify fieldNames to avoid unnecessary re-renders.
-        JSON.stringify(fieldNames),
-        childrenAsData,
-    ]);
-    // =========================== Search ===========================
-    const [mergedSearchValue, setSearchValue] = (0, useMergedState_1.default)('', {
-        value: searchValue !== undefined ? searchValue : inputValue,
-        postState: (search) => search || '',
+      }
+      return {
+        label: rawLabel,
+        value: rawValue,
+        key: rawKey,
+        disabled: rawDisabled,
+        title: rawTitle
+      };
     });
-    // =========================== Option ===========================
-    const parsedOptions = (0, useOptions_1.default)(options, children, mergedFieldNames, optionFilterProp, optionLabelProp);
-    const { valueOptions, labelOptions, options: mergedOptions } = parsedOptions;
-    // ========================= Wrap Value =========================
-    const convert2LabelValues = React.useCallback((draftValues) => {
-        // Convert to array
-        const valueList = (0, commonUtil_1.toArray)(draftValues);
-        // Convert to labelInValue type
-        return valueList.map((val) => {
-            var _a, _b;
-            let rawValue;
-            let rawLabel;
-            let rawKey;
-            let rawDisabled;
-            let rawTitle;
-            // Fill label & value
-            if (isRawValue(val)) {
-                rawValue = val;
-            }
-            else {
-                rawKey = val.key;
-                rawLabel = val.label;
-                rawValue = (_a = val.value) !== null && _a !== void 0 ? _a : rawKey;
-            }
-            const option = valueOptions.get(rawValue);
-            if (option) {
-                // Fill missing props
-                if (rawLabel === undefined)
-                    rawLabel = option === null || option === void 0 ? void 0 : option[optionLabelProp || mergedFieldNames.label];
-                if (rawKey === undefined)
-                    rawKey = (_b = option === null || option === void 0 ? void 0 : option.key) !== null && _b !== void 0 ? _b : rawValue;
-                rawDisabled = option === null || option === void 0 ? void 0 : option.disabled;
-                rawTitle = option === null || option === void 0 ? void 0 : option.title;
-                // Warning if label not same as provided
-                if (process.env.NODE_ENV !== 'production' && !optionLabelProp) {
-                    const optionLabel = option === null || option === void 0 ? void 0 : option[mergedFieldNames.label];
-                    if (optionLabel !== undefined &&
-                        !React.isValidElement(optionLabel) &&
-                        !React.isValidElement(rawLabel) &&
-                        optionLabel !== rawLabel) {
-                        (0, warning_1.default)(false, '`label` of `value` is not same as `label` in Select options.');
-                    }
-                }
-            }
-            return {
-                label: rawLabel,
-                value: rawValue,
-                key: rawKey,
-                disabled: rawDisabled,
-                title: rawTitle,
-            };
-        });
-    }, [mergedFieldNames, optionLabelProp, valueOptions]);
-    // =========================== Values ===========================
-    const [internalValue, setInternalValue] = (0, useMergedState_1.default)(defaultValue, {
-        value,
-    });
-    // Merged value with LabelValueType
-    const rawLabeledValues = React.useMemo(() => {
-        var _a;
-        const values = convert2LabelValues(internalValue);
-        // combobox no need save value when it's no value (exclude value equal 0)
-        if (mode === 'combobox' && (0, commonUtil_1.isComboNoValue)((_a = values[0]) === null || _a === void 0 ? void 0 : _a.value)) {
-            return [];
-        }
-        return values;
-    }, [internalValue, convert2LabelValues, mode]);
-    // Fill label with cache to avoid option remove
-    const [mergedValues, getMixedOption] = (0, useCache_1.default)(rawLabeledValues, valueOptions);
-    const displayValues = React.useMemo(() => {
-        // `null` need show as placeholder instead
-        // https://github.com/ant-design/ant-design/issues/25057
-        if (!mode && mergedValues.length === 1) {
-            const firstValue = mergedValues[0];
-            if (firstValue.value === null &&
-                (firstValue.label === null || firstValue.label === undefined)) {
-                return [];
-            }
-        }
-        return mergedValues.map((item) => {
-            var _a;
-            return (Object.assign(Object.assign({}, item), { label: (_a = item.label) !== null && _a !== void 0 ? _a : item.value }));
-        });
-    }, [mode, mergedValues]);
-    /** Convert `displayValues` to raw value type set */
-    const rawValues = React.useMemo(() => new Set(mergedValues.map((val) => val.value)), [mergedValues]);
-    React.useEffect(() => {
-        var _a;
-        if (mode === 'combobox') {
-            const strValue = (_a = mergedValues[0]) === null || _a === void 0 ? void 0 : _a.value;
-            setSearchValue((0, commonUtil_1.hasValue)(strValue) ? String(strValue) : '');
-        }
-    }, [mergedValues]);
-    // ======================= Display Option =======================
-    // Create a placeholder item if not exist in `options`
-    const createTagOption = (0, useRefFunc_1.default)((val, label) => {
-        const mergedLabel = label !== null && label !== void 0 ? label : val;
-        return {
-            [mergedFieldNames.value]: val,
-            [mergedFieldNames.label]: mergedLabel,
-        };
+  }, [mergedFieldNames, optionLabelProp, valueOptions]);
+  // =========================== Values ===========================
+  var _useMergedState3 = (0, _useMergedState5["default"])(defaultValue, {
+      value: value
+    }),
+    _useMergedState4 = _slicedToArray(_useMergedState3, 2),
+    internalValue = _useMergedState4[0],
+    setInternalValue = _useMergedState4[1];
+  // Merged value with LabelValueType
+  var rawLabeledValues = React.useMemo(function () {
+    var _a;
+    var values = convert2LabelValues(internalValue);
+    // combobox no need save value when it's no value (exclude value equal 0)
+    if (mode === 'combobox' && (0, _commonUtil.isComboNoValue)((_a = values[0]) === null || _a === void 0 ? void 0 : _a.value)) {
+      return [];
+    }
+    return values;
+  }, [internalValue, convert2LabelValues, mode]);
+  // Fill label with cache to avoid option remove
+  var _useCache = (0, _useCache3["default"])(rawLabeledValues, valueOptions),
+    _useCache2 = _slicedToArray(_useCache, 2),
+    mergedValues = _useCache2[0],
+    getMixedOption = _useCache2[1];
+  var displayValues = React.useMemo(function () {
+    // `null` need show as placeholder instead
+    // https://github.com/ant-design/ant-design/issues/25057
+    if (!mode && mergedValues.length === 1) {
+      var firstValue = mergedValues[0];
+      if (firstValue.value === null && (firstValue.label === null || firstValue.label === undefined)) {
+        return [];
+      }
+    }
+    return mergedValues.map(function (item) {
+      var _a;
+      return Object.assign(Object.assign({}, item), {
+        label: (_a = item.label) !== null && _a !== void 0 ? _a : item.value
+      });
     });
-    // Fill tag as option if mode is `tags`
-    const filledTagOptions = React.useMemo(() => {
-        if (mode !== 'tags') {
-            return mergedOptions;
-        }
-        // >>> Tag mode
-        const cloneOptions = [...mergedOptions];
-        // Check if value exist in options (include new patch item)
-        const existOptions = (val) => valueOptions.has(val);
-        // Fill current value as option
-        [...mergedValues]
-            .sort((a, b) => (a.value < b.value ? -1 : 1))
-            .forEach((item) => {
-            const val = item.value;
-            if (!existOptions(val)) {
-                cloneOptions.push(createTagOption(val, item.label));
-            }
-        });
-        return cloneOptions;
-    }, [createTagOption, mergedOptions, valueOptions, mergedValues, mode]);
-    const filteredOptions = (0, useFilterOptions_1.default)(filledTagOptions, mergedFieldNames, mergedSearchValue, mergedFilterOption, optionFilterProp);
-    // Fill options with search value if needed
-    const filledSearchOptions = React.useMemo(() => {
-        if (mode !== 'tags' ||
-            !mergedSearchValue ||
-            filteredOptions.some((item) => item[optionFilterProp || 'value'] === mergedSearchValue)) {
-            return filteredOptions;
-        }
-        // ignore when search value equal select input value
-        if (filteredOptions.some((item) => item[mergedFieldNames.value] === mergedSearchValue)) {
-            return filteredOptions;
-        }
-        // Fill search value as option
-        return [createTagOption(mergedSearchValue), ...filteredOptions];
-    }, [
-        createTagOption,
-        optionFilterProp,
-        mode,
-        filteredOptions,
-        mergedSearchValue,
-        mergedFieldNames,
-    ]);
-    const orderedFilteredOptions = React.useMemo(() => {
-        if (!filterSort) {
-            return filledSearchOptions;
-        }
-        return [...filledSearchOptions].sort((a, b) => filterSort(a, b));
-    }, [filledSearchOptions, filterSort]);
-    const displayOptions = React.useMemo(() => (0, valueUtil_1.flattenOptions)(orderedFilteredOptions, {
-        fieldNames: mergedFieldNames,
-        childrenAsData,
-    }), [orderedFilteredOptions, mergedFieldNames, childrenAsData]);
-    // =========================== Change ===========================
-    const triggerChange = (values) => {
-        const labeledValues = convert2LabelValues(values);
-        setInternalValue(labeledValues);
-        if (onChange &&
-            // Trigger event only when value changed
-            (labeledValues.length !== mergedValues.length ||
-                labeledValues.some((newVal, index) => { var _a; return ((_a = mergedValues[index]) === null || _a === void 0 ? void 0 : _a.value) !== (newVal === null || newVal === void 0 ? void 0 : newVal.value); }))) {
-            const returnValues = labelInValue ? labeledValues : labeledValues.map((v) => v.value);
-            const returnOptions = labeledValues.map((v) => (0, valueUtil_1.injectPropsWithOption)(getMixedOption(v.value)));
-            onChange(
-            // Value
-            multiple ? returnValues : returnValues[0], 
-            // Option
-            multiple ? returnOptions : returnOptions[0]);
-        }
-    };
-    // ======================= Accessibility ========================
-    const [activeValue, setActiveValue] = React.useState(null);
-    const [accessibilityIndex, setAccessibilityIndex] = React.useState(0);
-    const mergedDefaultActiveFirstOption = defaultActiveFirstOption !== undefined ? defaultActiveFirstOption : mode !== 'combobox';
-    const onActiveValue = React.useCallback((active, index, { source = 'keyboard' } = {}) => {
-        setAccessibilityIndex(index);
-        if (backfill && mode === 'combobox' && active !== null && source === 'keyboard') {
-            setActiveValue(String(active));
-        }
-    }, [backfill, mode]);
-    // ========================= OptionList =========================
-    const triggerSelect = (val, selected, type) => {
-        const getSelectEnt = () => {
-            var _a;
-            const option = getMixedOption(val);
-            return [
-                labelInValue
-                    ? {
-                        label: option === null || option === void 0 ? void 0 : option[mergedFieldNames.label],
-                        value: val,
-                        key: (_a = option === null || option === void 0 ? void 0 : option.key) !== null && _a !== void 0 ? _a : val,
-                    }
-                    : val,
-                (0, valueUtil_1.injectPropsWithOption)(option),
-            ];
-        };
-        if (selected && onSelect) {
-            const [wrappedValue, option] = getSelectEnt();
-            onSelect(wrappedValue, option);
-        }
-        else if (!selected && onDeselect && type !== 'clear') {
-            const [wrappedValue, option] = getSelectEnt();
-            onDeselect(wrappedValue, option);
-        }
+  }, [mode, mergedValues]);
+  /** Convert `displayValues` to raw value type set */
+  var rawValues = React.useMemo(function () {
+    return new Set(mergedValues.map(function (val) {
+      return val.value;
+    }));
+  }, [mergedValues]);
+  React.useEffect(function () {
+    var _a;
+    if (mode === 'combobox') {
+      var strValue = (_a = mergedValues[0]) === null || _a === void 0 ? void 0 : _a.value;
+      setSearchValue((0, _commonUtil.hasValue)(strValue) ? String(strValue) : '');
+    }
+  }, [mergedValues]);
+  // ======================= Display Option =======================
+  // Create a placeholder item if not exist in `options`
+  var createTagOption = (0, _useRefFunc["default"])(function (val, label) {
+    var _ref;
+    var mergedLabel = label !== null && label !== void 0 ? label : val;
+    return _ref = {}, _defineProperty(_ref, mergedFieldNames.value, val), _defineProperty(_ref, mergedFieldNames.label, mergedLabel), _ref;
+  });
+  // Fill tag as option if mode is `tags`
+  var filledTagOptions = React.useMemo(function () {
+    if (mode !== 'tags') {
+      return mergedOptions;
+    }
+    // >>> Tag mode
+    var cloneOptions = _toConsumableArray(mergedOptions);
+    // Check if value exist in options (include new patch item)
+    var existOptions = function existOptions(val) {
+      return valueOptions.has(val);
     };
-    // Used for OptionList selection
-    const onInternalSelect = (0, useRefFunc_1.default)((val, info) => {
-        let cloneValues;
-        // Single mode always trigger select only with option list
-        const mergedSelect = multiple ? info.selected : true;
-        if (mergedSelect) {
-            cloneValues = multiple ? [...mergedValues, val] : [val];
-        }
-        else {
-            cloneValues = mergedValues.filter((v) => v.value !== val);
-        }
-        triggerChange(cloneValues);
-        triggerSelect(val, mergedSelect);
-        // Clean search value if single or configured
-        if (mode === 'combobox') {
-            // setSearchValue(String(val));
-            setActiveValue('');
-        }
-        else if (!BaseSelect_1.isMultiple || autoClearSearchValue) {
-            setSearchValue('');
-            setActiveValue('');
-        }
+    // Fill current value as option
+    _toConsumableArray(mergedValues).sort(function (a, b) {
+      return a.value < b.value ? -1 : 1;
+    }).forEach(function (item) {
+      var val = item.value;
+      if (!existOptions(val)) {
+        cloneOptions.push(createTagOption(val, item.label));
+      }
     });
-    // ======================= Display Change =======================
-    // BaseSelect display values change
-    const onDisplayValuesChange = (nextValues, info) => {
-        triggerChange(nextValues);
-        const { type, values } = info;
-        if (type === 'remove' || type === 'clear') {
-            values.forEach((item) => {
-                triggerSelect(item.value, false, type);
-            });
-        }
-    };
-    // =========================== Search ===========================
-    const onInternalSearch = (searchText, info) => {
-        setSearchValue(searchText);
-        setActiveValue(null);
-        // [Submit] Tag mode should flush input
-        if (info.source === 'submit') {
-            const formatted = (searchText || '').trim();
-            // prevent empty tags from appearing when you click the Enter button
-            if (formatted) {
-                const newRawValues = Array.from(new Set([...rawValues, formatted]));
-                triggerChange(newRawValues);
-                triggerSelect(formatted, true);
-                setSearchValue('');
-            }
-            return;
-        }
-        if (info.source !== 'blur') {
-            if (mode === 'combobox') {
-                triggerChange(searchText);
-            }
-            onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchText);
-        }
+    return cloneOptions;
+  }, [createTagOption, mergedOptions, valueOptions, mergedValues, mode]);
+  var filteredOptions = (0, _useFilterOptions["default"])(filledTagOptions, mergedFieldNames, mergedSearchValue, mergedFilterOption, optionFilterProp);
+  // Fill options with search value if needed
+  var filledSearchOptions = React.useMemo(function () {
+    if (mode !== 'tags' || !mergedSearchValue || filteredOptions.some(function (item) {
+      return item[optionFilterProp || 'value'] === mergedSearchValue;
+    })) {
+      return filteredOptions;
+    }
+    // ignore when search value equal select input value
+    if (filteredOptions.some(function (item) {
+      return item[mergedFieldNames.value] === mergedSearchValue;
+    })) {
+      return filteredOptions;
+    }
+    // Fill search value as option
+    return [createTagOption(mergedSearchValue)].concat(_toConsumableArray(filteredOptions));
+  }, [createTagOption, optionFilterProp, mode, filteredOptions, mergedSearchValue, mergedFieldNames]);
+  var orderedFilteredOptions = React.useMemo(function () {
+    if (!filterSort) {
+      return filledSearchOptions;
+    }
+    return _toConsumableArray(filledSearchOptions).sort(function (a, b) {
+      return filterSort(a, b);
+    });
+  }, [filledSearchOptions, filterSort]);
+  var displayOptions = React.useMemo(function () {
+    return (0, _valueUtil.flattenOptions)(orderedFilteredOptions, {
+      fieldNames: mergedFieldNames,
+      childrenAsData: childrenAsData
+    });
+  }, [orderedFilteredOptions, mergedFieldNames, childrenAsData]);
+  // =========================== Change ===========================
+  var triggerChange = function triggerChange(values) {
+    var labeledValues = convert2LabelValues(values);
+    setInternalValue(labeledValues);
+    if (onChange && (
+    // Trigger event only when value changed
+    labeledValues.length !== mergedValues.length || labeledValues.some(function (newVal, index) {
+      var _a;
+      return ((_a = mergedValues[index]) === null || _a === void 0 ? void 0 : _a.value) !== (newVal === null || newVal === void 0 ? void 0 : newVal.value);
+    }))) {
+      var returnValues = labelInValue ? labeledValues : labeledValues.map(function (v) {
+        return v.value;
+      });
+      var returnOptions = labeledValues.map(function (v) {
+        return (0, _valueUtil.injectPropsWithOption)(getMixedOption(v.value));
+      });
+      onChange(
+      // Value
+      multiple ? returnValues : returnValues[0],
+      // Option
+      multiple ? returnOptions : returnOptions[0]);
+    }
+  };
+  // ======================= Accessibility ========================
+  var _React$useState = React.useState(null),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    activeValue = _React$useState2[0],
+    setActiveValue = _React$useState2[1];
+  var _React$useState3 = React.useState(0),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    accessibilityIndex = _React$useState4[0],
+    setAccessibilityIndex = _React$useState4[1];
+  var mergedDefaultActiveFirstOption = defaultActiveFirstOption !== undefined ? defaultActiveFirstOption : mode !== 'combobox';
+  var onActiveValue = React.useCallback(function (active, index) {
+    var _ref2 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
+      _ref2$source = _ref2.source,
+      source = _ref2$source === void 0 ? 'keyboard' : _ref2$source;
+    setAccessibilityIndex(index);
+    if (backfill && mode === 'combobox' && active !== null && source === 'keyboard') {
+      setActiveValue(String(active));
+    }
+  }, [backfill, mode]);
+  // ========================= OptionList =========================
+  var triggerSelect = function triggerSelect(val, selected, type) {
+    var getSelectEnt = function getSelectEnt() {
+      var _a;
+      var option = getMixedOption(val);
+      return [labelInValue ? {
+        label: option === null || option === void 0 ? void 0 : option[mergedFieldNames.label],
+        value: val,
+        key: (_a = option === null || option === void 0 ? void 0 : option.key) !== null && _a !== void 0 ? _a : val
+      } : val, (0, _valueUtil.injectPropsWithOption)(option)];
     };
-    const onInternalSearchSplit = (words) => {
-        let patchValues = words;
-        if (mode !== 'tags') {
-            patchValues = words
-                .map((word) => {
-                const opt = labelOptions.get(word);
-                return opt === null || opt === void 0 ? void 0 : opt.value;
-            })
-                .filter((val) => val !== undefined);
-        }
-        const newRawValues = Array.from(new Set([...rawValues, ...patchValues]));
+    if (selected && onSelect) {
+      var _getSelectEnt = getSelectEnt(),
+        _getSelectEnt2 = _slicedToArray(_getSelectEnt, 2),
+        wrappedValue = _getSelectEnt2[0],
+        option = _getSelectEnt2[1];
+      onSelect(wrappedValue, option);
+    } else if (!selected && onDeselect && type !== 'clear') {
+      var _getSelectEnt3 = getSelectEnt(),
+        _getSelectEnt4 = _slicedToArray(_getSelectEnt3, 2),
+        _wrappedValue = _getSelectEnt4[0],
+        _option = _getSelectEnt4[1];
+      onDeselect(_wrappedValue, _option);
+    }
+  };
+  // Used for OptionList selection
+  var onInternalSelect = (0, _useRefFunc["default"])(function (val, info) {
+    var cloneValues;
+    // Single mode always trigger select only with option list
+    var mergedSelect = multiple ? info.selected : true;
+    if (mergedSelect) {
+      cloneValues = multiple ? [].concat(_toConsumableArray(mergedValues), [val]) : [val];
+    } else {
+      cloneValues = mergedValues.filter(function (v) {
+        return v.value !== val;
+      });
+    }
+    triggerChange(cloneValues);
+    triggerSelect(val, mergedSelect);
+    // Clean search value if single or configured
+    if (mode === 'combobox') {
+      // setSearchValue(String(val));
+      setActiveValue('');
+    } else if (!_BaseSelect.isMultiple || autoClearSearchValue) {
+      setSearchValue('');
+      setActiveValue('');
+    }
+  });
+  // ======================= Display Change =======================
+  // BaseSelect display values change
+  var onDisplayValuesChange = function onDisplayValuesChange(nextValues, info) {
+    triggerChange(nextValues);
+    var type = info.type,
+      values = info.values;
+    if (type === 'remove' || type === 'clear') {
+      values.forEach(function (item) {
+        triggerSelect(item.value, false, type);
+      });
+    }
+  };
+  // =========================== Search ===========================
+  var onInternalSearch = function onInternalSearch(searchText, info) {
+    setSearchValue(searchText);
+    setActiveValue(null);
+    // [Submit] Tag mode should flush input
+    if (info.source === 'submit') {
+      var formatted = (searchText || '').trim();
+      // prevent empty tags from appearing when you click the Enter button
+      if (formatted) {
+        var newRawValues = Array.from(new Set([].concat(_toConsumableArray(rawValues), [formatted])));
         triggerChange(newRawValues);
-        newRawValues.forEach((newRawValue) => {
-            triggerSelect(newRawValue, true);
-        });
-    };
-    // ========================== Context ===========================
-    const selectContext = React.useMemo(() => {
-        const realVirtual = virtual !== false && dropdownMatchSelectWidth !== false;
-        return Object.assign(Object.assign({}, parsedOptions), { flattenOptions: displayOptions, onActiveValue, defaultActiveFirstOption: mergedDefaultActiveFirstOption, onSelect: onInternalSelect, menuItemSelectedIcon,
-            rawValues, fieldNames: mergedFieldNames, virtual: realVirtual, direction,
-            listHeight,
-            listItemHeight,
-            childrenAsData,
-            optionRender });
-    }, [
-        parsedOptions,
-        displayOptions,
-        onActiveValue,
-        mergedDefaultActiveFirstOption,
-        onInternalSelect,
-        menuItemSelectedIcon,
-        rawValues,
-        mergedFieldNames,
-        virtual,
-        dropdownMatchSelectWidth,
-        listHeight,
-        listItemHeight,
-        childrenAsData,
-        optionRender,
-    ]);
-    // ========================== Warning ===========================
-    if (process.env.NODE_ENV !== 'production') {
-        (0, warningPropsUtil_1.default)(props);
-        (0, warningPropsUtil_1.warningNullOptions)(mergedOptions, mergedFieldNames);
+        triggerSelect(formatted, true);
+        setSearchValue('');
+      }
+      return;
+    }
+    if (info.source !== 'blur') {
+      if (mode === 'combobox') {
+        triggerChange(searchText);
+      }
+      onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchText);
     }
-    // ==============================================================
-    // ==                          Render                          ==
-    // ==============================================================
-    return (React.createElement(SelectContext_1.default.Provider, { value: selectContext },
-        React.createElement(BaseSelect_1.default, Object.assign({}, restProps, { 
-            // >>> MISC
-            id: mergedId, prefixCls: prefixCls, ref: ref, omitDomProps: OMIT_DOM_PROPS, mode: mode, 
-            // >>> Values
-            displayValues: displayValues, onDisplayValuesChange: onDisplayValuesChange, 
-            // >>> Trigger
-            direction: direction, 
-            // >>> Search
-            searchValue: mergedSearchValue, onSearch: onInternalSearch, autoClearSearchValue: autoClearSearchValue, onSearchSplit: onInternalSearchSplit, dropdownMatchSelectWidth: dropdownMatchSelectWidth, 
-            // >>> OptionList
-            OptionList: OptionList_1.default, emptyOptions: !displayOptions.length, 
-            // >>> Accessibility
-            activeValue: activeValue, activeDescendantId: `${mergedId}_list_${accessibilityIndex}` }))));
+  };
+  var onInternalSearchSplit = function onInternalSearchSplit(words) {
+    var patchValues = words;
+    if (mode !== 'tags') {
+      patchValues = words.map(function (word) {
+        var opt = labelOptions.get(word);
+        return opt === null || opt === void 0 ? void 0 : opt.value;
+      }).filter(function (val) {
+        return val !== undefined;
+      });
+    }
+    var newRawValues = Array.from(new Set([].concat(_toConsumableArray(rawValues), _toConsumableArray(patchValues))));
+    triggerChange(newRawValues);
+    newRawValues.forEach(function (newRawValue) {
+      triggerSelect(newRawValue, true);
+    });
+  };
+  // ========================== Context ===========================
+  var selectContext = React.useMemo(function () {
+    var realVirtual = virtual !== false && dropdownMatchSelectWidth !== false;
+    return Object.assign(Object.assign({}, parsedOptions), {
+      flattenOptions: displayOptions,
+      onActiveValue: onActiveValue,
+      defaultActiveFirstOption: mergedDefaultActiveFirstOption,
+      onSelect: onInternalSelect,
+      menuItemSelectedIcon: menuItemSelectedIcon,
+      rawValues: rawValues,
+      fieldNames: mergedFieldNames,
+      virtual: realVirtual,
+      direction: direction,
+      listHeight: listHeight,
+      listItemHeight: listItemHeight,
+      childrenAsData: childrenAsData,
+      optionRender: optionRender
+    });
+  }, [parsedOptions, displayOptions, onActiveValue, mergedDefaultActiveFirstOption, onInternalSelect, menuItemSelectedIcon, rawValues, mergedFieldNames, virtual, dropdownMatchSelectWidth, listHeight, listItemHeight, childrenAsData, optionRender]);
+  // ========================== Warning ===========================
+  if (process.env.NODE_ENV !== 'production') {
+    (0, _warningPropsUtil["default"])(props);
+    (0, _warningPropsUtil.warningNullOptions)(mergedOptions, mergedFieldNames);
+  }
+  // ==============================================================
+  // ==                          Render                          ==
+  // ==============================================================
+  return React.createElement(_SelectContext["default"].Provider, {
+    value: selectContext
+  }, React.createElement(_BaseSelect["default"], Object.assign({}, restProps, {
+    // >>> MISC
+    id: mergedId,
+    prefixCls: prefixCls,
+    ref: ref,
+    omitDomProps: OMIT_DOM_PROPS,
+    mode: mode,
+    // >>> Values
+    displayValues: displayValues,
+    onDisplayValuesChange: onDisplayValuesChange,
+    // >>> Trigger
+    direction: direction,
+    // >>> Search
+    searchValue: mergedSearchValue,
+    onSearch: onInternalSearch,
+    autoClearSearchValue: autoClearSearchValue,
+    onSearchSplit: onInternalSearchSplit,
+    dropdownMatchSelectWidth: dropdownMatchSelectWidth,
+    // >>> OptionList
+    OptionList: _OptionList["default"],
+    emptyOptions: !displayOptions.length,
+    // >>> Accessibility
+    activeValue: activeValue,
+    activeDescendantId: "".concat(mergedId, "_list_").concat(accessibilityIndex)
+  })));
 });
 if (process.env.NODE_ENV !== 'production') {
-    Select.displayName = 'Select';
+  Select.displayName = 'Select';
 }
-const TypedSelect = Select;
-TypedSelect.Option = Option_1.default;
-TypedSelect.OptGroup = OptGroup_1.default;
-exports.default = TypedSelect;
-//# sourceMappingURL=Select.js.map
+var TypedSelect = Select;
+TypedSelect.Option = _Option["default"];
+TypedSelect.OptGroup = _OptGroup["default"];
+var _default = TypedSelect;
+exports["default"] = _default;