@douyinfe/semi-ui 2.36.0-beta.0 → 2.36.0

package/lib/cjs/select/index.js

@@ -4,99 +4,57 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _isFunction2 = _interopRequireDefault(require("lodash/isFunction"));
-
 var _isNumber2 = _interopRequireDefault(require("lodash/isNumber"));
-
 var _get2 = _interopRequireDefault(require("lodash/get"));
-
 var _noop2 = _interopRequireDefault(require("lodash/noop"));
-
 var _isString2 = _interopRequireDefault(require("lodash/isString"));
-
 var _isEqual2 = _interopRequireDefault(require("lodash/isEqual"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _reactDom = _interopRequireDefault(require("react-dom"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _context = _interopRequireDefault(require("../configProvider/context"));
-
 var _foundation = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/select/foundation"));
-
 var _constants = require("@douyinfe/semi-foundation/lib/cjs/select/constants");
-
 var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
-
 var _index = _interopRequireDefault(require("../tag/index"));
-
 var _group = _interopRequireDefault(require("../tag/group"));
-
 var _index2 = _interopRequireDefault(require("../overflowList/index"));
-
 var _index3 = _interopRequireDefault(require("../space/index"));
-
 var _text = _interopRequireDefault(require("../typography/text"));
-
 var _localeConsumer = _interopRequireDefault(require("../locale/localeConsumer"));
-
 var _index4 = _interopRequireDefault(require("../popover/index"));
-
 var _constants2 = require("@douyinfe/semi-foundation/lib/cjs/popover/constants");
-
 var _Event = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/Event"));
-
 var _reactWindow = require("react-window");
-
 var _utils = require("./utils");
-
 var _virtualRow = _interopRequireDefault(require("./virtualRow"));
-
 var _index5 = _interopRequireDefault(require("../input/index"));
-
 var _option = _interopRequireDefault(require("./option"));
-
 var _optionGroup = _interopRequireDefault(require("./optionGroup"));
-
 var _spin = _interopRequireDefault(require("../spin"));
-
 var _trigger = _interopRequireDefault(require("../trigger"));
-
 var _semiIcons = require("@douyinfe/semi-icons");
-
 var _utils2 = require("../_utils");
-
 var _uuid = require("@douyinfe/semi-foundation/lib/cjs/utils/uuid");
-
 require("@douyinfe/semi-foundation/lib/cjs/select/select.css");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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 }; }
-
 /* eslint-disable max-len */
-
 /* eslint-disable max-lines-per-function */
-const prefixcls = _constants.cssClasses.PREFIX;
-const key = 0; // Notes: Use the label of the option as the identifier, that is, the option in Select, the value is allowed to be the same, but the label must be unique
 
+const prefixcls = _constants.cssClasses.PREFIX;
+const key = 0;
+// Notes: Use the label of the option as the identifier, that is, the option in Select, the value is allowed to be the same, but the label must be unique
 class Select extends _baseComponent.default {
   constructor(props) {
     super(props);
-
     this.setOptionContainerEl = node => this.optionContainerEl = {
       current: node
     };
-
     this.handleInputChange = (value, event) => this.foundation.handleInputChange(value, event);
-
     this.getTagItem = (item, i, renderSelectedItem) => {
       const {
         size,
@@ -107,7 +65,6 @@ class Select extends _baseComponent.default {
         value
       } = item[1];
       const disabled = item[1].disabled || selectDisabled;
-
       const onClose = (tagContent, e) => {
         if (e && typeof e.preventDefault === 'function') {
           e.preventDefault(); // make sure that tag will not hidden immediately in controlled mode
@@ -118,7 +75,6 @@ class Select extends _baseComponent.default {
           value
         });
       };
-
       const {
         content,
         isRenderInTag
@@ -132,7 +88,6 @@ class Select extends _baseComponent.default {
         closable: !disabled,
         onClose
       };
-
       if (isRenderInTag) {
         return /*#__PURE__*/_react.default.createElement(_index.default, Object.assign({}, basic, {
           color: "white",
@@ -146,7 +101,6 @@ class Select extends _baseComponent.default {
         }, content);
       }
     };
-
     this.state = {
       isOpen: false,
       isFocus: false,
@@ -165,7 +119,6 @@ class Select extends _baseComponent.default {
       overflowItemCount: 0
     };
     /* Generate random string */
-
     this.selectOptionListID = '';
     this.selectID = '';
     this.virtualizeListRef = /*#__PURE__*/_react.default.createRef();
@@ -183,10 +136,8 @@ class Select extends _baseComponent.default {
     this.eventManager = new _Event.default();
     this.foundation = new _foundation.default(this.adapter);
   }
-
   get adapter() {
     var _this = this;
-
     const keyboardAdapter = {
       registerKeyDown: cb => {
         const keyboardEventSet = {
@@ -226,7 +177,6 @@ class Select extends _baseComponent.default {
         const {
           preventScroll
         } = this.props;
-
         if (this.inputRef && this.inputRef.current) {
           this.inputRef.current.focus({
             preventScroll
@@ -240,17 +190,15 @@ class Select extends _baseComponent.default {
       registerClickOutsideHandler: cb => {
         const clickOutsideHandler = e => {
           const optionInstance = this.optionsRef && this.optionsRef.current;
-          const triggerDom = this.triggerRef && this.triggerRef.current; // eslint-disable-next-line react/no-find-dom-node
-
-          const optionsDom = _reactDom.default.findDOMNode(optionInstance); // let isInPanel = optionsDom && optionsDom.contains(e.target);
+          const triggerDom = this.triggerRef && this.triggerRef.current;
+          // eslint-disable-next-line react/no-find-dom-node
+          const optionsDom = _reactDom.default.findDOMNode(optionInstance);
+          // let isInPanel = optionsDom && optionsDom.contains(e.target);
           // let isInTrigger = triggerDom && triggerDom.contains(e.target);
-
-
           if (optionsDom && !optionsDom.contains(e.target) && triggerDom && !triggerDom.contains(e.target)) {
             cb(e);
           }
         };
-
         this.clickOutsideHandler = clickOutsideHandler;
         document.addEventListener('mousedown', clickOutsideHandler, false);
       },
@@ -287,7 +235,6 @@ class Select extends _baseComponent.default {
         const {
           optionList
         } = _this.props;
-
         if (optionList && optionList.length) {
           options = optionList.map((itemOpt, index) => Object.assign({
             _show: true,
@@ -303,11 +250,9 @@ class Select extends _baseComponent.default {
           optionGroups = result.optionGroups;
           options = result.options;
         }
-
         _this.setState({
           optionGroups
         });
-
         return options;
       },
       updateOptions: options => {
@@ -421,18 +366,14 @@ class Select extends _baseComponent.default {
       updateScrollTop: index => {
         // eslint-disable-next-line max-len
         let optionClassName = `.${prefixcls}-option-selected`;
-
         if (index !== undefined) {
           optionClassName = `.${prefixcls}-option:nth-child(${index})`;
         }
-
         let destNode = document.querySelector(`#${prefixcls}-${this.selectOptionListID} ${optionClassName}`);
-
         if (Array.isArray(destNode)) {
           // eslint-disable-next-line prefer-destructuring
           destNode = destNode[0];
         }
-
         if (destNode) {
           /**
            * Scroll the first selected item into view.
@@ -444,30 +385,23 @@ class Select extends _baseComponent.default {
       }
     });
   }
-
   componentDidMount() {
     this.foundation.init();
     this.selectOptionListID = (0, _uuid.getUuidShort)();
     this.selectID = this.props.id || (0, _uuid.getUuidShort)();
   }
-
   componentWillUnmount() {
     this.foundation.destroy();
   }
-
   componentDidUpdate(prevProps, prevState) {
     const prevChildrenKeys = _react.default.Children.toArray(prevProps.children).map(child => child.key);
-
     const nowChildrenKeys = _react.default.Children.toArray(this.props.children).map(child => child.key);
-
     let isOptionsChanged = false;
-
     if (!(0, _isEqual2.default)(prevChildrenKeys, nowChildrenKeys) || !(0, _isEqual2.default)(prevProps.optionList, this.props.optionList)) {
       isOptionsChanged = true;
       this.foundation.handleOptionListChange();
-    } // Add isOptionChanged: There may be cases where the value is unchanged, but the optionList is updated. At this time, the label corresponding to the value may change, and the selected item needs to be updated
-
-
+    }
+    // Add isOptionChanged: There may be cases where the value is unchanged, but the optionList is updated. At this time, the label corresponding to the value may change, and the selected item needs to be updated
     if (!(0, _isEqual2.default)(this.props.value, prevProps.value) || isOptionsChanged) {
       if ('value' in this.props) {
         this.foundation.handleValueChange(this.props.value);
@@ -476,7 +410,6 @@ class Select extends _baseComponent.default {
       }
     }
   }
-
   renderInput() {
     const {
       size,
@@ -500,15 +433,14 @@ class Select extends _baseComponent.default {
       className: inputcls,
       onChange: this.handleInputChange
     }, inputProps);
-    let style = {}; // Multiple choice mode
-
+    let style = {};
+    // Multiple choice mode
     if (multiple) {
       style = {
         width: inputValue ? `${inputValue.length * 16}px` : '2px'
       };
       selectInputProps.style = style;
     }
-
     return /*#__PURE__*/_react.default.createElement(_index5.default, Object.assign({
       ref: this.inputRef,
       size: size,
@@ -520,66 +452,54 @@ class Select extends _baseComponent.default {
           this.setState({
             isFocus: true
           });
-        } // prevent event bubbling which will fire trigger onFocus event
-
-
-        e.stopPropagation(); // e.nativeEvent.stopImmediatePropagation();
+        }
+        // prevent event bubbling which will fire trigger onFocus event
+        e.stopPropagation();
+        // e.nativeEvent.stopImmediatePropagation();
       },
       onBlur: e => this.foundation.handleInputBlur(e)
     }, selectInputProps));
   }
-
   close() {
     this.foundation.close();
   }
-
   open() {
     this.foundation.open();
   }
-
   clearInput() {
     this.foundation.clearInput();
   }
-
   selectAll() {
     this.foundation.selectAll();
   }
-
   deselectAll() {
     this.foundation.clearSelected();
   }
-
   focus() {
     this.foundation.focus();
   }
-
   onSelect(option, optionIndex, e) {
     this.foundation.onSelect(option, optionIndex, e);
   }
-
   onClear(e) {
     e.nativeEvent.stopImmediatePropagation();
     this.foundation.handleClearClick(e);
   }
-
   search(value, event) {
     this.handleInputChange(value, event);
   }
-
   renderEmpty() {
     return /*#__PURE__*/_react.default.createElement(_option.default, {
       empty: true,
       emptyContent: this.props.emptyContent
     });
   }
-
   renderLoading() {
     const loadingWrapperCls = `${prefixcls}-loading-wrapper`;
     return /*#__PURE__*/_react.default.createElement("div", {
       className: loadingWrapperCls
     }, /*#__PURE__*/_react.default.createElement(_spin.default, null));
   }
-
   renderOption(option, optionIndex, style) {
     const {
       focusIndex,
@@ -591,11 +511,9 @@ class Select extends _baseComponent.default {
     let optionContent;
     const isFocused = optionIndex === focusIndex;
     let optionStyle = style || {};
-
     if (option.style) {
       optionStyle = Object.assign(Object.assign({}, optionStyle), option.style);
     }
-
     if (option._inputCreateOnly) {
       optionContent = this.renderCreateOption(option, isFocused, optionIndex, style);
     } else {
@@ -603,7 +521,6 @@ class Select extends _baseComponent.default {
       if ('key' in option) {
         option._keyInOptionList = option.key;
       }
-
       optionContent = /*#__PURE__*/_react.default.createElement(_option.default, Object.assign({
         showTick: true
       }, option, {
@@ -618,15 +535,13 @@ class Select extends _baseComponent.default {
         id: `${this.selectID}-option-${optionIndex}`
       }), option.label);
     }
-
     return optionContent;
   }
-
   renderCreateOption(option, isFocused, optionIndex, style) {
     const {
       renderCreateItem
-    } = this.props; // default render method
-
+    } = this.props;
+    // default render method
     if (typeof renderCreateItem === 'undefined') {
       const defaultCreateItem = /*#__PURE__*/_react.default.createElement(_option.default, Object.assign({
         key: option.key || option.label + option.value,
@@ -641,10 +556,8 @@ class Select extends _baseComponent.default {
       }, locale => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
         className: `${prefixcls}-create-tips`
       }, locale.createText), option.value)));
-
       return defaultCreateItem;
     }
-
     const customCreateItem = renderCreateItem(option.value, isFocused);
     return (
       /*#__PURE__*/
@@ -657,33 +570,27 @@ class Select extends _baseComponent.default {
       }, customCreateItem)
     );
   }
-
   onOptionHover(optionIndex) {
     this.foundation.handleOptionMouseEnter(optionIndex);
   }
-
   renderWithGroup(visibleOptions) {
     const content = [];
     const groupStatus = new Map();
     visibleOptions.forEach((option, optionIndex) => {
       const parentGroup = option._parentGroup;
       const optionContent = this.renderOption(option, optionIndex);
-
       if (parentGroup && !groupStatus.has(parentGroup.label)) {
         // when use with OptionGroup and group content not already insert
         const groupContent = /*#__PURE__*/_react.default.createElement(_optionGroup.default, Object.assign({}, parentGroup, {
           key: parentGroup.label
         }));
-
         groupStatus.set(parentGroup.label, true);
         content.push(groupContent);
       }
-
       content.push(optionContent);
     });
     return content;
   }
-
   renderVirtualizeList(visibleOptions) {
     const {
       virtualize
@@ -711,7 +618,6 @@ class Select extends _baseComponent.default {
       }
     }, _virtualRow.default);
   }
-
   renderOptions(children) {
     const {
       dropdownMinWidth,
@@ -730,15 +636,13 @@ class Select extends _baseComponent.default {
       virtualize,
       multiple,
       emptyContent
-    } = this.props; // Do a filter first, instead of directly judging in forEach, so that the focusIndex can correspond to
-
+    } = this.props;
+    // Do a filter first, instead of directly judging in forEach, so that the focusIndex can correspond to
     const visibleOptions = options.filter(item => item._show);
     let listContent = this.renderWithGroup(visibleOptions);
-
     if (virtualize) {
       listContent = this.renderVirtualizeList(visibleOptions);
     }
-
     const style = Object.assign({
       minWidth: dropdownMinWidth
     }, dropdownStyle);
@@ -783,7 +687,6 @@ class Select extends _baseComponent.default {
       }, outerBottomSlot) : null)
     );
   }
-
   renderSingleSelection(selections, filterable) {
     let {
       renderSelectedItem
@@ -797,23 +700,20 @@ class Select extends _baseComponent.default {
     } = this.state;
     let renderText = '';
     const selectedItems = [...selections];
-
     if (typeof renderSelectedItem === 'undefined') {
       renderSelectedItem = optionNode => optionNode.label;
     }
-
     if (selectedItems.length) {
       const selectedItem = selectedItems[0][1];
       renderText = renderSelectedItem(selectedItem);
     }
-
     const spanCls = (0, _classnames.default)({
       [`${prefixcls}-selection-text`]: true,
       [`${prefixcls}-selection-placeholder`]: !renderText && renderText !== 0,
       [`${prefixcls}-selection-text-hide`]: inputValue && showInput,
       [`${prefixcls}-selection-text-inactive`]: !inputValue && showInput // Stack Input & RenderText(opacity 0.4)
-
     });
+
     const contentWrapperCls = `${prefixcls}-content-wrapper`;
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
       className: contentWrapperCls
@@ -822,7 +722,6 @@ class Select extends _baseComponent.default {
       "x-semi-prop": "placeholder"
     }, renderText || renderText === 0 ? renderText : placeholder), filterable && showInput ? this.renderInput() : null));
   }
-
   renderTag(item, i, isCollapseItem) {
     const {
       size,
@@ -836,7 +735,6 @@ class Select extends _baseComponent.default {
       value
     } = item[1];
     const disabled = item[1].disabled || selectDisabled;
-
     const onClose = (tagContent, e) => {
       if (e && typeof e.preventDefault === 'function') {
         e.preventDefault(); // make sure that tag will not hidden immediately in controlled mode
@@ -847,14 +745,12 @@ class Select extends _baseComponent.default {
         value
       });
     };
-
     if (typeof renderSelectedItem === 'undefined') {
       renderSelectedItem = optionNode => ({
         isRenderInTag: true,
         content: optionNode.label
       });
     }
-
     const {
       content,
       isRenderInTag
@@ -883,7 +779,6 @@ class Select extends _baseComponent.default {
         }
       }
     }, content) : content;
-
     if (isRenderInTag) {
       return /*#__PURE__*/_react.default.createElement(_index.default, Object.assign({}, basic, {
         color: "white",
@@ -899,14 +794,12 @@ class Select extends _baseComponent.default {
       }, realContent);
     }
   }
-
   renderNTag(n, restTags) {
     const {
       size,
       showRestTagsPopover,
       restTagsPopoverProps
     } = this.props;
-
     let nTag = /*#__PURE__*/_react.default.createElement(_index.default, {
       closable: false,
       size: size || 'large',
@@ -918,7 +811,6 @@ class Select extends _baseComponent.default {
         flexShrink: 0
       }
     }, "+", n);
-
     if (showRestTagsPopover) {
       nTag = /*#__PURE__*/_react.default.createElement(_index4.default, Object.assign({
         showArrow: true,
@@ -936,15 +828,12 @@ class Select extends _baseComponent.default {
         key: `_+${n}_Popover`
       }), nTag);
     }
-
     return nTag;
   }
-
   renderOverflow(items, index) {
     const isCollapse = true;
     return items.length && items[0] ? this.renderTag(items[0], index, isCollapse) : null;
   }
-
   handleOverflow(items) {
     const {
       overflowItemCount,
@@ -955,12 +844,10 @@ class Select extends _baseComponent.default {
     } = this.props;
     const maxVisibleCount = selections.size - maxTagCount;
     const newOverFlowItemCount = maxVisibleCount > 0 ? maxVisibleCount + items.length - 1 : items.length - 1;
-
     if (items.length > 1 && overflowItemCount !== newOverFlowItemCount) {
       this.foundation.updateOverflowItemCount(selections.size, newOverFlowItemCount);
     }
   }
-
   renderCollapsedTags(selections, length) {
     const {
       overflowItemCount
@@ -975,7 +862,6 @@ class Select extends _baseComponent.default {
       visibleItemRenderer: (item, index) => this.renderTag(item, index)
     }), overflowItemCount > 0 && this.renderNTag(overflowItemCount, selections.slice(selections.length - overflowItemCount)));
   }
-
   renderOneLineTags(selectedItems, n) {
     let {
       renderSelectedItem
@@ -989,14 +875,12 @@ class Select extends _baseComponent.default {
       isFullTags
     } = this.state;
     let tagContent;
-
     if (typeof renderSelectedItem === 'undefined') {
       renderSelectedItem = optionNode => ({
         isRenderInTag: true,
         content: optionNode.label
       });
     }
-
     if (showRestTagsPopover) {
       // showRestTagsPopover = true，
       const mapItems = isFullTags ? selectedItems : selectedItems.slice(0, maxTagCount);
@@ -1031,10 +915,8 @@ class Select extends _baseComponent.default {
         mode: "custom"
       });
     }
-
     return tagContent;
   }
-
   renderMultipleSelection(selections, filterable) {
     let {
       renderSelectedItem
@@ -1050,14 +932,12 @@ class Select extends _baseComponent.default {
       isOpen
     } = this.state;
     const selectedItems = [...selections];
-
     if (typeof renderSelectedItem === 'undefined') {
       renderSelectedItem = optionNode => ({
         isRenderInTag: true,
         content: optionNode.label
       });
     }
-
     const contentWrapperCls = (0, _classnames.default)({
       [`${prefixcls}-content-wrapper`]: true,
       [`${prefixcls}-content-wrapper-one-line`]: maxTagCount && !isOpen,
@@ -1079,21 +959,16 @@ class Select extends _baseComponent.default {
       className: contentWrapperCls
     }, selectedItems && selectedItems.length ? tagContent : placeholderText, !filterable ? null : this.renderInput()));
   }
-
   onMouseEnter(e) {
     this.foundation.handleMouseEnter(e);
   }
-
   onMouseLeave(e) {
     this.foundation.handleMouseLeave(e);
   }
-
   onKeyPress(e) {
     this.foundation.handleKeyPress(e);
   }
   /* Processing logic when popover visible changes */
-
-
   handlePopoverVisibleChange(status) {
     const {
       virtualize
@@ -1101,22 +976,18 @@ class Select extends _baseComponent.default {
     const {
       selections
     } = this.state;
-
     if (!status) {
       return;
     }
-
     if (virtualize) {
       let minItemIndex = -1;
       selections.forEach(item => {
         const itemIndex = (0, _get2.default)(item, '_scrollIndex');
         /* When the itemIndex is legal */
-
         if ((0, _isNumber2.default)(itemIndex) && itemIndex >= 0) {
           minItemIndex = minItemIndex !== -1 && minItemIndex < itemIndex ? minItemIndex : itemIndex;
         }
       });
-
       if (minItemIndex !== -1) {
         try {
           this.virtualizeListRef.current.scrollToItem(minItemIndex, 'center');
@@ -1126,7 +997,6 @@ class Select extends _baseComponent.default {
       this.foundation.updateScrollTop();
     }
   }
-
   renderSuffix() {
     const {
       suffix
@@ -1141,7 +1011,6 @@ class Select extends _baseComponent.default {
       "x-semi-prop": "suffix"
     }, suffix);
   }
-
   renderPrefix() {
     const {
       prefix,
@@ -1161,7 +1030,6 @@ class Select extends _baseComponent.default {
       "x-semi-prop": "prefix,insetLabel"
     }, labelNode);
   }
-
   renderSelection() {
     const {
       disabled,
@@ -1194,7 +1062,6 @@ class Select extends _baseComponent.default {
     } = this.state;
     const useCustomTrigger = typeof triggerRender === 'function';
     const filterable = Boolean(filter); // filter（boolean || function）
-
     const selectionCls = useCustomTrigger ? (0, _classnames.default)(className) : (0, _classnames.default)(prefixcls, className, {
       [`${prefixcls}-borderless`]: borderless,
       [`${prefixcls}-open`]: isOpen,
@@ -1218,8 +1085,8 @@ class Select extends _baseComponent.default {
     }, arrowIcon) : /*#__PURE__*/_react.default.createElement("div", {
       className: `${prefixcls}-arrow-empty`
     });
-    const clear = clearIcon ? clearIcon : /*#__PURE__*/_react.default.createElement(_semiIcons.IconClear, null); // semantics of onSearch are more in line with behavior, onChange is alias of onSearch, will be deprecate next major version
-
+    const clear = clearIcon ? clearIcon : /*#__PURE__*/_react.default.createElement(_semiIcons.IconClear, null);
+    // semantics of onSearch are more in line with behavior, onChange is alias of onSearch, will be deprecate next major version
     const inner = useCustomTrigger ? /*#__PURE__*/_react.default.createElement(_trigger.default, {
       value: Array.from(selections.values()),
       inputValue: inputValue,
@@ -1254,11 +1121,9 @@ class Select extends _baseComponent.default {
      * 在disabled，可搜索单选且显示input框，以及可搜索多选情况下
      * 让combobox无法通过tab聚焦
      */
-
     const tabIndex = disabled || filterable && showInput || filterable && multiple ? -1 : 0;
     return (
       /*#__PURE__*/
-
       /* eslint-disable-next-line jsx-a11y/aria-activedescendant-has-tabindex */
       _react.default.createElement("div", Object.assign({
         role: "combobox",
@@ -1287,7 +1152,6 @@ class Select extends _baseComponent.default {
       }, keyboardEventSet), inner)
     );
   }
-
   render() {
     const {
       direction
@@ -1334,9 +1198,7 @@ class Select extends _baseComponent.default {
       afterClose: () => this.foundation.handlePopoverClose()
     }, selection);
   }
-
 }
-
 Select.contextType = _context.default;
 Select.Option = _option.default;
 Select.OptGroup = _optionGroup.default;
@@ -1423,10 +1285,11 @@ Select.propTypes = {
   renderOptionItem: _propTypes.default.func,
   onListScroll: _propTypes.default.func,
   arrowIcon: _propTypes.default.node,
-  preventScroll: _propTypes.default.bool // open: PropTypes.bool,
+  preventScroll: _propTypes.default.bool
+  // open: PropTypes.bool,
   // tagClosable: PropTypes.bool,
-
 };
+
 Select.defaultProps = {
   stopPropagation: true,
   motion: true,
@@ -1467,11 +1330,11 @@ Select.defaultProps = {
   showRestTagsPopover: false,
   restTagsPopoverProps: {},
   expandRestTagsOnClick: false,
-  ellipsisTrigger: false // Radio selection is different from the default renderSelectedItem for multiple selection, so it is not declared here
+  ellipsisTrigger: false
+  // Radio selection is different from the default renderSelectedItem for multiple selection, so it is not declared here
   // renderSelectedItem: (optionNode) => optionNode.label,
   // The default creator rendering is related to i18, so it is not declared here
   // renderCreateItem: (input) => input
-
 };
 var _default = Select;
 exports.default = _default;