@douyinfe/semi-ui 2.23.0-beta.1 → 2.23.0

package/lib/cjs/_base/base.css

@@ -9,6 +9,7 @@ body {
   --semi-transition_duration-fast:0ms;
   --semi-transition_duration-faster:0ms;
   --semi-transition_duration-fastest:0ms;
+  --semi-transition_duration-none:0ms;
   --semi-transition_function-linear:linear;
   --semi-transition_function-ease:ease;
   --semi-transition_function-easeIn:ease-in;

package/lib/cjs/datePicker/yearAndMonth.js

@@ -186,7 +186,6 @@ class YearAndMonth extends _baseComponent.default {
       disabledDate,
       yearAndMonthOpts
     } = this.props;
-    console.log('yearAndMonthOpts', yearAndMonthOpts);
 
     let transform = val => val;
 

package/lib/cjs/dropdown/dropdownMenu.d.ts

@@ -9,7 +9,6 @@ declare class DropdownMenu extends BaseComponent<DropdownMenuProps> {
         style: PropTypes.Requireable<object>;
     };
     static contextType: React.Context<import("./context").DropdownContextType>;
-    menuRef: React.RefObject<HTMLUListElement>;
     constructor(props: DropdownMenuProps);
     get adapter(): {
         getContext(key: string): any;
@@ -25,7 +24,6 @@ declare class DropdownMenu extends BaseComponent<DropdownMenuProps> {
         stopPropagation(e: any): void;
         persistEvent: (event: any) => void;
     };
-    componentDidMount(): void;
     render(): JSX.Element;
 }
 export default DropdownMenu;

package/lib/cjs/dropdown/dropdownMenu.js

@@ -37,7 +37,6 @@ const prefixCls = _constants.cssClasses.PREFIX;
 class DropdownMenu extends _baseComponent.default {
   constructor(props) {
     super(props);
-    this.menuRef = /*#__PURE__*/_react.default.createRef();
     this.foundation = new _menuFoundation.default(this.adapter);
   }
 
@@ -45,10 +44,6 @@ class DropdownMenu extends _baseComponent.default {
     return Object.assign({}, super.adapter);
   }
 
-  componentDidMount() {
-    this.foundation.autoFocus(this.menuRef.current);
-  }
-
   render() {
     const _a = this.props,
           {
@@ -60,8 +55,7 @@ class DropdownMenu extends _baseComponent.default {
 
     return /*#__PURE__*/_react.default.createElement("ul", Object.assign({
       role: "menu",
-      "aria-orientation": "vertical",
-      ref: this.menuRef
+      "aria-orientation": "vertical"
     }, rest, {
       className: (0, _classnames.default)("".concat(prefixCls, "-menu"), className),
       style: style,

package/lib/cjs/dropdown/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import BaseComponent from '../_base/baseComponent';
-import { Position, TooltipProps, Trigger } from '../tooltip/index';
+import Tooltip, { Position, TooltipProps, Trigger } from '../tooltip/index';
 import DropdownMenu from './dropdownMenu';
 import DropdownItem, { DropdownItemProps } from './dropdownItem';
 import { DropdownDividerProps } from './dropdownDivider';
@@ -87,11 +87,13 @@ declare class Dropdown extends BaseComponent<DropdownProps, DropdownState> {
         closeOnEsc: boolean;
         onEscKeyDown: (...args: any[]) => void;
     };
+    tooltipRef: React.RefObject<Tooltip>;
     constructor(props: DropdownProps);
     context: DropdownContextType;
     get adapter(): {
         setPopVisible: (popVisible: boolean) => void;
         notifyVisibleChange: (visible: boolean) => void;
+        getPopupId: () => string;
         getContext(key: string): any;
         getContexts(): any;
         getProp(key: string): any;

package/lib/cjs/dropdown/index.js

@@ -63,6 +63,7 @@ class Dropdown extends _baseComponent.default {
       popVisible: props.visible
     };
     this.foundation = new _foundation.default(this.adapter);
+    this.tooltipRef = /*#__PURE__*/_react.default.createRef();
   }
 
   get adapter() {
@@ -70,7 +71,8 @@ class Dropdown extends _baseComponent.default {
       setPopVisible: popVisible => this.setState({
         popVisible
       }),
-      notifyVisibleChange: visible => this.props.onVisibleChange(visible)
+      notifyVisibleChange: visible => this.props.onVisibleChange(visible),
+      getPopupId: () => this.tooltipRef.current.getPopupId()
     });
   }
 
@@ -227,7 +229,8 @@ class Dropdown extends _baseComponent.default {
       trigger: trigger,
       onVisibleChange: this.handleVisibleChange,
       showArrow: false,
-      returnFocusOnClose: true
+      returnFocusOnClose: true,
+      ref: this.tooltipRef
     }, attr), /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, {
       //@ts-ignore
       className: (0, _classnames.default)((0, _get2.default)(children, 'props.className'), {

package/lib/cjs/select/index.js

@@ -451,7 +451,7 @@ class Select extends _baseComponent.default {
     } // 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 (prevProps.value !== this.props.value || isOptionsChanged) {
+    if (!(0, _isEqual2.default)(this.props.value, prevProps.value) || isOptionsChanged) {
       if ('value' in this.props) {
         this.foundation.handleValueChange(this.props.value);
       } else {

package/lib/cjs/tooltip/index.d.ts

@@ -185,5 +185,6 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
     renderPortal: () => JSX.Element;
     wrapSpan: (elem: React.ReactNode | React.ReactElement) => JSX.Element;
     mergeEvents: (rawEvents: Record<string, any>, events: Record<string, any>) => {};
+    getPopupId: () => string;
     render(): JSX.Element;
 }

package/lib/cjs/tooltip/index.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _isEqual2 = _interopRequireDefault(require("lodash/isEqual"));
+
 var _isFunction2 = _interopRequireDefault(require("lodash/isFunction"));
 
 var _isEmpty2 = _interopRequireDefault(require("lodash/isEmpty"));
@@ -304,6 +306,10 @@ class Tooltip extends _baseComponent.default {
       return mergedEvents;
     };
 
+    this.getPopupId = () => {
+      return this.state.id;
+    };
+
     this.state = {
       visible: false,
 
@@ -615,7 +621,7 @@ class Tooltip extends _baseComponent.default {
       this.props.visible ? this.foundation.delayShow() : this.foundation.delayHide();
     }
 
-    if (prevProps.rePosKey !== this.props.rePosKey) {
+    if (!(0, _isEqual2.default)(prevProps.rePosKey, this.props.rePosKey)) {
       this.rePosition();
     }
   }

package/lib/es/_base/base.css

@@ -9,6 +9,7 @@ body {
   --semi-transition_duration-fast:0ms;
   --semi-transition_duration-faster:0ms;
   --semi-transition_duration-fastest:0ms;
+  --semi-transition_duration-none:0ms;
   --semi-transition_function-linear:linear;
   --semi-transition_function-ease:ease;
   --semi-transition_function-easeIn:ease-in;

package/lib/es/datePicker/yearAndMonth.js

@@ -163,7 +163,6 @@ class YearAndMonth extends BaseComponent {
       disabledDate,
       yearAndMonthOpts
     } = this.props;
-    console.log('yearAndMonthOpts', yearAndMonthOpts);
 
     let transform = val => val;
 

package/lib/es/dropdown/dropdownMenu.d.ts

@@ -9,7 +9,6 @@ declare class DropdownMenu extends BaseComponent<DropdownMenuProps> {
         style: PropTypes.Requireable<object>;
     };
     static contextType: React.Context<import("./context").DropdownContextType>;
-    menuRef: React.RefObject<HTMLUListElement>;
     constructor(props: DropdownMenuProps);
     get adapter(): {
         getContext(key: string): any;
@@ -25,7 +24,6 @@ declare class DropdownMenu extends BaseComponent<DropdownMenuProps> {
         stopPropagation(e: any): void;
         persistEvent: (event: any) => void;
     };
-    componentDidMount(): void;
     render(): JSX.Element;
 }
 export default DropdownMenu;

package/lib/es/dropdown/dropdownMenu.js

@@ -21,7 +21,6 @@ const prefixCls = cssClasses.PREFIX;
 class DropdownMenu extends BaseComponent {
   constructor(props) {
     super(props);
-    this.menuRef = /*#__PURE__*/React.createRef();
     this.foundation = new Foundation(this.adapter);
   }
 
@@ -29,10 +28,6 @@ class DropdownMenu extends BaseComponent {
     return Object.assign({}, super.adapter);
   }
 
-  componentDidMount() {
-    this.foundation.autoFocus(this.menuRef.current);
-  }
-
   render() {
     const _a = this.props,
           {
@@ -44,8 +39,7 @@ class DropdownMenu extends BaseComponent {
 
     return /*#__PURE__*/React.createElement("ul", Object.assign({
       role: "menu",
-      "aria-orientation": "vertical",
-      ref: this.menuRef
+      "aria-orientation": "vertical"
     }, rest, {
       className: classnames("".concat(prefixCls, "-menu"), className),
       style: style,

package/lib/es/dropdown/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import BaseComponent from '../_base/baseComponent';
-import { Position, TooltipProps, Trigger } from '../tooltip/index';
+import Tooltip, { Position, TooltipProps, Trigger } from '../tooltip/index';
 import DropdownMenu from './dropdownMenu';
 import DropdownItem, { DropdownItemProps } from './dropdownItem';
 import { DropdownDividerProps } from './dropdownDivider';
@@ -87,11 +87,13 @@ declare class Dropdown extends BaseComponent<DropdownProps, DropdownState> {
         closeOnEsc: boolean;
         onEscKeyDown: (...args: any[]) => void;
     };
+    tooltipRef: React.RefObject<Tooltip>;
     constructor(props: DropdownProps);
     context: DropdownContextType;
     get adapter(): {
         setPopVisible: (popVisible: boolean) => void;
         notifyVisibleChange: (visible: boolean) => void;
+        getPopupId: () => string;
         getContext(key: string): any;
         getContexts(): any;
         getProp(key: string): any;

package/lib/es/dropdown/index.js

@@ -39,6 +39,7 @@ class Dropdown extends BaseComponent {
       popVisible: props.visible
     };
     this.foundation = new Foundation(this.adapter);
+    this.tooltipRef = /*#__PURE__*/React.createRef();
   }
 
   get adapter() {
@@ -46,7 +47,8 @@ class Dropdown extends BaseComponent {
       setPopVisible: popVisible => this.setState({
         popVisible
       }),
-      notifyVisibleChange: visible => this.props.onVisibleChange(visible)
+      notifyVisibleChange: visible => this.props.onVisibleChange(visible),
+      getPopupId: () => this.tooltipRef.current.getPopupId()
     });
   }
 
@@ -203,7 +205,8 @@ class Dropdown extends BaseComponent {
       trigger: trigger,
       onVisibleChange: this.handleVisibleChange,
       showArrow: false,
-      returnFocusOnClose: true
+      returnFocusOnClose: true,
+      ref: this.tooltipRef
     }, attr), /*#__PURE__*/React.isValidElement(children) ? /*#__PURE__*/React.cloneElement(children, {
       //@ts-ignore
       className: classnames(_get(children, 'props.className'), {

package/lib/es/select/index.js

@@ -405,7 +405,7 @@ class Select extends BaseComponent {
     } // 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 (prevProps.value !== this.props.value || isOptionsChanged) {
+    if (!_isEqual(this.props.value, prevProps.value) || isOptionsChanged) {
       if ('value' in this.props) {
         this.foundation.handleValueChange(this.props.value);
       } else {

package/lib/es/tooltip/index.d.ts

@@ -185,5 +185,6 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
     renderPortal: () => JSX.Element;
     wrapSpan: (elem: React.ReactNode | React.ReactElement) => JSX.Element;
     mergeEvents: (rawEvents: Record<string, any>, events: Record<string, any>) => {};
+    getPopupId: () => string;
     render(): JSX.Element;
 }

package/lib/es/tooltip/index.js

@@ -1,3 +1,4 @@
+import _isEqual from "lodash/isEqual";
 import _isFunction from "lodash/isFunction";
 import _isEmpty from "lodash/isEmpty";
 import _each from "lodash/each";
@@ -273,6 +274,10 @@ export default class Tooltip extends BaseComponent {
       return mergedEvents;
     };
 
+    this.getPopupId = () => {
+      return this.state.id;
+    };
+
     this.state = {
       visible: false,
 
@@ -585,7 +590,7 @@ export default class Tooltip extends BaseComponent {
       this.props.visible ? this.foundation.delayShow() : this.foundation.delayHide();
     }
 
-    if (prevProps.rePosKey !== this.props.rePosKey) {
+    if (!_isEqual(prevProps.rePosKey, this.props.rePosKey)) {
       this.rePosition();
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-ui",
-    "version": "2.23.0-beta.1",
+    "version": "2.23.0",
     "description": "",
     "main": "lib/cjs/index.js",
     "module": "lib/es/index.js",
@@ -18,11 +18,11 @@
     ],
     "dependencies": {
         "@douyinfe/semi-animation": "2.12.0",
-        "@douyinfe/semi-animation-react": "2.23.0-beta.1",
-        "@douyinfe/semi-foundation": "2.23.0-beta.1",
-        "@douyinfe/semi-icons": "2.23.0-beta.1",
+        "@douyinfe/semi-animation-react": "2.23.0",
+        "@douyinfe/semi-foundation": "2.23.0",
+        "@douyinfe/semi-icons": "2.23.0",
         "@douyinfe/semi-illustrations": "2.15.0",
-        "@douyinfe/semi-theme-default": "2.23.0-beta.1",
+        "@douyinfe/semi-theme-default": "2.23.0",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "copy-text-to-clipboard": "^2.1.1",
@@ -69,13 +69,13 @@
     ],
     "author": "",
     "license": "MIT",
-    "gitHead": "afe3b23c86641a627ade78ceb414d05223fc7354",
+    "gitHead": "a5195872c7df1a97551c6c23357bdb941b8fa807",
     "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.23.0-beta.1",
+        "@douyinfe/semi-scss-compile": "2.23.0",
         "@storybook/addon-knobs": "^6.3.1",
         "@types/lodash": "^4.14.176",
         "@types/react": ">=16.0.0",