@douyinfe/semi-ui 2.24.0-beta.1 → 2.24.1

package/dist/umd/semi-ui.js

@@ -19312,23 +19312,26 @@ class foundation_Tooltip extends foundation {
 
 
       if (this.isTB(position)) {
-        isHeightOverFlow = isViewYOverFlow && isContainerYOverFlow;
+        isHeightOverFlow = isViewYOverFlow && isContainerYOverFlow; // Related PR: https://github.com/DouyinFE/semi-design/pull/1297
+        // If clientRight or restClientRight less than 0, means that the left and right parts of the trigger are blocked
+        // Then the display of the wrapper will also be affected, make width overflow to offset the wrapper
 
         if (position === 'top' || position === 'bottom') {
-          isWidthOverFlow = isViewXOverFlowSideHalf && isContainerXOverFlowSideHalf;
+          isWidthOverFlow = isViewXOverFlowSideHalf && isContainerXOverFlowSideHalf || clientRight < 0 || restClientRight < 0;
         } else {
-          isWidthOverFlow = isViewXOverFlowSide && isContainerXOverFlowSide;
+          isWidthOverFlow = isViewXOverFlowSide && isContainerXOverFlowSide || clientRight < 0 || restClientRight < 0;
         }
       } // 左右方向 left and right
 
 
       if (this.isLR(position)) {
-        isWidthOverFlow = isViewXOverFlow && isContainerXOverFlow;
+        isWidthOverFlow = isViewXOverFlow && isContainerXOverFlow; // If clientTop or restClientTop less than 0, means that the top and bottom parts of the trigger are blocked
+        // Then the display of the wrapper will also be affected, make height overflow to offset the wrapper
 
         if (position === 'left' || position === 'right') {
-          isHeightOverFlow = isViewYOverFlowSideHalf && isContainerYOverFlowSideHalf;
+          isHeightOverFlow = isViewYOverFlowSideHalf && isContainerYOverFlowSideHalf || clientTop < 0 || restClientTop < 0;
         } else {
-          isHeightOverFlow = isViewYOverFlowSide && isContainerYOverFlowSide;
+          isHeightOverFlow = isViewYOverFlowSide && isContainerYOverFlowSide || clientTop < 0 || restClientTop < 0;
         }
       }
     }
@@ -26863,6 +26866,8 @@ class foundation_InputFoundation extends foundation {
 
 
     if (this._adapter.isEventTarget(e)) {
+      this._adapter.focusInput();
+
       this._adapter.toggleFocusing(true);
     }
   }
@@ -26878,6 +26883,8 @@ class foundation_InputFoundation extends foundation {
   handleClickEye(e) {
     const eyeClosed = this._adapter.getState('eyeClosed');
 
+    this._adapter.focusInput();
+
     this._adapter.toggleFocusing(true);
 
     this._adapter.setEyeClosed(!eyeClosed);
@@ -26970,6 +26977,8 @@ class foundation_InputFoundation extends foundation {
     } = this._adapter.getStates();
 
     if (!disabled && !isFocus) {
+      this._adapter.focusInput();
+
       this._adapter.toggleFocusing(true);
     }
   }
@@ -27008,6 +27017,7 @@ var input_input = __webpack_require__("RHNq");
 
 
 
+
 var input_rest = undefined && undefined.__rest || function (s, e) {
   var t = {};
 
@@ -27112,21 +27122,17 @@ class input_Input extends baseComponent_BaseComponent {
         eyeClosed: value
       }),
       toggleFocusing: isFocus => {
+        this.setState({
+          isFocus
+        });
+      },
+      focusInput: () => {
         const {
           preventScroll
         } = this.props;
         const input = this.inputRef && this.inputRef.current;
-
-        if (isFocus) {
-          input && input.focus({
-            preventScroll
-          });
-        } else {
-          input && input.blur();
-        }
-
-        this.setState({
-          isFocus
+        input && input.focus({
+          preventScroll
         });
       },
       toggleHovering: isHovering => this.setState({
@@ -27330,6 +27336,28 @@ class input_Input extends baseComponent_BaseComponent {
     );
   }
 
+  getInputRef() {
+    const {
+      forwardRef
+    } = this.props;
+
+    if (!isUndefined_default()(forwardRef)) {
+      if (typeof forwardRef === 'function') {
+        return node => {
+          forwardRef(node);
+          this.inputRef = {
+            current: node
+          };
+        };
+      } else if (Object.prototype.toString.call(forwardRef) === '[object Object]') {
+        this.inputRef = forwardRef;
+        return forwardRef;
+      }
+    }
+
+    return this.inputRef;
+  }
+
   render() {
     const _a = this.props,
           {
@@ -27369,7 +27397,7 @@ class input_Input extends baseComponent_BaseComponent {
     } = this.state;
     const suffixAllowClear = this.showClearBtn();
     const suffixIsIcon = Object(_utils["e" /* isSemiIcon */])(suffix);
-    const ref = forwardRef || this.inputRef;
+    const ref = this.getInputRef();
     const wrapperPrefix = "".concat(input_prefixCls, "-wrapper");
     const wrapperCls = classnames_default()(wrapperPrefix, className, {
       ["".concat(input_prefixCls, "-wrapper__with-prefix")]: prefix || insetLabel,
@@ -56597,8 +56625,48 @@ Combobox_Combobox.defaultProps = {
   format: timePicker_constants_strings.DEFAULT_FORMAT
 };
 /* harmony default export */ var timePicker_Combobox = (Combobox_Combobox);
+// CONCATENATED MODULE: /home/runner/work/semi-design/semi-design/node_modules/date-fns/esm/setYear/index.js
+
+
+
+/**
+ * @name setYear
+ * @category Year Helpers
+ * @summary Set the year to the given date.
+ *
+ * @description
+ * Set the year to the given date.
+ *
+ * ### v2.0.0 breaking changes:
+ *
+ * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).
+ *
+ * @param {Date|Number} date - the date to be changed
+ * @param {Number} year - the year of the new date
+ * @returns {Date} the new date with the year set
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // Set year 2013 to 1 September 2014:
+ * const result = setYear(new Date(2014, 8, 1), 2013)
+ * //=> Sun Sep 01 2013 00:00:00
+ */
+
+function setYear(dirtyDate, dirtyYear) {
+  requiredArgs(2, arguments);
+  var date = toDate(dirtyDate);
+  var year = toInteger(dirtyYear); // Check if date is Invalid Date because Date.prototype.setFullYear ignores the value of Invalid Date
+
+  if (isNaN(date.getTime())) {
+    return new Date(NaN);
+  }
+
+  date.setFullYear(year);
+  return date;
+}
 // CONCATENATED MODULE: ../semi-foundation/datePicker/yearAndMonthFoundation.ts
 
+
 class yearAndMonthFoundation_YearAndMonthFoundation extends foundation {
   constructor(adapter) {
     super(Object.assign({}, adapter));
@@ -56613,7 +56681,7 @@ class yearAndMonthFoundation_YearAndMonthFoundation extends foundation {
   selectYear(item) {
     const year = item.value;
 
-    this._adapter.setCurrentYear(year);
+    this._adapter.setCurrentYear(year, () => this.autoSelectMonth(item));
 
     this._adapter.notifySelectYear(year);
   }
@@ -56627,6 +56695,59 @@ class yearAndMonthFoundation_YearAndMonthFoundation extends foundation {
 
     this._adapter.notifySelectMonth(month);
   }
+  /**
+   * After selecting a year, if the currentMonth is disabled, automatically select a non-disabled month
+   */
+
+
+  autoSelectMonth(item) {
+    const {
+      disabledDate,
+      locale
+    } = this._adapter.getProps();
+
+    const {
+      months,
+      currentMonth
+    } = this._adapter.getStates();
+
+    const currentDate = setYear(Date.now(), item.year);
+    const isCurrentMonthDisabled = disabledDate(setMonth(currentDate, currentMonth - 1));
+
+    if (isCurrentMonthDisabled) {
+      const currentIndex = months.findIndex(_ref => {
+        let {
+          month
+        } = _ref;
+        return month === currentMonth;
+      });
+      let validMonth; // First look in the back, if you can't find it in the back, then look in the front
+
+      validMonth = months.slice(currentIndex).find(_ref2 => {
+        let {
+          month
+        } = _ref2;
+        return !disabledDate(setMonth(currentDate, month - 1));
+      });
+
+      if (!validMonth) {
+        validMonth = months.slice(0, currentIndex).find(_ref3 => {
+          let {
+            month
+          } = _ref3;
+          return !disabledDate(setMonth(currentDate, month - 1));
+        });
+      }
+
+      if (validMonth) {
+        this.selectMonth({
+          month: validMonth.month,
+          value: locale.fullMonths[validMonth.month],
+          disabled: false
+        });
+      }
+    }
+  }
 
   backToMain() {
     this._adapter.notifyBackToMain();
@@ -56643,45 +56764,6 @@ const getYears = () => {
 };
 
 /* harmony default export */ var _utils_getYears = (getYears);
-// CONCATENATED MODULE: /home/runner/work/semi-design/semi-design/node_modules/date-fns/esm/setYear/index.js
-
-
-
-/**
- * @name setYear
- * @category Year Helpers
- * @summary Set the year to the given date.
- *
- * @description
- * Set the year to the given date.
- *
- * ### v2.0.0 breaking changes:
- *
- * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).
- *
- * @param {Date|Number} date - the date to be changed
- * @param {Number} year - the year of the new date
- * @returns {Date} the new date with the year set
- * @throws {TypeError} 2 arguments required
- *
- * @example
- * // Set year 2013 to 1 September 2014:
- * const result = setYear(new Date(2014, 8, 1), 2013)
- * //=> Sun Sep 01 2013 00:00:00
- */
-
-function setYear(dirtyDate, dirtyYear) {
-  requiredArgs(2, arguments);
-  var date = toDate(dirtyDate);
-  var year = toInteger(dirtyYear); // Check if date is Invalid Date because Date.prototype.setFullYear ignores the value of Invalid Date
-
-  if (isNaN(date.getTime())) {
-    return new Date(NaN);
-  }
-
-  date.setFullYear(year);
-  return date;
-}
 // CONCATENATED MODULE: ./datePicker/yearAndMonth.tsx
 
 
@@ -56758,9 +56840,9 @@ class yearAndMonth_YearAndMonth extends baseComponent_BaseComponent {
     return Object.assign(Object.assign({}, super.adapter), {
       // updateYears: years => this.setState({ years }),
       // updateMonths: months => this.setState({ months }),
-      setCurrentYear: currentYear => this.setState({
+      setCurrentYear: (currentYear, cb) => this.setState({
         currentYear
-      }),
+      }, cb),
       setCurrentMonth: currentMonth => this.setState({
         currentMonth
       }),
@@ -56795,7 +56877,8 @@ class yearAndMonth_YearAndMonth extends baseComponent_BaseComponent {
     const {
       years,
       currentYear,
-      currentMonth
+      currentMonth,
+      months
     } = this.state;
     const {
       disabledDate,
@@ -56809,10 +56892,19 @@ class yearAndMonth_YearAndMonth extends baseComponent_BaseComponent {
         value,
         year
       } = _ref;
+      const isAllMonthDisabled = months.every(_ref2 => {
+        let {
+          month
+        } = _ref2;
+        return disabledDate(set_set(currentDate, {
+          year,
+          month: month - 1
+        }));
+      });
       return {
         year,
         value,
-        disabled: disabledDate(setYear(currentDate, year))
+        disabled: isAllMonthDisabled
       };
     });
 
@@ -56859,11 +56951,11 @@ class yearAndMonth_YearAndMonth extends baseComponent_BaseComponent {
     } // i18n
 
 
-    const list = months.map(_ref2 => {
+    const list = months.map(_ref3 => {
       let {
         value,
         month
-      } = _ref2;
+      } = _ref3;
       return {
         month,
         disabled: disabledDate(setMonth(currentDate, month - 1)),
@@ -63263,7 +63355,9 @@ class foundation_InputNumberFoundation extends foundation {
   _preventDefault(event) {
     const keepFocus = this._adapter.getProp('keepFocus');
 
-    if (keepFocus) {
+    const innerButtons = this._adapter.getProp('innerButtons');
+
+    if (keepFocus || innerButtons) {
       event.preventDefault();
     }
   }
@@ -86934,7 +87028,6 @@ class TabBar_TabBar extends external_root_React_commonjs2_react_commonjs_react_a
     this.renderTabComponents = list => list.map(panel => this.renderTabItem(panel));
 
     this.handleArrowClick = (items, pos) => {
-      const inline = pos === 'start' ? 'end' : 'start';
       const lastItem = pos === 'start' ? items.pop() : items.shift();
 
       if (!lastItem) {
@@ -86948,7 +87041,7 @@ class TabBar_TabBar extends external_root_React_commonjs2_react_commonjs_react_a
       tabItem.scrollIntoView({
         behavior: 'smooth',
         block: 'nearest',
-        inline
+        inline: 'nearest'
       });
     };
 
@@ -93666,7 +93759,9 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
         maxTagCount,
         checkRelation,
         showRestTagsPopover,
-        restTagsPopoverProps
+        restTagsPopoverProps,
+        searchPosition,
+        filterTreeNode
       } = this.props;
       const {
         keyEntities,
@@ -93680,8 +93775,16 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
         keyList = normalizeKeyList(checkedKeys, keyEntities, leafOnly);
       } else if (checkRelation === 'unRelated') {
         keyList = [...realCheckedKeys];
-      }
+      } // auto focus search input divide into two parts
+      // 1. filterTreeNode && searchPosition === strings.SEARCH_POSITION_TRIGGER
+      //    Implemented by passing autofocus to the underlying input's autofocus
+      // 2. filterTreeNode && searchPosition === strings.SEARCH_POSITION_DROPDOWN
+      //    Due to the off-screen rendering in the tooltip implementation mechanism, if it is implemented through the 
+      //    autofocus of the input, when the option panel is opened, the page will scroll to top, so it is necessary 
+      //    to call the focus method through ref in the onVisibleChange callback of the Popover to achieve focus
 
+
+      const autoFocus = filterTreeNode && searchPosition === treeSelect_constants_strings.SEARCH_POSITION_TRIGGER ? searchAutoFocus : undefined;
       return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(tagInput_0, {
         maxTagCount: maxTagCount,
         disabled: disabled,
@@ -93694,7 +93797,7 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
         showRestTagsPopover: showRestTagsPopover,
         restTagsPopoverProps: restTagsPopoverProps,
         // eslint-disable-next-line jsx-a11y/no-autofocus
-        autoFocus: searchAutoFocus,
+        autoFocus: autoFocus,
         renderTagItem: (itemKey, index) => this.renderTagItem(itemKey, index),
         onRemove: itemKey => this.removeTag(itemKey),
         expandRestTagsOnClick: false
@@ -93730,6 +93833,7 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
         prefix: /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconSearch, null)
       };
       const inputTriggerProps = {
+        autofocus: searchAutoFocus,
         onFocus: e => this.foundation.handleInputTriggerFocus(),
         onBlur: e => this.foundation.handleInputTriggerBlur(),
         disabled
@@ -93761,7 +93865,6 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
         return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(input_0, Object.assign({
           "aria-label": 'Filter TreeSelect item',
           ref: this.inputRef,
-          autofocus: searchAutoFocus,
           placeholder: placeholder
         }, baseInputProps, realInputProps));
       }));
@@ -93835,12 +93938,18 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
 
     this.handlePopoverClose = isVisible => {
       const {
-        filterTreeNode
+        filterTreeNode,
+        searchAutoFocus,
+        searchPosition
       } = this.props;
 
       if (isVisible === false && Boolean(filterTreeNode)) {
         this.foundation.clearInput();
       }
+
+      if (filterTreeNode && searchPosition === treeSelect_constants_strings.SEARCH_POSITION_DROPDOWN && isVisible && searchAutoFocus) {
+        this.foundation.focusInput(true);
+      }
     };
 
     this.renderTreeNode = (treeNode, ind, style) => {
@@ -94304,7 +94413,25 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
           isHovering: bool
         });
       },
-      updateInputFocus: bool => {} // eslint-disable-line
+      updateInputFocus: bool => {
+        if (bool) {
+          if (this.inputRef && this.inputRef.current) {
+            this.inputRef.current.focus();
+          }
+
+          if (this.tagInputRef && this.tagInputRef.current) {
+            this.tagInputRef.current.focus();
+          }
+        } else {
+          if (this.inputRef && this.inputRef.current) {
+            this.inputRef.current.blur();
+          }
+
+          if (this.tagInputRef && this.tagInputRef.current) {
+            this.tagInputRef.current.blur();
+          }
+        }
+      } // eslint-disable-line
 
     });
   }
@@ -103108,7 +103235,7 @@ class preview_Preview extends baseComponent_BaseComponent {
     const finalSrcList = [...srcArr, ...srcListInChildren];
     return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(PreviewContext.Provider, {
       value: {
-        isGroup: finalSrcList.length > 1,
+        isGroup: true,
         previewSrc: finalSrcList,
         titles: titles,
         currentIndex,