@douyinfe/semi-ui 2.52.0 → 2.53.0-beta.0

package/lib/cjs/resizeObserver/index.js

@@ -3,16 +3,25 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = exports.ObserverProperty = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactDom = require("react-dom");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
-var _resizeObserverPolyfill = _interopRequireDefault(require("resize-observer-polyfill"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var ObserverProperty;
+exports.ObserverProperty = ObserverProperty;
+(function (ObserverProperty) {
+  ObserverProperty["Width"] = "width";
+  ObserverProperty["Height"] = "height";
+  ObserverProperty["All"] = "all";
+})(ObserverProperty || (exports.ObserverProperty = ObserverProperty = {}));
 class ReactResizeObserver extends _baseComponent.default {
   constructor(props) {
+    var _this;
     super(props);
+    _this = this;
+    this.formerPropertyValue = new Map();
     this.getElement = () => {
       try {
         // using findDOMNode for two reasons:
@@ -24,6 +33,54 @@ class ReactResizeObserver extends _baseComponent.default {
         return null;
       }
     };
+    this.handleResizeEventTriggered = entries => {
+      if (this.props.observerProperty === ObserverProperty.All) {
+        this.props.onResize(entries);
+      } else {
+        const finalEntries = [];
+        for (const entry of entries) {
+          if (this.formerPropertyValue.has(entry.target)) {
+            if (entry.contentRect[this.props.observerProperty] !== this.formerPropertyValue.get(entry.target)) {
+              this.formerPropertyValue.set(entry.target, entry.contentRect[this.props.observerProperty]);
+              finalEntries.push(entry);
+            }
+          } else {
+            this.formerPropertyValue.set(entry.target, entry.contentRect[this.props.observerProperty]);
+            finalEntries.push(entry);
+          }
+        }
+        if (finalEntries.length > 0) {
+          this.props.onResize(finalEntries);
+        }
+      }
+    };
+    this.observeElement = function () {
+      let force = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+      const element = _this.getElement();
+      if (!_this.observer) {
+        _this.observer = new ResizeObserver(_this.handleResizeEventTriggered);
+      }
+      if (!(element && element instanceof Element)) {
+        // stop everything if not defined
+        _this.observer.disconnect();
+        return;
+      }
+      if (element === _this.element && !force) {
+        // abort if given same element -- nothing to update (unless forced)
+        return;
+      } else {
+        // clear observer list if new element
+        _this.observer.disconnect();
+        // remember element reference for next time
+        _this.element = element;
+      }
+      // observer callback is invoked immediately when observing new elements
+      _this.observer.observe(element);
+      if (_this.props.observeParent && element.parentNode && element.parentNode.ownerDocument && element.parentNode.ownerDocument.defaultView && element.parentNode instanceof element.parentNode.ownerDocument.defaultView.HTMLElement) {
+        _this._parentNode = element.parentNode;
+        _this.observer.observe(_this._parentNode);
+      }
+    };
     this.mergeRef = (ref, node) => {
       this.childNode = node;
       if (typeof ref === 'function') {
@@ -32,7 +89,7 @@ class ReactResizeObserver extends _baseComponent.default {
         ref.current = node;
       }
     };
-    this.observer = new _resizeObserverPolyfill.default(props.onResize);
+    this.observer = new ResizeObserver(this.handleResizeEventTriggered);
   }
   componentDidMount() {
     this.observeElement();
@@ -47,33 +104,6 @@ class ReactResizeObserver extends _baseComponent.default {
       this.element = null;
     }
   }
-  observeElement() {
-    let force = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-    const element = this.getElement();
-    if (!this.observer) {
-      this.observer = new _resizeObserverPolyfill.default(this.props.onResize);
-    }
-    if (!(element && element instanceof Element)) {
-      // stop everything if not defined
-      this.observer.disconnect();
-      return;
-    }
-    if (element === this.element && !force) {
-      // abort if given same element -- nothing to update (unless forced)
-      return;
-    } else {
-      // clear observer list if new element
-      this.observer.disconnect();
-      // remember element reference for next time
-      this.element = element;
-    }
-    // observer callback is invoked immediately when observing new elements
-    this.observer.observe(element);
-    if (this.props.observeParent && element.parentNode && element.parentNode.ownerDocument && element.parentNode.ownerDocument.defaultView && element.parentNode instanceof element.parentNode.ownerDocument.defaultView.HTMLElement) {
-      this._parentNode = element.parentNode;
-      this.observer.observe(this._parentNode);
-    }
-  }
   render() {
     const child = _react.default.Children.only(this.props.children);
     const {
@@ -87,9 +117,13 @@ class ReactResizeObserver extends _baseComponent.default {
 exports.default = ReactResizeObserver;
 ReactResizeObserver.propTypes = {
   onResize: _propTypes.default.func,
-  observeParent: _propTypes.default.bool
+  observeParent: _propTypes.default.bool,
+  observerProperty: _propTypes.default.string,
+  delayTick: _propTypes.default.number
 };
 ReactResizeObserver.defaultProps = {
   onResize: () => {},
-  observeParent: false
+  observeParent: false,
+  observerProperty: "all",
+  delayTick: 0
 };

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

@@ -251,6 +251,7 @@ declare class Select extends BaseComponent<SelectProps, SelectState> {
         arrowIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         preventScroll: PropTypes.Requireable<boolean>;
     };
+    static __SemiComponentName__: string;
     static defaultProps: Partial<SelectProps>;
     inputRef: React.RefObject<HTMLInputElement>;
     triggerRef: React.RefObject<HTMLDivElement>;

package/lib/cjs/select/index.js

@@ -1293,7 +1293,8 @@ Select.propTypes = {
   // tagClosable: PropTypes.bool,
 };
 
-Select.defaultProps = {
+Select.__SemiComponentName__ = "Select";
+Select.defaultProps = (0, _utils2.getDefaultPropsFromGlobalConfig)(Select.__SemiComponentName__, {
   stopPropagation: true,
   motion: true,
   borderless: false,
@@ -1338,6 +1339,6 @@ Select.defaultProps = {
   // 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;

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

@@ -45,6 +45,7 @@ export default class SideSheet extends BaseComponent<SideSheetReactProps, SideSh
         keepDOM: PropTypes.Requireable<boolean>;
         'aria-label': PropTypes.Requireable<string>;
     };
+    static __SemiComponentName__: string;
     static defaultProps: SideSheetReactProps;
     private _active;
     constructor(props: SideSheetReactProps);

package/lib/cjs/sideSheet/index.js

@@ -256,7 +256,8 @@ SideSheet.propTypes = {
   keepDOM: _propTypes.default.bool,
   'aria-label': _propTypes.default.string
 };
-SideSheet.defaultProps = {
+SideSheet.__SemiComponentName__ = "SideSheet";
+SideSheet.defaultProps = (0, _utils.getDefaultPropsFromGlobalConfig)(SideSheet.__SemiComponentName__, {
   visible: false,
   motion: true,
   mask: true,
@@ -270,4 +271,4 @@ SideSheet.defaultProps = {
   closeOnEsc: false,
   afterVisibleChange: _noop2.default,
   keepDOM: false
-};
+});

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

@@ -38,6 +38,7 @@ declare class Tabs extends BaseComponent<TabsProps, TabsState> {
         onTabClose: PropTypes.Requireable<(...args: any[]) => any>;
         preventScroll: PropTypes.Requireable<boolean>;
     };
+    static __SemiComponentName__: string;
     static defaultProps: TabsProps;
     contentRef: RefObject<HTMLDivElement>;
     contentHeight: string;

package/lib/cjs/tabs/index.js

@@ -19,6 +19,7 @@ var _TabBar = _interopRequireDefault(require("./TabBar"));
 var _TabPane = _interopRequireDefault(require("./TabPane"));
 var _TabItem = _interopRequireDefault(require("./TabItem"));
 var _tabsContext = _interopRequireDefault(require("./tabs-context"));
+var _utils = require("../_utils");
 var _interface = require("./interface");
 Object.keys(_interface).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -341,7 +342,8 @@ Tabs.propTypes = {
   onTabClose: _propTypes.default.func,
   preventScroll: _propTypes.default.bool
 };
-Tabs.defaultProps = {
+Tabs.__SemiComponentName__ = "Tabs";
+Tabs.defaultProps = (0, _utils.getDefaultPropsFromGlobalConfig)(Tabs.__SemiComponentName__, {
   children: [],
   collapsible: false,
   keepDOM: true,
@@ -353,6 +355,6 @@ Tabs.defaultProps = {
   tabPosition: 'top',
   type: 'line',
   onTabClose: () => undefined
-};
+});
 var _default = Tabs;
 exports.default = _default;

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

@@ -72,39 +72,7 @@ export default class LocaleTimePicker extends React.PureComponent<LocalePickerPr
         motion: import("prop-types").Requireable<NonNullable<boolean | object>>;
         autoAdjustOverflow: import("prop-types").Requireable<boolean>;
     };
-    static defaultProps: {
-        autoAdjustOverflow: boolean;
-        borderless: boolean;
-        getPopupContainer: () => HTMLElement;
-        showClear: boolean;
-        zIndex: number;
-        rangeSeparator: " ~ ";
-        onOpenChange: (...args: any[]) => void;
-        clearText: string;
-        prefixCls: string;
-        inputReadOnly: boolean;
-        style: {};
-        stopPropagation: boolean;
-        className: string;
-        popupClassName: string;
-        popupStyle: {
-            left: string;
-            top: string;
-        };
-        disabledHours: () => number[];
-        disabledMinutes: () => number[];
-        disabledSeconds: () => number[];
-        hideDisabledOptions: boolean;
-        onFocus: (...args: any[]) => void;
-        onBlur: (...args: any[]) => void;
-        onChange: (...args: any[]) => void;
-        onChangeWithDateFirst: boolean;
-        use12Hours: boolean;
-        focusOnOpen: boolean;
-        onKeyDown: (...args: any[]) => void;
-        size: "default";
-        type: "time";
-        motion: boolean;
-    };
+    static __SemiComponentName__: string;
+    static defaultProps: any;
     render(): JSX.Element;
 }

package/lib/cjs/timePicker/index.js

@@ -9,6 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 var _localeConsumer = _interopRequireDefault(require("../locale/localeConsumer"));
 var _TimePicker = _interopRequireDefault(require("./TimePicker"));
 var _context = _interopRequireDefault(require("../configProvider/context"));
+var _utils = require("../_utils");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 class LocaleTimePicker extends _react.default.PureComponent {
   render() {
@@ -34,4 +35,5 @@ class LocaleTimePicker extends _react.default.PureComponent {
 }
 exports.default = LocaleTimePicker;
 LocaleTimePicker.propTypes = _TimePicker.default.propTypes;
-LocaleTimePicker.defaultProps = _TimePicker.default.defaultProps;
+LocaleTimePicker.__SemiComponentName__ = "TimePicker";
+LocaleTimePicker.defaultProps = (0, _utils.getDefaultPropsFromGlobalConfig)(LocaleTimePicker.__SemiComponentName__, _TimePicker.default.defaultProps);

package/lib/cjs/toast/toast.d.ts

@@ -35,17 +35,8 @@ declare class Toast extends BaseComponent<ToastReactProps, ToastState> {
         icon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         direction: PropTypes.Requireable<string>;
     };
-    static defaultProps: {
-        onClose: (...args: any[]) => void;
-        content: string;
-        close: (...args: any[]) => void;
-        duration: number;
-        textMaxWidth: number;
-        showClose: boolean;
-        stack: boolean;
-        stackExpanded: boolean;
-        theme: string;
-    };
+    static __SemiComponentName__: string;
+    static defaultProps: any;
     constructor(props: ToastReactProps);
     context: ContextValue;
     get adapter(): ToastAdapter;

package/lib/cjs/toast/toast.js

@@ -160,7 +160,8 @@ Toast.propTypes = {
   icon: _propTypes.default.node,
   direction: _propTypes.default.oneOf(_constants.strings.directions)
 };
-Toast.defaultProps = {
+Toast.__SemiComponentName__ = "Toast";
+Toast.defaultProps = (0, _utils.getDefaultPropsFromGlobalConfig)(Toast.__SemiComponentName__, {
   onClose: _noop2.default,
   content: '',
   close: _noop2.default,
@@ -170,6 +171,6 @@ Toast.defaultProps = {
   stack: false,
   stackExpanded: false,
   theme: 'normal'
-};
+});
 var _default = Toast;
 exports.default = _default;

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

@@ -127,38 +127,8 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
         preventScroll: PropTypes.Requireable<boolean>;
         keepDOM: PropTypes.Requireable<boolean>;
     };
-    static defaultProps: {
-        arrowBounding: {
-            readonly offsetX: 0;
-            readonly offsetY: 2;
-            readonly width: 24;
-            readonly height: 7;
-        };
-        autoAdjustOverflow: boolean;
-        arrowPointAtCenter: boolean;
-        trigger: string;
-        transformFromCenter: boolean;
-        position: string;
-        prefixCls: "semi-tooltip";
-        role: string;
-        mouseEnterDelay: 50;
-        mouseLeaveDelay: 50;
-        motion: boolean;
-        onVisibleChange: (...args: any[]) => void;
-        onClickOutSide: (...args: any[]) => void;
-        spacing: 8;
-        margin: 0;
-        showArrow: boolean;
-        wrapWhenSpecial: boolean;
-        zIndex: 1060;
-        closeOnEsc: boolean;
-        guardFocus: boolean;
-        returnFocusOnClose: boolean;
-        onEscKeyDown: (...args: any[]) => void;
-        disableFocusListener: boolean;
-        disableArrowKeyDown: boolean;
-        keepDOM: boolean;
-    };
+    static __SemiComponentName__: string;
+    static defaultProps: any;
     eventManager: Event;
     triggerEl: React.RefObject<unknown>;
     containerEl: React.RefObject<HTMLDivElement>;

package/lib/cjs/tooltip/index.js

@@ -682,7 +682,8 @@ Tooltip.propTypes = {
   preventScroll: _propTypes.default.bool,
   keepDOM: _propTypes.default.bool
 };
-Tooltip.defaultProps = {
+Tooltip.__SemiComponentName__ = "Tooltip";
+Tooltip.defaultProps = (0, _utils.getDefaultPropsFromGlobalConfig)(Tooltip.__SemiComponentName__, {
   arrowBounding: _constants2.numbers.ARROW_BOUNDING,
   autoAdjustOverflow: true,
   arrowPointAtCenter: true,
@@ -708,4 +709,4 @@ Tooltip.defaultProps = {
   disableFocusListener: false,
   disableArrowKeyDown: false,
   keepDOM: false
-};
+});

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

@@ -1,8 +1,9 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import { Ellipsis, ShowTooltip, TypographyBaseSize, TypographyBaseType } from './interface';
+import type { Ellipsis, ShowTooltip, TypographyBaseSize, TypographyBaseType } from './interface';
 import { CopyableConfig, LinkType } from './title';
 import { BaseProps } from '../_base/baseComponent';
+import { ResizeEntry } from '../resizeObserver';
 export interface BaseTypographyProps extends BaseProps {
     copyable?: CopyableConfig | boolean;
     delete?: boolean;
@@ -85,7 +86,7 @@ export default class Base extends Component<BaseTypographyProps, BaseTypographyS
         spacing: PropTypes.Requireable<"normal" | "extended">;
         strong: PropTypes.Requireable<boolean>;
         size: PropTypes.Requireable<"small" | "normal">;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "danger" | "tertiary" | "quaternary">;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;
         icon: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
@@ -115,12 +116,13 @@ export default class Base extends Component<BaseTypographyProps, BaseTypographyS
     rafId: ReturnType<typeof requestAnimationFrame>;
     expandStr: string;
     collapseStr: string;
+    observerTakingEffect: boolean;
     constructor(props: BaseTypographyProps);
     componentDidMount(): void;
     static getDerivedStateFromProps(props: BaseTypographyProps, prevState: BaseTypographyState): Partial<BaseTypographyState>;
     componentDidUpdate(prevProps: BaseTypographyProps): void;
     componentWillUnmount(): void;
-    onResize: () => void;
+    onResize: (entries?: ResizeEntry[]) => Promise<void>;
     canUseCSSEllipsis: () => boolean;
     /**
      * whether truncated
@@ -133,7 +135,8 @@ export default class Base extends Component<BaseTypographyProps, BaseTypographyS
     showTooltip: () => boolean | ShowTooltip | {
         type: string;
     };
-    getEllipsisState(): boolean;
+    onHover: () => any;
+    getEllipsisState: () => Promise<void>;
     /**
      * Triggered when the fold button is clicked to save the latest expanded state
      * @param {Event} e