@nutui/nutui-react 2.3.4 → 2.3.6

package/dist/nutui.react.umd.js

@@ -8,7 +8,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 /*!
-* @nutui/nutui-react v2.3.4 Fri Dec 29 2023 14:37:01 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.3.6 Fri Jan 12 2024 15:48:36 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -14084,7 +14084,7 @@ Please add \`${key}Action\` when creating your handler.`);
               },
               key: item.value ? item.value : index
             },
-            /* @__PURE__ */ React.createElement(React.Fragment, null, item.text ? item.text : item)
+            /* @__PURE__ */ React.createElement(React.Fragment, null, item.text)
           );
         }),
         !threeDimensional && options2.map((item, index) => {
@@ -14094,7 +14094,7 @@ Please add \`${key}Action\` when creating your handler.`);
               className: "nut-picker-roller-item-title",
               key: item.value ? item.value : index
             },
-            /* @__PURE__ */ React.createElement(React.Fragment, null, item.text ? item.text : item)
+            /* @__PURE__ */ React.createElement(React.Fragment, null, item.text)
           );
         })
       ),
@@ -17431,11 +17431,20 @@ Please add \`${key}Action\` when creating your handler.`);
     const [exactValue, setEaxctValue] = React.useState(
       () => value || defaultValue || 0
     );
+    const marksRef = React.useRef({});
     React.useEffect(() => {
       if (marks) {
-        const marksKeys = Object.keys(marks);
-        const list = marksKeys.map(parseFloat).sort((a2, b) => a2 - b).filter((point) => point >= min && point <= max);
-        setMarksList(list);
+        if (Array.isArray(marks)) {
+          const list = marks.sort((a2, b) => a2.value - b.value).filter((point) => point.value >= min && point.value <= max);
+          setMarksList(list.map((mark) => mark.value));
+          list.forEach((mark) => {
+            marksRef.current[mark.value] = mark.label !== void 0 ? mark.label : mark.value;
+          });
+        } else {
+          const marksKeys = Object.keys(marks);
+          const list = marksKeys.map(parseFloat).sort((a2, b) => a2 - b).filter((point) => point >= min && point <= max);
+          setMarksList(list);
+        }
       }
     }, [marks]);
     const scope = () => {
@@ -17628,20 +17637,20 @@ Please add \`${key}Action\` when creating your handler.`);
     const renderButton = (index) => {
       return /* @__PURE__ */ React.createElement(React.Fragment, null, button || /* @__PURE__ */ React.createElement("div", { className: "nut-range-button" }, currentDescription !== null && /* @__PURE__ */ React.createElement("div", { className: "number" }, currentDescription ? currentDescription(curValue(index)) : curValue(index))));
     };
-    return /* @__PURE__ */ React.createElement("div", { className: containerClasses }, minDescription !== null && /* @__PURE__ */ React.createElement("div", { className: "min" }, minDescription || min), /* @__PURE__ */ React.createElement("div", { ref: root2, className: classes, onClick: (e2) => click(e2) }, marksList.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "nut-range-mark" }, marksList.map((marks2) => {
+    return /* @__PURE__ */ React.createElement("div", { className: containerClasses }, minDescription !== null && /* @__PURE__ */ React.createElement("div", { className: "min" }, minDescription || min), /* @__PURE__ */ React.createElement("div", { ref: root2, className: classes, onClick: (e2) => click(e2) }, marksList.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "nut-range-mark" }, marksList.map((mark) => {
       return /* @__PURE__ */ React.createElement(
         "span",
         {
-          key: marks2,
-          className: markClassName(marks2),
-          style: marksStyle(marks2)
+          key: mark,
+          className: markClassName(mark),
+          style: marksStyle(mark)
         },
-        marks2,
+        Array.isArray(marks) ? marksRef.current[mark] : marks[mark],
         /* @__PURE__ */ React.createElement(
           "span",
           {
             className: classNames("nut-range-tick", {
-              active: tickClass(marks2)
+              active: tickClass(mark)
             })
           }
         )
@@ -23113,7 +23122,9 @@ Please add \`${key}Action\` when creating your handler.`);
       );
     };
     const slideChangeEnd = (page) => {
+      var _a2;
       setActive(page + 1);
+      (_a2 = props.onChange) == null ? void 0 : _a2.call(props, page + 1);
     };
     const onCloseInner = () => {
       setShowPop(false);
@@ -24785,7 +24796,8 @@ Please add \`${key}Action\` when creating your handler.`);
       /* @__PURE__ */ React.createElement(Button, { type: "success", key: "confirm" }, "确认")
     ],
     toolbarPosition: "bottom",
-    editText: "编辑"
+    editText: "编辑",
+    shape: "square"
   };
   const classPrefix = `nut-avatar-cropper`;
   const AvatarCropper = (props) => {
@@ -24796,6 +24808,7 @@ Please add \`${key}Action\` when creating your handler.`);
       space,
       toolbarPosition,
       editText,
+      shape,
       className,
       style,
       onConfirm,
@@ -24805,7 +24818,7 @@ Please add \`${key}Action\` when creating your handler.`);
       ...defaultProps,
       ...props
     };
-    const cls = classNames(classPrefix, className);
+    const cls = classNames(classPrefix, className, shape === "round" && "round");
     const toolbarPositionCls = classNames(
       `${classPrefix}-popup-toolbar`,
       toolbarPosition
@@ -24853,7 +24866,8 @@ Please add \`${key}Action\` when creating your handler.`);
       const height = width;
       return {
         width,
-        height
+        height,
+        borderRadius: shape === "round" ? "50%" : ""
       };
     }, [devicePixelRatio, drawImage.swidth]);
     const isAngle = React.useMemo(() => {
@@ -25127,7 +25141,8 @@ Please add \`${key}Action\` when creating your handler.`);
         type: "file",
         accept: "image/*",
         className: `${classPrefix}-input`,
-        onChange: (e2) => inputImageChange(e2)
+        onChange: (e2) => inputImageChange(e2),
+        "aria-label": "选择图片"
       }
     ), /* @__PURE__ */ React.createElement("div", { className: "nut-avatar-cropper-edit-text" }, editText)), CropperPopup());
   };

package/dist/packages/avatarcropper/avatarcropper.scss

@@ -89,4 +89,9 @@
       }
     }
   }
+  &.round {
+    .nut-avatar-cropper-edit-text {
+      border-radius: 50%;
+    }
+  }
 }

package/dist/packages/dialog/dialog.scss

@@ -35,7 +35,7 @@
   &-header {
     display: block;
     text-align: center;
-    font-size: $font-size-large;
+    font-size: $dialog-header-font-size;
     font-weight: $dialog-header-font-weight;
     color: $color-title;
     @include oneline-ellipsis();

package/dist/packages/picker/picker.scss

@@ -85,6 +85,7 @@
     background-position: top, bottom;
     background-size: 100% 108px;
     background-repeat: no-repeat;
+    transform: translateZ(0);
     z-index: 3;
   }
 

package/dist/packages/range/range.scss

@@ -69,7 +69,7 @@
         text-align: center;
         word-break: keep-all;
         user-select: none;
-        transform: translateY(-50%);
+        transform: translateY(-11px);
       }
 
       &-tick {
@@ -191,7 +191,7 @@
     text-align: center;
     word-break: keep-all;
     user-select: none;
-    transform: translateX(-50%);
+    transform: translateX(-10px);
   }
 
   &-tick {

package/dist/packages/tabs/tabs.scss

@@ -8,7 +8,7 @@
   display: flex;
   box-sizing: border-box;
   height: $tabs-titles-height;
-  padding: 0 16px;
+  padding: $tabs-titles-padding;
   user-select: none;
   overflow: hidden;
   background: $tabs-titles-background-color;
@@ -49,7 +49,7 @@
     margin: 0 $tabs-titles-gap;
     min-width: $tabs-titles-item-min-width;
     font-size: $tabs-titles-font-size;
-    color: $color-title;
+    color: $tabs-titles-item-color;
     text-overflow: ellipsis;
     white-space: nowrap;