@nutui/nutui-react-taro 2.0.0-alpha.7 → 2.0.0-alpha.8

package/dist/nutui.react.umd.js

@@ -8,7 +8,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 /*!
-* @nutui/nutui-react-taro v2.0.0-alpha.7 Fri May 12 2023 15:36:41 GMT+0800 (China Standard Time)
+* @nutui/nutui-react-taro v2.0.0-alpha.8 Fri May 12 2023 19:09:01 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -6771,6 +6771,10 @@ var __publicField = (obj, key, value) => {
     );
     return children ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: classes, children: !disabled && children }) : null;
   };
+  function useForceUpdate$1() {
+    const [, updateState] = React.useState();
+    return React.useCallback(() => updateState({}), []);
+  }
   const defaultProps$17 = {
     ...ComponentDefaults,
     tabStyle: {},
@@ -6826,6 +6830,7 @@ var __publicField = (obj, key, value) => {
       return titles2;
     };
     const titles = React.useRef(getTitles());
+    const forceUpdate = useForceUpdate$1();
     React.useEffect(() => {
       titles.current = getTitles();
       let current = "";
@@ -6834,8 +6839,10 @@ var __publicField = (obj, key, value) => {
           current = value;
         }
       });
-      if (current !== "") {
+      if (current !== "" && current !== value) {
         setValue(current);
+      } else {
+        forceUpdate();
       }
     }, [children]);
     const classes = classNames(
@@ -8767,7 +8774,6 @@ var __publicField = (obj, key, value) => {
     popup: true,
     visible: false,
     options: [],
-    value: [],
     title: "",
     optionKey: { textKey: "text", valueKey: "value", childrenKey: "children" },
     format: {},
@@ -8782,8 +8788,7 @@ var __publicField = (obj, key, value) => {
     onChange: () => {
     },
     onPathChange: () => {
-    },
-    ...Popup.defaultProps
+    }
   };
   const InternalCascader = (props, ref) => {
     const {
@@ -8793,6 +8798,7 @@ var __publicField = (obj, key, value) => {
       visible,
       options,
       value,
+      defaultValue,
       title,
       optionKey: optionKey2,
       format: format2,
@@ -8808,6 +8814,15 @@ var __publicField = (obj, key, value) => {
     const [tabvalue, setTabvalue] = React.useState("c1");
     const [optionsData, setOptionsData] = React.useState([]);
     const isLazy = () => state.configs.lazy && Boolean(state.configs.onLoad);
+    const [innerValue, setInnerValue] = usePropsValue({
+      value,
+      defaultValue,
+      finalValue: defaultValue,
+      onChange: (val) => {
+        var _a;
+        (_a = props.onChange) == null ? void 0 : _a.call(props, val);
+      }
+    });
     const [state] = React.useState({
       optionsData: [],
       panes: [
@@ -8817,7 +8832,6 @@ var __publicField = (obj, key, value) => {
           paneKey: ""
         }
       ],
-      innerValue: value,
       tree: new Tree$1([], {}),
       tabsCursor: 0,
       // 选中的tab项
@@ -8837,12 +8851,12 @@ var __publicField = (obj, key, value) => {
     });
     React.useEffect(() => {
       initData();
-    }, [options]);
+    }, [options, format2]);
     React.useEffect(() => {
-      if (value !== state.innerValue) {
-        state.innerValue = value;
+      if (defaultValue && defaultValue !== innerValue) {
+        setInnerValue(defaultValue);
       }
-    }, [value]);
+    }, [defaultValue]);
     const initData = async () => {
       state.lazyLoadMap.clear();
       if (format2 && Object.keys(format2).length > 0) {
@@ -8877,24 +8891,24 @@ var __publicField = (obj, key, value) => {
       setOptionsData(state.panes);
     };
     const syncValue = async () => {
-      const currentValue2 = state.innerValue;
-      if (currentValue2 === void 0 || !state.tree.nodes.length) {
+      const currentValue = innerValue;
+      if (currentValue === void 0 || currentValue !== defaultValue || !state.tree.nodes.length) {
         return;
       }
-      if (currentValue2.length === 0) {
+      if (currentValue.length === 0) {
         state.tabsCursor = 0;
         return;
       }
-      let needToSync = currentValue2;
-      if (isLazy() && Array.isArray(currentValue2) && currentValue2.length) {
+      let needToSync = currentValue;
+      if (isLazy() && Array.isArray(currentValue) && currentValue.length) {
         needToSync = [];
         const parent = state.tree.nodes.find(
-          (node) => node.value === currentValue2[0]
+          (node) => node.value === currentValue[0]
         );
         if (parent) {
           needToSync = [parent.value];
           state.initLoading = true;
-          const last = await currentValue2.slice(1).reduce(async (p, value2) => {
+          const last = await currentValue.slice(1).reduce(async (p, value2) => {
             var _a;
             const parent2 = await p;
             await invokeLazyLoad(parent2);
@@ -8910,7 +8924,7 @@ var __publicField = (obj, key, value) => {
           state.initLoading = false;
         }
       }
-      if (needToSync.length && currentValue2 === value) {
+      if (needToSync.length && currentValue === defaultValue) {
         const pathNodes = state.tree.getPathNodesByValue(needToSync);
         pathNodes.forEach((node, index) => {
           state.tabsCursor = index;
@@ -8967,6 +8981,7 @@ var __publicField = (obj, key, value) => {
           const optionParams = pathNodes.map((item) => item.value);
           onChange(optionParams, pathNodes);
           onPathChange(optionParams, pathNodes);
+          setInnerValue(optionParams);
         }
         setOptionsData(state.panes);
         close();
@@ -9660,7 +9675,7 @@ var __publicField = (obj, key, value) => {
         (_a = props.onConfirm) == null ? void 0 : _a.call(props, setSelectedOptions(), val);
       }
     });
-    const [currentValue2, setCurrentValue] = React.useState([]);
+    const [currentValue, setCurrentValue] = React.useState([]);
     const [columnIndex, setColumnIndex] = React.useState(0);
     const pickerRef = React.useRef(null);
     const [refs, setRefs] = useRefs();
@@ -9850,7 +9865,7 @@ var __publicField = (obj, key, value) => {
       setPickingStatus(false);
     };
     const pickerChange = (data) => {
-      const prevDefaultValue = currentValue2;
+      const prevDefaultValue = currentValue;
       let changeIndex = 0;
       const list = data.detail.value;
       for (let i = 0, len = list.length; i < len; i++) {
@@ -9893,7 +9908,7 @@ var __publicField = (obj, key, value) => {
             components.PickerView,
             {
               ref: pickerRef,
-              value: currentValue2,
+              value: currentValue,
               immediateChange: true,
               onPickStart: pickerStart,
               onChange: pickerChange,
@@ -11740,289 +11755,103 @@ var __publicField = (obj, key, value) => {
   Radio.displayName = "NutRadio";
   Radio.RadioGroup = RadioGroup;
   const defaultProps$O = {
-    id: "",
-    style: {},
-    icon: null,
-    iconSize: "20",
-    msg: "",
-    bottom: "30px",
-    // center为false时生效，距离底部位置
-    duration: 2,
-    // 时长,duration为0则一直展示
-    center: true,
-    // toast是否居中展示
-    type: "text",
-    title: "",
-    customClass: "",
-    // 自定义样式名
-    size: "base",
-    // 设置字体大小，默认base,可选large\small\base
-    textAlignCenter: true,
-    // 文字是否居中显示,true为居中，false为left
-    bgColor: "rgba(0, 0, 0, .8)",
-    cover: false,
-    // 是否展示透明遮罩层
-    coverColor: "rgba(0, 0, 0, 0)",
-    // 遮罩颜色设定
-    closeOnClickOverlay: false,
-    // 是否点击遮罩可关闭
-    visible: false,
-    onClose: () => {
-    }
-    // 未实现
-  };
-  const Toast = (props) => {
-    const {
-      children,
-      id,
-      style,
-      icon,
-      iconSize,
-      msg,
-      bottom,
-      duration,
-      center,
-      type,
-      title,
-      customClass,
-      size,
-      textAlignCenter,
-      bgColor,
-      cover,
-      coverColor,
-      closeOnClickOverlay,
-      visible,
-      onClose,
-      ...rest
-    } = { ...defaultProps$O, ...props };
-    let timer;
-    const [openState, SetOpenState] = React.useState(false);
-    React.useEffect(() => {
-      if (visible) {
-        SetOpenState(true);
-        show();
-      } else {
-        hide();
-      }
-    }, [visible]);
-    const clearTimer = () => {
-      if (timer) {
-        clearTimeout(timer);
-        timer = null;
-      }
-    };
-    const hide = () => {
-      SetOpenState(false);
-      onClose();
-    };
-    const show = () => {
-      clearTimer();
-      if (duration) {
-        timer = window.setTimeout(() => {
-          hide();
-        }, duration * 1e3);
-      }
-    };
-    const clickCover = () => {
-      if (closeOnClickOverlay) {
-        hide();
-      }
-    };
-    const toastBem = cn("toast");
-    const hasIcon = () => {
-      if (type !== "text") {
-        return true;
-      }
-      return !!icon;
-    };
-    const iconName = () => {
-      if (icon) {
-        return icon;
-      }
-      return {
-        success: /* @__PURE__ */ jsxRuntimeExports.jsx(a$4, { color: "#ffffff", width: iconSize, height: iconSize }),
-        fail: /* @__PURE__ */ jsxRuntimeExports.jsx(a$l, { color: "#ffffff", width: iconSize, height: iconSize }),
-        warn: /* @__PURE__ */ jsxRuntimeExports.jsx(a$3, { color: "#ffffff", width: iconSize, height: iconSize }),
-        loading: /* @__PURE__ */ jsxRuntimeExports.jsx(r$f, { color: "#ffffff", width: iconSize, height: iconSize })
-      }[type];
-    };
-    const classes = classNames({
-      "nut-toast-center": center,
-      "nut-toast-has-icon": icon,
-      "nut-toast-cover": cover,
-      "nut-toast-loading": type === "loading",
-      [`${customClass}`]: true,
-      [`nut-toast-${size}`]: true
-    });
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: openState ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "div",
-      {
-        className: `${toastBem()} ${classes}`,
-        id,
-        style: {
-          bottom: center ? "auto" : `${bottom}`,
-          backgroundColor: cover ? coverColor : "",
-          ...style
-        },
-        onClick: () => {
-          clickCover();
-        },
-        children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
-          "div",
-          {
-            className: toastBem("inner"),
-            style: {
-              textAlign: textAlignCenter ? "center" : "left",
-              backgroundColor: bgColor
-            },
-            children: [
-              hasIcon() ? /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: toastBem("icon-wrapper"), children: iconName() }) : null,
-              title ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-toast-title", children: title }) : null,
-              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: toastBem("text"), children: msg })
-            ]
-          }
-        )
-      }
-    ) : null });
-  };
-  Toast.defaultProps = defaultProps$O;
-  Toast.displayName = "NutToast";
-  const defaultProps$N = {
+    ...ComponentDefaults,
     range: false,
-    hiddenRange: false,
-    hiddenTag: false,
     min: 0,
     max: 100,
     step: 1,
-    modelValue: 0,
     vertical: false,
     marks: {}
   };
-  let startValue;
-  let currentValue;
   const Range = (props) => {
-    const { locale } = useConfig$1();
     const {
       className,
       range,
       disabled,
-      activeColor,
-      inactiveColor,
-      buttonColor,
-      hiddenRange,
-      hiddenTag,
-      modelValue,
       button,
       vertical,
       marks,
-      dragStart,
-      dragEnd,
       onChange,
-      onDragStart,
-      onDragEnd,
-      minDesc,
-      maxDesc,
-      curValueDesc
-    } = { ...defaultProps$N, ...props };
-    let { min, max, step } = { ...defaultProps$N, ...props };
-    min = Number(min);
-    max = Number(max);
-    step = Number(step);
-    const [buttonIndex, SetButtonIndex] = React.useState(0);
-    const [initValue, SetInitValue] = React.useState();
-    const [dragStatus, SetDragStatus] = React.useState("start");
+      onStart,
+      onEnd,
+      minDescription,
+      maxDescription,
+      currentDescription,
+      min,
+      max,
+      step,
+      value,
+      defaultValue
+    } = { ...defaultProps$O, ...props };
+    const classPrefix2 = "nut-range";
+    const [buttonIndex, setButtonIndex] = React.useState(0);
+    const [dragStatus, setDragStatus] = React.useState("start");
     const touch = useTouch();
     const root2 = React.useRef(null);
-    const [marksList, SetMarksList] = React.useState([]);
-    const [show, SetShow] = React.useState(false);
-    const [toastMsg, SetToastMsg] = React.useState("");
-    const toastShow = (msg) => {
-      SetToastMsg(msg);
-      SetShow(true);
+    const [marksList, setMarksList] = React.useState([]);
+    const [startValue, setStartValue] = React.useState(0);
+    const handleChange = (value2) => {
+      onChange && onChange(value2);
     };
-    React.useEffect(() => {
-      if (typeof modelValue === "number") {
-        if (!range && (modelValue < min || modelValue > max)) {
-          SetInitValue(0);
-          toastShow(`${modelValue} ${locale.range.rangeText}`);
-          return;
-        }
-        SetInitValue(modelValue);
-      }
-    }, [modelValue]);
+    const [current, setCurrent] = usePropsValue({
+      value,
+      defaultValue,
+      finalValue: 0,
+      onChange: handleChange
+    });
+    const [exactValue, setEaxctValue] = React.useState(
+      () => value || defaultValue || 0
+    );
     React.useEffect(() => {
       if (marks) {
         const marksKeys = Object.keys(marks);
         const list = marksKeys.map(parseFloat).sort((a2, b2) => a2 - b2).filter((point) => point >= min && point <= max);
-        SetMarksList(list);
+        setMarksList(list);
       }
     }, [marks]);
     const scope = () => {
-      return Number(max) - Number(min);
+      return max - min;
     };
-    const classes = React.useCallback(() => {
-      const prefixCls2 = "nut-range";
-      return [
-        prefixCls2,
-        `${disabled ? `${prefixCls2}-disabled` : ""}`,
-        `${vertical ? `${prefixCls2}-vertical` : ""}`,
-        `${!hiddenRange ? `${prefixCls2}-show-number` : ""}`
-      ].filter(Boolean).join(" ");
-    }, [disabled, vertical, hiddenRange]);
-    const containerClasses = React.useCallback(() => {
-      const prefixCls2 = "nut-range-container";
-      return [prefixCls2, `${vertical ? `${prefixCls2}-vertical` : ""}`, className].filter(Boolean).join(" ");
-    }, [vertical, className]);
+    const classes = classNames(classPrefix2, {
+      [`${classPrefix2}-disabled`]: disabled,
+      [`${classPrefix2}-vertical`]: vertical
+    });
+    const containerClasses = classNames(`${classPrefix2}-container`, className, {
+      [`${classPrefix2}-container-vertical`]: vertical
+    });
     const markClassName = React.useCallback(
       (mark) => {
-        const classPrefix2 = "nut-range-mark";
-        let lowerBound = Number(min);
-        let upperBound = Number(max);
-        if (range) {
-          const [left, right] = modelValue;
-          lowerBound = left;
-          upperBound = right;
+        const classPrefix22 = "nut-range-mark";
+        let lowerBound = min;
+        let upperBound = max;
+        if (range && Array.isArray(current)) {
+          lowerBound = current[0];
+          upperBound = current[1];
         } else {
-          upperBound = modelValue;
+          upperBound = current;
         }
         const isActive = mark <= upperBound && mark >= lowerBound;
         return [
-          `${classPrefix2}-text`,
-          `${isActive ? `${classPrefix2}-text-active` : ""}`
-        ].filter(Boolean).join(" ");
+          `${classPrefix22}-text`,
+          `${isActive ? `${classPrefix22}-text-active` : ""}`
+        ].join(" ");
       },
-      [range, modelValue, min, max]
+      [range, current, min, max]
     );
-    const [rangeName, setRangeName] = React.useState(classes());
-    const [containerName, setContainerName] = React.useState(containerClasses());
-    React.useEffect(() => {
-      setRangeName(classes());
-      setContainerName(containerClasses());
-    }, [classes, containerClasses]);
-    const wrapperStyle = () => {
-      return {
-        background: inactiveColor
-      };
-    };
-    const buttonStyle = () => {
-      return {
-        borderColor: buttonColor
-      };
-    };
     const isRange = (val) => {
       return !!range && Array.isArray(val);
     };
     const calcMainAxis = () => {
-      const modelVal = initValue || initValue === 0 ? initValue : modelValue;
+      const modelVal = current;
       if (isRange(modelVal)) {
         return `${(modelVal[1] - modelVal[0]) * 100 / scope()}%`;
       }
-      return `${(modelVal - Number(min)) * 100 / scope()}%`;
+      return `${(modelVal - min) * 100 / scope()}%`;
     };
     const calcOffset = () => {
-      const modelVal = initValue || initValue === 0 ? initValue : modelValue;
+      const modelVal = current;
       if (isRange(modelVal)) {
-        return `${(modelVal[0] - Number(min)) * 100 / scope()}%`;
+        return `${(modelVal[0] - min) * 100 / scope()}%`;
       }
       return `0%`;
     };
@@ -12031,74 +11860,61 @@ var __publicField = (obj, key, value) => {
         return {
           height: calcMainAxis(),
           top: calcOffset(),
-          background: activeColor,
           transition: dragStatus ? "none" : void 0
         };
       }
       return {
         width: calcMainAxis(),
         left: calcOffset(),
-        background: activeColor,
         transition: dragStatus ? "none" : void 0
       };
     };
     const marksStyle = (mark) => {
       let style = {
-        left: `${(mark - Number(min)) / scope() * 100}%`
+        left: `${(mark - min) / scope() * 100}%`
       };
       if (vertical) {
         style = {
-          top: `${(mark - Number(min)) / scope() * 100}%`
+          top: `${(mark - min) / scope() * 100}%`
         };
       }
       return style;
     };
-    const tickStyle = (mark) => {
-      let lowerBound = Number(min);
-      let upperBound = Number(max);
-      if (range) {
-        const [left, right] = modelValue;
-        lowerBound = left;
-        upperBound = right;
+    const tickClass = (mark) => {
+      if (range && Array.isArray(current)) {
+        return mark <= current[1] && mark >= current[0];
       }
-      const isActive = mark <= upperBound && mark >= lowerBound;
-      const style = {
-        background: !isActive ? inactiveColor : activeColor
-      };
-      return style;
+      return mark <= current;
     };
-    const format = (value) => {
-      value = Math.max(+min, Math.min(value, +max));
-      return Math.round(value / +step) * +step;
+    const format = (value2) => {
+      value2 = Math.max(+min, Math.min(value2, +max));
+      return Math.round(value2 / +step) * +step;
     };
     const isSameValue = (newValue, oldValue) => {
       return JSON.stringify(newValue) === JSON.stringify(oldValue);
     };
-    const handleOverlap = (value) => {
-      if (value[0] > value[1]) {
-        return value.slice(0).reverse();
+    const handleOverlap = (value2) => {
+      if (value2[0] > value2[1]) {
+        return value2.slice(0).reverse();
       }
-      return value;
+      return value2;
     };
-    const updateValue = (value, end) => {
-      if (isRange(value)) {
-        value = handleOverlap(value).map(format);
+    const updateValue = (value2, end) => {
+      if (isRange(value2)) {
+        value2 = handleOverlap(value2).map(format);
       } else {
-        value = format(value);
-      }
-      const modelVal = initValue || initValue === 0 ? initValue : modelValue;
-      if (!isSameValue(value, modelVal)) {
-        SetInitValue(value);
+        value2 = format(value2);
       }
-      if ((marks || end) && !isSameValue(value, startValue)) {
-        onChange && onChange(value);
+      if (!isSameValue(value2, current)) {
+        setCurrent(value2);
       }
+      end && onEnd && onEnd(value2);
     };
     const click = async (event) => {
       if (disabled || !root2.current) {
         return;
       }
-      SetDragStatus("");
+      setDragStatus("");
       const rect = await getRectByTaro(root2.current);
       let delta = (event.detail.x ? event.detail.x : event.clientX) - rect.left;
       let total = rect.width;
@@ -12106,18 +11922,18 @@ var __publicField = (obj, key, value) => {
         delta = (event.detail.y ? event.detail.y : event.clientY) - rect.top;
         total = rect.height;
       }
-      const value = Number(min) + delta / total * scope();
-      currentValue = initValue || initValue === 0 ? initValue : modelValue;
-      if (isRange(currentValue)) {
-        const [left, right] = currentValue;
+      const value2 = min + delta / total * scope();
+      setEaxctValue(current);
+      if (isRange(current)) {
+        const [left, right] = current;
         const middle = (left + right) / 2;
-        if (value <= middle) {
-          updateValue([value, right], true);
+        if (value2 <= middle) {
+          updateValue([value2, right], true);
         } else {
-          updateValue([left, value], true);
+          updateValue([left, value2], true);
         }
       } else {
-        updateValue(value, true);
+        updateValue(value2, true);
       }
     };
     const onTouchStart = (event) => {
@@ -12125,24 +11941,23 @@ var __publicField = (obj, key, value) => {
         return;
       }
       touch.start(event);
-      currentValue = initValue || initValue === 0 ? initValue : modelValue;
-      if (isRange(currentValue)) {
-        startValue = currentValue.map(format);
+      setEaxctValue(current);
+      if (isRange(current)) {
+        setStartValue(current.map(format));
       } else {
-        startValue = format(currentValue);
+        setStartValue(format(current));
       }
-      SetDragStatus("start");
+      setDragStatus("start");
     };
     const onTouchMove = async (event) => {
       if (disabled || !root2.current) {
         return;
       }
       if (dragStatus === "start") {
-        dragStart && dragStart();
-        onDragStart && onDragStart();
+        onStart && onStart();
       }
       touch.move(event);
-      SetDragStatus("draging");
+      setDragStatus("draging");
       const rect = await getRectByTaro(root2.current);
       let delta = touch.deltaX;
       let total = rect.width;
@@ -12152,137 +11967,97 @@ var __publicField = (obj, key, value) => {
         total = rect.height;
         diff = delta / total * scope();
       }
+      let newValue;
       if (isRange(startValue)) {
-        currentValue[buttonIndex] = startValue[buttonIndex] + diff;
+        newValue = exactValue.slice();
+        newValue[buttonIndex] = startValue[buttonIndex] + diff;
       } else {
-        currentValue = startValue + diff;
+        newValue = startValue + diff;
       }
-      updateValue(currentValue);
+      setEaxctValue(newValue);
+      updateValue(newValue);
     };
     const onTouchEnd = (event) => {
       if (disabled) {
         return;
       }
       if (dragStatus === "draging") {
-        updateValue(currentValue, true);
-        dragEnd && dragEnd();
-        onDragEnd && onDragEnd();
+        updateValue(current, true);
       }
-      SetDragStatus("");
+      setDragStatus("");
     };
     const curValue = (idx) => {
-      const modelVal = initValue || initValue === 0 ? initValue : modelValue;
-      const value = typeof idx === "number" ? modelVal[idx] : modelVal;
-      return value;
+      const modelVal = current;
+      const value2 = typeof idx === "number" ? modelVal[idx] : modelVal;
+      return value2;
     };
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `${containerName}`, children: [
-      !hiddenRange ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min", children: minDesc || +min }) : null,
-      /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        "div",
-        {
-          ref: root2,
-          style: wrapperStyle(),
-          className: `${rangeName}`,
-          onClick: (e) => {
-            click(e);
-          },
-          children: [
-            marksList.length > 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-range-mark", children: marksList.map((marks2) => {
-              return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-                "span",
-                {
-                  className: markClassName(marks2),
-                  style: marksStyle(marks2),
-                  children: [
-                    marks2,
-                    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "nut-range-tick", style: tickStyle(marks2) })
-                  ]
-                },
-                marks2
-              );
-            }) }) : null,
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-range-bar", style: barStyle(), children: range ? [0, 1].map((item, index) => {
-              return /* @__PURE__ */ jsxRuntimeExports.jsx(
-                "div",
-                {
-                  role: "slider",
-                  className: `${index === 0 ? "nut-range-button-wrapper-left" : ""}
+    const renderButton = (index) => {
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: button || /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-range-button", children: currentDescription !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "number", children: currentDescription ? currentDescription(curValue(index)) : curValue(index) }) }) });
+    };
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: containerClasses, children: [
+      minDescription !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min", children: minDescription || min }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: root2, className: classes, onClick: (e) => click(e), children: [
+        marksList.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-range-mark", children: marksList.map((marks2) => {
+          return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "span",
+            {
+              className: markClassName(marks2),
+              style: marksStyle(marks2),
+              children: [
+                marks2,
+                /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  "span",
+                  {
+                    className: classNames("nut-range-tick", {
+                      active: tickClass(marks2)
+                    })
+                  }
+                )
+              ]
+            },
+            marks2
+          );
+        }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-range-bar", style: barStyle(), children: range ? [0, 1].map((item, index) => {
+          return /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "div",
+            {
+              className: `${index === 0 ? "nut-range-button-wrapper-left" : ""}
                   ${index === 1 ? "nut-range-button-wrapper-right" : ""}`,
-                  tabIndex: disabled ? -1 : 0,
-                  "aria-valuemin": +min,
-                  "aria-valuenow": curValue(index),
-                  "aria-valuemax": +max,
-                  "aria-orientation": vertical ? "vertical" : "horizontal",
-                  onTouchStart: (e) => {
-                    if (typeof index === "number") {
-                      SetButtonIndex(index);
-                    }
-                    onTouchStart(e);
-                  },
-                  onTouchMove: (e) => {
-                    onTouchMove(e);
-                  },
-                  onTouchEnd: (e) => {
-                    onTouchEnd();
-                  },
-                  onTouchCancel: (e) => {
-                    onTouchEnd();
-                  },
-                  onClick: (e) => {
-                    e.stopPropagation();
-                  },
-                  children: button || /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-range-button", style: buttonStyle(), children: !hiddenTag ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "number", children: curValueDesc || curValue(index) }) : null })
-                },
-                index
-              );
-            }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
-              "div",
-              {
-                role: "slider",
-                className: "nut-range-button-wrapper",
-                tabIndex: disabled ? -1 : 0,
-                "aria-valuemin": +min,
-                "aria-valuenow": curValue(),
-                "aria-valuemax": +max,
-                "aria-orientation": vertical ? "vertical" : "horizontal",
-                onTouchStart: (e) => {
-                  onTouchStart(e);
-                },
-                onTouchMove: (e) => {
-                  onTouchMove(e);
-                },
-                onTouchEnd: (e) => {
-                  onTouchEnd();
-                },
-                onTouchCancel: (e) => {
-                  onTouchEnd();
-                },
-                onClick: (e) => {
-                  e.stopPropagation();
-                },
-                children: button || /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-range-button", style: buttonStyle(), children: !hiddenTag ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "number", children: curValueDesc || curValue() }) : null })
-              }
-            ) })
-          ]
-        }
-      ),
-      !hiddenRange ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "max", children: maxDesc || +max }) : null,
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        Toast,
-        {
-          type: "text",
-          visible: show,
-          msg: toastMsg,
-          onClose: () => {
-            SetShow(false);
+              onTouchStart: (e) => {
+                if (typeof index === "number") {
+                  setButtonIndex(index);
+                }
+                onTouchStart(e);
+              },
+              onTouchMove: (e) => onTouchMove(e),
+              onTouchEnd: (e) => onTouchEnd(),
+              onTouchCancel: (e) => onTouchEnd(),
+              onClick: (e) => e.stopPropagation(),
+              children: renderButton(index)
+            },
+            index
+          );
+        }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+          components.View,
+          {
+            catchMove: true,
+            className: "nut-range-button-wrapper",
+            onTouchStart: (e) => onTouchStart(e),
+            onTouchMove: (e) => onTouchMove(e),
+            onTouchEnd: (e) => onTouchEnd(),
+            onTouchCancel: (e) => onTouchEnd(),
+            onClick: (e) => e.stopPropagation(),
+            children: renderButton()
           }
-        }
-      )
+        ) })
+      ] }),
+      maxDescription !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "max", children: maxDescription || max })
     ] });
   };
-  Range.defaultProps = defaultProps$N;
+  Range.defaultProps = defaultProps$O;
   Range.displayName = "NutRange";
-  const defaultProps$M = {
+  const defaultProps$N = {
     ...ComponentDefaults,
     count: 5,
     min: 0,
@@ -12307,7 +12082,7 @@ var __publicField = (obj, key, value) => {
       allowHalf,
       onChange
     } = {
-      ...defaultProps$M,
+      ...defaultProps$N,
       ...props
     };
     const classPrefix2 = "nut-rate";
@@ -12392,9 +12167,9 @@ var __publicField = (obj, key, value) => {
       }
     );
   };
-  Rate.defaultProps = defaultProps$M;
+  Rate.defaultProps = defaultProps$N;
   Rate.displayName = "NutRate";
-  const defaultProps$L = {
+  const defaultProps$M = {
     ...ComponentDefaults,
     placeholder: "",
     shape: "square",
@@ -12442,7 +12217,7 @@ var __publicField = (obj, key, value) => {
       onClickRightinIcon,
       onClickRightoutIcon
     } = {
-      ...defaultProps$L,
+      ...defaultProps$M,
       ...props
     };
     const alignClass = `${align}`;
@@ -12628,9 +12403,9 @@ var __publicField = (obj, key, value) => {
       }
     );
   };
-  SearchBar.defaultProps = defaultProps$L;
+  SearchBar.defaultProps = defaultProps$M;
   SearchBar.displayName = "NutSearchBar";
-  const defaultProps$K = {
+  const defaultProps$L = {
     ...ComponentDefaults,
     title: "",
     description: "",
@@ -12793,9 +12568,9 @@ var __publicField = (obj, key, value) => {
       }
     ) });
   };
-  ShortPassword.defaultProps = defaultProps$K;
+  ShortPassword.defaultProps = defaultProps$L;
   ShortPassword.displayName = "NutShortPassword";
-  const defaultProps$J = {
+  const defaultProps$K = {
     canvasId: "spcanvas",
     type: "png",
     lineWidth: 2,
@@ -12817,7 +12592,7 @@ var __publicField = (obj, key, value) => {
       onClear,
       ...rest
     } = {
-      ...defaultProps$J,
+      ...defaultProps$K,
       ...props
     };
     const b2 = cn("signature");
@@ -12981,9 +12756,9 @@ var __publicField = (obj, key, value) => {
       )
     ] });
   };
-  Signature.defaultProps = defaultProps$J;
+  Signature.defaultProps = defaultProps$K;
   Signature.displayName = "NutSignature";
-  const defaultProps$I = {
+  const defaultProps$J = {
     ...ComponentDefaults,
     disabled: false,
     activeText: "",
@@ -13000,7 +12775,7 @@ var __publicField = (obj, key, value) => {
       style,
       onChange
     } = {
-      ...defaultProps$I,
+      ...defaultProps$J,
       ...props
     };
     const classPrefix2 = "nut-switch";
@@ -13022,9 +12797,9 @@ var __publicField = (obj, key, value) => {
       activeText && /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: value ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__label open`, children: activeText }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__label close`, children: inactiveText }) })
     ] }) });
   };
-  Switch.defaultProps = defaultProps$I;
+  Switch.defaultProps = defaultProps$J;
   Switch.displayName = "NutSwitch";
-  const defaultProps$H = {
+  const defaultProps$I = {
     ...ComponentDefaults,
     defaultValue: "",
     showCount: false,
@@ -13052,7 +12827,7 @@ var __publicField = (obj, key, value) => {
       onBlur,
       onFocus,
       ...rest
-    } = { ...defaultProps$H, ...props };
+    } = { ...defaultProps$I, ...props };
     const classPrefix2 = "nut-textarea";
     const compositionRef = React.useRef(false);
     const format = (value2) => {
@@ -13134,9 +12909,9 @@ var __publicField = (obj, key, value) => {
       }
     );
   };
-  TextArea.defaultProps = defaultProps$H;
+  TextArea.defaultProps = defaultProps$I;
   TextArea.displayName = "NutTextArea";
-  const defaultProps$G = {
+  const defaultProps$H = {
     ...ComponentDefaults,
     percent: 0,
     showText: false,
@@ -13155,7 +12930,7 @@ var __publicField = (obj, key, value) => {
       children,
       ...rest
     } = {
-      ...defaultProps$G,
+      ...defaultProps$H,
       ...props
     };
     const classPrefix2 = "nut-progress";
@@ -13192,7 +12967,7 @@ var __publicField = (obj, key, value) => {
       }
     ) }) }) });
   };
-  Progress.defaultProps = defaultProps$G;
+  Progress.defaultProps = defaultProps$H;
   Progress.displayName = "NutProgress";
   class UploadOptions {
     constructor() {
@@ -13337,7 +13112,7 @@ var __publicField = (obj, key, value) => {
       done();
     }
   };
-  const defaultProps$F = {
+  const defaultProps$G = {
     ...ComponentDefaults,
     url: "",
     maxCount: 1,
@@ -13425,7 +13200,7 @@ var __publicField = (obj, key, value) => {
       beforeXhrUpload,
       beforeDelete,
       ...restProps
-    } = { ...defaultProps$F, ...props };
+    } = { ...defaultProps$G, ...props };
     const [fileList, setFileList] = React.useState(defaultValue || []);
     const [uploadQueue, setUploadQueue] = React.useState([]);
     React.useEffect(() => {
@@ -13788,9 +13563,9 @@ var __publicField = (obj, key, value) => {
     ] });
   };
   const Uploader = React.forwardRef(InternalUploader);
-  Uploader.defaultProps = defaultProps$F;
+  Uploader.defaultProps = defaultProps$G;
   Uploader.displayName = "NutUploader";
-  const defaultProps$E = {
+  const defaultProps$F = {
     cancelText: "",
     optionTag: "name",
     optionSubTag: "subname",
@@ -13824,7 +13599,7 @@ var __publicField = (obj, key, value) => {
       className,
       style,
       ...rest
-    } = { ...defaultProps$E, ...props };
+    } = { ...defaultProps$F, ...props };
     const b2 = cn("actionsheet");
     const isHighlight = (item) => {
       return props.chooseTagValue && props.chooseTagValue === item[props.optionTag || "name"] ? props.color : "#1a1a1a";
@@ -13869,7 +13644,7 @@ var __publicField = (obj, key, value) => {
       }
     );
   };
-  ActionSheet.defaultProps = defaultProps$E;
+  ActionSheet.defaultProps = defaultProps$F;
   ActionSheet.displayName = "NutActionSheet";
   const Content = (props) => {
     const { visible, title, footer, footerDirection, onClick, children } = props;
@@ -13964,7 +13739,7 @@ var __publicField = (obj, key, value) => {
   };
   DialogWrap.defaultProps = defaultDialogProps;
   DialogWrap.displayName = "NutDialogWrap";
-  const defaultProps$D = {
+  const defaultProps$E = {
     confirmText: "",
     cancelText: "",
     overlay: true,
@@ -14062,9 +13837,9 @@ var __publicField = (obj, key, value) => {
       );
     }
   );
-  BaseDialog.defaultProps = defaultProps$D;
+  BaseDialog.defaultProps = defaultProps$E;
   BaseDialog.displayName = "NutDialog";
-  const defaultProps$C = {
+  const defaultProps$D = {
     ...ComponentDefaults,
     attract: false,
     direction: void 0,
@@ -14078,7 +13853,7 @@ var __publicField = (obj, key, value) => {
   };
   const Drag = (props) => {
     const { attract, direction, boundary, children, className, style, ...reset } = {
-      ...defaultProps$C,
+      ...defaultProps$D,
       ...props
     };
     const classPrefix2 = "nut-drag";
@@ -14175,14 +13950,14 @@ var __publicField = (obj, key, value) => {
       }
     );
   };
-  Drag.defaultProps = defaultProps$C;
+  Drag.defaultProps = defaultProps$D;
   Drag.displayName = "NutDrag";
   const defaultStatus = {
     empty: "https://static-ftcms.jd.com/p/files/61a9e3183985005b3958672b.png",
     error: "https://ftcms.jd.com/p/files/61a9e33ee7dcdbcc0ce62736.png",
     network: "https://static-ftcms.jd.com/p/files/61a9e31de7dcdbcc0ce62734.png"
   };
-  const defaultProps$B = {
+  const defaultProps$C = {
     ...ComponentDefaults,
     description: "",
     imageSize: "",
@@ -14191,7 +13966,7 @@ var __publicField = (obj, key, value) => {
   const classPrefix$6 = `nut-empty`;
   const Empty = (props) => {
     const { locale } = useConfig$1();
-    defaultProps$B.description = locale.noData || defaultProps$B.description;
+    defaultProps$C.description = locale.noData || defaultProps$C.description;
     const {
       image,
       imageSize,
@@ -14201,7 +13976,7 @@ var __publicField = (obj, key, value) => {
       status,
       ...rest
     } = {
-      ...defaultProps$B,
+      ...defaultProps$C,
       ...props
     };
     const [imgStyle, setImgStyle] = React.useState({});
@@ -14230,9 +14005,9 @@ var __publicField = (obj, key, value) => {
       children
     ] }) });
   };
-  Empty.defaultProps = defaultProps$B;
+  Empty.defaultProps = defaultProps$C;
   Empty.displayName = "NutEmpty";
-  const defaultProps$A = {
+  const defaultProps$B = {
     ...ComponentDefaults,
     hasMore: true,
     upperThreshold: 40,
@@ -14262,7 +14037,7 @@ var __publicField = (obj, key, value) => {
       onLoadMore,
       onScrollChange
     } = {
-      ...defaultProps$A,
+      ...defaultProps$B,
       ...props
     };
     const [isInfiniting, setIsInfiniting] = React.useState(false);
@@ -14385,9 +14160,9 @@ var __publicField = (obj, key, value) => {
       }
     );
   };
-  Infiniteloading.defaultProps = defaultProps$A;
+  Infiniteloading.defaultProps = defaultProps$B;
   Infiniteloading.displayName = "NutInfiniteloading";
-  const defaultProps$z = {
+  const defaultProps$A = {
     ...ComponentDefaults,
     // 滚动方向  across 横向 vertical 纵向
     direction: "across",
@@ -14432,7 +14207,7 @@ var __publicField = (obj, key, value) => {
       onClick,
       onClickItem
     } = {
-      ...defaultProps$z,
+      ...defaultProps$A,
       ...props
     };
     const wrap = React.useRef(null);
@@ -14838,9 +14613,9 @@ var __publicField = (obj, key, value) => {
       ) : null
     ] });
   };
-  NoticeBar.defaultProps = defaultProps$z;
+  NoticeBar.defaultProps = defaultProps$A;
   NoticeBar.displayName = "NutNoticeBar";
-  const defaultProps$y = {
+  const defaultProps$z = {
     id: "",
     msg: "",
     color: "",
@@ -14874,7 +14649,7 @@ var __publicField = (obj, key, value) => {
       onClosed,
       onClick,
       ...rest
-    } = { ...defaultProps$y, ...props };
+    } = { ...defaultProps$z, ...props };
     let timer;
     const [showNotify, SetShow] = React.useState(false);
     React.useEffect(() => {
@@ -14942,7 +14717,7 @@ var __publicField = (obj, key, value) => {
       }
     ) });
   };
-  Notify.defaultProps = defaultProps$y;
+  Notify.defaultProps = defaultProps$z;
   Notify.displayName = "NutNotify";
   function fillRef(ref, node) {
     if (typeof ref === "function") {
@@ -14986,7 +14761,7 @@ var __publicField = (obj, key, value) => {
       return trigger;
     }
   }
-  const defaultProps$x = {
+  const defaultProps$y = {
     ...ComponentDefaults,
     list: [],
     theme: "light",
@@ -15013,7 +14788,7 @@ var __publicField = (obj, key, value) => {
       onChoose,
       ...reset
     } = {
-      ...defaultProps$x,
+      ...defaultProps$y,
       ...props
     };
     const goodItem = React.useRef(null);
@@ -15116,7 +14891,7 @@ var __publicField = (obj, key, value) => {
       ) : null
     ] });
   };
-  Popover.defaultProps = defaultProps$x;
+  Popover.defaultProps = defaultProps$y;
   Popover.displayName = "NutPopover";
   function clamp$1(v, min, max) {
     return Math.max(min, Math.min(v, max));
@@ -19708,7 +19483,7 @@ This message will only show in development mode. It won't appear in production.
     return position;
   }
   const sleep = (time) => new Promise((resolve) => setTimeout(resolve, time));
-  const defaultProps$w = {
+  const defaultProps$x = {
     pullingText: "",
     canReleaseText: "",
     refreshingText: "",
@@ -19723,7 +19498,7 @@ This message will only show in development mode. It won't appear in production.
   const PullToRefresh = (p) => {
     const { locale } = useConfig$1();
     const props = {
-      ...defaultProps$w,
+      ...defaultProps$x,
       ...p,
       ...{
         pullingText: p.pullingText || locale.pullToRefresh.pullingText,
@@ -19860,10 +19635,10 @@ This message will only show in development mode. It won't appear in production.
       /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-pulltorefresh-content", children: props.children })
     ] });
   };
-  PullToRefresh.defaultProps = defaultProps$w;
+  PullToRefresh.defaultProps = defaultProps$x;
   PullToRefresh.displayName = "NutPullToRefresh";
   const AvatarContext = React.createContext({});
-  const defaultProps$v = {
+  const defaultProps$w = {
     ...ComponentDefaults,
     size: "",
     shape: "round",
@@ -19893,7 +19668,7 @@ This message will only show in development mode. It won't appear in production.
       onError,
       ...rest
     } = {
-      ...defaultProps$v,
+      ...defaultProps$w,
       ...props
     };
     const [maxSum, setMaxSum] = React.useState(0);
@@ -19982,9 +19757,9 @@ This message will only show in development mode. It won't appear in production.
       }
     ) });
   };
-  Avatar.defaultProps = defaultProps$v;
+  Avatar.defaultProps = defaultProps$w;
   Avatar.displayName = "NutAvatar";
-  const defaultProps$u = {
+  const defaultProps$v = {
     width: "100px",
     height: "100px",
     row: 1,
@@ -20012,7 +19787,7 @@ This message will only show in development mode. It won't appear in production.
       avatarShape,
       ...restProps
     } = {
-      ...defaultProps$u,
+      ...defaultProps$v,
       ...props
     };
     const b2 = cn("skeleton");
@@ -20069,7 +19844,7 @@ This message will only show in development mode. It won't appear in production.
       ] })
     ] }) });
   };
-  Skeleton.defaultProps = defaultProps$u;
+  Skeleton.defaultProps = defaultProps$v;
   Skeleton.displayName = "NutSkeleton";
   function preventDefault(event, isStopPropagation) {
     if (typeof event.cancelable !== "boolean" || event.cancelable) {
@@ -20079,7 +19854,7 @@ This message will only show in development mode. It won't appear in production.
       event.stopPropagation();
     }
   }
-  const defaultProps$t = {
+  const defaultProps$u = {
     name: ""
   };
   const Swipe = React.forwardRef((props, instanceRef) => {
@@ -20098,7 +19873,7 @@ This message will only show in development mode. It won't appear in production.
       };
       Taro.nextTick(() => getWidth());
     });
-    const { children, className, style } = { ...defaultProps$t, ...props };
+    const { children, className, style } = { ...defaultProps$u, ...props };
     const root2 = React.useRef();
     const opened = React.useRef(false);
     const lockClick = React.useRef(false);
@@ -20258,8 +20033,156 @@ This message will only show in development mode. It won't appear in production.
       }
     );
   });
-  Swipe.defaultProps = defaultProps$t;
+  Swipe.defaultProps = defaultProps$u;
   Swipe.displayName = "NutSwipe";
+  const defaultProps$t = {
+    id: "",
+    style: {},
+    icon: null,
+    iconSize: "20",
+    msg: "",
+    bottom: "30px",
+    // center为false时生效，距离底部位置
+    duration: 2,
+    // 时长,duration为0则一直展示
+    center: true,
+    // toast是否居中展示
+    type: "text",
+    title: "",
+    customClass: "",
+    // 自定义样式名
+    size: "base",
+    // 设置字体大小，默认base,可选large\small\base
+    textAlignCenter: true,
+    // 文字是否居中显示,true为居中，false为left
+    bgColor: "rgba(0, 0, 0, .8)",
+    cover: false,
+    // 是否展示透明遮罩层
+    coverColor: "rgba(0, 0, 0, 0)",
+    // 遮罩颜色设定
+    closeOnClickOverlay: false,
+    // 是否点击遮罩可关闭
+    visible: false,
+    onClose: () => {
+    }
+    // 未实现
+  };
+  const Toast = (props) => {
+    const {
+      children,
+      id,
+      style,
+      icon,
+      iconSize,
+      msg,
+      bottom,
+      duration,
+      center,
+      type,
+      title,
+      customClass,
+      size,
+      textAlignCenter,
+      bgColor,
+      cover,
+      coverColor,
+      closeOnClickOverlay,
+      visible,
+      onClose,
+      ...rest
+    } = { ...defaultProps$t, ...props };
+    let timer;
+    const [openState, SetOpenState] = React.useState(false);
+    React.useEffect(() => {
+      if (visible) {
+        SetOpenState(true);
+        show();
+      } else {
+        hide();
+      }
+    }, [visible]);
+    const clearTimer = () => {
+      if (timer) {
+        clearTimeout(timer);
+        timer = null;
+      }
+    };
+    const hide = () => {
+      SetOpenState(false);
+      onClose();
+    };
+    const show = () => {
+      clearTimer();
+      if (duration) {
+        timer = window.setTimeout(() => {
+          hide();
+        }, duration * 1e3);
+      }
+    };
+    const clickCover = () => {
+      if (closeOnClickOverlay) {
+        hide();
+      }
+    };
+    const toastBem = cn("toast");
+    const hasIcon = () => {
+      if (type !== "text") {
+        return true;
+      }
+      return !!icon;
+    };
+    const iconName = () => {
+      if (icon) {
+        return icon;
+      }
+      return {
+        success: /* @__PURE__ */ jsxRuntimeExports.jsx(a$4, { color: "#ffffff", width: iconSize, height: iconSize }),
+        fail: /* @__PURE__ */ jsxRuntimeExports.jsx(a$l, { color: "#ffffff", width: iconSize, height: iconSize }),
+        warn: /* @__PURE__ */ jsxRuntimeExports.jsx(a$3, { color: "#ffffff", width: iconSize, height: iconSize }),
+        loading: /* @__PURE__ */ jsxRuntimeExports.jsx(r$f, { color: "#ffffff", width: iconSize, height: iconSize })
+      }[type];
+    };
+    const classes = classNames({
+      "nut-toast-center": center,
+      "nut-toast-has-icon": icon,
+      "nut-toast-cover": cover,
+      "nut-toast-loading": type === "loading",
+      [`${customClass}`]: true,
+      [`nut-toast-${size}`]: true
+    });
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: openState ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "div",
+      {
+        className: `${toastBem()} ${classes}`,
+        id,
+        style: {
+          bottom: center ? "auto" : `${bottom}`,
+          backgroundColor: cover ? coverColor : "",
+          ...style
+        },
+        onClick: () => {
+          clickCover();
+        },
+        children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "div",
+          {
+            className: toastBem("inner"),
+            style: {
+              textAlign: textAlignCenter ? "center" : "left",
+              backgroundColor: bgColor
+            },
+            children: [
+              hasIcon() ? /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: toastBem("icon-wrapper"), children: iconName() }) : null,
+              title ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-toast-title", children: title }) : null,
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: toastBem("text"), children: msg })
+            ]
+          }
+        )
+      }
+    ) : null });
+  };
+  Toast.defaultProps = defaultProps$t;
+  Toast.displayName = "NutToast";
   const defaultProps$s = {
     ...ComponentDefaults,
     type: "shake",
@@ -20548,9 +20471,11 @@ This message will only show in development mode. It won't appear in production.
           /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: b("progress-bar-wrapper"), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
             Range,
             {
-              modelValue: percent,
-              hiddenTag: true,
-              hiddenRange: true,
+              value: percent,
+              onChange: (val) => setPercent(val),
+              currentDescription: null,
+              maxDescription: null,
+              minDescription: null,
               "inactive-color": "#cccccc",
               "active-color": "#fa2c19"
             }