@douyinfe/semi-ui 2.29.0-beta.0 → 2.30.0-beta.0

package/dist/umd/semi-ui.js

@@ -19401,7 +19401,7 @@ class foundation_Tooltip extends foundation {
    */
 
 
-  _focusTrigger() {
+  focusTrigger() {
     const {
       trigger,
       returnFocusOnClose,
@@ -19427,8 +19427,7 @@ class foundation_Tooltip extends foundation {
     if (trigger !== 'custom') {
       // Move the focus into the trigger first and then close the pop-up layer 
       // to avoid the problem of opening the pop-up layer again when the focus returns to the trigger in the case of hover and focus
-      this._focusTrigger();
-
+      this.focusTrigger();
       this.hide();
     }
 
@@ -20147,6 +20146,8 @@ class tooltip_Tooltip extends baseComponent_BaseComponent {
           zIndex
         }
       }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+        // listen keyboard event, don't move tabIndex -1
+        tabIndex: -1,
         className: `${BASE_CLASS_PREFIX}-portal-inner`,
         style: portalInnerStyle,
         ref: this.setContainerEl,
@@ -20500,6 +20501,14 @@ class tooltip_Tooltip extends baseComponent_BaseComponent {
     this.mounted = false;
     this.foundation.destroy();
   }
+  /**
+   * focus on tooltip trigger
+   */
+
+
+  focusTrigger() {
+    this.foundation.focusTrigger();
+  }
   /** for transition - end */
 
 
@@ -21332,8 +21341,8 @@ const local = {
   code: 'zh-CN',
   dateFnsLocale: zh_CN,
   Pagination: {
-    pageSize: '${pageSize} 条/页',
-    total: '共 ${total} 页',
+    pageSize: '每页条数：${pageSize}',
+    total: '总页数：${total}',
     jumpTo: '跳至',
     page: '页'
   },
@@ -21474,8 +21483,8 @@ const local = {
     clear: '清空',
     selectAll: '全选',
     clearSelectAll: '取消全选',
-    total: '共 ${total} 项',
-    selected: '已选 ${total} 项'
+    total: '总个数：${total}',
+    selected: '已选个数：${total}'
   },
   Form: {
     optional: '（可选）'
@@ -23986,8 +23995,17 @@ const popover_positionSet = popover_constants_strings.POSITION_SET;
 const popover_triggerSet = popover_constants_strings.TRIGGER_SET;
 
 class popover_Popover extends external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.PureComponent {
-  constructor() {
-    super(...arguments);
+  constructor(props) {
+    super(props);
+    /**
+     * focus on tooltip trigger
+     */
+
+    this.focusTrigger = () => {
+      var _a;
+
+      (_a = this.tooltipRef.current) === null || _a === void 0 ? void 0 : _a.focusTrigger();
+    };
 
     this.renderPopCard = _ref => {
       let {
@@ -24025,6 +24043,8 @@ class popover_Popover extends external_root_React_commonjs2_react_commonjs_react
       };
       return !isFunction_default()(content) ? content : content(contentProps);
     };
+
+    this.tooltipRef = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createRef();
   }
 
   render() {
@@ -24058,7 +24078,8 @@ class popover_Popover extends external_root_React_commonjs2_react_commonjs_react
 
     const role = trigger === 'click' || trigger === 'custom' ? 'dialog' : 'tooltip';
     return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(tooltip_Tooltip, Object.assign({
-      guardFocus: true
+      guardFocus: true,
+      ref: this.tooltipRef
     }, attr, {
       trigger: trigger,
       position: position,
@@ -25132,13 +25153,8 @@ class FormatNumeral {
         return `${this.truncatePrecision(value)} ${units[i]}`;
       },
       percentages: value => {
-        const cArr = value.toString().split('.');
-
-        if (Number(cArr[0]) === 0) {
-          return `${this.truncatePrecision(value * 100)}%`;
-        }
-
-        return `${this.truncatePrecision(value)}%`;
+        // The rules here have been modified in version v2.30.0
+        return `${this.truncatePrecision(value * 100)}%`;
       },
       exponential: value => {
         const vExponential = value.toExponential(this.precision + 2);
@@ -45197,6 +45213,14 @@ class cascader_Cascader extends baseComponent_BaseComponent {
     }, inputProps)));
   }
 
+  close() {
+    this.foundation.close();
+  }
+
+  open() {
+    this.foundation.open();
+  }
+
   render() {
     const {
       zIndex,
@@ -50563,10 +50587,13 @@ class foundation_DatePickerFoundation extends foundation {
 
     const result = this.parseWithTimezone(_value, timeZone, prevTimeZone);
 
-    this._adapter.updatePrevTimezone(prevTimeZone);
+    this._adapter.updatePrevTimezone(prevTimeZone); // reset input value when value update
+
 
     this._adapter.updateInputValue(null);
 
+    this._adapter.updateInsetInputValue(null);
+
     this._adapter.updateValue(result);
 
     this.resetCachedSelectedValue(result);
@@ -53571,14 +53598,20 @@ class monthsGridFoundation_MonthsGridFoundation extends foundation {
 
   _initDatePickerFromValue(values) {
     let refreshPicker = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-    const monthLeft = this.getState('monthLeft');
+
+    const {
+      monthLeft
+    } = this._adapter.getStates();
+
     const newMonthLeft = Object.assign({}, monthLeft); // REMOVE:
 
     this._adapter.updateMonthOnLeft(newMonthLeft);
 
     const newSelected = new Set();
 
-    if (!this._isMultiple()) {
+    const isMultiple = this._isMultiple();
+
+    if (!isMultiple) {
       values[0] && newSelected.add(format_format(values[0], datePicker_constants_strings.FORMAT_FULL_DATE));
     } else {
       values.forEach(date => {
@@ -53587,7 +53620,12 @@ class monthsGridFoundation_MonthsGridFoundation extends foundation {
     }
 
     if (refreshPicker) {
-      this.handleShowDateAndTime(datePicker_constants_strings.PANEL_TYPE_LEFT, values[0] || newMonthLeft.pickerDate);
+      if (isMultiple) {
+        const leftPickerDateInSelected = values === null || values === void 0 ? void 0 : values.some(item => item && differenceInCalendarMonths(item, monthLeft.pickerDate) === 0);
+        !leftPickerDateInSelected && this.handleShowDateAndTime(datePicker_constants_strings.PANEL_TYPE_LEFT, values[0] || newMonthLeft.pickerDate);
+      } else {
+        this.handleShowDateAndTime(datePicker_constants_strings.PANEL_TYPE_LEFT, values[0] || newMonthLeft.pickerDate);
+      }
     } else {
       // FIXME:
       this.handleShowDateAndTime(datePicker_constants_strings.PANEL_TYPE_LEFT, newMonthLeft.pickerDate);
@@ -58185,36 +58223,12 @@ class datePicker_DatePicker extends baseComponent_BaseComponent {
         density,
         topSlot,
         bottomSlot,
-        insetInput,
-        type,
-        format,
-        rangeSeparator,
-        defaultPickerValue,
         presetPosition
       } = this.props;
-      const {
-        insetInputValue,
-        value
-      } = this.state;
       const wrapCls = classnames_default()(datePicker_constants_cssClasses.PREFIX, {
         [datePicker_constants_cssClasses.PANEL_YAM]: this.adapter.typeIsYearOrMonth(),
         [`${datePicker_constants_cssClasses.PREFIX}-compact`]: density === 'compact'
       }, dropdownClassName);
-      const insetInputProps = {
-        dateFnsLocale,
-        format,
-        insetInputValue,
-        rangeSeparator,
-        type,
-        value: value,
-        handleInsetDateFocus: this.handleInsetDateFocus,
-        handleInsetTimeFocus: this.handleInsetTimeFocus,
-        onInsetInputChange: this.handleInsetInputChange,
-        rangeInputStartRef: this.rangeInputStartRef,
-        rangeInputEndRef: this.rangeInputEndRef,
-        density,
-        defaultPickerValue
-      };
       return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
         ref: this.panelRef,
         className: wrapCls,
@@ -74134,7 +74148,7 @@ const popconfirm_constants_numbers = {
 };
 
 // CONCATENATED MODULE: ../semi-foundation/popconfirm/popconfirmFoundation.ts
-/* eslint-disable @typescript-eslint/no-empty-function */
+
 
 
 class popconfirmFoundation_PopConfirmFoundation extends foundation {
@@ -74187,9 +74201,28 @@ class popconfirmFoundation_PopConfirmFoundation extends foundation {
       this._adapter.setVisible(visible);
     }
 
+    if (visible) {
+      this.handleFocusOperateButton();
+    } else {
+      this._adapter.focusPrevFocusElement();
+    }
+
     this._adapter.notifyVisibleChange(visible);
   }
 
+  handleFocusOperateButton() {
+    const {
+      cancelButtonProps,
+      okButtonProps
+    } = this._adapter.getProps();
+
+    if (get_default()(cancelButtonProps, 'autoFocus') && !get_default()(cancelButtonProps, 'disabled')) {
+      this._adapter.focusCancelButton();
+    } else if (get_default()(okButtonProps, 'autoFocus') && !get_default()(okButtonProps, 'disabled')) {
+      this._adapter.focusOkButton();
+    }
+  }
+
 }
 // EXTERNAL MODULE: ../semi-foundation/popconfirm/popconfirm.scss
 var popconfirm = __webpack_require__("s0u6");
@@ -74198,6 +74231,8 @@ var popconfirm = __webpack_require__("s0u6");
 
 
 
+
+
 var popconfirm_rest = undefined && undefined.__rest || function (s, e) {
   var t = {};
 
@@ -74237,12 +74272,74 @@ class popconfirm_Popconfirm extends baseComponent_BaseComponent {
 
     this.stopImmediatePropagation = e => e && e.nativeEvent && e.nativeEvent.stopImmediatePropagation();
 
+    this.renderConfirmPopCard = _ref => {
+      let {
+        initialFocusRef
+      } = _ref;
+      const {
+        content,
+        title,
+        className,
+        style,
+        cancelType,
+        icon,
+        prefixCls
+      } = this.props;
+      const {
+        direction
+      } = this.context;
+      const popCardCls = classnames_default()(prefixCls, className, {
+        [`${prefixCls}-rtl`]: direction === 'rtl'
+      });
+      const showTitle = title !== null && typeof title !== 'undefined';
+      const showContent = !(content === null || typeof content === 'undefined');
+      return (
+        /*#__PURE__*/
+
+        /* eslint-disable-next-line jsx-a11y/no-static-element-interactions */
+        external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+          className: popCardCls,
+          onClick: this.stopImmediatePropagation,
+          style: style
+        }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+          className: `${prefixCls}-inner`
+        }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+          className: `${prefixCls}-header`
+        }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("i", {
+          className: `${prefixCls}-header-icon`,
+          "x-semi-prop": "icon"
+        }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.isValidElement(icon) ? icon : null), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+          className: `${prefixCls}-header-body`
+        }, showTitle ? /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+          className: `${prefixCls}-header-title`,
+          "x-semi-prop": "title"
+        }, title) : null), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(button_0, {
+          className: `${prefixCls}-btn-close`,
+          icon: /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconClose, null),
+          size: "small",
+          theme: 'borderless',
+          type: cancelType,
+          onClick: this.handleCancel
+        })), showContent ? /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+          className: `${prefixCls}-body`,
+          "x-semi-prop": "content"
+        }, isFunction_default()(content) ? content({
+          initialFocusRef
+        }) : content) : null, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+          className: `${prefixCls}-footer`,
+          ref: this.footerRef
+        }, this.renderControls())))
+      );
+    };
+
     this.state = {
       cancelLoading: false,
       confirmLoading: false,
       visible: props.defaultVisible || false
     };
     this.foundation = new popconfirmFoundation_PopConfirmFoundation(this.adapter);
+    this.footerRef = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createRef();
+    this.popoverRef = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createRef();
   }
 
   static getDerivedStateFromProps(props, state) {
@@ -74272,7 +74369,28 @@ class popconfirm_Popconfirm extends baseComponent_BaseComponent {
       notifyConfirm: e => this.props.onConfirm(e),
       notifyCancel: e => this.props.onCancel(e),
       notifyVisibleChange: visible => this.props.onVisibleChange(visible),
-      notifyClickOutSide: e => this.props.onClickOutSide(e)
+      notifyClickOutSide: e => this.props.onClickOutSide(e),
+      focusCancelButton: () => {
+        var _a, _b;
+
+        const buttonNode = (_b = (_a = this.footerRef) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.querySelector('[data-type=cancel]');
+        buttonNode === null || buttonNode === void 0 ? void 0 : buttonNode.focus({
+          preventScroll: true
+        });
+      },
+      focusOkButton: () => {
+        var _a, _b;
+
+        const buttonNode = (_b = (_a = this.footerRef) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.querySelector('[data-type=ok]');
+        buttonNode === null || buttonNode === void 0 ? void 0 : buttonNode.focus({
+          preventScroll: true
+        });
+      },
+      focusPrevFocusElement: () => {
+        var _a;
+
+        (_a = this.popoverRef.current) === null || _a === void 0 ? void 0 : _a.focusTrigger();
+      }
     });
   }
 
@@ -74292,68 +74410,17 @@ class popconfirm_Popconfirm extends baseComponent_BaseComponent {
     return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(localeConsumer_LocaleConsumer, {
       componentName: "Popconfirm"
     }, (locale, localeCode) => /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.Fragment, null, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(button_0, Object.assign({
+      "data-type": "cancel",
       type: cancelType,
       onClick: this.handleCancel,
       loading: cancelLoading
-    }, cancelButtonProps), cancelText || get_default()(locale, 'cancel')), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(button_0, Object.assign({
+    }, omit_default()(cancelButtonProps, 'autoFocus')), cancelText || get_default()(locale, 'cancel')), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(button_0, Object.assign({
+      "data-type": "ok",
       type: okType,
       theme: "solid",
       onClick: this.handleConfirm,
       loading: confirmLoading
-    }, okButtonProps), okText || get_default()(locale, 'confirm'))));
-  }
-
-  renderConfirmPopCard() {
-    const {
-      content,
-      title,
-      className,
-      style,
-      cancelType,
-      icon,
-      prefixCls
-    } = this.props;
-    const {
-      direction
-    } = this.context;
-    const popCardCls = classnames_default()(prefixCls, className, {
-      [`${prefixCls}-rtl`]: direction === 'rtl'
-    });
-    const showTitle = title !== null && typeof title !== 'undefined';
-    const showContent = !(content === null || typeof content === 'undefined');
-    return (
-      /*#__PURE__*/
-      // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
-      external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
-        className: popCardCls,
-        onClick: this.stopImmediatePropagation,
-        style: style
-      }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
-        className: `${prefixCls}-inner`
-      }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
-        className: `${prefixCls}-header`
-      }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("i", {
-        className: `${prefixCls}-header-icon`,
-        "x-semi-prop": "icon"
-      }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.isValidElement(icon) ? icon : null), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
-        className: `${prefixCls}-header-body`
-      }, showTitle ? /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
-        className: `${prefixCls}-header-title`,
-        "x-semi-prop": "title"
-      }, title) : null), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(button_0, {
-        className: `${prefixCls}-btn-close`,
-        icon: /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconClose, null),
-        size: "small",
-        theme: 'borderless',
-        type: cancelType,
-        onClick: this.handleCancel
-      })), showContent ? /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
-        className: `${prefixCls}-body`,
-        "x-semi-prop": "content"
-      }, content) : null, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
-        className: `${prefixCls}-footer`
-      }, this.renderControls())))
-    );
+    }, omit_default()(okButtonProps, 'autoFocus')), okText || get_default()(locale, 'confirm'))));
   }
 
   render() {
@@ -74381,7 +74448,6 @@ class popconfirm_Popconfirm extends baseComponent_BaseComponent {
     const {
       visible
     } = this.state;
-    const popContent = this.renderConfirmPopCard();
     const popProps = {
       onVisibleChange: this.handleVisibleChange,
       className: popconfirm_constants_cssClasses.POPOVER,
@@ -74392,8 +74458,10 @@ class popconfirm_Popconfirm extends baseComponent_BaseComponent {
       popProps.trigger = 'custom';
     }
 
-    return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(popover_0, Object.assign({}, attrs, {
-      content: popContent,
+    return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(popover_0, Object.assign({
+      ref: this.popoverRef
+    }, attrs, {
+      content: this.renderConfirmPopCard,
       visible: visible,
       position: position
     }, popProps), children);
@@ -74404,7 +74472,7 @@ popconfirm_Popconfirm.contextType = configProvider_context;
 popconfirm_Popconfirm.propTypes = {
   motion: prop_types_default.a.oneOfType([prop_types_default.a.bool, prop_types_default.a.func, prop_types_default.a.object]),
   disabled: prop_types_default.a.bool,
-  content: prop_types_default.a.any,
+  content: prop_types_default.a.oneOfType([prop_types_default.a.node, prop_types_default.a.func]),
   title: prop_types_default.a.any,
   prefixCls: prop_types_default.a.string,
   className: prop_types_default.a.string,