@douyinfe/semi-ui 2.10.1 → 2.10.2

package/form/baseForm.tsx

@@ -151,7 +151,6 @@ class Form extends BaseComponent<BaseFormProps, BaseFormState> {
 
     componentWillUnmount() {
         this.foundation.destroy();
-        this.foundation = null;
         this.formApi = null;
     }
 

package/lib/cjs/checkbox/checkbox.js

@@ -150,6 +150,7 @@ class Checkbox extends _baseComponent.default {
       } = this.context.checkboxGroup;
       props.isCardType = isCardType;
       props.isPureCardType = isPureCardType;
+      props['name'] = this.context.checkboxGroup.name;
     }
 
     const prefix = prefixCls || _constants.checkboxClasses.PREFIX;
@@ -168,7 +169,6 @@ class Checkbox extends _baseComponent.default {
     const extraCls = (0, _classnames.default)("".concat(prefix, "-extra"), {
       ["".concat(prefix, "-cardType_extra_noChildren")]: props.isCardType && !children
     });
-    const name = inGroup && this.context.checkboxGroup.name;
 
     const renderContent = () => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children ? /*#__PURE__*/_react.default.createElement("span", {
       id: this.addonId,
@@ -196,7 +196,6 @@ class Checkbox extends _baseComponent.default {
       }, /*#__PURE__*/_react.default.createElement(_checkboxInner.default, (0, _assign.default)({}, this.props, props, {
         addonId: children && this.addonId,
         extraId: extra && this.extraId,
-        name: name,
         isPureCardType: props.isPureCardType,
         ref: ref => {
           this.checkboxEntity = ref;

package/lib/cjs/checkbox/checkboxInner.js

@@ -14,6 +14,8 @@ _Object$defineProperty(exports, "__esModule", {
 
 exports.default = void 0;
 
+var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
+
 var _noop2 = _interopRequireDefault(require("lodash/noop"));
 
 var _react = _interopRequireWildcard(require("react"));
@@ -63,27 +65,29 @@ class CheckboxInner extends _react.PureComponent {
       ["".concat(prefix, "-inner-display")]: true
     });
     const icon = checked ? /*#__PURE__*/_react.default.createElement(_semiIcons.IconCheckboxTick, null) : indeterminate ? /*#__PURE__*/_react.default.createElement(_semiIcons.IconCheckboxIndeterminate, null) : null;
-    return /*#__PURE__*/_react.default.createElement("span", {
-      className: wrapper
-    }, /*#__PURE__*/_react.default.createElement("input", {
+    const inputProps = {
       type: "checkbox",
-      "aria-label": this.props['aria-label'],
-      "aria-disabled": disabled,
-      "aria-checked": checked,
-      "aria-labelledby": addonId,
-      "aria-describedby": extraId || this.props['aria-describedby'],
-      "aria-invalid": this.props['aria-invalid'],
-      "aria-errormessage": this.props['aria-errormessage'],
-      "aria-required": this.props['aria-required'],
-      ref: ref => {
-        this.inputEntity = ref;
-      },
+      'aria-label': this.props['aria-label'],
+      'aria-disabled': disabled,
+      'aria-checked': checked,
+      'aria-labelledby': addonId,
+      'aria-describedby': extraId || this.props['aria-describedby'],
+      'aria-invalid': this.props['aria-invalid'],
+      'aria-errormessage': this.props['aria-errormessage'],
+      'aria-required': this.props['aria-required'],
       className: _constants.checkboxClasses.INPUT,
       onChange: _noop2.default,
       checked: checked,
-      disabled: disabled,
-      name: name
-    }), /*#__PURE__*/_react.default.createElement("span", {
+      disabled: disabled
+    };
+    name && (inputProps['name'] = name);
+    return /*#__PURE__*/_react.default.createElement("span", {
+      className: wrapper
+    }, /*#__PURE__*/_react.default.createElement("input", (0, _assign.default)({}, inputProps, {
+      ref: ref => {
+        this.inputEntity = ref;
+      }
+    })), /*#__PURE__*/_react.default.createElement("span", {
       className: inner
     }, icon));
   }

package/lib/cjs/form/baseForm.js

@@ -106,7 +106,6 @@ class Form extends _baseComponent.default {
 
   componentWillUnmount() {
     this.foundation.destroy();
-    this.foundation = null;
     this.formApi = null;
   }
 

package/lib/cjs/select/index.js

@@ -16,8 +16,6 @@ exports.default = void 0;
 
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/map"));
 
-var _slice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/slice"));
-
 var _bind = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/bind"));
 
 var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
@@ -34,6 +32,8 @@ var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-sta
 
 var _some = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/some"));
 
+var _slice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/slice"));
+
 var _from = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/from"));
 
 var _values = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/values"));
@@ -56,7 +56,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _context16 = _interopRequireDefault(require("../configProvider/context"));
+var _context15 = _interopRequireDefault(require("../configProvider/context"));
 
 var _foundation = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/select/foundation"));
 
@@ -96,6 +96,8 @@ var _utils2 = require("../_utils");
 
 var _warning = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/warning"));
 
+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); }
@@ -110,7 +112,7 @@ const key = 0; // Notes: Use the label of the option as the identifier, that is,
 
 class Select extends _baseComponent.default {
   constructor(props) {
-    var _context, _context2, _context3, _context4, _context5, _context6, _context7, _context8;
+    var _context, _context2, _context3, _context4, _context5, _context6, _context7;
 
     super(props);
 
@@ -132,19 +134,19 @@ class Select extends _baseComponent.default {
     };
     /* Generate random string */
 
-    this.selectOptionListID = (0, _slice.default)(_context = Math.random().toString(36)).call(_context, 2);
+    this.selectOptionListID = '';
     this.virtualizeListRef = /*#__PURE__*/_react.default.createRef();
     this.inputRef = /*#__PURE__*/_react.default.createRef();
     this.triggerRef = /*#__PURE__*/_react.default.createRef();
     this.optionsRef = /*#__PURE__*/_react.default.createRef();
     this.clickOutsideHandler = null;
-    this.onSelect = (0, _bind.default)(_context2 = this.onSelect).call(_context2, this);
-    this.onClear = (0, _bind.default)(_context3 = this.onClear).call(_context3, this);
-    this.onMouseEnter = (0, _bind.default)(_context4 = this.onMouseEnter).call(_context4, this);
-    this.onMouseLeave = (0, _bind.default)(_context5 = this.onMouseLeave).call(_context5, this);
-    this.renderOption = (0, _bind.default)(_context6 = this.renderOption).call(_context6, this);
-    this.onKeyPress = (0, _bind.default)(_context7 = this.onKeyPress).call(_context7, this);
-    this.onClearBtnEnterPress = (0, _bind.default)(_context8 = this.onClearBtnEnterPress).call(_context8, this);
+    this.onSelect = (0, _bind.default)(_context = this.onSelect).call(_context, this);
+    this.onClear = (0, _bind.default)(_context2 = this.onClear).call(_context2, this);
+    this.onMouseEnter = (0, _bind.default)(_context3 = this.onMouseEnter).call(_context3, this);
+    this.onMouseLeave = (0, _bind.default)(_context4 = this.onMouseLeave).call(_context4, this);
+    this.renderOption = (0, _bind.default)(_context5 = this.renderOption).call(_context5, this);
+    this.onKeyPress = (0, _bind.default)(_context6 = this.onKeyPress).call(_context6, this);
+    this.onClearBtnEnterPress = (0, _bind.default)(_context7 = this.onClearBtnEnterPress).call(_context7, this);
     this.foundation = new _foundation.default(this.adapter);
     (0, _warning.default)('optionLabelProp' in this.props, '[Semi Select] \'optionLabelProp\' has already been deprecated, please use \'renderSelectedItem\' instead.');
     (0, _warning.default)('labelInValue' in this.props, '[Semi Select] \'labelInValue\' has already been deprecated, please use \'onChangeWithObject\' instead.');
@@ -348,18 +350,18 @@ class Select extends _baseComponent.default {
         } catch (error) {}
       },
       updateScrollTop: index => {
-        var _context10, _context11;
+        var _context9, _context10;
 
         // eslint-disable-next-line max-len
         let optionClassName = ".".concat(prefixcls, "-option-selected");
 
         if (index !== undefined) {
-          var _context9;
+          var _context8;
 
-          optionClassName = (0, _concat.default)(_context9 = ".".concat(prefixcls, "-option:nth-child(")).call(_context9, index, ")");
+          optionClassName = (0, _concat.default)(_context8 = ".".concat(prefixcls, "-option:nth-child(")).call(_context8, index, ")");
         }
 
-        let destNode = document.querySelector((0, _concat.default)(_context10 = (0, _concat.default)(_context11 = "#".concat(prefixcls, "-")).call(_context11, this.selectOptionListID, " ")).call(_context10, optionClassName));
+        let destNode = document.querySelector((0, _concat.default)(_context9 = (0, _concat.default)(_context10 = "#".concat(prefixcls, "-")).call(_context10, this.selectOptionListID, " ")).call(_context9, optionClassName));
 
         if ((0, _isArray.default)(destNode)) {
           // eslint-disable-next-line prefer-destructuring
@@ -380,6 +382,7 @@ class Select extends _baseComponent.default {
 
   componentDidMount() {
     this.foundation.init();
+    this.selectOptionListID = (0, _uuid.getUuidShort)();
   }
 
   componentWillUnmount() {
@@ -387,10 +390,10 @@ class Select extends _baseComponent.default {
   }
 
   componentDidUpdate(prevProps, prevState) {
-    var _context12, _context13;
+    var _context11, _context12;
 
-    const prevChildrenKeys = (0, _map2.default)(_context12 = _react.default.Children.toArray(prevProps.children)).call(_context12, child => child.key);
-    const nowChildrenKeys = (0, _map2.default)(_context13 = _react.default.Children.toArray(this.props.children)).call(_context13, child => child.key);
+    const prevChildrenKeys = (0, _map2.default)(_context11 = _react.default.Children.toArray(prevProps.children)).call(_context11, child => child.key);
+    const nowChildrenKeys = (0, _map2.default)(_context12 = _react.default.Children.toArray(this.props.children)).call(_context12, child => child.key);
     let isOptionsChanged = false;
 
     if (!(0, _isEqual2.default)(prevChildrenKeys, nowChildrenKeys) || !(0, _isEqual2.default)(prevProps.optionList, this.props.optionList)) {
@@ -631,7 +634,7 @@ class Select extends _baseComponent.default {
   }
 
   renderOptions(children) {
-    var _context14;
+    var _context13;
 
     const {
       dropdownMinWidth,
@@ -667,7 +670,7 @@ class Select extends _baseComponent.default {
     });
     const isEmpty = !options.length || !(0, _some.default)(options).call(options, item => item._show);
     return /*#__PURE__*/_react.default.createElement("div", {
-      id: (0, _concat.default)(_context14 = "".concat(prefixcls, "-")).call(_context14, this.selectOptionListID),
+      id: (0, _concat.default)(_context13 = "".concat(prefixcls, "-")).call(_context13, this.selectOptionListID),
       className: dropdownClassName,
       style: style
     }, outerTopSlot, /*#__PURE__*/_react.default.createElement("div", {
@@ -898,7 +901,7 @@ class Select extends _baseComponent.default {
   }
 
   renderSelection() {
-    var _context15;
+    var _context14;
 
     const {
       disabled,
@@ -982,7 +985,7 @@ class Select extends _baseComponent.default {
       role: "combobox",
       "aria-disabled": disabled,
       "aria-expanded": isOpen,
-      "aria-controls": (0, _concat.default)(_context15 = "".concat(prefixcls, "-")).call(_context15, this.selectOptionListID),
+      "aria-controls": (0, _concat.default)(_context14 = "".concat(prefixcls, "-")).call(_context14, this.selectOptionListID),
       "aria-haspopup": "listbox",
       "aria-label": "select value",
       "aria-invalid": this.props['aria-invalid'],
@@ -1049,7 +1052,7 @@ class Select extends _baseComponent.default {
 
 }
 
-Select.contextType = _context16.default;
+Select.contextType = _context15.default;
 Select.Option = _option.default;
 Select.OptGroup = _optionGroup.default;
 Select.propTypes = {

package/lib/cjs/table/Body/BaseRow.d.ts

@@ -113,6 +113,7 @@ export default class TableRow extends BaseComponent<BaseRowProps, Record<string,
     get adapter(): TableRowAdapter<BaseRowProps>;
     ref: React.MutableRefObject<any>;
     constructor(props: BaseRowProps);
+    componentDidMount(): void;
     shouldComponentUpdate(nextProps: BaseRowProps): boolean;
     _cacheNode: (node: any) => void;
     renderExpandIcon: (record: Record<string, any>) => React.ReactNode;

package/lib/cjs/table/Body/BaseRow.js

@@ -141,6 +141,28 @@ class TableRow extends _baseComponent.default {
     });
   }
 
+  componentDidMount() {
+    // fix #745
+    // didmount/willUnmount may be called twice when React.StrictMode is true in React 18, we need to ensure that this.cache.customRowProps is correct
+    const {
+      onRow,
+      index,
+      record
+    } = this.props;
+    const customRowProps = this.adapter.getCache('customRowProps');
+
+    if (typeof customRowProps === 'undefined') {
+      const _a = onRow(record, index) || {},
+            {
+        className: customClassName,
+        style: customStyle
+      } = _a,
+            rowProps = __rest(_a, ["className", "style"]);
+
+      this.adapter.setCache('customRowProps', (0, _assign.default)({}, rowProps));
+    }
+  }
+
   shouldComponentUpdate(nextProps) {
     /**
       * Shallow comparison of incoming props to simulate PureComponent

package/lib/cjs/table/HeadTable.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Fixed, TableComponents, Scroll, BodyScrollEvent, ColumnProps } from './interface';
+import { Fixed, TableComponents, Scroll, BodyScrollEvent, ColumnProps, OnHeaderRow } from './interface';
 export interface HeadTableProps {
     [x: string]: any;
     anyColumnFixed?: boolean;
@@ -15,6 +15,7 @@ export interface HeadTableProps {
     selectedRowKeysSet: Set<any>;
     showHeader?: boolean;
     onDidUpdate?: (ref: React.MutableRefObject<any>) => void;
+    onHeaderRow?: OnHeaderRow<any>;
 }
 declare const _default: React.ForwardRefExoticComponent<Pick<HeadTableProps, keyof HeadTableProps> & React.RefAttributes<HTMLDivElement>>;
 export default _default;

package/lib/cjs/table/HeadTable.js

@@ -116,7 +116,8 @@ HeadTable.propTypes = {
   }),
   selectedRowKeysSet: _propTypes.default.instanceOf(_set.default).isRequired,
   showHeader: _propTypes.default.bool,
-  onDidUpdate: _propTypes.default.func
+  onDidUpdate: _propTypes.default.func,
+  onHeaderRow: _propTypes.default.func
 };
 HeadTable.defaultProps = {
   handleBodyScroll: _noop2.default

package/lib/cjs/table/Table.js

@@ -718,6 +718,7 @@ class Table extends _baseComponent.default {
         components,
         headerRef,
         bodyRef,
+        onHeaderRow,
         rowSelection,
         dataSource,
         bodyHasScrollBar,
@@ -736,6 +737,7 @@ class Table extends _baseComponent.default {
         scroll: scroll,
         showHeader: showHeader,
         selectedRowKeysSet: selectedRowKeysSet,
+        onHeaderRow: onHeaderRow,
         dataSource: dataSource,
         bodyHasScrollBar: bodyHasScrollBar
       }) : null;

package/lib/es/checkbox/checkbox.js

@@ -126,6 +126,7 @@ class Checkbox extends BaseComponent {
       } = this.context.checkboxGroup;
       props.isCardType = isCardType;
       props.isPureCardType = isPureCardType;
+      props['name'] = this.context.checkboxGroup.name;
     }
 
     const prefix = prefixCls || css.PREFIX;
@@ -144,7 +145,6 @@ class Checkbox extends BaseComponent {
     const extraCls = classnames("".concat(prefix, "-extra"), {
       ["".concat(prefix, "-cardType_extra_noChildren")]: props.isCardType && !children
     });
-    const name = inGroup && this.context.checkboxGroup.name;
 
     const renderContent = () => /*#__PURE__*/React.createElement(React.Fragment, null, children ? /*#__PURE__*/React.createElement("span", {
       id: this.addonId,
@@ -172,7 +172,6 @@ class Checkbox extends BaseComponent {
       }, /*#__PURE__*/React.createElement(CheckboxInner, _Object$assign({}, this.props, props, {
         addonId: children && this.addonId,
         extraId: extra && this.extraId,
-        name: name,
         isPureCardType: props.isPureCardType,
         ref: ref => {
           this.checkboxEntity = ref;

package/lib/es/checkbox/checkboxInner.js

@@ -1,4 +1,5 @@
 import _noop from "lodash/noop";
+import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
 
 /* eslint-disable no-nested-ternary */
 import React, { PureComponent } from 'react';
@@ -38,27 +39,29 @@ class CheckboxInner extends PureComponent {
       ["".concat(prefix, "-inner-display")]: true
     });
     const icon = checked ? /*#__PURE__*/React.createElement(IconCheckboxTick, null) : indeterminate ? /*#__PURE__*/React.createElement(IconCheckboxIndeterminate, null) : null;
-    return /*#__PURE__*/React.createElement("span", {
-      className: wrapper
-    }, /*#__PURE__*/React.createElement("input", {
+    const inputProps = {
       type: "checkbox",
-      "aria-label": this.props['aria-label'],
-      "aria-disabled": disabled,
-      "aria-checked": checked,
-      "aria-labelledby": addonId,
-      "aria-describedby": extraId || this.props['aria-describedby'],
-      "aria-invalid": this.props['aria-invalid'],
-      "aria-errormessage": this.props['aria-errormessage'],
-      "aria-required": this.props['aria-required'],
-      ref: ref => {
-        this.inputEntity = ref;
-      },
+      'aria-label': this.props['aria-label'],
+      'aria-disabled': disabled,
+      'aria-checked': checked,
+      'aria-labelledby': addonId,
+      'aria-describedby': extraId || this.props['aria-describedby'],
+      'aria-invalid': this.props['aria-invalid'],
+      'aria-errormessage': this.props['aria-errormessage'],
+      'aria-required': this.props['aria-required'],
       className: css.INPUT,
       onChange: _noop,
       checked: checked,
-      disabled: disabled,
-      name: name
-    }), /*#__PURE__*/React.createElement("span", {
+      disabled: disabled
+    };
+    name && (inputProps['name'] = name);
+    return /*#__PURE__*/React.createElement("span", {
+      className: wrapper
+    }, /*#__PURE__*/React.createElement("input", _Object$assign({}, inputProps, {
+      ref: ref => {
+        this.inputEntity = ref;
+      }
+    })), /*#__PURE__*/React.createElement("span", {
       className: inner
     }, icon));
   }

package/lib/es/form/baseForm.js

@@ -68,7 +68,6 @@ class Form extends BaseComponent {
 
   componentWillUnmount() {
     this.foundation.destroy();
-    this.foundation = null;
     this.formApi = null;
   }
 

package/lib/es/select/index.js

@@ -4,7 +4,6 @@ import _noop from "lodash/noop";
 import _isString from "lodash/isString";
 import _isEqual from "lodash/isEqual";
 import _Map from "@babel/runtime-corejs3/core-js-stable/map";
-import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
 import _bindInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/bind";
 import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
@@ -13,6 +12,7 @@ import _Array$isArray from "@babel/runtime-corejs3/core-js-stable/array/is-array
 import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
 import _someInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/some";
+import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
 import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
 import _valuesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/values";
 
@@ -43,13 +43,14 @@ import Trigger from '../trigger';
 import { IconChevronDown, IconClear } from '@douyinfe/semi-icons';
 import { isSemiIcon } from '../_utils';
 import warning from '@douyinfe/semi-foundation/lib/es/utils/warning';
+import { getUuidShort } from '@douyinfe/semi-foundation/lib/es/utils/uuid';
 import '@douyinfe/semi-foundation/lib/es/select/select.css';
 const prefixcls = 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 {
   constructor(props) {
-    var _context, _context2, _context3, _context4, _context5, _context6, _context7, _context8;
+    var _context, _context2, _context3, _context4, _context5, _context6, _context7;
 
     super(props);
 
@@ -71,19 +72,19 @@ class Select extends BaseComponent {
     };
     /* Generate random string */
 
-    this.selectOptionListID = _sliceInstanceProperty(_context = Math.random().toString(36)).call(_context, 2);
+    this.selectOptionListID = '';
     this.virtualizeListRef = /*#__PURE__*/React.createRef();
     this.inputRef = /*#__PURE__*/React.createRef();
     this.triggerRef = /*#__PURE__*/React.createRef();
     this.optionsRef = /*#__PURE__*/React.createRef();
     this.clickOutsideHandler = null;
-    this.onSelect = _bindInstanceProperty(_context2 = this.onSelect).call(_context2, this);
-    this.onClear = _bindInstanceProperty(_context3 = this.onClear).call(_context3, this);
-    this.onMouseEnter = _bindInstanceProperty(_context4 = this.onMouseEnter).call(_context4, this);
-    this.onMouseLeave = _bindInstanceProperty(_context5 = this.onMouseLeave).call(_context5, this);
-    this.renderOption = _bindInstanceProperty(_context6 = this.renderOption).call(_context6, this);
-    this.onKeyPress = _bindInstanceProperty(_context7 = this.onKeyPress).call(_context7, this);
-    this.onClearBtnEnterPress = _bindInstanceProperty(_context8 = this.onClearBtnEnterPress).call(_context8, this);
+    this.onSelect = _bindInstanceProperty(_context = this.onSelect).call(_context, this);
+    this.onClear = _bindInstanceProperty(_context2 = this.onClear).call(_context2, this);
+    this.onMouseEnter = _bindInstanceProperty(_context3 = this.onMouseEnter).call(_context3, this);
+    this.onMouseLeave = _bindInstanceProperty(_context4 = this.onMouseLeave).call(_context4, this);
+    this.renderOption = _bindInstanceProperty(_context5 = this.renderOption).call(_context5, this);
+    this.onKeyPress = _bindInstanceProperty(_context6 = this.onKeyPress).call(_context6, this);
+    this.onClearBtnEnterPress = _bindInstanceProperty(_context7 = this.onClearBtnEnterPress).call(_context7, this);
     this.foundation = new SelectFoundation(this.adapter);
     warning('optionLabelProp' in this.props, '[Semi Select] \'optionLabelProp\' has already been deprecated, please use \'renderSelectedItem\' instead.');
     warning('labelInValue' in this.props, '[Semi Select] \'labelInValue\' has already been deprecated, please use \'onChangeWithObject\' instead.');
@@ -286,18 +287,18 @@ class Select extends BaseComponent {
         } catch (error) {}
       },
       updateScrollTop: index => {
-        var _context10, _context11;
+        var _context9, _context10;
 
         // eslint-disable-next-line max-len
         let optionClassName = ".".concat(prefixcls, "-option-selected");
 
         if (index !== undefined) {
-          var _context9;
+          var _context8;
 
-          optionClassName = _concatInstanceProperty(_context9 = ".".concat(prefixcls, "-option:nth-child(")).call(_context9, index, ")");
+          optionClassName = _concatInstanceProperty(_context8 = ".".concat(prefixcls, "-option:nth-child(")).call(_context8, index, ")");
         }
 
-        let destNode = document.querySelector(_concatInstanceProperty(_context10 = _concatInstanceProperty(_context11 = "#".concat(prefixcls, "-")).call(_context11, this.selectOptionListID, " ")).call(_context10, optionClassName));
+        let destNode = document.querySelector(_concatInstanceProperty(_context9 = _concatInstanceProperty(_context10 = "#".concat(prefixcls, "-")).call(_context10, this.selectOptionListID, " ")).call(_context9, optionClassName));
 
         if (_Array$isArray(destNode)) {
           // eslint-disable-next-line prefer-destructuring
@@ -318,6 +319,7 @@ class Select extends BaseComponent {
 
   componentDidMount() {
     this.foundation.init();
+    this.selectOptionListID = getUuidShort();
   }
 
   componentWillUnmount() {
@@ -325,11 +327,11 @@ class Select extends BaseComponent {
   }
 
   componentDidUpdate(prevProps, prevState) {
-    var _context12, _context13;
+    var _context11, _context12;
 
-    const prevChildrenKeys = _mapInstanceProperty(_context12 = React.Children.toArray(prevProps.children)).call(_context12, child => child.key);
+    const prevChildrenKeys = _mapInstanceProperty(_context11 = React.Children.toArray(prevProps.children)).call(_context11, child => child.key);
 
-    const nowChildrenKeys = _mapInstanceProperty(_context13 = React.Children.toArray(this.props.children)).call(_context13, child => child.key);
+    const nowChildrenKeys = _mapInstanceProperty(_context12 = React.Children.toArray(this.props.children)).call(_context12, child => child.key);
 
     let isOptionsChanged = false;
 
@@ -575,7 +577,7 @@ class Select extends BaseComponent {
   }
 
   renderOptions(children) {
-    var _context14;
+    var _context13;
 
     const {
       dropdownMinWidth,
@@ -613,7 +615,7 @@ class Select extends BaseComponent {
     });
     const isEmpty = !options.length || !_someInstanceProperty(options).call(options, item => item._show);
     return /*#__PURE__*/React.createElement("div", {
-      id: _concatInstanceProperty(_context14 = "".concat(prefixcls, "-")).call(_context14, this.selectOptionListID),
+      id: _concatInstanceProperty(_context13 = "".concat(prefixcls, "-")).call(_context13, this.selectOptionListID),
       className: dropdownClassName,
       style: style
     }, outerTopSlot, /*#__PURE__*/React.createElement("div", {
@@ -847,7 +849,7 @@ class Select extends BaseComponent {
   }
 
   renderSelection() {
-    var _context15;
+    var _context14;
 
     const {
       disabled,
@@ -931,7 +933,7 @@ class Select extends BaseComponent {
       role: "combobox",
       "aria-disabled": disabled,
       "aria-expanded": isOpen,
-      "aria-controls": _concatInstanceProperty(_context15 = "".concat(prefixcls, "-")).call(_context15, this.selectOptionListID),
+      "aria-controls": _concatInstanceProperty(_context14 = "".concat(prefixcls, "-")).call(_context14, this.selectOptionListID),
       "aria-haspopup": "listbox",
       "aria-label": "select value",
       "aria-invalid": this.props['aria-invalid'],

package/lib/es/table/Body/BaseRow.d.ts

@@ -113,6 +113,7 @@ export default class TableRow extends BaseComponent<BaseRowProps, Record<string,
     get adapter(): TableRowAdapter<BaseRowProps>;
     ref: React.MutableRefObject<any>;
     constructor(props: BaseRowProps);
+    componentDidMount(): void;
     shouldComponentUpdate(nextProps: BaseRowProps): boolean;
     _cacheNode: (node: any) => void;
     renderExpandIcon: (record: Record<string, any>) => React.ReactNode;

package/lib/es/table/Body/BaseRow.js

@@ -103,6 +103,28 @@ export default class TableRow extends BaseComponent {
     });
   }
 
+  componentDidMount() {
+    // fix #745
+    // didmount/willUnmount may be called twice when React.StrictMode is true in React 18, we need to ensure that this.cache.customRowProps is correct
+    const {
+      onRow,
+      index,
+      record
+    } = this.props;
+    const customRowProps = this.adapter.getCache('customRowProps');
+
+    if (typeof customRowProps === 'undefined') {
+      const _a = onRow(record, index) || {},
+            {
+        className: customClassName,
+        style: customStyle
+      } = _a,
+            rowProps = __rest(_a, ["className", "style"]);
+
+      this.adapter.setCache('customRowProps', _Object$assign({}, rowProps));
+    }
+  }
+
   shouldComponentUpdate(nextProps) {
     /**
       * Shallow comparison of incoming props to simulate PureComponent

package/lib/es/table/HeadTable.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Fixed, TableComponents, Scroll, BodyScrollEvent, ColumnProps } from './interface';
+import { Fixed, TableComponents, Scroll, BodyScrollEvent, ColumnProps, OnHeaderRow } from './interface';
 export interface HeadTableProps {
     [x: string]: any;
     anyColumnFixed?: boolean;
@@ -15,6 +15,7 @@ export interface HeadTableProps {
     selectedRowKeysSet: Set<any>;
     showHeader?: boolean;
     onDidUpdate?: (ref: React.MutableRefObject<any>) => void;
+    onHeaderRow?: OnHeaderRow<any>;
 }
 declare const _default: React.ForwardRefExoticComponent<Pick<HeadTableProps, keyof HeadTableProps> & React.RefAttributes<HTMLDivElement>>;
 export default _default;

package/lib/es/table/HeadTable.js

@@ -96,7 +96,8 @@ HeadTable.propTypes = {
   }),
   selectedRowKeysSet: PropTypes.instanceOf(_Set).isRequired,
   showHeader: PropTypes.bool,
-  onDidUpdate: PropTypes.func
+  onDidUpdate: PropTypes.func,
+  onHeaderRow: PropTypes.func
 };
 HeadTable.defaultProps = {
   handleBodyScroll: _noop

package/lib/es/table/Table.js

@@ -658,6 +658,7 @@ class Table extends BaseComponent {
         components,
         headerRef,
         bodyRef,
+        onHeaderRow,
         rowSelection,
         dataSource,
         bodyHasScrollBar,
@@ -678,6 +679,7 @@ class Table extends BaseComponent {
         scroll: scroll,
         showHeader: showHeader,
         selectedRowKeysSet: selectedRowKeysSet,
+        onHeaderRow: onHeaderRow,
         dataSource: dataSource,
         bodyHasScrollBar: bodyHasScrollBar
       }) : null;