@nutui/nutui-react-taro 2.6.13 → 2.6.15-beta.0

package/dist/nutui.react.es.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react-taro v2.6.13 Fri Jul 12 2024 13:57:50 GMT+0800 (China Standard Time)
+* @nutui/nutui-react-taro v2.6.14 Wed Jul 24 2024 13:29:51 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -3961,13 +3961,10 @@ const Sticky = (props) => {
         width: ""
       };
     }
-    const style2 = {};
-    if (rootRect.height) {
-      style2.height = rootRect.height;
-    }
-    if (rootRect.width) {
-      style2.width = rootRect.width;
-    }
+    const style2 = {
+      height: rootRect.height ?? "",
+      width: rootRect.width ?? ""
+    };
     return style2;
   }, [fixed, rootRect.height, rootRect.width]);
   const stickyStyle = useMemo$1(() => {
@@ -3978,36 +3975,37 @@ const Sticky = (props) => {
         [position]: ""
       };
     }
-    const style2 = {};
-    if (rootRect.height) style2.height = rootRect.height;
-    if (rootRect.width) style2.width = rootRect.width;
-    style2.transform = `translate3d(0, ${transform}px, 0)`;
-    style2[position] = threshold;
-    style2.zIndex = zIndex;
+    const style2 = {
+      height: rootRect.height ?? "",
+      width: rootRect.width ?? "",
+      transform: `translate3d(0, ${transform}px, 0)`,
+      [position]: threshold,
+      zIndex
+    };
     return style2;
   }, [fixed, rootRect.height, rootRect.width, transform, position]);
   const handleScroll = async (scrollTop) => {
     const curRootRect = await getRectByTaro(rootRef.current);
     const stickyRect = await getRectByTaro(stickyRef.current);
-    if (curRootRect && stickyRect) {
-      setRootRect(curRootRect);
-      if (position === "top") {
-        if (container) {
-          const containerRect = await getRectByTaro(container.current);
-          const difference = containerRect.bottom - threshold - curRootRect.height;
-          const curTransform = difference < 0 ? difference : 0;
-          setTransform(curTransform);
-          const curFixed = threshold > curRootRect.top && containerRect.bottom > 0;
-          setFixed(curFixed);
-        } else {
-          setFixed(threshold > curRootRect.top);
-        }
+    if (!curRootRect || !stickyRect) {
+      console.warn("getRectByTaro获取失败", { stickyRect, curRootRect });
+      return;
+    }
+    setRootRect(curRootRect);
+    if (position === "top") {
+      if (container) {
+        const containerRect = await getRectByTaro(container.current);
+        const difference = containerRect.bottom - threshold - curRootRect.height;
+        const curTransform = difference < 0 ? difference : 0;
+        setTransform(curTransform);
+        const curFixed = threshold > curRootRect.top && containerRect.bottom > 0;
+        setFixed(curFixed);
       } else {
-        const windowHeight = getSystemInfoSync().windowHeight;
-        setFixed(windowHeight - threshold < curRootRect.bottom);
+        setFixed(threshold > curRootRect.top);
       }
     } else {
-      console.warn("getRectByTaro获取失败", { stickyRect, curRootRect });
+      const windowHeight = getSystemInfoSync().windowHeight;
+      setFixed(windowHeight - threshold < curRootRect.bottom);
     }
   };
   const getElement = useCallback(() => {
@@ -5720,7 +5718,7 @@ const InternalCascader = (props, ref) => {
   };
   const syncValue = async () => {
     const currentValue = innerValue;
-    if (currentValue === void 0 || currentValue !== defaultValue || !state.tree.nodes.length) {
+    if (currentValue === void 0 || ![defaultValue, value].includes(currentValue) || !state.tree.nodes.length) {
       return;
     }
     if (currentValue.length === 0) {
@@ -5752,7 +5750,7 @@ const InternalCascader = (props, ref) => {
         state.initLoading = false;
       }
     }
-    if (needToSync.length && currentValue === defaultValue) {
+    if (needToSync.length && [defaultValue, value].includes(currentValue)) {
       const pathNodes = state.tree.getPathNodesByValue(needToSync);
       pathNodes.forEach((node, index) => {
         state.tabsCursor = index;
@@ -6730,8 +6728,10 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
   };
   useEffect(() => {
     setCurrentDate(resetDefaultValue() || []);
-    popup && resetRender();
   }, [defaultValue]);
+  useEffect(() => {
+    popup && resetRender();
+  }, [currentDate]);
   const scrollToDate = (date4) => {
     if (Utils.compareDate(date4, propStartDate)) {
       date4 = propStartDate;
@@ -9793,7 +9793,7 @@ class FormStore {
         this.store = values;
       }
     };
-    this.setFieldsValue = (newStore) => {
+    this.setFieldsValue = (newStore, needValidate = true) => {
       this.store = {
         ...this.store,
         ...newStore
@@ -9815,6 +9815,7 @@ class FormStore {
           item.entity.onStoreChange("update");
         }
       });
+      needValidate && this.validateFields();
     };
     this.setCallback = (callback) => {
       this.callbacks = {
@@ -10064,7 +10065,7 @@ const _FormItem = class _FormItem extends React__default.Component {
           if (this.props.getValueFromEvent) {
             next = this.props.getValueFromEvent(...args);
           }
-          setFieldsValue({ [name]: next });
+          setFieldsValue({ [name]: next }, false);
         }
       };
       const { validateTrigger } = this.props;
@@ -10797,18 +10798,20 @@ const MenuItem = forwardRef((props, ref) => {
               handleClick(item);
             }
           },
-          item.value === innerValue ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, icon || /* @__PURE__ */ React__default.createElement(
+          item.value === innerValue ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, icon ? React__default.cloneElement(icon, {
+            className: `nut-menu-container-item-icon ${icon.props.className || ""}`
+          }) : /* @__PURE__ */ React__default.createElement(
             g$3,
             {
               color: activeColor,
               size: 16,
-              className: getIconCName(item.value, value)
+              className: `nut-menu-container-item-icon ${getIconCName(item.value, value)}`
             }
           )) : null,
           /* @__PURE__ */ React__default.createElement(
             View,
             {
-              className: getIconCName(item.value, value),
+              className: `nut-menu-container-item-title ${getIconCName(item.value, value)}`,
               style: {
                 color: `${item.value === innerValue ? activeColor : ""}`
               }
@@ -12882,6 +12885,10 @@ const InternalUploader = (props, ref) => {
       clearUploadQueue();
     }
   }));
+  const fileListRef = useRef([]);
+  useEffect(() => {
+    fileListRef.current = fileList;
+  }, [fileList]);
   const clearUploadQueue = (index = -1) => {
     if (index > -1) {
       uploadQueue.splice(index, 1);
@@ -12961,7 +12968,7 @@ const InternalUploader = (props, ref) => {
     uploadOption.onStart = (option) => {
       clearUploadQueue(index);
       setFileList(
-        fileList.map((item) => {
+        fileListRef.current.map((item) => {
           if (item.uid === fileItem.uid) {
             item.status = "ready";
             item.message = locale.uploader.readyUpload;
@@ -12969,23 +12976,23 @@ const InternalUploader = (props, ref) => {
           return item;
         })
       );
-      onStart && onStart(option);
+      onStart == null ? void 0 : onStart(option);
     };
     uploadOption.onProgress = (e2, option) => {
       setFileList(
-        fileList.map((item) => {
+        fileListRef.current.map((item) => {
           if (item.uid === fileItem.uid) {
             item.status = UPLOADING;
             item.message = locale.uploader.uploading;
             item.percentage = e2.progress;
-            onProgress && onProgress({ e: e2, option, percentage: item.percentage });
+            onProgress == null ? void 0 : onProgress({ e: e2, option, percentage: item.percentage });
           }
           return item;
         })
       );
     };
     uploadOption.onSuccess = (responseText, option) => {
-      const list = fileList.map((item) => {
+      const list = fileListRef.current.map((item) => {
         if (item.uid === fileItem.uid) {
           item.status = SUCCESS;
           item.message = locale.uploader.success;
@@ -13001,7 +13008,7 @@ const InternalUploader = (props, ref) => {
       });
     };
     uploadOption.onFailure = (responseText, option) => {
-      const list = fileList.map((item) => {
+      const list = fileListRef.current.map((item) => {
         if (item.uid === fileItem.uid) {
           item.status = ERROR;
           item.message = locale.uploader.error;
@@ -13063,8 +13070,8 @@ const InternalUploader = (props, ref) => {
       if (preview) {
         fileItem.url = fileType === "video" ? file.thumbTempFilePath : filepath;
       }
-      setFileList([...fileList, fileItem]);
       executeUpload(fileItem, index);
+      setFileList([...fileList, fileItem]);
     });
   };
   const filterFiles = (files) => {
@@ -13078,9 +13085,7 @@ const InternalUploader = (props, ref) => {
       }
       return true;
     });
-    if (oversizes.length) {
-      onOversize && onOversize(files);
-    }
+    oversizes.length && (onOversize == null ? void 0 : onOversize(files));
     const currentFileLength = filterFile.length + fileList.length;
     if (currentFileLength > maximum) {
       filterFile.splice(filterFile.length - (currentFileLength - maximum));
@@ -13728,7 +13733,8 @@ const InfiniteLoading = (props) => {
     className,
     onRefresh,
     onLoadMore,
-    onScroll
+    onScroll,
+    ...rest
   } = {
     ...defaultProps$D,
     ...props
@@ -13822,6 +13828,7 @@ const InfiniteLoading = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     ScrollView,
     {
+      ...rest,
       className: classes,
       scrollY: true,
       id: "scroller",
@@ -18591,6 +18598,8 @@ const defaultProps$1 = {
   gapY: 48,
   width: 120,
   height: 64,
+  startX: 0,
+  startY: 0,
   image: "",
   imageWidth: 120,
   imageHeight: 64,
@@ -18609,6 +18618,8 @@ const WaterMark = (props) => {
     className,
     gapX,
     gapY,
+    startX,
+    startY,
     width,
     height,
     image,
@@ -18689,7 +18700,7 @@ const WaterMark = (props) => {
           const markSize = Number(fontSize) * ratio;
           ctx.font = `${fontStyle} normal ${fontWeight} ${markSize}px/${markHeight}px ${fontFamily}`;
           ctx.fillStyle = color;
-          ctx.fillText(content, 0, 0);
+          ctx.fillText(content, startX, startY);
           ctx.restore();
           setBase64Url(canvas.toDataURL());
         }

package/dist/nutui.react.umd.js

@@ -2,7 +2,7 @@
   typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react"), require("@tarojs/taro"), require("@tarojs/components"), require("react-dom")) : typeof define === "function" && define.amd ? define(["exports", "react", "@tarojs/taro", "@tarojs/components", "react-dom"], factory) : (global2 = typeof globalThis !== "undefined" ? globalThis : global2 || self, factory((global2.nutui = global2.nutui || {}, global2.nutui.react = {}), global2.React, global2.Taro, global2.components, global2.ReactDOM));
 })(this, function(exports2, React, Taro, components, ReactDOM) {
   "use strict";/*!
-* @nutui/nutui-react-taro v2.6.13 Fri Jul 12 2024 13:57:50 GMT+0800 (China Standard Time)
+* @nutui/nutui-react-taro v2.6.14 Wed Jul 24 2024 13:29:51 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -3977,13 +3977,10 @@
           width: ""
         };
       }
-      const style2 = {};
-      if (rootRect.height) {
-        style2.height = rootRect.height;
-      }
-      if (rootRect.width) {
-        style2.width = rootRect.width;
-      }
+      const style2 = {
+        height: rootRect.height ?? "",
+        width: rootRect.width ?? ""
+      };
       return style2;
     }, [fixed, rootRect.height, rootRect.width]);
     const stickyStyle = React.useMemo(() => {
@@ -3994,36 +3991,37 @@
           [position]: ""
         };
       }
-      const style2 = {};
-      if (rootRect.height) style2.height = rootRect.height;
-      if (rootRect.width) style2.width = rootRect.width;
-      style2.transform = `translate3d(0, ${transform}px, 0)`;
-      style2[position] = threshold;
-      style2.zIndex = zIndex;
+      const style2 = {
+        height: rootRect.height ?? "",
+        width: rootRect.width ?? "",
+        transform: `translate3d(0, ${transform}px, 0)`,
+        [position]: threshold,
+        zIndex
+      };
       return style2;
     }, [fixed, rootRect.height, rootRect.width, transform, position]);
     const handleScroll = async (scrollTop) => {
       const curRootRect = await getRectByTaro(rootRef.current);
       const stickyRect = await getRectByTaro(stickyRef.current);
-      if (curRootRect && stickyRect) {
-        setRootRect(curRootRect);
-        if (position === "top") {
-          if (container) {
-            const containerRect = await getRectByTaro(container.current);
-            const difference = containerRect.bottom - threshold - curRootRect.height;
-            const curTransform = difference < 0 ? difference : 0;
-            setTransform(curTransform);
-            const curFixed = threshold > curRootRect.top && containerRect.bottom > 0;
-            setFixed(curFixed);
-          } else {
-            setFixed(threshold > curRootRect.top);
-          }
+      if (!curRootRect || !stickyRect) {
+        console.warn("getRectByTaro获取失败", { stickyRect, curRootRect });
+        return;
+      }
+      setRootRect(curRootRect);
+      if (position === "top") {
+        if (container) {
+          const containerRect = await getRectByTaro(container.current);
+          const difference = containerRect.bottom - threshold - curRootRect.height;
+          const curTransform = difference < 0 ? difference : 0;
+          setTransform(curTransform);
+          const curFixed = threshold > curRootRect.top && containerRect.bottom > 0;
+          setFixed(curFixed);
         } else {
-          const windowHeight = Taro.getSystemInfoSync().windowHeight;
-          setFixed(windowHeight - threshold < curRootRect.bottom);
+          setFixed(threshold > curRootRect.top);
         }
       } else {
-        console.warn("getRectByTaro获取失败", { stickyRect, curRootRect });
+        const windowHeight = Taro.getSystemInfoSync().windowHeight;
+        setFixed(windowHeight - threshold < curRootRect.bottom);
       }
     };
     const getElement = React.useCallback(() => {
@@ -5736,7 +5734,7 @@
     };
     const syncValue = async () => {
       const currentValue = innerValue;
-      if (currentValue === void 0 || currentValue !== defaultValue || !state.tree.nodes.length) {
+      if (currentValue === void 0 || ![defaultValue, value].includes(currentValue) || !state.tree.nodes.length) {
         return;
       }
       if (currentValue.length === 0) {
@@ -5768,7 +5766,7 @@
           state.initLoading = false;
         }
       }
-      if (needToSync.length && currentValue === defaultValue) {
+      if (needToSync.length && [defaultValue, value].includes(currentValue)) {
         const pathNodes = state.tree.getPathNodesByValue(needToSync);
         pathNodes.forEach((node, index) => {
           state.tabsCursor = index;
@@ -6746,8 +6744,10 @@
     };
     React.useEffect(() => {
       setCurrentDate(resetDefaultValue() || []);
-      popup && resetRender();
     }, [defaultValue]);
+    React.useEffect(() => {
+      popup && resetRender();
+    }, [currentDate]);
     const scrollToDate = (date2) => {
       if (Utils.compareDate(date2, propStartDate)) {
         date2 = propStartDate;
@@ -9809,7 +9809,7 @@
           this.store = values;
         }
       };
-      this.setFieldsValue = (newStore) => {
+      this.setFieldsValue = (newStore, needValidate = true) => {
         this.store = {
           ...this.store,
           ...newStore
@@ -9831,6 +9831,7 @@
             item.entity.onStoreChange("update");
           }
         });
+        needValidate && this.validateFields();
       };
       this.setCallback = (callback) => {
         this.callbacks = {
@@ -10080,7 +10081,7 @@
             if (this.props.getValueFromEvent) {
               next = this.props.getValueFromEvent(...args);
             }
-            setFieldsValue({ [name]: next });
+            setFieldsValue({ [name]: next }, false);
           }
         };
         const { validateTrigger } = this.props;
@@ -10813,18 +10814,20 @@
                 handleClick(item);
               }
             },
-            item.value === innerValue ? /* @__PURE__ */ React.createElement(React.Fragment, null, icon || /* @__PURE__ */ React.createElement(
+            item.value === innerValue ? /* @__PURE__ */ React.createElement(React.Fragment, null, icon ? React.cloneElement(icon, {
+              className: `nut-menu-container-item-icon ${icon.props.className || ""}`
+            }) : /* @__PURE__ */ React.createElement(
               g$3,
               {
                 color: activeColor,
                 size: 16,
-                className: getIconCName(item.value, value)
+                className: `nut-menu-container-item-icon ${getIconCName(item.value, value)}`
               }
             )) : null,
             /* @__PURE__ */ React.createElement(
               components.View,
               {
-                className: getIconCName(item.value, value),
+                className: `nut-menu-container-item-title ${getIconCName(item.value, value)}`,
                 style: {
                   color: `${item.value === innerValue ? activeColor : ""}`
                 }
@@ -12898,6 +12901,10 @@
         clearUploadQueue();
       }
     }));
+    const fileListRef = React.useRef([]);
+    React.useEffect(() => {
+      fileListRef.current = fileList;
+    }, [fileList]);
     const clearUploadQueue = (index = -1) => {
       if (index > -1) {
         uploadQueue.splice(index, 1);
@@ -12977,7 +12984,7 @@
       uploadOption.onStart = (option) => {
         clearUploadQueue(index);
         setFileList(
-          fileList.map((item) => {
+          fileListRef.current.map((item) => {
             if (item.uid === fileItem.uid) {
               item.status = "ready";
               item.message = locale.uploader.readyUpload;
@@ -12985,23 +12992,23 @@
             return item;
           })
         );
-        onStart && onStart(option);
+        onStart == null ? void 0 : onStart(option);
       };
       uploadOption.onProgress = (e2, option) => {
         setFileList(
-          fileList.map((item) => {
+          fileListRef.current.map((item) => {
             if (item.uid === fileItem.uid) {
               item.status = UPLOADING;
               item.message = locale.uploader.uploading;
               item.percentage = e2.progress;
-              onProgress && onProgress({ e: e2, option, percentage: item.percentage });
+              onProgress == null ? void 0 : onProgress({ e: e2, option, percentage: item.percentage });
             }
             return item;
           })
         );
       };
       uploadOption.onSuccess = (responseText, option) => {
-        const list = fileList.map((item) => {
+        const list = fileListRef.current.map((item) => {
           if (item.uid === fileItem.uid) {
             item.status = SUCCESS;
             item.message = locale.uploader.success;
@@ -13017,7 +13024,7 @@
         });
       };
       uploadOption.onFailure = (responseText, option) => {
-        const list = fileList.map((item) => {
+        const list = fileListRef.current.map((item) => {
           if (item.uid === fileItem.uid) {
             item.status = ERROR;
             item.message = locale.uploader.error;
@@ -13079,8 +13086,8 @@
         if (preview) {
           fileItem.url = fileType === "video" ? file.thumbTempFilePath : filepath;
         }
-        setFileList([...fileList, fileItem]);
         executeUpload(fileItem, index);
+        setFileList([...fileList, fileItem]);
       });
     };
     const filterFiles = (files) => {
@@ -13094,9 +13101,7 @@
         }
         return true;
       });
-      if (oversizes.length) {
-        onOversize && onOversize(files);
-      }
+      oversizes.length && (onOversize == null ? void 0 : onOversize(files));
       const currentFileLength = filterFile.length + fileList.length;
       if (currentFileLength > maximum) {
         filterFile.splice(filterFile.length - (currentFileLength - maximum));
@@ -13744,7 +13749,8 @@
       className,
       onRefresh,
       onLoadMore,
-      onScroll
+      onScroll,
+      ...rest
     } = {
       ...defaultProps$D,
       ...props
@@ -13838,6 +13844,7 @@
     return /* @__PURE__ */ React.createElement(
       components.ScrollView,
       {
+        ...rest,
         className: classes,
         scrollY: true,
         id: "scroller",
@@ -18607,6 +18614,8 @@
     gapY: 48,
     width: 120,
     height: 64,
+    startX: 0,
+    startY: 0,
     image: "",
     imageWidth: 120,
     imageHeight: 64,
@@ -18625,6 +18634,8 @@
       className,
       gapX,
       gapY,
+      startX,
+      startY,
       width,
       height,
       image,
@@ -18705,7 +18716,7 @@
             const markSize = Number(fontSize) * ratio;
             ctx.font = `${fontStyle} normal ${fontWeight} ${markSize}px/${markHeight}px ${fontFamily}`;
             ctx.fillStyle = color;
-            ctx.fillText(content, 0, 0);
+            ctx.fillText(content, startX, startY);
             ctx.restore();
             setBase64Url(canvas.toDataURL());
           }

package/dist/packages/empty/empty.scss

@@ -5,7 +5,7 @@
   flex-direction: column;
   justify-content: center;
   padding: $empty-padding;
-  background-color: $color-background-overlay;
+  background-color: $empty-background-color;
 
   &-image {
     width: $empty-image-size;

package/dist/packages/uploader/uploader.scss

@@ -174,7 +174,9 @@
       }
 
       &-c {
-        width: 100%;
+        display: flex;
+        justify-content: center;
+        align-items: center;
         height: 100%;
         position: initial;
         border-radius: $uploader-image-border-radius;