@douyinfe/semi-ui 2.10.0 → 2.10.2-alpha.1

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.d.ts

@@ -125,7 +125,7 @@ declare class Form extends BaseComponent<BaseFormProps, BaseFormState> {
         onBlur?: (e: React.FocusEvent<Element, Element>) => void;
         onListScroll?: (e: React.UIEvent<HTMLDivElement, UIEvent>) => void;
         children?: React.ReactNode;
-    } & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
+    } & Pick<import("../tooltip").TooltipProps, "getPopupContainer" | "stopPropagation" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
     static Checkbox: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox").CheckboxProps & import("./interface").RCIncludeType>;
     static CheckboxGroup: React.ComponentType<import("utility-types").Subtract<import("../checkbox").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
     static Radio: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../radio").RadioProps & import("./interface").RCIncludeType>;

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/form/field.d.ts

@@ -73,7 +73,7 @@ declare const FormSelect: import("react").ComponentType<import("utility-types").
     onBlur?: (e: import("react").FocusEvent<Element, Element>) => void;
     onListScroll?: (e: import("react").UIEvent<HTMLDivElement, UIEvent>) => void;
     children?: import("react").ReactNode;
-} & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
+} & Pick<import("../tooltip").TooltipProps, "getPopupContainer" | "stopPropagation" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
 declare const FormCheckboxGroup: import("react").ComponentType<import("utility-types").Subtract<import("../checkbox/checkboxGroup").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
 declare const FormCheckbox: import("react").ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox/checkbox").CheckboxProps & import("./interface").RCIncludeType>;
 declare const FormRadioGroup: import("react").ComponentType<import("utility-types").Subtract<import("../radio/radioGroup").RadioGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;

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/tooltip/index.d.ts

@@ -164,6 +164,7 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
     componentDidUpdate(prevProps: TooltipProps, prevState: TooltipState): void;
     renderIcon: () => any;
     handlePortalInnerClick: (e: React.MouseEvent) => void;
+    handlePortalMouseDown: (e: React.MouseEvent) => void;
     handlePortalInnerKeyDown: (e: React.KeyboardEvent) => void;
     renderContentNode: (content: TooltipProps['content']) => React.ReactNode;
     renderPortal: () => JSX.Element;

package/lib/cjs/tooltip/index.js

@@ -187,6 +187,12 @@ class Tooltip extends _baseComponent.default {
       }
     };
 
+    this.handlePortalMouseDown = e => {
+      if (this.props.stopPropagation) {
+        (0, _utils.stopPropagation)(e);
+      }
+    };
+
     this.handlePortalInnerKeyDown = e => {
       this.foundation.handleContainerKeydown(e);
     };
@@ -271,6 +277,7 @@ class Tooltip extends _baseComponent.default {
         style: portalInnerStyle,
         ref: this.setContainerEl,
         onClick: this.handlePortalInnerClick,
+        onMouseDown: this.handlePortalMouseDown,
         onKeyDown: this.handlePortalInnerKeyDown
       }, inner));
     };
@@ -498,15 +505,11 @@ class Tooltip extends _baseComponent.default {
           }
         };
 
-        document.addEventListener('mousedown', this.clickOutsideHandler, {
-          capture: true
-        });
+        window.addEventListener('mousedown', this.clickOutsideHandler);
       },
       unregisterClickOutsideHandler: () => {
         if (this.clickOutsideHandler) {
-          document.removeEventListener('mousedown', this.clickOutsideHandler, {
-            capture: true
-          });
+          window.removeEventListener('mousedown', this.clickOutsideHandler);
           this.clickOutsideHandler = null;
         }
       },

package/lib/cjs/typography/title.d.ts

@@ -37,7 +37,7 @@ export default class Title extends PureComponent<TitleProps> {
         underline: PropTypes.Requireable<boolean>;
         strong: PropTypes.Requireable<boolean>;
         type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
-        heading: PropTypes.Requireable<1 | 2 | 3 | 4 | 5 | 6>;
+        heading: PropTypes.Requireable<4 | 2 | 1 | 3 | 5 | 6>;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;
         component: PropTypes.Requireable<string>;

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.d.ts

@@ -125,7 +125,7 @@ declare class Form extends BaseComponent<BaseFormProps, BaseFormState> {
         onBlur?: (e: React.FocusEvent<Element, Element>) => void;
         onListScroll?: (e: React.UIEvent<HTMLDivElement, UIEvent>) => void;
         children?: React.ReactNode;
-    } & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
+    } & Pick<import("../tooltip").TooltipProps, "getPopupContainer" | "stopPropagation" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
     static Checkbox: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox").CheckboxProps & import("./interface").RCIncludeType>;
     static CheckboxGroup: React.ComponentType<import("utility-types").Subtract<import("../checkbox").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
     static Radio: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../radio").RadioProps & import("./interface").RCIncludeType>;

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/form/field.d.ts

@@ -73,7 +73,7 @@ declare const FormSelect: import("react").ComponentType<import("utility-types").
     onBlur?: (e: import("react").FocusEvent<Element, Element>) => void;
     onListScroll?: (e: import("react").UIEvent<HTMLDivElement, UIEvent>) => void;
     children?: import("react").ReactNode;
-} & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
+} & Pick<import("../tooltip").TooltipProps, "getPopupContainer" | "stopPropagation" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
 declare const FormCheckboxGroup: import("react").ComponentType<import("utility-types").Subtract<import("../checkbox/checkboxGroup").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
 declare const FormCheckbox: import("react").ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox/checkbox").CheckboxProps & import("./interface").RCIncludeType>;
 declare const FormRadioGroup: import("react").ComponentType<import("utility-types").Subtract<import("../radio/radioGroup").RadioGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;

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/tooltip/index.d.ts

@@ -164,6 +164,7 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
     componentDidUpdate(prevProps: TooltipProps, prevState: TooltipState): void;
     renderIcon: () => any;
     handlePortalInnerClick: (e: React.MouseEvent) => void;
+    handlePortalMouseDown: (e: React.MouseEvent) => void;
     handlePortalInnerKeyDown: (e: React.KeyboardEvent) => void;
     renderContentNode: (content: TooltipProps['content']) => React.ReactNode;
     renderPortal: () => JSX.Element;

package/lib/es/tooltip/index.js

@@ -138,6 +138,12 @@ export default class Tooltip extends BaseComponent {
       }
     };
 
+    this.handlePortalMouseDown = e => {
+      if (this.props.stopPropagation) {
+        stopPropagation(e);
+      }
+    };
+
     this.handlePortalInnerKeyDown = e => {
       this.foundation.handleContainerKeydown(e);
     };
@@ -225,6 +231,7 @@ export default class Tooltip extends BaseComponent {
         style: portalInnerStyle,
         ref: this.setContainerEl,
         onClick: this.handlePortalInnerClick,
+        onMouseDown: this.handlePortalMouseDown,
         onKeyDown: this.handlePortalInnerKeyDown
       }, inner));
     };
@@ -457,15 +464,11 @@ export default class Tooltip extends BaseComponent {
           }
         };
 
-        document.addEventListener('mousedown', this.clickOutsideHandler, {
-          capture: true
-        });
+        window.addEventListener('mousedown', this.clickOutsideHandler);
       },
       unregisterClickOutsideHandler: () => {
         if (this.clickOutsideHandler) {
-          document.removeEventListener('mousedown', this.clickOutsideHandler, {
-            capture: true
-          });
+          window.removeEventListener('mousedown', this.clickOutsideHandler);
           this.clickOutsideHandler = null;
         }
       },

package/lib/es/typography/title.d.ts

@@ -37,7 +37,7 @@ export default class Title extends PureComponent<TitleProps> {
         underline: PropTypes.Requireable<boolean>;
         strong: PropTypes.Requireable<boolean>;
         type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
-        heading: PropTypes.Requireable<1 | 2 | 3 | 4 | 5 | 6>;
+        heading: PropTypes.Requireable<4 | 2 | 1 | 3 | 5 | 6>;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;
         component: PropTypes.Requireable<string>;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-ui",
-    "version": "2.10.0",
+    "version": "2.10.2-alpha.1",
     "description": "",
     "main": "lib/cjs/index.js",
     "module": "lib/es/index.js",
@@ -14,12 +14,12 @@
     },
     "dependencies": {
         "@babel/runtime-corejs3": "^7.15.4",
-        "@douyinfe/semi-animation": "2.10.0",
-        "@douyinfe/semi-animation-react": "2.10.0",
-        "@douyinfe/semi-foundation": "2.10.0",
-        "@douyinfe/semi-icons": "2.10.0",
-        "@douyinfe/semi-illustrations": "2.10.0",
-        "@douyinfe/semi-theme-default": "2.10.0",
+        "@douyinfe/semi-animation": "2.10.1",
+        "@douyinfe/semi-animation-react": "2.10.2-alpha.0",
+        "@douyinfe/semi-foundation": "2.10.1",
+        "@douyinfe/semi-icons": "2.10.1",
+        "@douyinfe/semi-illustrations": "2.10.1",
+        "@douyinfe/semi-theme-default": "2.10.1",
         "@types/react-window": "^1.8.2",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
@@ -69,13 +69,13 @@
     ],
     "author": "",
     "license": "MIT",
-    "gitHead": "0cbe3b9873aa550afa2eda0997eaa7015983fe0d",
+    "gitHead": "f3c92123d53b7b67e6d89b8c858793c2b5c30256",
     "devDependencies": {
         "@babel/plugin-proposal-decorators": "^7.15.8",
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",
         "@babel/preset-react": "^7.14.5",
-        "@douyinfe/semi-scss-compile": "2.10.0",
+        "@douyinfe/semi-scss-compile": "2.10.1",
         "@storybook/addon-knobs": "^6.3.1",
         "@types/lodash": "^4.14.176",
         "babel-loader": "^8.2.2",

package/popover/_story/popover.stories.js

@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 
 import Popover from '../index';
 import { strings } from '@douyinfe/semi-foundation/tooltip/constants';
-import { Button, Input, Table, IconButton, Modal, Tag, Space } from '@douyinfe/semi-ui';
+import { Button, Input, Table, IconButton, Modal, Tag, Space, Select } from '@douyinfe/semi-ui';
 import SelectInPopover from './SelectInPopover';
 import BtnClose from './BtnClose';
 import PopRight from './PopRight';
@@ -10,6 +10,8 @@ import NestedPopover from './NestedPopover';
 import ArrowPointAtCenter from './ArrowPointAtCenter';
 import { IconDelete } from '@douyinfe/semi-icons';
 
+const Option = Select.Option;
+
 export default {
   title: 'Popover',
   parameters: {
@@ -645,4 +647,38 @@ export const A11yKeyboard = () => {
       </div>
   );
 };
-A11yKeyboard.storyName = "a11y keyboard and focus";
+A11yKeyboard.storyName = "a11y keyboard and focus";
+
+/**
+ * fix 嵌套 popover 的弹出层会导致外部 popover 关闭问题
+ * 
+ * @see https://github.com/DouyinFE/semi-design/issues/818
+ * @see https://github.com/facebook/react/issues/4335#issuecomment-421705171
+ */
+export const FixNestedPopover = () => {
+    return (
+        <div data-cy="fix-nested-popover" style={{ paddingLeft: 100 }}>
+            <Popover
+                content={(
+                    <div data-cy="select-in-popover" style={{ padding: 20 }}>
+                        <Select
+                            defaultValue="abc"
+                            style={{ width: 120 }}
+                        >
+                            <Option value="abc">抖音</Option>
+                            <Option value="hotsoon">火山</Option>
+                            <Option value="pipixia" disabled>
+                                皮皮虾
+                            </Option>
+                            <Option value="xigua">西瓜视频</Option>
+                        </Select>
+                    </div>
+                )}
+                trigger="click"
+                showArrow
+            >
+                <Tag>点击此处</Tag>
+            </Popover>
+        </div>
+    );
+}

package/table/Body/BaseRow.tsx

@@ -153,6 +153,21 @@ export default class TableRow extends BaseComponent<BaseRowProps, Record<string,
         this.foundation = new TableRowFoundation(this.adapter);
     }
 
+    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 { className: customClassName, style: customStyle, ...rowProps } = onRow(record, index) || {};
+            this.adapter.setCache('customRowProps', { ...rowProps });
+        }
+    }
+
     shouldComponentUpdate(nextProps: BaseRowProps) {
         /**
           * Shallow comparison of incoming props to simulate PureComponent

package/tooltip/index.tsx

@@ -343,11 +343,11 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
                         cb();
                     }
                 };
-                document.addEventListener('mousedown', this.clickOutsideHandler, { capture: true });
+                window.addEventListener('mousedown', this.clickOutsideHandler);
             },
             unregisterClickOutsideHandler: () => {
                 if (this.clickOutsideHandler) {
-                    document.removeEventListener('mousedown', this.clickOutsideHandler, { capture: true });
+                    window.removeEventListener('mousedown', this.clickOutsideHandler);
                     this.clickOutsideHandler = null;
                 }
             },
@@ -528,6 +528,12 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
         }
     };
 
+    handlePortalMouseDown = (e: React.MouseEvent) => {
+        if (this.props.stopPropagation) {
+            stopPropagation(e);
+        }
+    }
+
     handlePortalInnerKeyDown = (e: React.KeyboardEvent) => {
         this.foundation.handleContainerKeydown(e);
     }
@@ -595,6 +601,7 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
                     style={portalInnerStyle}
                     ref={this.setContainerEl}
                     onClick={this.handlePortalInnerClick}
+                    onMouseDown={this.handlePortalMouseDown}
                     onKeyDown={this.handlePortalInnerKeyDown}
                 >
                     {inner}