@nutui/nutui-react 2.3.3 → 2.3.4

package/dist/nutui.react.umd.js

@@ -8,7 +8,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 /*!
-* @nutui/nutui-react v2.3.3 Fri Dec 22 2023 17:49:13 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.3.4 Fri Dec 29 2023 14:37:01 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -14659,9 +14659,7 @@ Please add \`${key}Action\` when creating your handler.`);
       return val || [];
     };
     React.useEffect(() => {
-      if (selectedDate) {
-        setPickerOptions(columns());
-      }
+      setPickerOptions(columns());
     }, [selectedDate, startDate, endDate]);
     return /* @__PURE__ */ React.createElement("div", { className: `nut-datepicker ${className}`, style, ...rest }, pickerOptions.length && /* @__PURE__ */ React.createElement(
       Picker$1,
@@ -19575,7 +19573,7 @@ Please add \`${key}Action\` when creating your handler.`);
     const [isInfiniting, setIsInfiniting] = React.useState(false);
     const scroller = React.useRef(null);
     const refreshTop = React.useRef(null);
-    const scrollEl = React.useRef(window);
+    const scrollEl = React.useRef(null);
     const isTouching = React.useRef(false);
     const beforeScrollTop = React.useRef(0);
     const refreshMaxH = React.useRef(0);
@@ -19583,14 +19581,16 @@ Please add \`${key}Action\` when creating your handler.`);
     const distance = React.useRef(0);
     const classes = classNames(classPrefix$d, className);
     React.useEffect(() => {
+      var _a2;
       if (target && document.getElementById(target)) {
         scrollEl.current = document.getElementById(target);
       } else {
         scrollEl.current = window;
       }
-      scrollEl.current.addEventListener("scroll", handleScroll, capture);
+      (_a2 = scrollEl.current) == null ? void 0 : _a2.addEventListener("scroll", handleScroll, capture);
       return () => {
-        scrollEl.current.removeEventListener("scroll", handleScroll, capture);
+        var _a3;
+        (_a3 = scrollEl.current) == null ? void 0 : _a3.removeEventListener("scroll", handleScroll, capture);
       };
     }, [hasMore, isInfiniting, onLoadMore]);
     React.useEffect(() => {
@@ -19608,15 +19608,13 @@ Please add \`${key}Action\` when creating your handler.`);
         transition: isTouching.current ? `height 0s cubic-bezier(0.25,0.1,0.25,1)` : `height 0.2s cubic-bezier(0.25,0.1,0.25,1)`
       };
     };
-    const handleScroll = () => {
-      requestAniFrame$1(() => {
-        if (!isScrollAtBottom() || !hasMore || isInfiniting) {
-          return false;
-        }
-        setIsInfiniting(true);
-        onLoadMore && onLoadMore(infiniteDone);
-        return true;
-      });
+    const handleScroll = async () => {
+      if (!isScrollAtBottom() || !hasMore || isInfiniting) {
+        return;
+      }
+      setIsInfiniting(true);
+      await (onLoadMore == null ? void 0 : onLoadMore());
+      infiniteDone();
     };
     const infiniteDone = () => {
       setIsInfiniting(false);
@@ -19653,12 +19651,13 @@ Please add \`${key}Action\` when creating your handler.`);
         isTouching.current = false;
       }
     };
-    const touchEnd = () => {
+    const touchEnd = async () => {
       if (distance.current < refreshMaxH.current) {
         distance.current = 0;
         getRefreshTop().style.height = `${distance.current}px`;
       } else {
-        onRefresh && onRefresh(refreshDone);
+        await (onRefresh == null ? void 0 : onRefresh());
+        refreshDone();
       }
     };
     const getWindowScrollTop = () => {
@@ -19700,9 +19699,9 @@ Please add \`${key}Action\` when creating your handler.`);
         onTouchEnd: touchEnd,
         ...restProps
       },
-      /* @__PURE__ */ React.createElement("div", { className: "nut-infinite-top", ref: refreshTop, style: getStyle() }, /* @__PURE__ */ React.createElement("div", { className: "top-box" }, pullingText || locale.infiniteloading.pullRefreshText)),
+      /* @__PURE__ */ React.createElement("div", { className: "nut-infinite-top", ref: refreshTop, style: getStyle() }, /* @__PURE__ */ React.createElement("div", { className: "nut-infinite-top-tips" }, pullingText || locale.infiniteloading.pullRefreshText)),
       /* @__PURE__ */ React.createElement("div", { className: "nut-infinite-container" }, children),
-      /* @__PURE__ */ React.createElement("div", { className: "nut-infinite-bottom" }, isInfiniting ? /* @__PURE__ */ React.createElement("div", { className: "bottom-box" }, loadingText || locale.infiniteloading.loadText) : !hasMore && /* @__PURE__ */ React.createElement("div", { className: "bottom-box" }, loadMoreText || locale.infiniteloading.loadMoreText))
+      /* @__PURE__ */ React.createElement("div", { className: "nut-infinite-bottom" }, isInfiniting ? /* @__PURE__ */ React.createElement("div", { className: "nut-infinite-bottom-tips" }, loadingText || locale.infiniteloading.loadText) : !hasMore && /* @__PURE__ */ React.createElement("div", { className: "nut-infinite-bottom-tips" }, loadMoreText || locale.infiniteloading.loadMoreText))
     );
   };
   InfiniteLoading.defaultProps = defaultProps$B;
@@ -20549,10 +20548,10 @@ Please add \`${key}Action\` when creating your handler.`);
             key: item.key || index,
             onClick: () => handleSelect(item, index)
           },
-          item.icon ? /* @__PURE__ */ React.createElement("i", { className: "nut-popover-menu-item-icon" }, item.icon) : null,
+          item.icon ? /* @__PURE__ */ React.createElement("div", { className: "nut-popover-menu-item-icon" }, item.icon) : null,
           /* @__PURE__ */ React.createElement("div", { className: "nut-popover-menu-item-name" }, item.name),
           item.action && item.action.icon ? /* @__PURE__ */ React.createElement(
-            "i",
+            "div",
             {
               className: "nut-popover-menu-item-action-icon",
               onClick: (e2) => {
@@ -24029,14 +24028,16 @@ Please add \`${key}Action\` when creating your handler.`);
     tempIndex = tempIndex || 0;
     return tempIndex;
   };
-  const updateItemSize = (positions, items, sizeKey) => {
+  const updateItemSize = (positions, items, sizeKey, margin) => {
     const newPos = positions.concat();
     Array.from(items).forEach((item) => {
       const index = Number(item.getAttribute("data-index"));
       const styleVal = item.getAttribute("style");
       if (styleVal && styleVal.includes("none"))
         return;
-      const nowSize = item.getBoundingClientRect()[sizeKey];
+      let nowSize = item.getBoundingClientRect()[sizeKey];
+      if (margin)
+        nowSize += margin;
       const oldSize = positions[index][sizeKey];
       const dValue = oldSize - nowSize;
       if (dValue) {

package/dist/packages/infiniteloading/infiniteloading.scss

@@ -11,7 +11,7 @@
     font-size: $font-size-small;
     color: $infiniteloading-color;
 
-    .top-box {
+    &-tips {
       width: 100%;
       display: flex;
       flex-direction: column;
@@ -21,8 +21,6 @@
         display: flex;
         justify-content: center;
         align-items: center;
-        width: $pulltorefresh-icon-width;
-        height: $pulltorefresh-icon-height;
         margin-bottom: 4px;
       }
     }
@@ -38,14 +36,12 @@
     color: $infiniteloading-color;
     text-align: center;
 
-    .bottom-box {
+    &-tips {
       display: flex;
       justify-content: center;
       align-items: center;
 
       &-icons {
-        width: $infiniteloading-icon-size;
-        height: $infiniteloading-icon-size;
         margin-right: 8px;
       }
     }

package/dist/packages/popover/popover.scss

@@ -22,21 +22,6 @@
       border-bottom-color: $popover-border-color;
       border-top-width: 0;
       margin-top: -8px;
-
-      &.nut-popover-arrow-bottom {
-        left: 50%;
-        transform: translateX(-50%);
-      }
-
-      &.nut-popover-arrow-bottom-start {
-        left: 16px;
-        transform: translateX(0%);
-      }
-
-      &.nut-popover-arrow-bottom-end {
-        right: 16px;
-        transform: translateX(0%);
-      }
     }
 
     &-left {
@@ -189,10 +174,31 @@
       }
     }
 
+    &-bottom {
+      .nut-popover-arrow-bottom {
+        left: 50%;
+        transform: translateX(-50%);
+      }
+    }
+
     &-bottom-end {
+      .nut-popover-arrow-bottom-end {
+        right: 16px;
+        transform: translateX(0%);
+      }
+
       right: 0;
     }
 
+    &-bottom-start {
+      left: 0;
+
+      .nut-popover-arrow-bottom-start {
+        left: 16px;
+        transform: translateX(0%);
+      }
+    }
+
     &-left-end {
       bottom: 0;
     }

package/dist/packages/tabbaritem/tabbaritem.scss

@@ -10,10 +10,6 @@
   color: $tabbar-inactive-color;
   height: 100%;
 
-  &-active {
-    color: $tabbar-active-color;
-  }
-
   &-icon-box {
     padding: 0px;
     display: flex;
@@ -40,4 +36,14 @@
       font-weight: $tabbar-text-large-font-weight;
     }
   }
+
+  &-active {
+    color: $tabbar-active-color;
+    .nut-tabbar-item-icon-box {
+      color: inherit;
+      .nut-icon {
+        color: inherit;
+      }
+    }
+  }
 }