@douyinfe/semi-ui 2.41.0 → 2.41.1

package/dist/umd/semi-ui.js

@@ -19754,6 +19754,12 @@ function getFocusableElements(node) {
   const focusableElements = Array.from(node.querySelectorAll(focusableSelectorsStr));
   return focusableElements;
 }
+function getScrollbarWidth() {
+  if (globalThis && Object.prototype.toString.call(globalThis) === '[object Window]') {
+    return window.innerWidth - document.documentElement.clientWidth;
+  }
+  return 0;
+}
 ;// CONCATENATED MODULE: ./configProvider/context.tsx
 
 const ConfigContext = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createContext({});
@@ -27663,10 +27669,10 @@ class Input extends BaseComponent {
     this.foundation.init();
     const {
       disabled,
-      autofocus,
+      autoFocus,
       preventScroll
     } = this.props;
-    if (!disabled && autofocus) {
+    if (!disabled && (autoFocus || this.props['autofocus'])) {
       this.inputRef.current.focus({
         preventScroll
       });
@@ -27829,7 +27835,7 @@ class Input extends BaseComponent {
       {
         addonAfter,
         addonBefore,
-        autofocus,
+        autoFocus,
         clearIcon,
         className,
         disabled,
@@ -27857,7 +27863,7 @@ class Input extends BaseComponent {
         borderless,
         showClearIgnoreDisabled
       } = _a,
-      rest = input_rest(_a, ["addonAfter", "addonBefore", "autofocus", "clearIcon", "className", "disabled", "defaultValue", "placeholder", "prefix", "mode", "insetLabel", "insetLabelId", "validateStatus", "type", "readonly", "size", "suffix", "style", "showClear", "onEnterPress", "onClear", "hideSuffix", "inputStyle", "forwardRef", "maxLength", "getValueLength", "preventScroll", "borderless", "showClearIgnoreDisabled"]);
+      rest = input_rest(_a, ["addonAfter", "addonBefore", "autoFocus", "clearIcon", "className", "disabled", "defaultValue", "placeholder", "prefix", "mode", "insetLabel", "insetLabelId", "validateStatus", "type", "readonly", "size", "suffix", "style", "showClear", "onEnterPress", "onClear", "hideSuffix", "inputStyle", "forwardRef", "maxLength", "getValueLength", "preventScroll", "borderless", "showClearIgnoreDisabled"]);
     const {
       value,
       isFocus,
@@ -27951,7 +27957,7 @@ Input.propTypes = {
   defaultValue: (prop_types_default()).any,
   disabled: (prop_types_default()).bool,
   readonly: (prop_types_default()).bool,
-  autofocus: (prop_types_default()).bool,
+  autoFocus: (prop_types_default()).bool,
   type: (prop_types_default()).string,
   showClear: (prop_types_default()).bool,
   hideSuffix: (prop_types_default()).bool,
@@ -53985,7 +53991,7 @@ class DateInput extends BaseComponent {
       onChange: (rangeStartValue, e) => this.handleRangeInputChange(rangeStartValue, rangeEnd, e),
       onEnterPress: e => this.handleRangeInputEnterPress(e, rangeStart, rangeEnd),
       onFocus: e => this.handleRangeInputFocus(e, 'rangeStart'),
-      autofocus: autofocus,
+      autoFocus: autofocus,
       ref: rangeInputStartRef
     })), this.renderRangeSeparator(rangeStart, rangeEnd), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
       className: `${inputCls} ${inputRightWrapperCls}`,
@@ -54160,7 +54166,7 @@ class DateInput extends BaseComponent {
       value: text,
       validateStatus: validateStatus,
       prefix: prefix,
-      autofocus: autofocus,
+      autoFocus: autofocus,
       size: size,
       onBlur: onBlur,
       onFocus: onFocus
@@ -60872,6 +60878,7 @@ var Modal_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
+
 const destroyFns = [];
 class Modal extends BaseComponent {
   constructor(props) {
@@ -61080,14 +61087,8 @@ class Modal extends BaseComponent {
     // }
     return newState;
   }
-  static getScrollbarWidth() {
-    if (globalThis && Object.prototype.toString.call(globalThis) === '[object Window]') {
-      return window.innerWidth - document.documentElement.clientWidth;
-    }
-    return 0;
-  }
   componentDidMount() {
-    this.scrollBarWidth = Modal.getScrollbarWidth();
+    this.scrollBarWidth = getScrollbarWidth();
     this.originBodyWidth = document.body.style.width;
     if (this.props.visible) {
       this.foundation.beforeShow();
@@ -63328,9 +63329,10 @@ class TextArea extends BaseComponent {
         maxLength,
         minLength,
         showClear,
-        borderless
+        borderless,
+        autoFocus
       } = _a,
-      rest = textarea_rest(_a, ["autosize", "placeholder", "onEnterPress", "onResize", "disabled", "readonly", "className", "showCounter", "validateStatus", "maxCount", "defaultValue", "style", "forwardRef", "getValueLength", "maxLength", "minLength", "showClear", "borderless"]);
+      rest = textarea_rest(_a, ["autosize", "placeholder", "onEnterPress", "onResize", "disabled", "readonly", "className", "showCounter", "validateStatus", "maxCount", "defaultValue", "style", "forwardRef", "getValueLength", "maxLength", "minLength", "showClear", "borderless", "autoFocus"]);
     const {
       isFocus,
       value,
@@ -63352,6 +63354,7 @@ class TextArea extends BaseComponent {
       [`${textarea_prefixCls}-textarea-showClear`]: showClear
     });
     const itemProps = Object.assign(Object.assign({}, omit_default()(rest, 'insetLabel', 'insetLabelId', 'getValueLength', 'onClear', 'showClear')), {
+      autoFocus: autoFocus || this.props['autofocus'],
       className: itemCls,
       disabled,
       readOnly: readonly,
@@ -75814,6 +75817,7 @@ var sideSheet_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
+
 const sideSheet_prefixCls = sideSheet_constants_cssClasses.PREFIX;
 const defaultWidthList = sideSheet_constants_strings.WIDTH;
 const defaultHeight = sideSheet_constants_strings.HEIGHT;
@@ -75833,6 +75837,9 @@ class SideSheet extends BaseComponent {
       displayNone: !this.props.visible
     };
     this.foundation = new SideSheetFoundation(this.adapter);
+    this.bodyOverflow = '';
+    this.scrollBarWidth = 0;
+    this.originBodyWidth = '100%';
   }
   get adapter() {
     return Object.assign(Object.assign({}, super.adapter), {
@@ -75840,16 +75847,19 @@ class SideSheet extends BaseComponent {
         const {
           getPopupContainer
         } = this.props;
-        if (!getPopupContainer && document) {
+        this.bodyOverflow = document.body.style.overflow || '';
+        if (!getPopupContainer && this.bodyOverflow !== 'hidden') {
           document.body.style.overflow = 'hidden';
+          document.body.style.width = `calc(${this.originBodyWidth || '100%'} - ${this.scrollBarWidth}px)`;
         }
       },
       enabledBodyScroll: () => {
         const {
           getPopupContainer
         } = this.props;
-        if (!getPopupContainer && document) {
-          document.body.style.overflow = '';
+        if (!getPopupContainer && this.bodyOverflow !== 'hidden') {
+          document.body.style.overflow = this.bodyOverflow;
+          document.body.style.width = this.originBodyWidth;
         }
       },
       notifyCancel: e => {
@@ -75888,6 +75898,8 @@ class SideSheet extends BaseComponent {
     return newState;
   }
   componentDidMount() {
+    this.scrollBarWidth = getScrollbarWidth();
+    this.originBodyWidth = document.body.style.width;
     if (this.props.visible) {
       this.foundation.beforeShow();
     }
@@ -77285,7 +77297,7 @@ class Slider extends BaseComponent {
       getMaxHandleEl: () => this.maxHanleEl.current,
       onHandleDown: e => {
         this._addEventListener(document.body, 'mousemove', this.foundation.onHandleMove, false);
-        this._addEventListener(document.body, 'mouseup', this.foundation.onHandleUp, false);
+        this._addEventListener(window, 'mouseup', this.foundation.onHandleUp, false);
         this._addEventListener(document.body, 'touchmove', this.foundation.onHandleTouchMove, false);
       },
       onHandleMove: function (mousePos, isMin) {
@@ -77349,6 +77361,8 @@ class Slider extends BaseComponent {
         });
       },
       onHandleUpBefore: e => {
+        var _a, _b;
+        (_b = (_a = this.props).onMouseUp) === null || _b === void 0 ? void 0 : _b.call(_a, e);
         e.stopPropagation();
         e.preventDefault();
         document.body.removeEventListener('mousemove', this.foundation.onHandleMove, false);
@@ -77475,6 +77489,7 @@ Slider.propTypes = {
   vertical: (prop_types_default()).bool,
   onAfterChange: (prop_types_default()).func,
   onChange: (prop_types_default()).func,
+  onMouseUp: (prop_types_default()).func,
   tooltipVisible: (prop_types_default()).bool,
   style: (prop_types_default()).object,
   className: (prop_types_default()).string,
@@ -100188,6 +100203,7 @@ class PreviewInnerFoundation extends foundation {
 
 
 
+
 const previewInner_prefixCls = image_constants_cssClasses.PREFIX;
 let startMouseDown = {
   x: 0,
@@ -100392,14 +100408,8 @@ class PreviewInner extends BaseComponent {
     }
     return willUpdateStates;
   }
-  static getScrollbarWidth() {
-    if (globalThis && Object.prototype.toString.call(globalThis) === '[object Window]') {
-      return window.innerWidth - document.documentElement.clientWidth;
-    }
-    return 0;
-  }
   componentDidMount() {
-    this.scrollBarWidth = PreviewInner.getScrollbarWidth();
+    this.scrollBarWidth = getScrollbarWidth();
     this.originBodyWidth = document.body.style.width;
     if (this.props.visible) {
       this.foundation.beforeShow();