@nutui/nutui-react 2.0.21 → 2.0.23-beta.0

package/dist/nutui.react.es.js

@@ -6,7 +6,7 @@ var __publicField = (obj, key, value) => {
 };
 var _a;
 /*!
-* @nutui/nutui-react v2.0.21 Wed Oct 18 2023 17:52:14 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.23 Fri Nov 03 2023 19:51:24 GMT+0800 (中国标准时间)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -2438,7 +2438,7 @@ const ComponentDefaults = {
   style: {}
 };
 const prefixCls$1 = "nut-button";
-const defaultProps$1s = {
+const defaultProps$1t = {
   ...ComponentDefaults,
   color: "",
   type: "default",
@@ -2472,7 +2472,7 @@ const Button = React__default.forwardRef(
       nativeType,
       ...rest
     } = {
-      ...defaultProps$1s,
+      ...defaultProps$1t,
       ...props
     };
     const getStyle = useCallback(() => {
@@ -2524,7 +2524,7 @@ const Button = React__default.forwardRef(
 );
 Button.displayName = "NutButton";
 const CellGroupContext = createContext(null);
-const defaultProps$1r = {
+const defaultProps$1s = {
   ...ComponentDefaults,
   title: "",
   description: "",
@@ -2533,7 +2533,7 @@ const defaultProps$1r = {
 const classPrefix$p = "nut-cell-group";
 const CellGroup = (props) => {
   const { children, className, style, title, description, divider, ...rest } = {
-    ...defaultProps$1r,
+    ...defaultProps$1s,
     ...props
   };
   return /* @__PURE__ */ React__default.createElement("div", { className: classNames(classPrefix$p, className), ...rest }, title ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$p}__title` }, title) : null, description ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$p}__description` }, description) : null, /* @__PURE__ */ React__default.createElement(
@@ -2544,9 +2544,9 @@ const CellGroup = (props) => {
     /* @__PURE__ */ React__default.createElement(CellGroupContext.Provider, { value: { divider } }, children)
   ));
 };
-CellGroup.defaultProps = defaultProps$1r;
+CellGroup.defaultProps = defaultProps$1s;
 CellGroup.displayName = "NutCellGroup";
-const defaultProps$1q = {
+const defaultProps$1r = {
   ...ComponentDefaults,
   title: null,
   description: null,
@@ -2571,7 +2571,7 @@ const Cell = (props) => {
     style,
     ...rest
   } = {
-    ...defaultProps$1q,
+    ...defaultProps$1r,
     ...props
   };
   const handleClick2 = (event) => {
@@ -2604,7 +2604,7 @@ const Cell = (props) => {
     (ctx2 == null ? void 0 : ctx2.divider) ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$o}__divider` }) : null
   );
 };
-Cell.defaultProps = defaultProps$1q;
+Cell.defaultProps = defaultProps$1r;
 Cell.displayName = "NutCell";
 Cell.Group = CellGroup;
 var INFINITY = 1 / 0;
@@ -3745,7 +3745,7 @@ ConfigProvider.displayName = "NutConfigProvider";
 const pxCheck = (value) => {
   return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
 };
-const defaultProps$1p = {
+const defaultProps$1q = {
   ...ComponentDefaults,
   fit: "fill",
   position: "center",
@@ -3774,26 +3774,40 @@ const Image$1 = (props) => {
     onClick,
     onLoad,
     onError
-  } = { ...defaultProps$1p, ...props };
-  const [innerLoading, setInnerLoading] = useState(true);
+  } = { ...defaultProps$1q, ...props };
+  const [innerLoading, setInnerLoading] = useState(false);
   const [isError, setIsError] = useState(false);
+  const [complete, setComplete] = useState(false);
   const imgRef = useRef(null);
   useEffect(() => {
-    if (imgRef.current && imgRef.current.complete && imgRef.current.naturalHeight !== 0) {
-      setInnerLoading(false);
-    } else if (src) {
+    if (imgRef.current && imgRef.current.complete) {
+      if (imgRef.current.naturalHeight === 0) {
+        handleError();
+      } else {
+        handleLoad();
+      }
+    } else {
       setInnerLoading(true);
     }
+  }, [imgRef]);
+  useEffect(() => {
+    setComplete(false);
   }, [src]);
   const handleLoad = () => {
-    setIsError(false);
-    setInnerLoading(false);
-    onLoad && onLoad();
+    if (!complete) {
+      setIsError(false);
+      setInnerLoading(false);
+      onLoad && onLoad();
+      setComplete(true);
+    }
   };
   const handleError = () => {
-    setIsError(true);
-    setInnerLoading(false);
-    onError && onError();
+    if (!complete) {
+      setIsError(true);
+      setInnerLoading(false);
+      onError && onError();
+      setComplete(true);
+    }
   };
   const containerStyle = {
     height: height ? pxCheck(height) : "",
@@ -3901,7 +3915,7 @@ const Image$1 = (props) => {
     renderErrorImg()
   );
 };
-Image$1.defaultProps = defaultProps$1p;
+Image$1.defaultProps = defaultProps$1q;
 Image$1.displayName = "NutImage";
 function _extends$4() {
   _extends$4 = Object.assign ? Object.assign.bind() : function(target) {
@@ -5644,6 +5658,171 @@ CSSTransition.propTypes = process.env.NODE_ENV !== "production" ? _extends$4({},
   onExited: propTypesExports.func
 }) : {};
 const CSSTransition$1 = CSSTransition;
+const MIN_DISTANCE = 10;
+function getDirection(x2, y2) {
+  if (x2 > y2 && x2 > MIN_DISTANCE) {
+    return "horizontal";
+  }
+  if (y2 > x2 && y2 > MIN_DISTANCE) {
+    return "vertical";
+  }
+  return "";
+}
+function useTouch() {
+  const startX = useRef(0);
+  const startY = useRef(0);
+  const deltaX = useRef(0);
+  const deltaY = useRef(0);
+  const offsetX = useRef(0);
+  const offsetY = useRef(0);
+  const direction = useRef("");
+  const isVertical = () => direction.current === "vertical";
+  const isHorizontal = () => direction.current === "horizontal";
+  const reset = () => {
+    deltaX.current = 0;
+    deltaY.current = 0;
+    offsetX.current = 0;
+    offsetY.current = 0;
+    direction.current = "";
+  };
+  const start2 = (event) => {
+    reset();
+    startX.current = event.touches[0].clientX;
+    startY.current = event.touches[0].clientY;
+  };
+  const move = (event) => {
+    const touch = event.touches[0];
+    deltaX.current = touch.clientX < 0 ? 0 : touch.clientX - startX.current;
+    deltaY.current = touch.clientY - startY.current;
+    offsetX.current = Math.abs(deltaX.current);
+    offsetY.current = Math.abs(deltaY.current);
+    if (!direction.current) {
+      direction.current = getDirection(offsetX.current, offsetY.current);
+    }
+  };
+  return {
+    move,
+    start: start2,
+    reset,
+    startX,
+    startY,
+    deltaX,
+    deltaY,
+    offsetX,
+    offsetY,
+    direction,
+    isVertical,
+    isHorizontal
+  };
+}
+const canUseDom = !!(typeof window !== "undefined" && typeof document !== "undefined" && window.document && window.document.createElement);
+const defaultRoot = canUseDom ? window : void 0;
+const overflowStylePatterns = ["scroll", "auto", "overlay"];
+function isElement(node) {
+  const ELEMENT_NODE_TYPE = 1;
+  return node.nodeType === ELEMENT_NODE_TYPE;
+}
+function getScrollParent(el, root2 = defaultRoot) {
+  let node = el;
+  while (node && node !== root2 && isElement(node)) {
+    if (node === document.body) {
+      return root2;
+    }
+    const { overflowY } = window.getComputedStyle(node);
+    if (overflowStylePatterns.includes(overflowY) && node.scrollHeight > node.clientHeight) {
+      return node;
+    }
+    node = node.parentNode;
+  }
+  return root2;
+}
+let passiveSupported = false;
+if (canUseDom) {
+  try {
+    const opts = Object.defineProperty({}, "passive", {
+      get() {
+        passiveSupported = true;
+      }
+    });
+    window.addEventListener("test-passive-supported", null, opts);
+  } catch (e) {
+    console.log(e);
+  }
+}
+let totalLockCount = 0;
+const BODY_LOCK_CLASS = "nut-overflow-hidden";
+function getScrollableElement(el) {
+  let current = el == null ? void 0 : el.parentElement;
+  while (current) {
+    if (current.clientHeight < current.scrollHeight) {
+      return current;
+    }
+    current = current.parentElement;
+  }
+  return null;
+}
+function useLockScroll(rootRef, shouldLock) {
+  const touch = useTouch();
+  const onTouchMove = (event) => {
+    touch.move(event);
+    const direction = touch.deltaY.current > 0 ? "10" : "01";
+    const el = getScrollParent(
+      event.target,
+      rootRef.current
+    );
+    if (!el)
+      return;
+    if (shouldLock === "strict") {
+      const scrollableParent = getScrollableElement(event.target);
+      if (scrollableParent === document.body || scrollableParent === document.documentElement) {
+        event.preventDefault();
+        return;
+      }
+    }
+    const { scrollHeight, offsetHeight, scrollTop } = el;
+    let status = "11";
+    if (scrollTop === 0) {
+      status = offsetHeight >= scrollHeight ? "00" : "01";
+    } else if (scrollTop + offsetHeight >= scrollHeight) {
+      status = "10";
+    }
+    if (status !== "11" && touch.isVertical() && !(parseInt(status, 2) & parseInt(direction, 2))) {
+      if (event.cancelable) {
+        event.preventDefault();
+      }
+    }
+  };
+  const lock = () => {
+    document.addEventListener("touchstart", touch.start);
+    document.addEventListener(
+      "touchmove",
+      onTouchMove,
+      passiveSupported ? { passive: false } : false
+    );
+    if (!totalLockCount) {
+      document.body.classList.add(BODY_LOCK_CLASS);
+    }
+    totalLockCount++;
+  };
+  const unlock = () => {
+    if (totalLockCount) {
+      document.removeEventListener("touchstart", touch.start);
+      document.removeEventListener("touchmove", onTouchMove);
+      totalLockCount--;
+      if (!totalLockCount) {
+        document.body.classList.remove(BODY_LOCK_CLASS);
+      }
+    }
+  };
+  useEffect(() => {
+    if (shouldLock) {
+      lock();
+      return () => {
+        unlock();
+      };
+    }
+  }, [shouldLock]);
+}
 const defaultOverlayProps = {
   ...ComponentDefaults,
   zIndex: 1e3,
@@ -5681,24 +5860,12 @@ const Overlay = (props) => {
     } else {
       setInnerVisible(false);
     }
-    lock();
   }, [visible]);
-  useEffect(() => {
-    return () => {
-      document.body.classList.remove("nut-overflow-hidden");
-    };
-  }, []);
+  useLockScroll(nodeRef, !!props.lockScroll && innerVisible);
   const classes = classNames(className, classPrefix2);
   const styles = {
     ...style
   };
-  const lock = () => {
-    if (lockScroll && visible) {
-      document.body.classList.add("nut-overflow-hidden");
-    } else {
-      document.body.classList.remove("nut-overflow-hidden");
-    }
-  };
   const handleClick2 = (e) => {
     if (closeOnOverlayClick) {
       onClick && onClick(e);
@@ -5737,7 +5904,7 @@ const Overlay = (props) => {
 Overlay.defaultProps = defaultOverlayProps;
 Overlay.displayName = "NutOverlay";
 const DataContext$2 = createContext({});
-const defaultProps$1o = {
+const defaultProps$1p = {
   ...ComponentDefaults,
   span: "24",
   offset: "0",
@@ -5745,7 +5912,7 @@ const defaultProps$1o = {
 };
 const Col = (props) => {
   const { className, style, span, offset, children, onClick } = {
-    ...defaultProps$1o,
+    ...defaultProps$1p,
     ...props
   };
   const [colName, setColName] = useState("");
@@ -5777,9 +5944,9 @@ const Col = (props) => {
     children
   );
 };
-Col.defaultProps = defaultProps$1o;
+Col.defaultProps = defaultProps$1p;
 Col.displayName = "NutCol";
-const defaultProps$1n = {
+const defaultProps$1o = {
   ...ComponentDefaults,
   contentPosition: "center",
   direction: "horizontal"
@@ -5787,7 +5954,7 @@ const defaultProps$1n = {
 const classPrefix$l = `nut-divider`;
 const Divider = (props) => {
   const { children, contentPosition, style, className, direction, ...rest } = {
-    ...defaultProps$1n,
+    ...defaultProps$1o,
     ...props
   };
   const classes = direction === "horizontal" ? classNames({
@@ -5802,14 +5969,14 @@ const Divider = (props) => {
   });
   return /* @__PURE__ */ React__default.createElement("div", { className: `${classes} ${className || ""}`, style, ...rest }, children);
 };
-Divider.defaultProps = defaultProps$1n;
+Divider.defaultProps = defaultProps$1o;
 Divider.displayName = "NutDivider";
 const gridContext = {
   onClick: (item, index) => {
   }
 };
 const GridContext = React__default.createContext(gridContext);
-const defaultProps$1m = {
+const defaultProps$1n = {
   text: "",
   columns: 4,
   gap: 0,
@@ -5835,7 +6002,7 @@ const GridItem = (props) => {
     onClick,
     ...rest
   } = {
-    ...defaultProps$1m,
+    ...defaultProps$1n,
     ...props
   };
   const classPrefix2 = "nut-grid-item";
@@ -5893,9 +6060,9 @@ const GridItem = (props) => {
     /* @__PURE__ */ React__default.createElement("div", { className: contentClass() }, children && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children), text && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__text` }, text))
   );
 };
-GridItem.defaultProps = defaultProps$1m;
+GridItem.defaultProps = defaultProps$1n;
 GridItem.displayName = "NutGridItem";
-const defaultProps$1l = {
+const defaultProps$1m = {
   columns: 4,
   gap: 0,
   center: true,
@@ -5916,7 +6083,7 @@ const Grid = (props) => {
     className,
     onClick,
     ...rest
-  } = { ...defaultProps$1l, ...props };
+  } = { ...defaultProps$1m, ...props };
   const childrenDom = React__default.Children.toArray(children);
   const classPrefix2 = "nut-grid";
   const rootClass = () => {
@@ -5946,18 +6113,18 @@ const Grid = (props) => {
     });
   })));
 };
-Grid.defaultProps = defaultProps$1l;
+Grid.defaultProps = defaultProps$1m;
 Grid.displayName = "NutGrid";
 Grid.Item = GridItem;
-const defaultProps$1k = {};
+const defaultProps$1l = {};
 const Layout = (props) => {
-  ({ ...defaultProps$1k, ...props });
+  ({ ...defaultProps$1l, ...props });
   return /* @__PURE__ */ React__default.createElement("div", { className: "nut-layout" }, "Layout");
 };
-Layout.defaultProps = defaultProps$1k;
+Layout.defaultProps = defaultProps$1l;
 Layout.displayName = "NutLayout";
 const classPrefix$k = "nut-row";
-const defaultProps$1j = {
+const defaultProps$1k = {
   ...ComponentDefaults,
   type: "",
   justify: "start",
@@ -5977,7 +6144,7 @@ const Row = (props) => {
     gutter,
     onClick
   } = {
-    ...defaultProps$1j,
+    ...defaultProps$1k,
     ...props
   };
   const getClass = (prefix2, type22) => {
@@ -6009,15 +6176,15 @@ const Row = (props) => {
     children
   ));
 };
-Row.defaultProps = defaultProps$1j;
+Row.defaultProps = defaultProps$1k;
 Row.displayName = "NutRow";
 const prefixCls = "nut-space";
-const defaultProps$1i = {
+const defaultProps$1j = {
   direction: "horizontal"
 };
 const Space = (props) => {
   const { className, style, children, wrap, align, direction, justify } = {
-    ...defaultProps$1i,
+    ...defaultProps$1j,
     ...props
   };
   const cls = classNames(
@@ -6032,29 +6199,8 @@ const Space = (props) => {
     return child !== null && child !== void 0 && /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-item` }, child);
   }));
 };
-Space.defaultProps = defaultProps$1i;
+Space.defaultProps = defaultProps$1j;
 Space.displayName = "NutSpace";
-const canUseDom = !!(typeof window !== "undefined" && typeof document !== "undefined" && window.document && window.document.createElement);
-const defaultRoot = canUseDom ? window : void 0;
-const overflowStylePatterns = ["scroll", "auto", "overlay"];
-function isElement(node) {
-  const ELEMENT_NODE_TYPE = 1;
-  return node.nodeType === ELEMENT_NODE_TYPE;
-}
-function getScrollParent(el, root2 = defaultRoot) {
-  let node = el;
-  while (node && node !== root2 && isElement(node)) {
-    if (node === document.body) {
-      return root2;
-    }
-    const { overflowY } = window.getComputedStyle(node);
-    if (overflowStylePatterns.includes(overflowY) && node.scrollHeight > node.clientHeight) {
-      return node;
-    }
-    node = node.parentNode;
-  }
-  return root2;
-}
 function isWindow(val) {
   return val === window;
 }
@@ -6107,7 +6253,7 @@ function useWatch(dep, callback, config2 = { immediate: false }) {
     stop2.current = true;
   };
 }
-const defaultProps$1h = {
+const defaultProps$1i = {
   ...ComponentDefaults,
   position: "top",
   threshold: 0,
@@ -6125,7 +6271,7 @@ const Sticky = (props) => {
     threshold,
     onChange,
     ...rest
-  } = { ...defaultProps$1h, ...props };
+  } = { ...defaultProps$1i, ...props };
   const stickyRef = useRef(null);
   const rootRef = useRef(null);
   const [isFixed, setIsFixed] = useState(false);
@@ -6241,9 +6387,9 @@ const Sticky = (props) => {
     /* @__PURE__ */ React__default.createElement("div", { className: "nut-sticky--box", ref: stickyRef, style: stickyStyle }, children)
   );
 };
-Sticky.defaultProps = defaultProps$1h;
+Sticky.defaultProps = defaultProps$1i;
 Sticky.displayName = "NutSticky";
-const defaultProps$1g = {
+const defaultProps$1h = {
   ...ComponentDefaults,
   target: "",
   threshold: 200,
@@ -6261,7 +6407,7 @@ const BackTop = (props) => {
     style,
     onClick
   } = {
-    ...defaultProps$1g,
+    ...defaultProps$1h,
     ...props
   };
   const classPrefix2 = "nut-backtop";
@@ -6359,7 +6505,7 @@ const BackTop = (props) => {
     children || /* @__PURE__ */ React__default.createElement(y$2, { width: 19, height: 19, className: "nut-backtop-main" })
   );
 };
-BackTop.defaultProps = defaultProps$1g;
+BackTop.defaultProps = defaultProps$1h;
 BackTop.displayName = "NutBackTop";
 function clamp$1(v, min, max) {
   return Math.max(min, Math.min(v, max));
@@ -11477,7 +11623,7 @@ const host = createHost(primitives, {
 });
 const animated = host.animated;
 const elevatorContext = createContext({});
-const defaultProps$1f = {
+const defaultProps$1g = {
   ...ComponentDefaults,
   height: "200px",
   floorKey: "title",
@@ -11503,7 +11649,7 @@ const Elevator = (props) => {
     children,
     ...rest
   } = {
-    ...defaultProps$1f,
+    ...defaultProps$1g,
     ...props
   };
   const classPrefix2 = "nut-elevator";
@@ -11678,10 +11824,10 @@ const Elevator = (props) => {
     })
   ))) : null);
 };
-Elevator.defaultProps = defaultProps$1f;
+Elevator.defaultProps = defaultProps$1g;
 Elevator.displayName = "NutElevator";
 Elevator.Context = elevatorContext;
-const defaultProps$1e = {
+const defaultProps$1f = {
   ...ComponentDefaults,
   activeText: "",
   inactiveText: "",
@@ -11709,7 +11855,7 @@ const FixedNav = (props) => {
     content,
     ...rest
   } = {
-    ...defaultProps$1e,
+    ...defaultProps$1f,
     ...props
   };
   const classPrefix2 = "nut-fixednav";
@@ -11761,9 +11907,9 @@ const FixedNav = (props) => {
     /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__btn`, onClick: () => onUpdateValue() }, content || /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(y$7, { color: "#fff" }), /* @__PURE__ */ React__default.createElement("div", { className: "text" }, visible ? activeText || locale.fixednav.activeText : inactiveText || locale.fixednav.inactiveText)))
   );
 };
-FixedNav.defaultProps = defaultProps$1e;
+FixedNav.defaultProps = defaultProps$1f;
 FixedNav.displayName = "NutFixedNav";
-const defaultProps$1d = {
+const defaultProps$1e = {
   ...ComponentDefaults,
   left: "",
   right: "",
@@ -11786,7 +11932,7 @@ const NavBar = (props) => {
     zIndex,
     onBackClick
   } = {
-    ...defaultProps$1d,
+    ...defaultProps$1e,
     ...props
   };
   const classPrefix2 = "nut-navbar";
@@ -11823,9 +11969,9 @@ const NavBar = (props) => {
   const cls = classNames(classPrefix2, classes, className);
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, fixed && placeholder ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}--placeholder` }, renderWrapper()) : renderWrapper());
 };
-NavBar.defaultProps = defaultProps$1d;
+NavBar.defaultProps = defaultProps$1e;
 NavBar.displayName = "NutNavBar";
-const defaultProps$1c = {
+const defaultProps$1d = {
   ...ComponentDefaults,
   position: "center",
   transition: "",
@@ -11846,7 +11992,7 @@ const defaultProps$1c = {
   onCloseIconClick: (e) => true,
   ...defaultOverlayProps
 };
-let _zIndex = 1100;
+const _zIndex = 1100;
 const Popup = (props) => {
   const {
     children,
@@ -11877,12 +12023,14 @@ const Popup = (props) => {
     afterShow,
     afterClose,
     onClick
-  } = { ...defaultProps$1c, ...props };
+  } = { ...defaultProps$1d, ...props };
   const nodeRef = React__default.useRef(null);
-  const [index, setIndex] = useState(zIndex || _zIndex);
+  let innerIndex = zIndex || _zIndex;
+  const [index, setIndex] = useState(innerIndex);
   const [innerVisible, setInnerVisible] = useState(visible);
   const [showChildren, setShowChildren] = useState(true);
   const [transitionName, setTransitionName] = useState("");
+  useLockScroll(nodeRef, innerVisible && lockScroll);
   const classPrefix2 = "nut-popup";
   const baseStyle = {
     zIndex: index
@@ -11908,7 +12056,7 @@ const Popup = (props) => {
   const open = () => {
     if (!innerVisible) {
       setInnerVisible(true);
-      setIndex(++_zIndex);
+      setIndex(++innerIndex);
     }
     if (destroyOnClose) {
       setShowChildren(true);
@@ -12000,7 +12148,6 @@ const Popup = (props) => {
         className: overlayClassName,
         visible: innerVisible,
         closeOnOverlayClick,
-        zIndex,
         lockScroll,
         duration,
         onClick: onHandleClickOverlay
@@ -12016,7 +12163,7 @@ const Popup = (props) => {
   }, [position, transition]);
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, renderToContainer(portal, renderNode()));
 };
-Popup.defaultProps = defaultProps$1c;
+Popup.defaultProps = defaultProps$1d;
 Popup.displayName = "NutPopup";
 const handleClick = (e) => {
   e.stopPropagation();
@@ -12032,7 +12179,7 @@ const handleClick = (e) => {
   }
 };
 const OffsetContext = createContext(20);
-const defaultProps$1b = {
+const defaultProps$1c = {
   ...ComponentDefaults,
   position: "left",
   width: "80%"
@@ -12049,7 +12196,7 @@ const SideNavBar = (props) => {
     onClose,
     ...rest
   } = {
-    ...defaultProps$1b,
+    ...defaultProps$1c,
     ...props
   };
   const indent = props.indent ? Number(props.indent) : 20;
@@ -12081,7 +12228,7 @@ const SideNavBar = (props) => {
     )))
   );
 };
-SideNavBar.defaultProps = defaultProps$1b;
+SideNavBar.defaultProps = defaultProps$1c;
 SideNavBar.displayName = "NutSideNavBar";
 const SideNavBarItem = (props) => {
   const classPrefix2 = "nut-subsidenavbar";
@@ -12100,13 +12247,13 @@ const SideNavBarItem = (props) => {
     title
   );
 };
-const defaultProps$1a = {
+const defaultProps$1b = {
   open: true
 };
 const SubSideNavBar = (props) => {
   const classPrefix2 = "nut-subsidenavbar";
   const { title, value, children, onClick, open, ...rest } = {
-    ...defaultProps$1a,
+    ...defaultProps$1b,
     ...props
   };
   const offset = useContext(OffsetContext);
@@ -12171,19 +12318,19 @@ function usePropsValue({
     stateRef.current = value;
   }
   const setState = useCallback(
-    (v) => {
+    (v, forceTrigger = false) => {
       const prevState = stateRef.current;
       stateRef.current = v;
-      if (prevState !== stateRef.current) {
+      if (prevState !== stateRef.current || forceTrigger) {
         forceUpdate();
+        onChange == null ? void 0 : onChange(v);
       }
-      onChange == null ? void 0 : onChange(v);
     },
     [value, onChange]
   );
   return [stateRef.current, setState];
 }
-const defaultProps$19 = {
+const defaultProps$1a = {
   ...ComponentDefaults,
   value: "",
   dot: false,
@@ -12194,7 +12341,7 @@ const defaultProps$19 = {
 };
 const Badge = (props) => {
   const { className, style, value, max, children, dot, top, right, color } = {
-    ...defaultProps$19,
+    ...defaultProps$1a,
     ...props
   };
   const classPrefix2 = "nut-badge";
@@ -12221,9 +12368,9 @@ const Badge = (props) => {
   };
   return /* @__PURE__ */ React__default.createElement("div", { className: classes, style }, typeof value === "object" && value && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__icon` }, value), /* @__PURE__ */ React__default.createElement("div", null, children), /* @__PURE__ */ React__default.createElement("div", { className: contentClasses, style: getStyle() }, content()));
 };
-Badge.defaultProps = defaultProps$19;
+Badge.defaultProps = defaultProps$1a;
 Badge.displayName = "NutBadge";
-const defaultProps$18 = {
+const defaultProps$19 = {
   ...ComponentDefaults,
   title: "",
   icon: null,
@@ -12253,7 +12400,7 @@ const TabbarItem = (props) => {
     handleClick: handleClick2,
     ...rest
   } = {
-    ...defaultProps$18,
+    ...defaultProps$19,
     ...props
   };
   const classPrefix2 = "nut-tabbar-item";
@@ -12286,7 +12433,7 @@ const TabbarItem = (props) => {
     icon ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Badge, { ...badgeProps }, /* @__PURE__ */ React__default.createElement("div", { className: boxPrefix }, icon)), /* @__PURE__ */ React__default.createElement("div", { className: titleClass }, title)) : /* @__PURE__ */ React__default.createElement(Badge, { ...badgeProps }, /* @__PURE__ */ React__default.createElement("div", { className: titleClass }, title))
   );
 };
-const defaultProps$17 = {
+const defaultProps$18 = {
   ...ComponentDefaults,
   defaultValue: 0,
   fixed: false,
@@ -12309,7 +12456,7 @@ const Tabbar = (props) => {
     style,
     onSwitch
   } = {
-    ...defaultProps$17,
+    ...defaultProps$18,
     ...props
   };
   const classPrefix2 = "nut-tabbar";
@@ -12344,17 +12491,17 @@ const Tabbar = (props) => {
     (fixed || safeArea) && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__safe-area` })
   );
 };
-Tabbar.defaultProps = defaultProps$17;
+Tabbar.defaultProps = defaultProps$18;
 Tabbar.displayName = "NutTabbar";
 Tabbar.Item = TabbarItem;
-const defaultProps$16 = {
+const defaultProps$17 = {
   title: "",
   value: "",
   disabled: false
 };
 const TabPane = (props) => {
   const { children, autoHeightClassName, className, disabled } = {
-    ...defaultProps$16,
+    ...defaultProps$17,
     ...props
   };
   const classPrefix2 = "nut-tabpane";
@@ -12380,7 +12527,7 @@ function requestAniFrame() {
   };
 }
 const requestAniFrame$1 = requestAniFrame();
-const defaultProps$15 = {
+const defaultProps$16 = {
   ...ComponentDefaults,
   tabStyle: {},
   activeColor: "",
@@ -12406,7 +12553,7 @@ const Tabs = (props) => {
     autoHeight,
     ...rest
   } = {
-    ...defaultProps$15,
+    ...defaultProps$16,
     ...props
   };
   const [value, setValue] = usePropsValue({
@@ -12573,7 +12720,7 @@ const Tabs = (props) => {
     return React__default.cloneElement(child, childProps);
   }))));
 };
-Tabs.defaultProps = defaultProps$15;
+Tabs.defaultProps = defaultProps$16;
 Tabs.displayName = "NutTabs";
 Tabs.TabPane = TabPane;
 const formatTree = (tree, parent, config2) => tree.map((node) => {
@@ -12713,7 +12860,7 @@ class Tree {
   }
 }
 const Tree$1 = Tree;
-const defaultProps$14 = {
+const defaultProps$15 = {
   ...ComponentDefaults,
   activeColor: "",
   activeIcon: "checklist",
@@ -12757,7 +12904,7 @@ const InternalCascader = (props, ref) => {
     onClose,
     onChange,
     onPathChange
-  } = { ...defaultProps$14, ...props };
+  } = { ...defaultProps$15, ...props };
   const [tabvalue, setTabvalue] = useState("c1");
   const [optionsData, setOptionsData] = useState([]);
   const isLazy = () => state.configs.lazy && Boolean(state.configs.onLoad);
@@ -13054,9 +13201,9 @@ const InternalCascader = (props, ref) => {
   ) : renderTabs());
 };
 const Cascader = React__default.forwardRef(InternalCascader);
-Cascader.defaultProps = defaultProps$14;
+Cascader.defaultProps = defaultProps$15;
 Cascader.displayName = "NutCascader";
-const defaultProps$13 = {
+const defaultProps$14 = {
   ...ComponentDefaults,
   visible: false,
   type: "custom",
@@ -13083,7 +13230,7 @@ const CustomRender = (props) => {
     onPathChange,
     ...rest
   } = {
-    ...defaultProps$13,
+    ...defaultProps$14,
     ...props
   };
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, type4 === "custom" && /* @__PURE__ */ React__default.createElement(
@@ -13108,7 +13255,7 @@ const CustomRender = (props) => {
     }
   ));
 };
-const defaultProps$12 = {
+const defaultProps$13 = {
   type: "custom",
   existList: [],
   defaultIcon: null,
@@ -13127,7 +13274,7 @@ const ExistRender = (props) => {
     onSelect,
     onSwitch,
     ...rest
-  } = { ...defaultProps$12, ...props };
+  } = { ...defaultProps$13, ...props };
   const classPrefix2 = "nut-address";
   const selectedExist = (item) => {
     existList.forEach((list, index) => {
@@ -13152,7 +13299,7 @@ const ExistRender = (props) => {
     );
   })), (custom || custom && locale.address.chooseAnotherAddress) && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-footer`, onClick }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-footer-btn` }, custom)));
 };
-const defaultProps$11 = {
+const defaultProps$12 = {
   ...ComponentDefaults,
   defaultValue: [],
   type: "custom",
@@ -13194,7 +13341,7 @@ const InternalAddress = (props, ref) => {
     className,
     ...rest
   } = {
-    ...defaultProps$11,
+    ...defaultProps$12,
     ...props
   };
   const classPrefix2 = "nut-address";
@@ -13285,7 +13432,7 @@ const InternalAddress = (props, ref) => {
   ));
 };
 const Address = forwardRef(InternalAddress);
-Address.defaultProps = defaultProps$11;
+Address.defaultProps = defaultProps$12;
 Address.displayName = "NutAddress";
 const Utils = {
   /**
@@ -13535,7 +13682,7 @@ const isEnd = (day, days) => {
 const isStartAndEnd = (days) => {
   return days.length >= 2 && Utils.isEqual(days[0], days[1]);
 };
-const defaultProps$10 = {
+const defaultProps$11 = {
   ...ComponentDefaults,
   type: "single",
   autoBackfill: false,
@@ -13595,7 +13742,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     onUpdate,
     onDayClick,
     onPageChange
-  } = { ...defaultProps$10, ...props };
+  } = { ...defaultProps$11, ...props };
   const weekdays = locale.calendaritem.weekdays;
   const weeks = [
     ...weekdays.slice(firstDayOfWeek, 7),
@@ -13929,6 +14076,8 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     }
     const scrollTop = e.target.scrollTop;
     let current = Math.floor(scrollTop / avgHeight);
+    if (!monthsData[current + 1])
+      return;
     const nextTop = monthsData[current + 1].scrollTop;
     const nextHeight = monthsData[current + 1].cssHeight;
     if (current === 0) {
@@ -14129,9 +14278,9 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
   };
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", { className: classes, style }, renderHeader(), renderContent(), popup && !autoBackfill ? renderFooter() : ""));
 });
-CalendarItem.defaultProps = defaultProps$10;
+CalendarItem.defaultProps = defaultProps$11;
 CalendarItem.displayName = "NutCalendarItem";
-const defaultProps$$ = {
+const defaultProps$10 = {
   ...ComponentDefaults,
   type: "single",
   autoBackfill: false,
@@ -14194,7 +14343,7 @@ const Calendar = React__default.forwardRef((props, ref) => {
     onConfirm,
     onDayClick,
     onPageChange
-  } = { ...defaultProps$$, ...props };
+  } = { ...defaultProps$10, ...props };
   const calendarRef = useRef(null);
   const close = () => {
     onClose && onClose();
@@ -14268,8 +14417,418 @@ const Calendar = React__default.forwardRef((props, ref) => {
     renderItem()
   ) : renderItem());
 });
-Calendar.defaultProps = defaultProps$$;
+Calendar.defaultProps = defaultProps$10;
 Calendar.displayName = "NutCalendar";
+const Left = () => {
+  return /* @__PURE__ */ React__default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "18",
+      height: "18",
+      viewBox: "0 0 18 18"
+    },
+    /* @__PURE__ */ React__default.createElement("path", { d: "M6.605 9.49a.771.771 0 0 1 0-.98l3.6-4.372a.771.771 0 0 1 1.19.981L8.2 9l3.197 3.881a.771.771 0 1 1-1.191.98l-3.6-4.37Z" })
+  );
+};
+const Right = () => {
+  return /* @__PURE__ */ React__default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "18",
+      height: "18",
+      viewBox: "0 0 18 18"
+    },
+    /* @__PURE__ */ React__default.createElement("path", { d: "M11.396 9.49a.771.771 0 0 0 0-.98l-3.6-4.372a.771.771 0 0 0-1.191.981L9.8 9l-3.196 3.881a.771.771 0 0 0 1.19.98l3.6-4.37Z" })
+  );
+};
+const DoubleLeft = () => {
+  return /* @__PURE__ */ React__default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "18",
+      height: "18",
+      viewBox: "0 0 18 18"
+    },
+    /* @__PURE__ */ React__default.createElement("path", { d: "M13.853 4.026a.771.771 0 0 1 .12 1.085L10.864 9l3.11 3.889a.771.771 0 1 1-1.204.963L9.272 9.482a.771.771 0 0 1 0-.964l3.497-4.371a.771.771 0 0 1 1.084-.12Zm-5.245 0a.771.771 0 0 1 .12 1.085L5.617 9l3.111 3.889a.771.771 0 0 1-1.205.963L4.026 9.482a.771.771 0 0 1 0-.964l3.497-4.371a.771.771 0 0 1 1.085-.12Z" })
+  );
+};
+const DoubleRight = () => {
+  return /* @__PURE__ */ React__default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "18",
+      height: "18",
+      viewBox: "0 0 18 18"
+    },
+    /* @__PURE__ */ React__default.createElement("path", { d: "M4.147 13.974a.771.771 0 0 1-.12-1.085L7.136 9 4.028 5.11a.771.771 0 1 1 1.204-.963l3.497 4.371a.771.771 0 0 1 0 .964l-3.497 4.371a.771.771 0 0 1-1.084.12Zm5.245 0a.771.771 0 0 1-.12-1.085L12.383 9 9.272 5.11a.771.771 0 1 1 1.205-.963l3.497 4.371a.771.771 0 0 1 0 .964l-3.497 4.371a.771.771 0 0 1-1.085.12Z" })
+  );
+};
+const convertDateToDay = (date4) => {
+  return date4 ? {
+    year: date4.getFullYear(),
+    month: date4.getMonth() + 1,
+    date: date4.getDate()
+  } : null;
+};
+const convertDayToDate = (day) => {
+  return day ? new Date(day.year, day.month - 1, day.date) : null;
+};
+const getPrevMonthDays = (year, month, firstDayOfWeek) => {
+  let prevMonth = month - 1;
+  let prevYear = year;
+  if (prevMonth <= 0) {
+    prevMonth = 12;
+    prevYear -= 1;
+  }
+  let days = Utils.getMonthPreDay(year, month);
+  days -= firstDayOfWeek;
+  if (days >= 7) {
+    days -= 7;
+  }
+  const preDates = Utils.getMonthDays(`${prevYear}`, `${prevMonth}`);
+  const months = Array.from(Array(preDates), (_, k2) => {
+    return {
+      type: "prev",
+      year: prevYear,
+      month: prevMonth,
+      date: k2 + 1
+    };
+  });
+  return months.slice(preDates - days);
+};
+const getCurrentMonthDays = (year, month) => {
+  const days = Utils.getMonthDays(`${year}`, `${month}`);
+  return Array.from(Array(days), (_, k2) => {
+    return {
+      type: "current",
+      year,
+      month,
+      date: k2 + 1
+    };
+  });
+};
+const getCurrentWeekDays = (day, firstDayOfWeek) => {
+  const current = new Date(day.year, day.month - 1, day.date);
+  const count = (current.getDay() + 7 - firstDayOfWeek) % 7;
+  return [
+    convertDateToDay(
+      new Date(current.getTime() - 24 * 60 * 60 * 1e3 * count)
+    ),
+    convertDateToDay(
+      new Date(current.getTime() + 24 * 60 * 60 * 1e3 * (6 - count))
+    )
+  ];
+};
+const defaultProps$$ = {
+  ...ComponentDefaults,
+  type: "single",
+  firstDayOfWeek: 0
+};
+const CalendarCard = React__default.forwardRef((props, ref) => {
+  const { locale } = useConfig();
+  const {
+    style,
+    type: type4,
+    value,
+    defaultValue,
+    firstDayOfWeek,
+    startDate,
+    endDate,
+    disableDay,
+    renderDay,
+    renderDayTop,
+    renderDayBottom,
+    onDayClick,
+    onPageChange,
+    onChange
+  } = { ...defaultProps$$, ...props };
+  const [month, setMonth] = useState(() => {
+    let date4 = new Date(Date.now());
+    const val = value || defaultValue;
+    if (Array.isArray(val)) {
+      if (val.length) {
+        date4 = val[0];
+      }
+    } else if (val) {
+      date4 = val;
+    }
+    return {
+      year: date4.getFullYear(),
+      month: date4.getMonth() + 1
+    };
+  });
+  const [days, setDays] = useState([]);
+  const valueToRange = (val) => {
+    if (Array.isArray(val)) {
+      return val.map((date4) => {
+        return convertDateToDay(date4);
+      });
+    }
+    return val ? [convertDateToDay(val)] : [];
+  };
+  const rangeTovalue = (range3) => {
+    if (Array.isArray(range3)) {
+      return range3.map((day) => {
+        return convertDayToDate(day);
+      });
+    }
+    return range3 ? [convertDayToDate(range3)] : [];
+  };
+  const [innerValue, setInnerValue] = useState(() => {
+    const val = value || defaultValue ? valueToRange(value || defaultValue) : [];
+    return val;
+  });
+  useEffect(() => {
+    const val = value || defaultValue ? valueToRange(value || defaultValue) : [];
+    setInnerValue(val);
+  }, [value]);
+  const change = (v) => {
+    setInnerValue(v);
+    if (type4 === "single") {
+      const date4 = convertDayToDate(v[0]);
+      onChange == null ? void 0 : onChange(date4);
+    } else if (type4 === "multiple" || type4 === "range" || type4 === "week") {
+      const val = rangeTovalue(v);
+      onChange == null ? void 0 : onChange(val);
+    }
+  };
+  const getDays = (month2) => {
+    const y2 = month2.year;
+    const m = month2.month;
+    const days2 = [
+      ...getPrevMonthDays(y2, m, firstDayOfWeek),
+      ...getCurrentMonthDays(y2, m)
+    ];
+    const size = days2.length;
+    const yearOfNextMonth = month2.month === 12 ? month2.year + 1 : month2.year;
+    const monthOfNextMonth = month2.month === 12 ? 1 : month2.month + 1;
+    for (let i = 1; i <= 42 - size; i++) {
+      days2.push({
+        type: "next",
+        year: yearOfNextMonth,
+        month: monthOfNextMonth,
+        date: i
+      });
+    }
+    return days2;
+  };
+  useEffect(() => {
+    const newDays = getDays(month);
+    setDays(newDays);
+    onPageChange == null ? void 0 : onPageChange(month);
+  }, [month]);
+  const isSameDay = (day1, day2) => {
+    return (day1 == null ? void 0 : day1.year) === (day2 == null ? void 0 : day2.year) && (day1 == null ? void 0 : day1.month) === (day2 == null ? void 0 : day2.month) && (day1 == null ? void 0 : day1.date) === (day2 == null ? void 0 : day2.date);
+  };
+  const compareDay = (day1, day2) => {
+    if (day1 && day2) {
+      if (day1.year === day2.year) {
+        if (day1.month === day2.month) {
+          return day1.date - day2.date;
+        }
+        return day1.month - day2.month;
+      }
+      return day1.year - day2.year;
+    }
+  };
+  const isDisable = (day) => {
+    if (disableDay && disableDay(day)) {
+      return true;
+    }
+    if (startDate && Number(compareDay(day, convertDateToDay(startDate))) < 0) {
+      return true;
+    }
+    if (endDate && Number(compareDay(day, convertDateToDay(endDate))) > 0) {
+      return true;
+    }
+    return false;
+  };
+  const isActive = (day) => {
+    if (type4 === "single" || type4 === "multiple") {
+      for (const val of innerValue) {
+        if (isSameDay(day, val)) {
+          return true;
+        }
+      }
+    } else if (type4 === "range" && innerValue.length === 1 && isSameDay(innerValue[0], day)) {
+      return true;
+    }
+    return false;
+  };
+  const isStart2 = (day) => {
+    return (type4 === "range" || type4 === "week") && innerValue.length === 2 && isSameDay(day, innerValue[0]);
+  };
+  const isEnd2 = (day) => {
+    return (type4 === "range" || type4 === "week") && innerValue.length === 2 && isSameDay(day, innerValue[1]);
+  };
+  const isMid = (day) => {
+    if (type4 === "range" || type4 === "week") {
+      if (innerValue.length === 2) {
+        const c12 = compareDay(innerValue[0], day);
+        const c22 = compareDay(day, innerValue[1]);
+        if (c12 && c12 < 0 && c22 && c22 < 0) {
+          return true;
+        }
+      }
+    }
+    return false;
+  };
+  const isWeekend = (day) => {
+    const d = new Date(day.year, day.month - 1, day.date).getDay();
+    return d === 0 || d === 6;
+  };
+  const getClasses = (day) => {
+    if (isDisable(day)) {
+      return ["disabled"];
+    }
+    const res = [];
+    if (day.type === "current") {
+      if (isActive(day)) {
+        res.push("active");
+      }
+      if (isStart2(day)) {
+        res.push("start");
+      }
+      if (isEnd2(day)) {
+        res.push("end");
+      }
+      if (isMid(day)) {
+        res.push("mid");
+      }
+      if (isWeekend(day)) {
+        res.push("weekend");
+      }
+    }
+    return res;
+  };
+  const jumpTo = (year, month2) => {
+    setMonth({ year, month: month2 });
+  };
+  const jump = (step = 1) => {
+    const current = month.year * 12 + month.month;
+    let newMonth = (current + step) % 12;
+    if (newMonth === 0) {
+      newMonth = 12;
+    }
+    const newYear = Math.floor((current + step - newMonth) / 12);
+    setMonth({
+      year: newYear,
+      month: newMonth
+    });
+  };
+  React__default.useImperativeHandle(ref, () => {
+    return {
+      jump,
+      jumpTo
+    };
+  });
+  const handleDayClick = (day) => {
+    if (day.type === "prev" || day.type === "next" || isDisable(day)) {
+      return;
+    }
+    onDayClick == null ? void 0 : onDayClick(day);
+    switch (type4) {
+      case "single": {
+        if (innerValue[0] && isSameDay(innerValue[0], day)) {
+          change([]);
+        } else {
+          change([day]);
+        }
+        break;
+      }
+      case "multiple": {
+        const t = innerValue.find((i) => isSameDay(i, day));
+        if (t) {
+          change(innerValue.filter((i) => i !== t));
+        } else {
+          change([...innerValue, day]);
+        }
+        break;
+      }
+      case "range": {
+        const len = innerValue.length;
+        if (len === 0 || len === 2) {
+          change([day]);
+        } else if (len === 1) {
+          const t = compareDay(innerValue[0], day);
+          if (t === 0 || t === null || t === void 0) {
+            change([]);
+          } else if (t < 0) {
+            change([innerValue[0], day]);
+          } else {
+            change([day, innerValue[0]]);
+          }
+        } else {
+          console.warn("[NutUI] Calendar range error");
+        }
+        break;
+      }
+      case "week": {
+        if (innerValue.length === 2 || innerValue.length === 0) {
+          const [left, right] = getCurrentWeekDays(day, firstDayOfWeek);
+          change([left, right]);
+        } else {
+          console.warn("[NutUI] Calendar week error");
+        }
+        break;
+      }
+      default: {
+        console.warn("[NutUI] Calendar type error");
+      }
+    }
+  };
+  const monthTitle = locale.calendaritem.monthTitle;
+  const renderHeader = () => {
+    return /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-header" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-header-left" }, /* @__PURE__ */ React__default.createElement("div", { className: "double-left", onClick: () => jump(-12) }, /* @__PURE__ */ React__default.createElement(DoubleLeft, null)), /* @__PURE__ */ React__default.createElement("div", { className: "left", onClick: () => jump(-1) }, /* @__PURE__ */ React__default.createElement(Left, null))), /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-header-title" }, monthTitle(month.year, month.month)), /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-header-right" }, /* @__PURE__ */ React__default.createElement("div", { className: "right", onClick: () => jump(1) }, /* @__PURE__ */ React__default.createElement(Right, null)), /* @__PURE__ */ React__default.createElement("div", { className: "double-right", onClick: () => jump(12) }, /* @__PURE__ */ React__default.createElement(DoubleRight, null))));
+  };
+  const [weekHeader] = useState(() => {
+    const weekdays = locale.calendaritem.weekdays.map((day, index) => {
+      return {
+        name: day,
+        key: index
+      };
+    });
+    return [
+      ...weekdays.slice(firstDayOfWeek, 7),
+      ...weekdays.slice(0, firstDayOfWeek)
+    ];
+  });
+  const renderContent = () => {
+    return /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-content" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-days" }, weekHeader.map((day) => {
+      return /* @__PURE__ */ React__default.createElement(
+        "div",
+        {
+          className: classNames("nut-calendarcard-day", "header", {
+            weekend: day.key === 0 || day.key === 6
+          }),
+          key: day.key
+        },
+        day.name
+      );
+    })), /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-days" }, days.map((day) => /* @__PURE__ */ React__default.createElement(
+      "div",
+      {
+        className: classNames(
+          "nut-calendarcard-day",
+          day.type,
+          getClasses(day)
+        ),
+        key: `${day.year}-${day.month}-${day.date}`,
+        onClick: () => handleDayClick(day)
+      },
+      /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-day-top" }, renderDayTop ? renderDayTop(day) : ""),
+      /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-day-inner" }, renderDay ? renderDay(day) : day.date),
+      /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-day-bottom" }, renderDayBottom ? renderDayBottom(day) : "")
+    ))));
+  };
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard", style }, renderHeader(), renderContent()));
+});
+CalendarCard.defaultProps = defaultProps$$;
+CalendarCard.displayName = "NutCalendarCard";
 const CheckboxGroupContext = createContext(null);
 const Context$1 = CheckboxGroupContext;
 const defaultProps$_ = {
@@ -14493,71 +15052,6 @@ const Checkbox = (props) => {
 Checkbox.defaultProps = defaultProps$Z;
 Checkbox.displayName = "NutCheckBox";
 Checkbox.Group = CheckboxGroup;
-const MIN_DISTANCE = 10;
-function getDirection(x2, y2) {
-  if (x2 > y2 && x2 > MIN_DISTANCE) {
-    return "horizontal";
-  }
-  if (y2 > x2 && y2 > MIN_DISTANCE) {
-    return "vertical";
-  }
-  return "";
-}
-function useTouch() {
-  const [startX, SetStartX] = useState(0);
-  const [startY, SetStartY] = useState(0);
-  const [moveX, SetMoveX] = useState(0);
-  const [moveY, SetMoveY] = useState(0);
-  const [deltaX, SetDeltaX] = useState(0);
-  const [deltaY, SetDeltaY] = useState(0);
-  const [offsetX, SetOffsetX] = useState(0);
-  const [offsetY, SetOffsetY] = useState(0);
-  const [direction, SetDirection] = useState("");
-  const isVertical = () => direction === "vertical";
-  const isHorizontal = () => direction === "horizontal";
-  const reset = () => {
-    SetDeltaX(0);
-    SetDeltaY(0);
-    SetOffsetX(0);
-    SetOffsetY(0);
-    SetDirection("");
-  };
-  const start2 = (event) => {
-    reset();
-    SetStartX(event.touches[0].clientX);
-    SetStartY(event.touches[0].clientY);
-  };
-  const move = (event) => {
-    const touch = event.touches[0];
-    const dX = touch.clientX - startX;
-    const dY = touch.clientY - startY;
-    SetDeltaX(dX);
-    SetDeltaY(dY);
-    SetMoveX(touch.clientX);
-    SetMoveY(touch.clientY);
-    SetOffsetX(Math.abs(dX));
-    SetOffsetY(Math.abs(dY));
-    if (!direction) {
-      SetDirection(getDirection(offsetX, offsetY));
-    }
-  };
-  return {
-    move,
-    start: start2,
-    reset,
-    startX,
-    startY,
-    moveX,
-    moveY,
-    deltaX,
-    deltaY,
-    offsetX,
-    offsetY,
-    direction,
-    isVertical,
-    isHorizontal
-  };
-}
 const InternalPickerPanel = (props, ref) => {
   const {
     keyIndex = 0,
@@ -14629,7 +15123,7 @@ const InternalPickerPanel = (props, ref) => {
   };
   const touchStart = (event) => {
     touch.start(event);
-    setStartY(touch.deltaY);
+    setStartY(touch.deltaY.current);
     setStartTime(Date.now());
     transformY.current = scrollDistance;
   };
@@ -14639,13 +15133,13 @@ const InternalPickerPanel = (props, ref) => {
       moving.current = true;
       preventDefault2(event, true);
     }
-    const move = touch.deltaY - startY;
+    const move = touch.deltaY.current - startY;
     setMove(move);
   };
   const touchEnd = (event) => {
     if (!moving.current)
       return;
-    const move = touch.deltaY - startY;
+    const move = touch.deltaY.current - startY;
     const moveTime = Date.now() - startTime;
     if (moveTime <= INERTIA_TIME && Math.abs(move) > INERTIA_DISTANCE) {
       const distance = momentum(move, moveTime);
@@ -14723,6 +15217,19 @@ const InternalPickerPanel = (props, ref) => {
     stopMomentum,
     moving: moving.current
   }));
+  useEffect(() => {
+    var _a2, _b, _c;
+    const options22 = passiveSupported ? { passive: false } : false;
+    (_a2 = PickerPanelRef.current) == null ? void 0 : _a2.addEventListener("touchstart", touchStart, options22);
+    (_b = PickerPanelRef.current) == null ? void 0 : _b.addEventListener("touchmove", touchMove, options22);
+    (_c = PickerPanelRef.current) == null ? void 0 : _c.addEventListener("touchend", touchEnd, options22);
+    return () => {
+      var _a3, _b2, _c2;
+      (_a3 = PickerPanelRef.current) == null ? void 0 : _a3.removeEventListener("touchstart", touchStart);
+      (_b2 = PickerPanelRef.current) == null ? void 0 : _b2.removeEventListener("touchmove", touchMove);
+      (_c2 = PickerPanelRef.current) == null ? void 0 : _c2.removeEventListener("touchend", touchEnd);
+    };
+  });
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
@@ -14800,6 +15307,7 @@ const InternalPicker = (props, ref) => {
     visible,
     title,
     options: options2 = [],
+    popupProps = {},
     defaultValue = [],
     className,
     style,
@@ -14971,7 +15479,7 @@ const InternalPicker = (props, ref) => {
     if (moving) {
       isConfirmEvent.current = true;
     } else {
-      setSelectedValue(innerValue);
+      setSelectedValue(innerValue, true);
       closePicker();
     }
     setTimeout(() => {
@@ -15009,6 +15517,7 @@ const InternalPicker = (props, ref) => {
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, typeof children === "function" && children(selectedValue), /* @__PURE__ */ React__default.createElement(
     Popup,
     {
+      ...popupProps,
       visible: innerVisible,
       position: "bottom",
       afterClose: () => {
@@ -15056,6 +15565,7 @@ const DatePicker = (props) => {
     visible,
     title,
     defaultValue,
+    pickerProps = {},
     formatter,
     onClose,
     onConfirm,
@@ -15328,6 +15838,7 @@ const DatePicker = (props) => {
   return /* @__PURE__ */ React__default.createElement("div", { className: `nut-datepicker ${className}`, style, ...rest }, options2.length && /* @__PURE__ */ React__default.createElement(
     Picker$1,
     {
+      ...pickerProps,
       title,
       visible,
       options: options2,
@@ -16932,7 +17443,7 @@ const Input = forwardRef(
       }
       setValue(val);
       const eventHandler = props[trigger];
-      if (eventHandler && typeof eventHandler === "function") {
+      if (eventHandler && typeof eventHandler === "function" && trigger !== "onChange") {
         eventHandler(val);
       }
     };
@@ -18225,11 +18736,11 @@ const Range = (props) => {
     touch.move(event);
     setDragStatus("draging");
     const rect = getRect(root2.current);
-    let delta = touch.deltaX;
+    let delta = touch.deltaX.current;
     let total = rect.width;
     let diff = delta / total * scope();
     if (vertical) {
-      delta = touch.deltaY;
+      delta = touch.deltaY.current;
       total = rect.height;
       diff = delta / total * scope();
     }
@@ -20357,7 +20868,7 @@ const defaultProps$y = {
   content: "",
   closeable: false,
   wrap: false,
-  leftIcon: null,
+  leftIcon: /* @__PURE__ */ React__default.createElement(k$1, { width: 16, height: 16 }),
   rightIcon: null,
   delay: 1,
   scrollable: null,
@@ -20622,6 +21133,9 @@ const NoticeBar = (props) => {
   };
   const getStyle = (moveOffset = offset) => {
     const target = innerRef.current;
+    if (!target) {
+      return;
+    }
     let _offset = 0;
     const val = rect.height - height;
     _offset = moveOffset + Number(active === childCount - 1 && val / 2);
@@ -20679,7 +21193,7 @@ const NoticeBar = (props) => {
       stopAutoPlay();
     };
   }, []);
-  return /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2} ${className || ""}`, style }, showNoticeBar && direction === "horizontal" ? /* @__PURE__ */ React__default.createElement("div", { className: noticebarClass, style: barStyle, onClick: handleClick2 }, /* @__PURE__ */ React__default.createElement("div", { className: "left-icon" }, leftIcon || /* @__PURE__ */ React__default.createElement(k$1, { width: 16, height: 16 })), /* @__PURE__ */ React__default.createElement("div", { ref: wrapRef, className: "wrap" }, /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2} ${className || ""}`, style }, showNoticeBar && direction === "horizontal" ? /* @__PURE__ */ React__default.createElement("div", { className: noticebarClass, style: barStyle, onClick: handleClick2 }, leftIcon ? /* @__PURE__ */ React__default.createElement("div", { className: "left-icon" }, leftIcon) : null, /* @__PURE__ */ React__default.createElement("div", { ref: wrapRef, className: "wrap" }, /* @__PURE__ */ React__default.createElement(
     "div",
     {
       ref: contentRef,
@@ -21181,19 +21695,6 @@ function rubberbandIfOutOfBounds(position, min, max, dimension, constant = 0.15)
   return position;
 }
 const sleep = (time) => new Promise((resolve) => setTimeout(resolve, time));
-let passiveSupported = false;
-if (canUseDom) {
-  try {
-    const opts = Object.defineProperty({}, "passive", {
-      get() {
-        passiveSupported = true;
-      }
-    });
-    window.addEventListener("test-passive-supported", null, opts);
-  } catch (e) {
-    console.log(e);
-  }
-}
 const defaultProps$w = {
   ...ComponentDefaults,
   pullingText: "",
@@ -21590,27 +22091,29 @@ const Swipe = forwardRef((props, instanceRef) => {
   const leftWidth = actionWidth.left;
   const rightWidth = actionWidth.right;
   const onTouchStart = (event) => {
+    var _a2;
     if (!props.disabled) {
       startOffset.current = state.offset;
       touch.start(event);
-      props.onTouchStart && props.onTouchStart(event);
+      (_a2 = props.onTouchStart) == null ? void 0 : _a2.call(props, event);
     }
   };
   const onTouchMove = (event) => {
+    var _a2;
     if (props.disabled) {
       return;
     }
     touch.move(event);
-    props.onTouchMove && props.onTouchMove(event);
+    (_a2 = props.onTouchMove) == null ? void 0 : _a2.call(props, event);
     if (touch.isHorizontal()) {
       lockClick.current = true;
       const newState = { ...state, dragging: true };
-      const isEdge = !opened || touch.deltaX * startOffset.current < 0;
+      const isEdge = !opened || touch.deltaX.current * startOffset.current < 0;
       if (isEdge) {
         preventDefault(event, true);
       }
       newState.offset = rangeCalculation(
-        touch.deltaX + startOffset.current,
+        touch.deltaX.current + startOffset.current,
         -rightWidth,
         leftWidth
       );
@@ -21618,13 +22121,14 @@ const Swipe = forwardRef((props, instanceRef) => {
     }
   };
   const onTouchEnd = (event) => {
+    var _a2;
     if (state.dragging) {
       setState((v) => ({ ...v, dragging: false }));
       toggle(state.offset > 0 ? "left" : "right");
       setTimeout(() => {
         lockClick.current = false;
       }, 0);
-      props.onTouchEnd && props.onTouchEnd(event);
+      (_a2 = props.onTouchEnd) == null ? void 0 : _a2.call(props, event);
     }
   };
   const toggle = (side) => {
@@ -25345,6 +25849,7 @@ export {
   Barrage,
   Button,
   Calendar,
+  CalendarCard,
   CalendarItem,
   Card,
   Cascader,