@nutui/nutui-react 2.3.8-beta.0 → 2.3.9

package/dist/nutui.react.es.js

@@ -5,7 +5,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 /*!
-* @nutui/nutui-react v2.3.8-beta.0 Tue Jan 23 2024 11:20:59 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.3.9 Fri Feb 02 2024 16:13:40 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -2379,7 +2379,8 @@ const zhCN = {
 const classPrefix$p = "nut-configprovider";
 const defaultConfigRef = {
   current: {
-    locale: zhCN
+    locale: zhCN,
+    direction: "ltr"
   }
 };
 const getDefaultConfig = () => {
@@ -2397,7 +2398,7 @@ function convertThemeVarsToCSSVars(themeVars) {
   return cssVars;
 }
 const ConfigProvider = (props) => {
-  const { style, className, children, ...config2 } = props;
+  const { style, className, children, direction, ...config2 } = props;
   const mergedConfig = useMemo(
     () => {
       return {
@@ -2420,8 +2421,10 @@ const ConfigProvider = (props) => {
       className: classNames(classPrefix$p, className),
       style: {
         ...cssVarStyle,
-        ...style
-      }
+        ...style,
+        direction
+      },
+      dir: direction
     },
     children
   ));
@@ -10663,8 +10666,38 @@ const NavBar = (props) => {
       zIndex
     };
   };
+  const leftRef = useRef(null);
+  const rightRef = useRef(null);
+  const wrapperRef = useRef(null);
+  const [contentWidth, setContentWidth] = useState("50%");
+  const getNodeWidth = (node) => {
+    if (node) {
+      const ele = getRect(node);
+      return ele.width;
+    }
+    return 0;
+  };
+  useEffect(() => {
+    if (titleAlign === "left") {
+      return;
+    }
+    if (!(back || left || right)) {
+      setContentWidth("100%");
+      return;
+    }
+    const leftRectWidth = getNodeWidth(leftRef == null ? void 0 : leftRef.current);
+    const rightRectWidth = getNodeWidth(rightRef == null ? void 0 : rightRef.current);
+    const wrapperWidth = getNodeWidth(wrapperRef == null ? void 0 : wrapperRef.current);
+    let centerWidth = wrapperWidth / 2;
+    if (leftRectWidth && rightRectWidth) {
+      centerWidth = wrapperWidth - (leftRectWidth > rightRectWidth ? leftRectWidth * 2 : rightRectWidth * 2);
+    } else {
+      centerWidth = wrapperWidth - leftRectWidth * 2 - rightRectWidth * 2;
+    }
+    setContentWidth(centerWidth.toFixed(2));
+  }, [left, right, back]);
   const renderLeft = () => {
-    return back || left ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-left` }, back && /* @__PURE__ */ React__default.createElement(
+    return back || left ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-left`, ref: leftRef }, back && /* @__PURE__ */ React__default.createElement(
       "div",
       {
         className: `${classPrefix2}-left-back`,
@@ -10674,13 +10707,21 @@ const NavBar = (props) => {
     ), left) : null;
   };
   const renderContent = () => {
-    return /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-title` }, children);
+    let titleStyle = {};
+    if (titleAlign === "center") {
+      const contentRealWidth = `${contentWidth}${/%$/i.test(contentWidth) ? "" : "px"}`;
+      titleStyle = {
+        minWidth: contentRealWidth,
+        width: contentRealWidth
+      };
+    }
+    return /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-title`, style: titleStyle }, children);
   };
   const renderRight = () => {
-    return /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-right` }, right);
+    return /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-right`, ref: rightRef }, right);
   };
   const renderWrapper = () => {
-    return /* @__PURE__ */ React__default.createElement("div", { className: cls, style: styles() }, renderLeft(), renderContent(), renderRight());
+    return /* @__PURE__ */ React__default.createElement("div", { className: cls, style: styles(), ref: wrapperRef }, renderLeft(), renderContent(), renderRight());
   };
   const classes = classNames({
     [`${classPrefix2}-fixed`]: fixed,
@@ -10843,7 +10884,8 @@ const Popup = (props) => {
       {
         nodeRef,
         classNames: transitionName,
-        unmountOnExit: true,
+        mountOnEnter: true,
+        unmountOnExit: destroyOnClose,
         timeout: duration,
         in: innerVisible,
         onEntered: onHandleOpened,
@@ -17198,6 +17240,7 @@ const RadioGroup = React__default.forwardRef(
       value,
       defaultValue,
       onChange,
+      shape,
       labelPosition,
       direction,
       options: options2,
@@ -17233,6 +17276,7 @@ const RadioGroup = React__default.forwardRef(
         value: {
           labelPosition: labelPosition || "right",
           disabled,
+          shape,
           value: val2State,
           check: (value2) => {
             setVal2State(value2);
@@ -17360,11 +17404,11 @@ const Radio = (props) => {
       className: classNames(color())
     }) : /* @__PURE__ */ React__default.createElement(o$7, { className: classNames(color()) });
   };
+  const renderByShape = (shape2) => {
+    return shape2 === "button" ? renderButton() : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, renderIcon(), renderLabel());
+  };
   const renderRadioItem = () => {
-    if (shape === "button") {
-      return renderButton();
-    }
-    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, renderIcon(), renderLabel());
+    return renderByShape(context && context.shape ? context.shape : shape);
   };
   const handleClick2 = (e2) => {
     if (disabled || checkedStatement)
@@ -17706,7 +17750,8 @@ const defaultProps$N = {
   uncheckedIcon: null,
   disabled: false,
   readOnly: false,
-  allowHalf: false
+  allowHalf: false,
+  touchable: false
 };
 const Rate = (props) => {
   const {
@@ -17721,13 +17766,17 @@ const Rate = (props) => {
     disabled,
     readOnly,
     allowHalf,
-    onChange
+    touchable,
+    onChange,
+    onTouchEnd
   } = {
     ...defaultProps$N,
     ...props
   };
   const classPrefix2 = "nut-rate";
   const [countArray, setCountArray] = useState([1, 2, 3, 4, 5]);
+  const [refs, setRefs] = useRefs();
+  const rateRects = useRef([]);
   const [score, setScore] = usePropsValue({
     value,
     defaultValue: Math.max(defaultValue || 0, min),
@@ -17764,6 +17813,81 @@ const Rate = (props) => {
     const value2 = Math.max(min, n - 0.5);
     setScore(value2);
   };
+  const getScoreByPosition = (x) => {
+    var _a2;
+    if ((_a2 = rateRects.current) == null ? void 0 : _a2.length) {
+      for (let index = rateRects.current.length - 1; index >= 0; index--) {
+        const item = rateRects.current[index];
+        if (item && x > item.left) {
+          return allowHalf ? index + (x > item.left + item.width / 2 ? 1 : 0.5) : index + 1;
+        }
+      }
+      return 0;
+    }
+  };
+  const updateRects = () => {
+    for (let index = 0; index < refs.length; index++) {
+      const item = refs[index];
+      if (item) {
+        rateRects.current[index] = getRect(item);
+      }
+    }
+  };
+  const handleTouchStart = (e2) => {
+    if (!touchable || readOnly || disabled) {
+      return;
+    }
+    if (e2.cancelable) {
+      e2.preventDefault();
+    }
+    e2.stopPropagation();
+    updateRects();
+  };
+  const handleTouchMove = (e2) => {
+    if (!touchable || readOnly || disabled) {
+      return;
+    }
+    if (e2.cancelable) {
+      e2.preventDefault();
+    }
+    e2.stopPropagation();
+    const val = getScoreByPosition(e2.touches[0].clientX);
+    if (val !== void 0) {
+      setScore(Math.max(min, val));
+    }
+  };
+  const handleTouchEnd = (e2) => {
+    if (!touchable || readOnly || disabled) {
+      return;
+    }
+    if (e2.cancelable) {
+      e2.preventDefault();
+    }
+    e2.stopPropagation();
+    const val = getScoreByPosition(e2.changedTouches[0].clientX);
+    if (val !== void 0) {
+      setScore(Math.max(min, val));
+      onTouchEnd && onTouchEnd(e2, Math.max(min, val));
+    }
+  };
+  const rateRef = useRef(null);
+  useEffect(() => {
+    const element = rateRef.current;
+    if (element) {
+      element.addEventListener("touchstart", handleTouchStart, {
+        passive: false
+      });
+      element.addEventListener("touchmove", handleTouchMove, { passive: false });
+      element.addEventListener("touchend", handleTouchEnd, { passive: false });
+    }
+    return () => {
+      if (element) {
+        element.removeEventListener("touchstart", handleTouchStart);
+        element.removeEventListener("touchmove", handleTouchMove);
+        element.removeEventListener("touchend", handleTouchEnd);
+      }
+    };
+  }, []);
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
@@ -17775,14 +17899,16 @@ const Rate = (props) => {
         },
         className
       ),
+      ref: rateRef,
       style
     },
-    countArray.map((n) => {
+    countArray.map((n, index) => {
       return /* @__PURE__ */ React__default.createElement(
         "div",
         {
           className: `${classPrefix2}-item`,
           key: n,
+          ref: setRefs(index),
           onClick: (event) => onClick(event, n)
         },
         /* @__PURE__ */ React__default.createElement(
@@ -18265,7 +18391,7 @@ const TextArea = (props) => {
   const textareaRef = useRef(null);
   const compositionRef = useRef(false);
   const format2 = (value2) => {
-    if (maxLength !== void 0 && value2.length > maxLength) {
+    if (maxLength !== -1 && value2.length > maxLength) {
       return value2.substring(0, maxLength);
     }
     return value2;
@@ -19704,6 +19830,7 @@ const InfiniteLoading = (props) => {
     if (distance.current < refreshMaxH.current) {
       distance.current = 0;
       getRefreshTop().style.height = `${distance.current}px`;
+      isTouching.current = false;
     } else {
       await (onRefresh == null ? void 0 : onRefresh());
       refreshDone();
@@ -23502,7 +23629,7 @@ const Step = (props) => {
     }
     return `${classPrefix2}-icon`;
   };
-  return /* @__PURE__ */ React__default.createElement("div", { className: classes, ...restProps, onClick: handleClickStep }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-step-head" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-step-line" }), /* @__PURE__ */ React__default.createElement("div", { className: renderIconClass() }, icon || !dot && /* @__PURE__ */ React__default.createElement("span", { className: "nut-step-inner" }, value))), /* @__PURE__ */ React__default.createElement("div", { className: "nut-step-main" }, /* @__PURE__ */ React__default.createElement("span", { className: "nut-step-title" }, title), description && /* @__PURE__ */ React__default.createElement("span", { className: "nut-step-description" }, description)));
+  return /* @__PURE__ */ React__default.createElement("div", { className: classes, ...restProps, onClick: handleClickStep }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-step-head" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-step-line" }), /* @__PURE__ */ React__default.createElement("div", { className: renderIconClass() }, icon || !dot && /* @__PURE__ */ React__default.createElement("span", { className: "nut-step-inner" }, value))), (title || description) && /* @__PURE__ */ React__default.createElement("div", { className: "nut-step-main" }, /* @__PURE__ */ React__default.createElement("span", { className: "nut-step-title" }, title), description && /* @__PURE__ */ React__default.createElement("span", { className: "nut-step-description" }, description)));
 };
 Step.defaultProps = defaultProps$c;
 Step.displayName = "NutStep";
@@ -23535,14 +23662,7 @@ const Steps = (props) => {
     },
     className
   );
-  return /* @__PURE__ */ React__default.createElement(DataContext.Provider, { value: parentSteps }, React__default.createElement(
-    "div",
-    {
-      className: classes,
-      ...restProps
-    },
-    children
-  ));
+  return /* @__PURE__ */ React__default.createElement(DataContext.Provider, { value: parentSteps }, /* @__PURE__ */ React__default.createElement("div", { className: classes, ...restProps }, children));
 };
 Steps.defaultProps = defaultProps$b;
 Steps.displayName = "NutSteps";

package/dist/nutui.react.umd.js

@@ -8,7 +8,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 /*!
-* @nutui/nutui-react v2.3.8-beta.0 Tue Jan 23 2024 11:20:59 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.3.9 Fri Feb 02 2024 16:13:40 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -2397,7 +2397,8 @@ Check the top-level render call using <` + t2 + ">.");
   const classPrefix$p = "nut-configprovider";
   const defaultConfigRef = {
     current: {
-      locale: zhCN
+      locale: zhCN,
+      direction: "ltr"
     }
   };
   const getDefaultConfig = () => {
@@ -2415,7 +2416,7 @@ Check the top-level render call using <` + t2 + ">.");
     return cssVars;
   }
   const ConfigProvider = (props) => {
-    const { style, className, children, ...config2 } = props;
+    const { style, className, children, direction, ...config2 } = props;
     const mergedConfig = useMemo(
       () => {
         return {
@@ -2438,8 +2439,10 @@ Check the top-level render call using <` + t2 + ">.");
         className: classNames(classPrefix$p, className),
         style: {
           ...cssVarStyle,
-          ...style
-        }
+          ...style,
+          direction
+        },
+        dir: direction
       },
       children
     ));
@@ -10681,8 +10684,38 @@ Please add \`${key}Action\` when creating your handler.`);
         zIndex
       };
     };
+    const leftRef = React.useRef(null);
+    const rightRef = React.useRef(null);
+    const wrapperRef = React.useRef(null);
+    const [contentWidth, setContentWidth] = React.useState("50%");
+    const getNodeWidth = (node) => {
+      if (node) {
+        const ele = getRect(node);
+        return ele.width;
+      }
+      return 0;
+    };
+    React.useEffect(() => {
+      if (titleAlign === "left") {
+        return;
+      }
+      if (!(back || left || right)) {
+        setContentWidth("100%");
+        return;
+      }
+      const leftRectWidth = getNodeWidth(leftRef == null ? void 0 : leftRef.current);
+      const rightRectWidth = getNodeWidth(rightRef == null ? void 0 : rightRef.current);
+      const wrapperWidth = getNodeWidth(wrapperRef == null ? void 0 : wrapperRef.current);
+      let centerWidth = wrapperWidth / 2;
+      if (leftRectWidth && rightRectWidth) {
+        centerWidth = wrapperWidth - (leftRectWidth > rightRectWidth ? leftRectWidth * 2 : rightRectWidth * 2);
+      } else {
+        centerWidth = wrapperWidth - leftRectWidth * 2 - rightRectWidth * 2;
+      }
+      setContentWidth(centerWidth.toFixed(2));
+    }, [left, right, back]);
     const renderLeft = () => {
-      return back || left ? /* @__PURE__ */ React.createElement("div", { className: `${classPrefix2}-left` }, back && /* @__PURE__ */ React.createElement(
+      return back || left ? /* @__PURE__ */ React.createElement("div", { className: `${classPrefix2}-left`, ref: leftRef }, back && /* @__PURE__ */ React.createElement(
         "div",
         {
           className: `${classPrefix2}-left-back`,
@@ -10692,13 +10725,21 @@ Please add \`${key}Action\` when creating your handler.`);
       ), left) : null;
     };
     const renderContent = () => {
-      return /* @__PURE__ */ React.createElement("div", { className: `${classPrefix2}-title` }, children);
+      let titleStyle = {};
+      if (titleAlign === "center") {
+        const contentRealWidth = `${contentWidth}${/%$/i.test(contentWidth) ? "" : "px"}`;
+        titleStyle = {
+          minWidth: contentRealWidth,
+          width: contentRealWidth
+        };
+      }
+      return /* @__PURE__ */ React.createElement("div", { className: `${classPrefix2}-title`, style: titleStyle }, children);
     };
     const renderRight = () => {
-      return /* @__PURE__ */ React.createElement("div", { className: `${classPrefix2}-right` }, right);
+      return /* @__PURE__ */ React.createElement("div", { className: `${classPrefix2}-right`, ref: rightRef }, right);
     };
     const renderWrapper = () => {
-      return /* @__PURE__ */ React.createElement("div", { className: cls, style: styles() }, renderLeft(), renderContent(), renderRight());
+      return /* @__PURE__ */ React.createElement("div", { className: cls, style: styles(), ref: wrapperRef }, renderLeft(), renderContent(), renderRight());
     };
     const classes = classNames({
       [`${classPrefix2}-fixed`]: fixed,
@@ -10861,7 +10902,8 @@ Please add \`${key}Action\` when creating your handler.`);
         {
           nodeRef,
           classNames: transitionName,
-          unmountOnExit: true,
+          mountOnEnter: true,
+          unmountOnExit: destroyOnClose,
           timeout: duration,
           in: innerVisible,
           onEntered: onHandleOpened,
@@ -17216,6 +17258,7 @@ Please add \`${key}Action\` when creating your handler.`);
         value,
         defaultValue,
         onChange,
+        shape,
         labelPosition,
         direction,
         options: options2,
@@ -17251,6 +17294,7 @@ Please add \`${key}Action\` when creating your handler.`);
           value: {
             labelPosition: labelPosition || "right",
             disabled,
+            shape,
             value: val2State,
             check: (value2) => {
               setVal2State(value2);
@@ -17378,11 +17422,11 @@ Please add \`${key}Action\` when creating your handler.`);
         className: classNames(color())
       }) : /* @__PURE__ */ React.createElement(o$7, { className: classNames(color()) });
     };
+    const renderByShape = (shape2) => {
+      return shape2 === "button" ? renderButton() : /* @__PURE__ */ React.createElement(React.Fragment, null, renderIcon(), renderLabel());
+    };
     const renderRadioItem = () => {
-      if (shape === "button") {
-        return renderButton();
-      }
-      return /* @__PURE__ */ React.createElement(React.Fragment, null, renderIcon(), renderLabel());
+      return renderByShape(context && context.shape ? context.shape : shape);
     };
     const handleClick2 = (e2) => {
       if (disabled || checkedStatement)
@@ -17724,7 +17768,8 @@ Please add \`${key}Action\` when creating your handler.`);
     uncheckedIcon: null,
     disabled: false,
     readOnly: false,
-    allowHalf: false
+    allowHalf: false,
+    touchable: false
   };
   const Rate = (props) => {
     const {
@@ -17739,13 +17784,17 @@ Please add \`${key}Action\` when creating your handler.`);
       disabled,
       readOnly,
       allowHalf,
-      onChange
+      touchable,
+      onChange,
+      onTouchEnd
     } = {
       ...defaultProps$N,
       ...props
     };
     const classPrefix2 = "nut-rate";
     const [countArray, setCountArray] = React.useState([1, 2, 3, 4, 5]);
+    const [refs, setRefs] = useRefs();
+    const rateRects = React.useRef([]);
     const [score, setScore] = usePropsValue({
       value,
       defaultValue: Math.max(defaultValue || 0, min),
@@ -17782,6 +17831,81 @@ Please add \`${key}Action\` when creating your handler.`);
       const value2 = Math.max(min, n - 0.5);
       setScore(value2);
     };
+    const getScoreByPosition = (x) => {
+      var _a2;
+      if ((_a2 = rateRects.current) == null ? void 0 : _a2.length) {
+        for (let index = rateRects.current.length - 1; index >= 0; index--) {
+          const item = rateRects.current[index];
+          if (item && x > item.left) {
+            return allowHalf ? index + (x > item.left + item.width / 2 ? 1 : 0.5) : index + 1;
+          }
+        }
+        return 0;
+      }
+    };
+    const updateRects = () => {
+      for (let index = 0; index < refs.length; index++) {
+        const item = refs[index];
+        if (item) {
+          rateRects.current[index] = getRect(item);
+        }
+      }
+    };
+    const handleTouchStart = (e2) => {
+      if (!touchable || readOnly || disabled) {
+        return;
+      }
+      if (e2.cancelable) {
+        e2.preventDefault();
+      }
+      e2.stopPropagation();
+      updateRects();
+    };
+    const handleTouchMove = (e2) => {
+      if (!touchable || readOnly || disabled) {
+        return;
+      }
+      if (e2.cancelable) {
+        e2.preventDefault();
+      }
+      e2.stopPropagation();
+      const val = getScoreByPosition(e2.touches[0].clientX);
+      if (val !== void 0) {
+        setScore(Math.max(min, val));
+      }
+    };
+    const handleTouchEnd = (e2) => {
+      if (!touchable || readOnly || disabled) {
+        return;
+      }
+      if (e2.cancelable) {
+        e2.preventDefault();
+      }
+      e2.stopPropagation();
+      const val = getScoreByPosition(e2.changedTouches[0].clientX);
+      if (val !== void 0) {
+        setScore(Math.max(min, val));
+        onTouchEnd && onTouchEnd(e2, Math.max(min, val));
+      }
+    };
+    const rateRef = React.useRef(null);
+    React.useEffect(() => {
+      const element = rateRef.current;
+      if (element) {
+        element.addEventListener("touchstart", handleTouchStart, {
+          passive: false
+        });
+        element.addEventListener("touchmove", handleTouchMove, { passive: false });
+        element.addEventListener("touchend", handleTouchEnd, { passive: false });
+      }
+      return () => {
+        if (element) {
+          element.removeEventListener("touchstart", handleTouchStart);
+          element.removeEventListener("touchmove", handleTouchMove);
+          element.removeEventListener("touchend", handleTouchEnd);
+        }
+      };
+    }, []);
     return /* @__PURE__ */ React.createElement(
       "div",
       {
@@ -17793,14 +17917,16 @@ Please add \`${key}Action\` when creating your handler.`);
           },
           className
         ),
+        ref: rateRef,
         style
       },
-      countArray.map((n) => {
+      countArray.map((n, index) => {
         return /* @__PURE__ */ React.createElement(
           "div",
           {
             className: `${classPrefix2}-item`,
             key: n,
+            ref: setRefs(index),
             onClick: (event) => onClick(event, n)
           },
           /* @__PURE__ */ React.createElement(
@@ -18283,7 +18409,7 @@ Please add \`${key}Action\` when creating your handler.`);
     const textareaRef = React.useRef(null);
     const compositionRef = React.useRef(false);
     const format2 = (value2) => {
-      if (maxLength !== void 0 && value2.length > maxLength) {
+      if (maxLength !== -1 && value2.length > maxLength) {
         return value2.substring(0, maxLength);
       }
       return value2;
@@ -19722,6 +19848,7 @@ Please add \`${key}Action\` when creating your handler.`);
       if (distance.current < refreshMaxH.current) {
         distance.current = 0;
         getRefreshTop().style.height = `${distance.current}px`;
+        isTouching.current = false;
       } else {
         await (onRefresh == null ? void 0 : onRefresh());
         refreshDone();
@@ -23520,7 +23647,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
       return `${classPrefix2}-icon`;
     };
-    return /* @__PURE__ */ React.createElement("div", { className: classes, ...restProps, onClick: handleClickStep }, /* @__PURE__ */ React.createElement("div", { className: "nut-step-head" }, /* @__PURE__ */ React.createElement("div", { className: "nut-step-line" }), /* @__PURE__ */ React.createElement("div", { className: renderIconClass() }, icon || !dot && /* @__PURE__ */ React.createElement("span", { className: "nut-step-inner" }, value))), /* @__PURE__ */ React.createElement("div", { className: "nut-step-main" }, /* @__PURE__ */ React.createElement("span", { className: "nut-step-title" }, title), description && /* @__PURE__ */ React.createElement("span", { className: "nut-step-description" }, description)));
+    return /* @__PURE__ */ React.createElement("div", { className: classes, ...restProps, onClick: handleClickStep }, /* @__PURE__ */ React.createElement("div", { className: "nut-step-head" }, /* @__PURE__ */ React.createElement("div", { className: "nut-step-line" }), /* @__PURE__ */ React.createElement("div", { className: renderIconClass() }, icon || !dot && /* @__PURE__ */ React.createElement("span", { className: "nut-step-inner" }, value))), (title || description) && /* @__PURE__ */ React.createElement("div", { className: "nut-step-main" }, /* @__PURE__ */ React.createElement("span", { className: "nut-step-title" }, title), description && /* @__PURE__ */ React.createElement("span", { className: "nut-step-description" }, description)));
   };
   Step.defaultProps = defaultProps$c;
   Step.displayName = "NutStep";
@@ -23553,14 +23680,7 @@ Please add \`${key}Action\` when creating your handler.`);
       },
       className
     );
-    return /* @__PURE__ */ React.createElement(DataContext.Provider, { value: parentSteps }, React.createElement(
-      "div",
-      {
-        className: classes,
-        ...restProps
-      },
-      children
-    ));
+    return /* @__PURE__ */ React.createElement(DataContext.Provider, { value: parentSteps }, /* @__PURE__ */ React.createElement("div", { className: classes, ...restProps }, children));
   };
   Steps.defaultProps = defaultProps$b;
   Steps.displayName = "NutSteps";

package/dist/packages/address/address.scss

@@ -49,3 +49,15 @@
     }
   }
 }
+
+[dir='rtl'] .nut-address,
+.nut-rtl .nut-address {
+  &-exist {
+    &-item {
+      &-info {
+        margin-left: 0;
+        margin-right: 9px;
+      }
+    }
+  }
+}