@nutui/nutui-react 3.0.12 → 3.0.13-beta.1

package/dist/es/packages/swiper/swiper.js

@@ -1,7 +1,7 @@
 import { _ as _define_property } from "@swc/helpers/_/_define_property";
 import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
-import React, { useEffect, useMemo, useRef, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useDrag } from "@use-gesture/react";
 import { useSpring } from "@react-spring/web";
 import classNames from "classnames";
@@ -14,7 +14,7 @@ var defaultProps = {
     indicator: false,
     loop: false,
     duration: 3000,
-    autoPlay: false,
+    autoplay: false,
     defaultValue: 0,
     touchable: true,
     effect: undefined
@@ -32,29 +32,44 @@ export var Swiper = /*#__PURE__*/ React.forwardRef(function(props, ref) {
         return current;
     };
     var classPrefix = 'nut-swiper';
-    var _$_object_spread = _object_spread({}, defaultProps, props), children = _$_object_spread.children, direction = _$_object_spread.direction, indicator = _$_object_spread.indicator, loop = _$_object_spread.loop, effect = _$_object_spread.effect, autoPlay = _$_object_spread.autoPlay, touchable = _$_object_spread.touchable, defaultValue = _$_object_spread.defaultValue, duration = _$_object_spread.duration, style = _$_object_spread.style, className = _$_object_spread.className;
+    var _$_object_spread = _object_spread({}, defaultProps, props), children = _$_object_spread.children, direction = _$_object_spread.direction, indicator = _$_object_spread.indicator, loop = _$_object_spread.loop, effect = _$_object_spread.effect, autoplay = _$_object_spread.autoplay, touchable = _$_object_spread.touchable, defaultValue = _$_object_spread.defaultValue, duration = _$_object_spread.duration, style = _$_object_spread.style, className = _$_object_spread.className;
     var isVertical = direction === 'vertical';
     var count = useMemo(function() {
         var c = 0;
-        React.Children.map(children, function(child, index) {
+        React.Children.map(children, function() {
             c += 1;
         });
         return c;
     }, [
         children
     ]);
+    var timeoutRef = useRef(null);
+    var _useState = _sliced_to_array(useState(false), 2), dragging = _useState[0], setDragging = _useState[1];
+    var _useRefState = _sliced_to_array(useRefState(defaultValue), 2), innerValue = _useRefState[0], setInnerValue = _useRefState[1];
+    var stageRef = useRef(null);
+    var swiperRef = useRef(null);
+    var _useSpring = _sliced_to_array(useSpring(function() {
+        return {
+            x: !isVertical ? innerValue.current * 100 * -1 : 0,
+            y: isVertical ? innerValue.current * 100 * -1 : 0,
+            s: 0,
+            reset: function() {},
+            config: {
+                tension: 200,
+                friction: 30
+            }
+        };
+    }), 2), springs = _useSpring[0], api = _useSpring[1];
     var getSlideSize = function() {
         if (props.slideSize) return props.slideSize;
         if (stageRef.current) {
-            if (isVertical) return stageRef.current.offsetHeight;
-            return stageRef.current.offsetWidth;
+            return isVertical ? stageRef.current.offsetHeight : stageRef.current.offsetWidth;
         }
         return 0;
     };
     var getSwiperSize = function() {
         if (swiperRef.current) {
-            if (isVertical) return swiperRef.current.offsetHeight;
-            return swiperRef.current.offsetWidth;
+            return isVertical ? swiperRef.current.offsetHeight : swiperRef.current.offsetWidth;
         }
         return 0;
     };
@@ -67,51 +82,48 @@ export var Swiper = /*#__PURE__*/ React.forwardRef(function(props, ref) {
         }
         return v;
     };
-    var timeoutRef = useRef(null);
-    var _useState = _sliced_to_array(useState(false), 2), dragging = _useState[0], setDragging = _useState[1];
-    var _useRefState = _sliced_to_array(useRefState(defaultValue), 2), current = _useRefState[0], setCurrent = _useRefState[1];
-    var stageRef = useRef(null);
-    var swiperRef = useRef(null);
-    var _useSpring = _sliced_to_array(useSpring(function() {
-        return {
-            x: !isVertical ? current.current * 100 * -1 : 0,
-            y: isVertical ? current.current * 100 * -1 : 0,
-            s: 0,
-            reset: function() {},
-            config: {
-                tension: 200,
-                friction: 30
-            }
-        };
-    }), 2), springs = _useSpring[0], api = _useSpring[1];
     useEffect(function() {
         var _obj;
-        api.start((_obj = {}, _define_property(_obj, isVertical ? 'y' : 'x', boundIndex(current.current) * -1 * 100), _define_property(_obj, "immediate", true), _obj));
+        api.start((_obj = {}, _define_property(_obj, isVertical ? 'y' : 'x', boundIndex(innerValue.current) * -1 * 100), _define_property(_obj, "immediate", true), _obj));
     }, [
         swiperRef.current
     ]);
     var swiperDirection = useRef(1);
-    var _useList = _sliced_to_array(useList(effect, count, current), 2), transforms = _useList[0], setTransforms = _useList[1];
+    var _useList = _sliced_to_array(useList(effect, count, innerValue), 2), transforms = _useList[0], setTransforms = _useList[1];
     // 自动播放
-    var runTimeSwiper = function() {
+    var runTimeSwiper = useCallback(function() {
         var durationNumber = typeof duration === 'string' ? parseInt(duration) : duration;
-        var d = typeof autoPlay === 'number' ? autoPlay : durationNumber;
+        var d = durationNumber;
+        // 优先使用明确设置的数值型自动播放间隔
+        if (typeof props.autoPlay === 'number') {
+            d = props.autoPlay;
+        } else if (typeof autoplay === 'number') {
+            d = autoplay;
+        }
         timeoutRef.current = window.setTimeout(function() {
             next();
             runTimeSwiper();
         }, d);
-    };
+    }, [
+        props.autoPlay,
+        autoplay,
+        duration
+    ]);
     useEffect(function() {
-        if (!autoPlay || dragging) return;
+        // 兼容旧版的 autoPlay 属性
+        var shouldAutoplay = props.autoPlay || autoplay;
+        if (!shouldAutoplay || dragging) return;
+        // if (!autoplay || dragging) return
         runTimeSwiper();
         return function() {
             if (timeoutRef.current) window.clearTimeout(timeoutRef.current);
         };
     }, [
-        autoPlay,
+        autoplay,
         duration,
         dragging,
-        count
+        count,
+        runTimeSwiper
     ]);
     var to = function(index) {
         var immediate = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
@@ -121,7 +133,7 @@ export var Swiper = /*#__PURE__*/ React.forwardRef(function(props, ref) {
             var cycleIndex = index % count;
             targetIndex = cycleIndex < 0 ? cycleIndex + count : cycleIndex;
         }
-        setCurrent(targetIndex);
+        setInnerValue(targetIndex);
         (_props_onChange = props.onChange) === null || _props_onChange === void 0 ? void 0 : _props_onChange.call(props, targetIndex);
         if (effect) {
             updateTransform(transforms, setTransforms, effect, targetIndex);
@@ -188,13 +200,10 @@ export var Swiper = /*#__PURE__*/ React.forwardRef(function(props, ref) {
         bounds: function() {
             if (loop) return {};
             var slideSize = getSlideSize();
-            if (isVertical) {
-                return {
-                    top: 0,
-                    bottom: (count - 1) * slideSize
-                };
-            }
-            return {
+            return isVertical ? {
+                top: 0,
+                bottom: (count - 1) * slideSize
+            } : {
                 left: 0,
                 right: (count - 1) * slideSize
             };
@@ -208,13 +217,13 @@ export var Swiper = /*#__PURE__*/ React.forwardRef(function(props, ref) {
         }
     });
     var renderIndicator = function() {
-        if (/*#__PURE__*/ React.isValidElement(indicator)) return indicator;
         if (!indicator) return null;
+        if (/*#__PURE__*/ React.isValidElement(indicator)) return indicator;
         var _obj;
         return /*#__PURE__*/ React.createElement("div", {
             className: classNames((_obj = {}, _define_property(_obj, "".concat(classPrefix, "-indicator"), true), _define_property(_obj, "".concat(classPrefix, "-indicator-vertical"), isVertical), _define_property(_obj, "".concat(classPrefix, "-indicator-horizontal"), !isVertical), _obj))
         }, /*#__PURE__*/ React.createElement(Indicator, {
-            current: getRefValue(current),
+            current: getRefValue(innerValue),
             total: count,
             direction: direction
         }));
@@ -235,7 +244,7 @@ export var Swiper = /*#__PURE__*/ React.forwardRef(function(props, ref) {
                 count: count,
                 isVertical: isVertical,
                 effect: effect,
-                current: current,
+                current: innerValue,
                 swiperDirection: swiperDirection,
                 dragging: dragging,
                 transforms: transforms

package/dist/es/packages/tabbaritem/style/style.css

@@ -15,10 +15,10 @@
   width: 24px;
   height: 24px;
   font-size: 24px;
-  /* #ifdef harmony*/
+  /* #ifdef harmony dynamic*/
   color: var(--nutui-tabbar-inactive-color, var(--nutui-color-title, #1a1a1a));
   /* #endif*/
-  /* #ifndef harmony*/
+  /* #ifndef harmony dynamic*/
   color: inherit;
   /* #endif*/
 }
@@ -49,10 +49,10 @@
 }
 .nut-tabbar-item-active .nut-tabbar-item-text,
 .nut-tabbar-item-active .nut-icon {
-  /* #ifdef harmony*/
+  /* #ifdef harmony dynamic*/
   color: var(--nutui-tabbar-active-color, var(--nutui-color-primary, #ff0f23));
   /* #endif*/
-  /* #ifndef harmony*/
+  /* #ifndef harmony dynamic*/
   color: inherit;
   /* #endif*/
 }

package/dist/es/packages/tabbaritem/style/tabbaritem.scss

@@ -11,10 +11,10 @@
     width: 24px;
     height: 24px;
     font-size: 24px;
-    /* #ifdef harmony*/
+    /* #ifdef harmony dynamic*/
     color: $tabbar-inactive-color;
     /* #endif*/
-    /* #ifndef harmony*/
+    /* #ifndef harmony dynamic*/
     color: inherit;
     /* #endif*/
   }
@@ -52,10 +52,10 @@
 
     .nut-tabbar-item-text,
     .nut-icon {
-      /* #ifdef harmony*/
+      /* #ifdef harmony dynamic*/
       color: $tabbar-active-color;
       /* #endif*/
-      /* #ifndef harmony*/
+      /* #ifndef harmony dynamic*/
       color: inherit;
       /* #endif*/
     }

package/dist/es/packages/tabbaritem/style-jmapp/style.css

@@ -15,10 +15,10 @@
   width: 24px;
   height: 24px;
   font-size: 24px;
-  /* #ifdef harmony*/
+  /* #ifdef harmony dynamic*/
   color: var(--nutui-tabbar-inactive-color, var(--nutui-color-text));
   /* #endif*/
-  /* #ifndef harmony*/
+  /* #ifndef harmony dynamic*/
   color: inherit;
   /* #endif*/
 }
@@ -49,10 +49,10 @@
 }
 .nut-tabbar-item-active .nut-tabbar-item-text,
 .nut-tabbar-item-active .nut-icon {
-  /* #ifdef harmony*/
+  /* #ifdef harmony dynamic*/
   color: var(--nutui-tabbar-active-color, var(--nutui-color-primary));
   /* #endif*/
-  /* #ifndef harmony*/
+  /* #ifndef harmony dynamic*/
   color: inherit;
   /* #endif*/
 }

package/dist/es/packages/tabbaritem/style-jmapp/tabbaritem.scss

@@ -11,10 +11,10 @@
     width: 24px;
     height: 24px;
     font-size: 24px;
-    /* #ifdef harmony*/
+    /* #ifdef harmony dynamic*/
     color: $tabbar-inactive-color;
     /* #endif*/
-    /* #ifndef harmony*/
+    /* #ifndef harmony dynamic*/
     color: inherit;
     /* #endif*/
   }
@@ -52,10 +52,10 @@
 
     .nut-tabbar-item-text,
     .nut-icon {
-      /* #ifdef harmony*/
+      /* #ifdef harmony dynamic*/
       color: $tabbar-active-color;
       /* #endif*/
-      /* #ifndef harmony*/
+      /* #ifndef harmony dynamic*/
       color: inherit;
       /* #endif*/
     }

package/dist/es/packages/tabbaritem/style-jrkf/style.css

@@ -15,10 +15,10 @@
   width: 24px;
   height: 24px;
   font-size: 24px;
-  /* #ifdef harmony*/
+  /* #ifdef harmony dynamic*/
   color: var(--nutui-tabbar-inactive-color, var(--nutui-color-text));
   /* #endif*/
-  /* #ifndef harmony*/
+  /* #ifndef harmony dynamic*/
   color: inherit;
   /* #endif*/
 }
@@ -49,10 +49,10 @@
 }
 .nut-tabbar-item-active .nut-tabbar-item-text,
 .nut-tabbar-item-active .nut-icon {
-  /* #ifdef harmony*/
+  /* #ifdef harmony dynamic*/
   color: var(--nutui-tabbar-active-color, var(--nutui-color-primary, #ff6666));
   /* #endif*/
-  /* #ifndef harmony*/
+  /* #ifndef harmony dynamic*/
   color: inherit;
   /* #endif*/
 }

package/dist/es/packages/tabbaritem/style-jrkf/tabbaritem.scss

@@ -11,10 +11,10 @@
     width: 24px;
     height: 24px;
     font-size: 24px;
-    /* #ifdef harmony*/
+    /* #ifdef harmony dynamic*/
     color: $tabbar-inactive-color;
     /* #endif*/
-    /* #ifndef harmony*/
+    /* #ifndef harmony dynamic*/
     color: inherit;
     /* #endif*/
   }
@@ -52,10 +52,10 @@
 
     .nut-tabbar-item-text,
     .nut-icon {
-      /* #ifdef harmony*/
+      /* #ifdef harmony dynamic*/
       color: $tabbar-active-color;
       /* #endif*/
-      /* #ifndef harmony*/
+      /* #ifndef harmony dynamic*/
       color: inherit;
       /* #endif*/
     }

package/dist/es/packages/tabs/style/style.css

@@ -170,10 +170,10 @@
 
 .nut-tabs-vertical .nut-tabs-ellipsis {
   white-space: break-spaces;
-  /* #ifdef harmony */
+  /* #ifdef harmony dynamic*/
   padding-left: 12px;
   /* #endif */
-  /* #ifndef harmony */
+  /* #ifndef harmony dynamic*/
   padding-left: 6px;
   /* #endif */
   width: 90px;

package/dist/es/packages/tabs/style/tabs.scss

@@ -213,10 +213,10 @@
 .nut-tabs-vertical {
   .nut-tabs-ellipsis {
     white-space: break-spaces;
-    /* #ifdef harmony */
+    /* #ifdef harmony dynamic*/
     padding-left: 12px;
     /* #endif */
-    /* #ifndef harmony */
+    /* #ifndef harmony dynamic*/
     padding-left: 6px;
     /* #endif */
     width: 90px;

package/dist/es/packages/tabs/style-jmapp/style.css

@@ -170,10 +170,10 @@
 
 .nut-tabs-vertical .nut-tabs-ellipsis {
   white-space: break-spaces;
-  /* #ifdef harmony */
+  /* #ifdef harmony dynamic*/
   padding-left: 12px;
   /* #endif */
-  /* #ifndef harmony */
+  /* #ifndef harmony dynamic*/
   padding-left: 6px;
   /* #endif */
   width: 90px;

package/dist/es/packages/tabs/style-jmapp/tabs.scss

@@ -213,10 +213,10 @@
 .nut-tabs-vertical {
   .nut-tabs-ellipsis {
     white-space: break-spaces;
-    /* #ifdef harmony */
+    /* #ifdef harmony dynamic*/
     padding-left: 12px;
     /* #endif */
-    /* #ifndef harmony */
+    /* #ifndef harmony dynamic*/
     padding-left: 6px;
     /* #endif */
     width: 90px;

package/dist/es/packages/tabs/style-jrkf/style.css

@@ -170,10 +170,10 @@
 
 .nut-tabs-vertical .nut-tabs-ellipsis {
   white-space: break-spaces;
-  /* #ifdef harmony */
+  /* #ifdef harmony dynamic*/
   padding-left: 12px;
   /* #endif */
-  /* #ifndef harmony */
+  /* #ifndef harmony dynamic*/
   padding-left: 6px;
   /* #endif */
   width: 90px;

package/dist/es/packages/tabs/style-jrkf/tabs.scss

@@ -213,10 +213,10 @@
 .nut-tabs-vertical {
   .nut-tabs-ellipsis {
     white-space: break-spaces;
-    /* #ifdef harmony */
+    /* #ifdef harmony dynamic*/
     padding-left: 12px;
     /* #endif */
-    /* #ifndef harmony */
+    /* #ifndef harmony dynamic*/
     padding-left: 6px;
     /* #endif */
     width: 90px;

package/dist/es/packages/textarea/textarea.d.ts

@@ -1,3 +1,3 @@
-import React, { FunctionComponent } from 'react';
+import React from 'react';
 import { WebTextAreaProps } from "../../types";
-export declare const TextArea: FunctionComponent<Partial<WebTextAreaProps> & Omit<React.HTMLAttributes<HTMLTextAreaElement>, 'onChange' | 'onBlur' | 'onFocus'>>;
+export declare const TextArea: React.ForwardRefExoticComponent<Partial<WebTextAreaProps> & Omit<React.HTMLAttributes<HTMLTextAreaElement>, "onFocus" | "onBlur" | "onChange"> & React.RefAttributes<unknown>>;

package/dist/es/packages/textarea/textarea.js

@@ -3,7 +3,7 @@ import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
 import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
-import React, { useEffect, useRef } from "react";
+import React, { useEffect, useRef, forwardRef, useImperativeHandle } from "react";
 import classNames from "classnames";
 import { useConfig, useRtl } from "../configprovider";
 import { ComponentDefaults } from "../../utils/typings";
@@ -13,14 +13,13 @@ var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     showCount: false,
     rows: 2,
     maxLength: 140,
-    placeholder: '',
     readOnly: false,
     disabled: false,
     autoSize: false,
     plain: false,
     status: 'default'
 });
-export var TextArea = function(props) {
+export var TextArea = /*#__PURE__*/ forwardRef(function(props, ref) {
     var locale = useConfig().locale;
     var _ref = _object_spread({}, defaultProps, props), className = _ref.className, value = _ref.value, defaultValue = _ref.defaultValue, showCount = _ref.showCount, maxLength = _ref.maxLength, rows = _ref.rows, placeholder = _ref.placeholder, readOnly = _ref.readOnly, disabled = _ref.disabled, autoSize = _ref.autoSize, style = _ref.style, plain = _ref.plain, status = _ref.status, onChange = _ref.onChange, onBlur = _ref.onBlur, onFocus = _ref.onFocus, rest = _object_without_properties(_ref, [
         "className",
@@ -55,13 +54,13 @@ export var TextArea = function(props) {
         defaultValue: defaultValue,
         finalValue: format(defaultValue),
         onChange: onChange
-    }), 2), inputValue = _usePropsValue[0], setInputValue = _usePropsValue[1];
+    }), 2), innerValue = _usePropsValue[0], setInnerValue = _usePropsValue[1];
     useEffect(function() {
         if (autoSize) setContentHeight();
     }, [
         autoSize,
         defaultValue,
-        inputValue
+        innerValue
     ]);
     var setContentHeight = function() {
         var textarea = textareaRef.current;
@@ -76,7 +75,7 @@ export var TextArea = function(props) {
     var handleChange = function(event) {
         var text = event.target;
         var value = compositionRef.current ? text.value : format(text.value);
-        setInputValue(value);
+        setInnerValue(value);
     };
     var isDisabled = function() {
         return disabled || readOnly;
@@ -89,6 +88,24 @@ export var TextArea = function(props) {
         if (isDisabled()) return;
         onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
     };
+    useImperativeHandle(ref, function() {
+        return {
+            clear: function() {
+                return setInnerValue('');
+            },
+            focus: function() {
+                var _textareaRef_current;
+                return (_textareaRef_current = textareaRef.current) === null || _textareaRef_current === void 0 ? void 0 : _textareaRef_current.focus();
+            },
+            blur: function() {
+                var _textareaRef_current;
+                return (_textareaRef_current = textareaRef.current) === null || _textareaRef_current === void 0 ? void 0 : _textareaRef_current.blur();
+            },
+            get nativeElement () {
+                return textareaRef.current;
+            }
+        };
+    });
     var _obj;
     return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", {
         className: classNames(classPrefix, (_obj = {}, _define_property(_obj, "".concat(classPrefix, "-disabled"), disabled), _define_property(_obj, "".concat(classPrefix, "-readonly"), readOnly), _define_property(_obj, "".concat(classPrefix, "-rtl"), rtl), _define_property(_obj, "".concat(classPrefix, "-plain"), plain), _define_property(_obj, "".concat(classPrefix, "-container"), !plain), _define_property(_obj, "".concat(classPrefix, "-").concat(status), status), _obj), className)
@@ -98,7 +115,7 @@ export var TextArea = function(props) {
         style: style,
         disabled: disabled,
         readOnly: readOnly,
-        value: inputValue,
+        value: innerValue,
         onChange: handleChange,
         onBlur: handleBlur,
         onFocus: handleFocus,
@@ -113,6 +130,6 @@ export var TextArea = function(props) {
         placeholder: placeholder !== undefined ? placeholder : locale.placeholder
     })), showCount && /*#__PURE__*/ React.createElement("div", {
         className: classNames("".concat(classPrefix, "-limit"), _define_property({}, "".concat(classPrefix, "-limit-disabled"), disabled))
-    }, inputValue.length, "/", maxLength < 0 ? 0 : maxLength)));
-};
+    }, innerValue.length, "/", maxLength < 0 ? 0 : maxLength)));
+});
 TextArea.displayName = 'NutTextArea';

package/dist/es/packages/toast/style/style.css

@@ -27,10 +27,10 @@
   --nutui-overlay-bg-color: rgba(0, 0, 0, 0);
 }
 .nut-toast-overlay-default-taro {
-  /* #ifdef harmony */
+  /* #ifdef harmony dynamic*/
   background-color: rgba(0, 0, 0, 0);
   /* #endif */
-  /* #ifndef harmony */
+  /* #ifndef harmony dynamic*/
   --nutui-overlay-bg-color: rgba(0, 0, 0, 0);
   /* #endif */
 }

package/dist/es/packages/toast/style/toast.scss

@@ -26,10 +26,10 @@
   }
 
   &-overlay-default-taro {
-    /* #ifdef harmony */
+    /* #ifdef harmony dynamic*/
     background-color: rgba(0, 0, 0, 0);
     /* #endif */
-    /* #ifndef harmony */
+    /* #ifndef harmony dynamic*/
     --nutui-overlay-bg-color: rgba(0, 0, 0, 0);
     /* #endif */
   }

package/dist/es/packages/toast/style-jmapp/style.css

@@ -27,10 +27,10 @@
   --nutui-overlay-bg-color: rgba(0, 0, 0, 0);
 }
 .nut-toast-overlay-default-taro {
-  /* #ifdef harmony */
+  /* #ifdef harmony dynamic*/
   background-color: rgba(0, 0, 0, 0);
   /* #endif */
-  /* #ifndef harmony */
+  /* #ifndef harmony dynamic*/
   --nutui-overlay-bg-color: rgba(0, 0, 0, 0);
   /* #endif */
 }

package/dist/es/packages/toast/style-jmapp/toast.scss

@@ -26,10 +26,10 @@
   }
 
   &-overlay-default-taro {
-    /* #ifdef harmony */
+    /* #ifdef harmony dynamic*/
     background-color: rgba(0, 0, 0, 0);
     /* #endif */
-    /* #ifndef harmony */
+    /* #ifndef harmony dynamic*/
     --nutui-overlay-bg-color: rgba(0, 0, 0, 0);
     /* #endif */
   }

package/dist/es/packages/toast/style-jrkf/style.css

@@ -27,10 +27,10 @@
   --nutui-overlay-bg-color: rgba(0, 0, 0, 0);
 }
 .nut-toast-overlay-default-taro {
-  /* #ifdef harmony */
+  /* #ifdef harmony dynamic*/
   background-color: rgba(0, 0, 0, 0);
   /* #endif */
-  /* #ifndef harmony */
+  /* #ifndef harmony dynamic*/
   --nutui-overlay-bg-color: rgba(0, 0, 0, 0);
   /* #endif */
 }

package/dist/es/packages/toast/style-jrkf/toast.scss

@@ -26,10 +26,10 @@
   }
 
   &-overlay-default-taro {
-    /* #ifdef harmony */
+    /* #ifdef harmony dynamic*/
     background-color: rgba(0, 0, 0, 0);
     /* #endif */
-    /* #ifndef harmony */
+    /* #ifndef harmony dynamic*/
     --nutui-overlay-bg-color: rgba(0, 0, 0, 0);
     /* #endif */
   }

package/dist/es/packages/uploader/style/style.css

@@ -77,6 +77,7 @@
   height: 100%;
   background: var(--nutui-uploader-preview-progress-background, var(--nutui-color-mask, rgba(0, 0, 0, 0.7)));
   border-radius: var(--nutui-uploader-image-border-radius, 4px);
+  z-index: 10;
 }
 .nut-uploader-preview-progress i {
   margin-bottom: var(--nutui-uploader-image-icon-margin-bottom, 6px);

package/dist/es/packages/uploader/style/uploader.scss

@@ -86,6 +86,7 @@
       height: 100%;
       background: $uploader-preview-progress-background;
       border-radius: $uploader-image-border-radius;
+      z-index: 10;
 
       i {
         margin-bottom: $uploader-image-icon-margin-bottom;

package/dist/es/packages/uploader/style-jmapp/style.css

@@ -77,6 +77,7 @@
   height: 100%;
   background: var(--nutui-uploader-preview-progress-background, var(--nutui-color-surface-overlay));
   border-radius: var(--nutui-uploader-image-border-radius, var(--nutui-radius-xs));
+  z-index: 10;
 }
 .nut-uploader-preview-progress i {
   margin-bottom: var(--nutui-uploader-image-icon-margin-bottom, 6px);

package/dist/es/packages/uploader/style-jmapp/uploader.scss

@@ -86,6 +86,7 @@
       height: 100%;
       background: $uploader-preview-progress-background;
       border-radius: $uploader-image-border-radius;
+      z-index: 10;
 
       i {
         margin-bottom: $uploader-image-icon-margin-bottom;