@nutui/nutui-react 1.2.0 → 1.2.1-beta.0

package/dist/nutui.react.es.js

@@ -1,10 +1,10 @@
 /*!
-* @nutui/nutui-react v1.2.0 Wed Jul 27 2022 11:40:25 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.2.1-beta.0 Wed Aug 03 2022 15:53:50 GMT+0800 (China Standard Time)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
 import * as React from "react";
-import React__default, { useCallback, useState, useEffect, Component, useRef, createContext, useContext as useContext$1, useImperativeHandle, forwardRef, useMemo, memo } from "react";
+import React__default, { useCallback, useState, useEffect, Component, useRef, createContext, useContext as useContext$1, useImperativeHandle, useLayoutEffect as useLayoutEffect$1, forwardRef, useMemo, memo } from "react";
 import * as ReactDOM from "react-dom";
 import ReactDOM__default, { unstable_batchedUpdates } from "react-dom";
 var classname = { exports: {} };
@@ -45,10 +45,11 @@ classname_production_min.cn = e$1, classname_production_min.withNaming = r$1;
   classname.exports = classname_production_min;
 }
 const cn = classname.exports.withNaming({ n: "nut-", e: "__", m: "--", v: "-" });
-const defaultProps$13 = {
+const defaultProps$14 = {
   name: "",
   size: "",
-  classPrefix: "nutui-iconfont",
+  classPrefix: "nutui-icon",
+  fontClassName: "nutui-iconfont",
   color: "",
   tag: "i",
   click: (e2) => {
@@ -67,11 +68,12 @@ const Icon = (props) => {
     tag,
     children,
     className,
+    fontClassName,
     style,
     click,
     ...rest
   } = {
-    ...defaultProps$13,
+    ...defaultProps$14,
     ...props
   };
   const isImage = name ? name.indexOf("/") !== -1 : false;
@@ -88,7 +90,9 @@ const Icon = (props) => {
     return {};
   };
   return React__default.createElement(type, {
-    className: isImage ? `${className || ""} ${b2("img")}` : `${className || ""} ${b2(null, [classPrefix])} nut-icon-${name} `,
+    className: isImage ? `${className || ""} ${b2("img")}` : `${className || ""} ${fontClassName} ${b2(null, [
+      classPrefix
+    ])} nut-icon-${name} `,
     style: {
       color,
       fontSize: pxCheck$2(size),
@@ -101,9 +105,9 @@ const Icon = (props) => {
     ...hasSrc()
   }, children);
 };
-Icon.defaultProps = defaultProps$13;
+Icon.defaultProps = defaultProps$14;
 Icon.displayName = "NutIcon";
-const defaultProps$12 = {
+const defaultProps$13 = {
   className: "",
   color: "",
   shape: "round",
@@ -136,7 +140,7 @@ const Button = (props) => {
     style,
     ...rest
   } = {
-    ...defaultProps$12,
+    ...defaultProps$13,
     ...props
   };
   const getStyle = useCallback(() => {
@@ -209,7 +213,7 @@ const Button = (props) => {
     name: icon
   }) : "", children));
 };
-Button.defaultProps = defaultProps$12;
+Button.defaultProps = defaultProps$13;
 Button.displayName = "NutButton";
 function _setPrototypeOf(o, p2) {
   _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf2(o2, p3) {
@@ -1425,7 +1429,7 @@ var useContext = React__default.useContext;
 function useHistory() {
   return useContext(historyContext);
 }
-const defaultProps$11 = {
+const defaultProps$12 = {
   title: null,
   subTitle: null,
   desc: "",
@@ -1465,7 +1469,7 @@ const Cell = (props) => {
     linkSlot,
     ...rest
   } = {
-    ...defaultProps$11,
+    ...defaultProps$12,
     ...props
   };
   const b2 = cn("cell");
@@ -1511,9 +1515,9 @@ const Cell = (props) => {
     className: b2("link")
   }) : linkSlot));
 };
-Cell.defaultProps = defaultProps$11;
+Cell.defaultProps = defaultProps$12;
 Cell.displayName = "NutCell";
-const defaultProps$10 = {
+const defaultProps$11 = {
   title: "",
   desc: "",
   titleSlot: null,
@@ -1522,7 +1526,7 @@ const defaultProps$10 = {
 };
 const CellGroup = (props) => {
   const { children, classPrefix, title, desc, titleSlot, descSlot } = {
-    ...defaultProps$10,
+    ...defaultProps$11,
     ...props
   };
   const b2 = cn("cell-group");
@@ -1536,7 +1540,7 @@ const CellGroup = (props) => {
     className: b2("wrap")
   }, children));
 };
-CellGroup.defaultProps = defaultProps$10;
+CellGroup.defaultProps = defaultProps$11;
 CellGroup.displayName = "NutCellGroup";
 var classnames = { exports: {} };
 /*!
@@ -2076,7 +2080,7 @@ CSSTransition.defaultProps = {
 };
 CSSTransition.propTypes = {};
 var CSSTransition$1 = CSSTransition;
-const defaultProps$$ = {
+const defaultProps$10 = {
   position: "center",
   transition: "",
   style: {},
@@ -2232,7 +2236,7 @@ const Popup = (props) => {
     size: "12px"
   })) : "")));
 };
-Popup.defaultProps = defaultProps$$;
+Popup.defaultProps = defaultProps$10;
 Popup.displayName = "NutPopup";
 const zhCN = {
   save: "\u4FDD\u5B58",
@@ -2326,7 +2330,7 @@ const zhCN = {
     additionalImages: (length) => `${length}\u5F20\u8FFD\u8BC4\u56FE\u7247`
   }
 };
-const defaultProps$_ = {
+const defaultProps$$ = {
   locale: zhCN
 };
 const defaultConfigRef = {
@@ -2343,7 +2347,7 @@ const useConfig = () => {
 };
 const ConfigContext = createContext(null);
 const ConfigProvider = (props) => {
-  const { children, ...config2 } = { ...defaultProps$_, ...props };
+  const { children, ...config2 } = { ...defaultProps$$, ...props };
   const parentConfig = useConfig();
   return /* @__PURE__ */ React__default.createElement(ConfigContext.Provider, {
     value: {
@@ -2352,25 +2356,25 @@ const ConfigProvider = (props) => {
     }
   }, children);
 };
-ConfigProvider.defaultProps = defaultProps$_;
+ConfigProvider.defaultProps = defaultProps$$;
 ConfigProvider.displayName = "NutConfigProvider";
-const defaultProps$Z = {};
+const defaultProps$_ = {};
 const Layout = (props) => {
-  ({ ...defaultProps$Z, ...props });
+  ({ ...defaultProps$_, ...props });
   return /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-layout"
   }, "Layout");
 };
-Layout.defaultProps = defaultProps$Z;
+Layout.defaultProps = defaultProps$_;
 Layout.displayName = "NutLayout";
 const DataContext$2 = createContext({});
-const defaultProps$Y = {
+const defaultProps$Z = {
   span: "24",
   offset: "0",
   gutter: "0"
 };
 const Col = (props) => {
-  const { span, offset, children } = { ...defaultProps$Y, ...props };
+  const { span, offset, children } = { ...defaultProps$Z, ...props };
   const [colName, setColName] = useState("");
   const [colStyle, setColStyle] = useState({});
   const { gutter } = useContext$1(DataContext$2);
@@ -2393,9 +2397,9 @@ const Col = (props) => {
     style: { ...colStyle }
   }, children);
 };
-Col.defaultProps = defaultProps$Y;
+Col.defaultProps = defaultProps$Z;
 Col.displayName = "NutCol";
-const defaultProps$X = {
+const defaultProps$Y = {
   type: "",
   justify: "start",
   align: "flex-start",
@@ -2404,7 +2408,7 @@ const defaultProps$X = {
 };
 const Row = (props) => {
   const { children, type, justify, align, wrap, gutter } = {
-    ...defaultProps$X,
+    ...defaultProps$Y,
     ...props
   };
   const prefixCls = "nut-row";
@@ -2429,9 +2433,9 @@ const Row = (props) => {
     className: getClasses()
   }, children));
 };
-Row.defaultProps = defaultProps$X;
+Row.defaultProps = defaultProps$Y;
 Row.displayName = "NutRow";
-const defaultProps$W = {
+const defaultProps$X = {
   contentPosition: "center",
   dashed: false,
   hairline: true,
@@ -2447,7 +2451,7 @@ const Divider = (props) => {
     className,
     direction
   } = {
-    ...defaultProps$W,
+    ...defaultProps$X,
     ...props
   };
   const dividerBem = cn("divider");
@@ -2467,58 +2471,109 @@ const Divider = (props) => {
     style: styles
   }, children);
 };
-Divider.defaultProps = defaultProps$W;
+Divider.defaultProps = defaultProps$X;
 Divider.displayName = "NutDivider";
-const defaultProps$V = {
+const defaultProps$W = {
   title: "",
   desc: "",
-  leftShow: false,
-  icon: "",
+  leftShow: true,
   titIcon: "",
-  className: ""
+  className: "",
+  leftText: "",
+  fixed: false,
+  safeAreaInsetTop: false,
+  border: false,
+  placeholder: false,
+  zIndex: 10,
+  style: {}
 };
 const NavBar = (props) => {
   const {
     desc,
-    icon,
     title,
     titIcon,
     leftShow,
     className,
     style,
+    leftText,
+    fixed,
+    safeAreaInsetTop,
+    border,
+    placeholder,
+    zIndex,
     onClickTitle,
     onClickIcon,
     onClickBack,
-    onClickClear
+    onClickRight
   } = {
-    ...defaultProps$V,
+    ...defaultProps$W,
     ...props
   };
   const b2 = cn("navbar");
-  return /* @__PURE__ */ React__default.createElement("div", {
-    className: `nut-navbar ${className}`,
-    style
-  }, leftShow && /* @__PURE__ */ React__default.createElement("i", {
-    className: ["nut-icon", "nutui-iconfont", `${b2("back")}`].join(" "),
-    onClick: (e2) => onClickBack(e2)
-  }), /* @__PURE__ */ React__default.createElement("div", {
-    className: `${b2("title")}`,
-    onClick: (e2) => onClickTitle(e2)
-  }, title, titIcon && /* @__PURE__ */ React__default.createElement(Icon, {
-    name: titIcon
-  })), /* @__PURE__ */ React__default.createElement("div", {
-    className: `${b2("desc")}`,
-    onClick: (e2) => onClickClear(e2)
-  }, desc), icon && /* @__PURE__ */ React__default.createElement("div", {
-    className: `${b2("icon")}`,
-    onClick: (e2) => onClickIcon(e2)
-  }, /* @__PURE__ */ React__default.createElement(Icon, {
-    name: icon
-  })));
+  const children = Array.isArray(props.children) ? props.children : [props.children];
+  const slot = children.reduce((slot2, item) => {
+    const data = slot2;
+    if (item && item.props) {
+      data[item.props.slot] = item;
+    }
+    return data;
+  }, {});
+  const styles = () => {
+    return {
+      ...style,
+      zIndex
+    };
+  };
+  const renderLeft = () => {
+    return /* @__PURE__ */ React__default.createElement("div", {
+      className: `${b2("left")}`,
+      onClick: (e2) => onClickBack(e2)
+    }, leftShow && /* @__PURE__ */ React__default.createElement(Icon, {
+      name: "left",
+      color: "#979797"
+    }), leftText && /* @__PURE__ */ React__default.createElement("div", {
+      className: `${b2("text")}`
+    }, leftText), slot.left);
+  };
+  const renderContent = () => {
+    return /* @__PURE__ */ React__default.createElement("div", {
+      className: `${b2("title")}`
+    }, title && /* @__PURE__ */ React__default.createElement("div", {
+      className: "title",
+      onClick: (e2) => onClickTitle(e2)
+    }, title), titIcon && /* @__PURE__ */ React__default.createElement("div", {
+      onClick: (e2) => onClickIcon(e2)
+    }, /* @__PURE__ */ React__default.createElement(Icon, {
+      name: titIcon
+    })), slot.content);
+  };
+  const renderRight = () => {
+    return /* @__PURE__ */ React__default.createElement("div", {
+      className: `${b2("right")}`,
+      onClick: (e2) => onClickRight(e2)
+    }, desc && /* @__PURE__ */ React__default.createElement("div", {
+      className: `${b2("text")}`
+    }, desc), slot.right);
+  };
+  const renderWrapper = () => {
+    return /* @__PURE__ */ React__default.createElement("div", {
+      className: cls,
+      style: styles()
+    }, renderLeft(), renderContent(), renderRight());
+  };
+  const classes = classNames({
+    [`nut-navbar--border`]: border,
+    [`nut-navbar--fixed`]: fixed,
+    [`nut-navbar--safe-area-inset-top`]: safeAreaInsetTop
+  });
+  const cls = classNames(b2(""), classes, className);
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, fixed && placeholder ? /* @__PURE__ */ React__default.createElement("div", {
+    className: `${b2("")}--placeholder`
+  }, renderWrapper()) : renderWrapper());
 };
-NavBar.defaultProps = defaultProps$V;
+NavBar.defaultProps = defaultProps$W;
 NavBar.displayName = "NutNavBar";
-const defaultProps$U = {
+const defaultProps$V = {
   fixednavClass: "nut-fixednav",
   activeText: "\u6536\u8D77\u5BFC\u822A",
   unActiveText: "\u5FEB\u901F\u5BFC\u822A",
@@ -2544,7 +2599,7 @@ const FixedNav = (props) => {
     slotList,
     slotBtn,
     ...rest
-  } = { ...defaultProps$U, ...props };
+  } = { ...defaultProps$V, ...props };
   const b2 = cn("fixednav");
   const classes = classNames({
     active: visible
@@ -2590,9 +2645,9 @@ const FixedNav = (props) => {
     className: "text"
   }, visible ? locale.fixednav.activeText || activeText : locale.fixednav.unActiveText || unActiveText))));
 };
-FixedNav.defaultProps = defaultProps$U;
+FixedNav.defaultProps = defaultProps$V;
 FixedNav.displayName = "NutFixedNav";
-const defaultProps$T = {
+const defaultProps$U = {
   visible: 0,
   bottom: false,
   type: "",
@@ -2615,7 +2670,7 @@ const Tabbar = (props) => {
     style,
     tabSwitch
   } = {
-    ...defaultProps$T,
+    ...defaultProps$U,
     ...props
   };
   const b2 = cn("tabbar");
@@ -2644,9 +2699,9 @@ const Tabbar = (props) => {
     return React__default.cloneElement(child, childProps);
   }));
 };
-Tabbar.defaultProps = defaultProps$T;
+Tabbar.defaultProps = defaultProps$U;
 Tabbar.displayName = "NutTabbar";
-const defaultProps$S = {
+const defaultProps$T = {
   tabTitle: "",
   icon: "",
   href: "",
@@ -2672,7 +2727,7 @@ const TabbarItem = (props) => {
     index: index2,
     handleClick
   } = {
-    ...defaultProps$S,
+    ...defaultProps$T,
     ...props
   };
   const b2 = cn("tabbar-item");
@@ -2710,10 +2765,14 @@ const TabbarItem = (props) => {
     ])
   }, tabTitle)));
 };
-const defaultProps$R = {
+const elevatorContext = createContext({});
+const defaultProps$S = {
   height: "200px",
   acceptKey: "title",
   indexList: [],
+  isSticky: false,
+  spaceHeight: 23,
+  titleHeight: 35,
   className: ""
 };
 const Elevator = (props) => {
@@ -2721,37 +2780,44 @@ const Elevator = (props) => {
     height,
     acceptKey,
     indexList,
+    isSticky,
+    spaceHeight,
+    titleHeight,
     className,
     clickItem,
     clickIndex,
+    children,
     ...rest
   } = {
-    ...defaultProps$R,
+    ...defaultProps$S,
     ...props
   };
   const b2 = cn("elevator");
-  const spaceHeight = 23;
   const listview = useRef(null);
   const initData = {
     anchorIndex: 0,
     listHeight: [],
-    listGroup: []
+    listGroup: [],
+    scrollY: 0,
+    diff: -1,
+    fixedTop: 0
   };
   const touchState = useRef({
     y1: 0,
     y2: 0
   });
+  const [scrollY, setScrollY] = useState(0);
+  const [currentData, setCurrentData] = useState({});
+  const [currentKey, setCurrentKey] = useState("");
   const [currentIndex, setCurrentIndex] = useState(0);
+  const [codeIndex, setCodeIndex] = useState(0);
   const [scrollStart, setScrollStart] = useState(false);
   const state = useRef(initData);
   const resetScrollState = () => {
-    state.current.anchorIndex = 0;
-    setCurrentIndex(0);
     setScrollStart(false);
-    touchState.current = {
-      y1: 0,
-      y2: 0
-    };
+  };
+  const clientHeight = () => {
+    return listview.current ? listview.current.clientHeight : 0;
   };
   const getData = (el, name) => {
     const prefix2 = "data-";
@@ -2773,21 +2839,24 @@ const Elevator = (props) => {
     if (!state.current.listHeight.length) {
       calculateHeight();
     }
-    if (index2 < 0)
-      index2 = 0;
-    if (index2 > state.current.listHeight.length - 2)
-      index2 = state.current.listHeight.length - 2;
-    setCurrentIndex(index2);
+    let cacheIndex = index2;
+    if (index2 < 0) {
+      cacheIndex = 0;
+    }
+    if (index2 > state.current.listHeight.length - 2) {
+      cacheIndex = state.current.listHeight.length - 2;
+    }
+    setCodeIndex(cacheIndex);
     if (listview.current) {
-      listview.current.scrollTo(0, state.current.listHeight[index2]);
+      listview.current.scrollTo(0, state.current.listHeight[cacheIndex]);
     }
   };
   const touchMove = (e2) => {
     const firstTouch = e2.touches[0];
     touchState.current.y2 = firstTouch.pageY;
-    const delta = (touchState.current.y2 - touchState.current.y1) / spaceHeight | 0;
+    const delta = (touchState.current.y2 - touchState.current.y1) / spaceHeight || 0;
     const cacheIndex = state.current.anchorIndex + delta;
-    setCurrentIndex(cacheIndex);
+    setCodeIndex(cacheIndex);
     scrollTo(cacheIndex);
   };
   const touchEnd = () => {
@@ -2799,7 +2868,7 @@ const Elevator = (props) => {
     const firstTouch = e2.touches[0];
     touchState.current.y1 = firstTouch.pageY;
     state.current.anchorIndex = +index2;
-    setCurrentIndex((currentIndex2) => currentIndex2 + index2);
+    setCodeIndex((codeIndex2) => codeIndex2 + index2);
     scrollTo(index2);
     const target = e2.currentTarget;
     target.removeEventListener("touchend", touchEnd, false);
@@ -2807,6 +2876,8 @@ const Elevator = (props) => {
   };
   const handleClickItem = (key, item) => {
     clickItem && clickItem(key, item);
+    setCurrentData(item);
+    setCurrentKey(key);
   };
   const handleClickIndex = (key) => {
     clickIndex && clickIndex(key);
@@ -2821,34 +2892,77 @@ const Elevator = (props) => {
       });
     }
   };
+  const listViewScroll = (e2) => {
+    const { listHeight } = state.current;
+    if (!listHeight.length) {
+      calculateHeight();
+    }
+    const target = e2.target;
+    const { scrollTop } = target;
+    state.current.scrollY = scrollTop;
+    setScrollY(scrollTop);
+    for (let i = 0; i < listHeight.length - 1; i++) {
+      const height1 = listHeight[i];
+      const height2 = listHeight[i + 1];
+      if (state.current.scrollY >= height1 && state.current.scrollY < height2) {
+        setCurrentIndex(i);
+        state.current.diff = height2 - state.current.scrollY;
+        return;
+      }
+    }
+    setCurrentIndex(listHeight.length - 2);
+  };
   useEffect(() => {
     if (listview.current) {
       setListGroup();
+      listview.current.addEventListener("scroll", listViewScroll);
+    }
+  }, [listview]);
+  useEffect(() => {
+    const { listHeight, diff, scrollY: scrollY2 } = state.current;
+    let fixedTop = diff > 0 && diff < titleHeight ? diff - titleHeight : 0;
+    if (scrollY2 + clientHeight() === listHeight[listHeight.length - 1]) {
+      if (fixedTop !== 0) {
+        fixedTop = 0;
+      }
     }
-  }, [listview.current]);
+    if (state.current.fixedTop === fixedTop)
+      return;
+    state.current.fixedTop = fixedTop;
+  }, [state.current.diff, titleHeight]);
   return /* @__PURE__ */ React__default.createElement("div", {
     className: `${b2()} ${className}`,
     ...rest
-  }, /* @__PURE__ */ React__default.createElement("div", {
+  }, isSticky && scrollY > 0 ? /* @__PURE__ */ React__default.createElement("div", {
+    className: b2("list__fixed")
+  }, /* @__PURE__ */ React__default.createElement("span", {
+    className: "fixed-title"
+  }, indexList[currentIndex][acceptKey])) : null, /* @__PURE__ */ React__default.createElement("div", {
     className: b2("list"),
-    ref: listview,
-    style: { height: isNaN(+height) ? height : `${height}px` }
-  }, indexList.map((item) => {
+    style: { height: Number.isNaN(+height) ? height : `${height}px` }
+  }, /* @__PURE__ */ React__default.createElement("div", {
+    className: b2("list__inner"),
+    ref: listview
+  }, indexList.map((item, idx) => {
     return /* @__PURE__ */ React__default.createElement("div", {
       className: b2("list__item"),
-      key: item[acceptKey]
+      key: idx
     }, /* @__PURE__ */ React__default.createElement("div", {
       className: b2("list__item__code")
     }, item[acceptKey]), /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, item.list.map((subitem) => {
       return /* @__PURE__ */ React__default.createElement("div", {
-        className: b2("list__item__name"),
+        className: b2("list__item__name", {
+          highcolor: currentData.id === subitem.id && currentKey === item[acceptKey]
+        }),
         key: subitem.id,
         onClick: () => handleClickItem(item[acceptKey], subitem)
-      }, subitem.name);
+      }, children ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(elevatorContext.Provider, {
+        value: subitem
+      }, children)) : subitem.name);
     })));
-  })), indexList.length && scrollStart ? /* @__PURE__ */ React__default.createElement("div", {
-    className: b2("code", { current: true })
-  }, " ", indexList[currentIndex][acceptKey]) : null, /* @__PURE__ */ React__default.createElement("div", {
+  }))), indexList.length && scrollStart ? /* @__PURE__ */ React__default.createElement("div", {
+    className: b2("code--current", { current: true })
+  }, indexList[codeIndex][acceptKey]) : null, /* @__PURE__ */ React__default.createElement("div", {
     className: b2("bars"),
     onTouchStart: (event) => touchStart(event),
     onTouchMove: (event) => touchMove(event)
@@ -2856,16 +2970,18 @@ const Elevator = (props) => {
     className: b2("bars__inner")
   }, indexList.map((item, index2) => {
     return /* @__PURE__ */ React__default.createElement("div", {
-      className: b2("bars__inner__item"),
+      className: b2("bars__inner__item", {
+        active: item[acceptKey] === indexList[currentIndex][acceptKey]
+      }),
       "data-index": index2,
-      key: item[acceptKey],
+      key: index2,
       onClick: () => handleClickIndex(item[acceptKey])
     }, item[acceptKey]);
   }))));
 };
-Elevator.defaultProps = defaultProps$R;
+Elevator.defaultProps = defaultProps$S;
 Elevator.displayName = "NutElevator";
-const defaultProps$Q = {
+const defaultProps$R = {
   defaultValue: 1,
   mode: "multi",
   prevText: "",
@@ -2882,7 +2998,7 @@ const defaultProps$Q = {
 };
 const Pagination = (props) => {
   const { locale } = useConfig();
-  ({ ...defaultProps$Q, ...props });
+  ({ ...defaultProps$R, ...props });
   const {
     modelValue,
     mode,
@@ -2999,7 +3115,7 @@ const Pagination = (props) => {
     onClick: (e2) => selectPage(Number(currentPage) + 1, true)
   }, nextText || locale.pagination.next));
 };
-Pagination.defaultProps = defaultProps$Q;
+Pagination.defaultProps = defaultProps$R;
 Pagination.displayName = "NutPagination";
 class Title {
   constructor() {
@@ -3009,7 +3125,7 @@ class Title {
     this.index = 0;
   }
 }
-const defaultProps$P = {
+const defaultProps$Q = {
   value: 0,
   color: "",
   background: "",
@@ -3019,7 +3135,8 @@ const defaultProps$P = {
   ellipsis: true,
   animatedTime: 300,
   titleGutter: 0,
-  size: "normal"
+  size: "normal",
+  autoHeight: false
 };
 const pxCheck$1 = (value) => {
   return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
@@ -3041,8 +3158,9 @@ const Tabs = (props) => {
     onClick,
     onChange,
     className,
+    autoHeight,
     ...rest
-  } = { ...defaultProps$P, ...props };
+  } = { ...defaultProps$Q, ...props };
   const [currentItem, setCurrentItem] = useState({ index: 0 });
   const titles = useRef([]);
   useEffect(() => {
@@ -3105,7 +3223,10 @@ const Tabs = (props) => {
     return /* @__PURE__ */ React__default.createElement("div", {
       style: titleStyle,
       onClick: (e2) => tabChange(item),
-      className: classNames({ active: item.paneKey === value, disabled: item.disabled }, `${b2("")}__titles-item`),
+      className: classNames({
+        active: String(item.paneKey) === String(value),
+        disabled: item.disabled
+      }, `${b2("")}__titles-item`),
       key: item.paneKey
     }, type === "line" && /* @__PURE__ */ React__default.createElement("div", {
       className: `${b2("")}__titles-item__line`,
@@ -3125,38 +3246,45 @@ const Tabs = (props) => {
     className: `${b2("")}__content`,
     style: contentStyle
   }, React__default.Children.map(children, (child, idx) => {
+    var _a;
     if (!React__default.isValidElement(child)) {
       return null;
     }
-    const childProps = {
+    let childProps = {
       ...child.props,
       activeKey: value
     };
+    if (String(value) !== String(((_a = child.props) == null ? void 0 : _a.paneKey) || idx) && autoHeight) {
+      childProps = {
+        ...childProps,
+        autoHeightClassName: "inactive"
+      };
+    }
     return React__default.cloneElement(child, childProps);
   })));
 };
-Tabs.defaultProps = defaultProps$P;
+Tabs.defaultProps = defaultProps$Q;
 Tabs.displayName = "NutTabs";
-const defaultProps$O = {
+const defaultProps$P = {
   title: "",
   paneKey: "",
   activeKey: "",
   disabled: false
 };
 const TabPane = (props) => {
-  const { children, paneKey, activeKey } = {
-    ...defaultProps$O,
+  const { children, paneKey, activeKey, autoHeightClassName } = {
+    ...defaultProps$P,
     ...props
   };
   const b2 = cn("tabpane");
   const classes = classNames({
     active: paneKey === activeKey
-  }, b2(""));
+  }, b2(""), autoHeightClassName);
   return /* @__PURE__ */ React__default.createElement("div", {
     className: classes
   }, children);
 };
-const defaultProps$N = {
+const defaultProps$O = {
   size: 3,
   current: 1,
   block: false,
@@ -3176,7 +3304,7 @@ const Indicator = (props) => {
     vertical,
     ...rest
   } = {
-    ...defaultProps$N,
+    ...defaultProps$O,
     ...props
   };
   const b2 = cn("indicator");
@@ -3205,7 +3333,7 @@ const Indicator = (props) => {
     ...rest
   }, renderEles());
 };
-Indicator.defaultProps = defaultProps$N;
+Indicator.defaultProps = defaultProps$O;
 Indicator.displayName = "NutIndicator";
 const MIN_DISTANCE = 10;
 function getDirection(x2, y2) {
@@ -3486,7 +3614,7 @@ var Toast = {
     }
   }
 };
-const defaultProps$M = {
+const defaultProps$N = {
   range: false,
   hiddenRange: false,
   hiddenTag: false,
@@ -3516,7 +3644,7 @@ const Range = (props) => {
     change,
     dragStart,
     dragEnd
-  } = { ...defaultProps$M, ...props };
+  } = { ...defaultProps$N, ...props };
   const [buttonIndex, SetButtonIndex] = useState(0);
   const [initValue, SetInitValue] = useState();
   const [dragStatus, SetDragStatus] = useState("start");
@@ -3725,7 +3853,7 @@ const Range = (props) => {
     className: "max"
   }, +max) : null);
 };
-Range.defaultProps = defaultProps$M;
+Range.defaultProps = defaultProps$N;
 Range.displayName = "NutRange";
 const Utils = {
   isLeapYear(y2) {
@@ -3819,7 +3947,7 @@ function requestAniFrame() {
   };
 }
 var requestAniFrame$1 = requestAniFrame();
-const defaultProps$L = {
+const defaultProps$M = {
   type: "one",
   isAutoBackFill: false,
   poppable: true,
@@ -3848,7 +3976,7 @@ const CalendarItem = (props) => {
     onChoose,
     onUpdate,
     onClose
-  } = { ...defaultProps$L, ...props };
+  } = { ...defaultProps$M, ...props };
   const weeks = locale.calendaritem.weekdays;
   const [yearMonthTitle, setYearMonthTitle] = useState("");
   const [unLoadPrev, setUnLoadPrev] = useState(false);
@@ -4244,9 +4372,9 @@ const CalendarItem = (props) => {
     onClick: confirm2
   }, locale.confirm)) : ""));
 };
-CalendarItem.defaultProps = defaultProps$L;
+CalendarItem.defaultProps = defaultProps$M;
 CalendarItem.displayName = "NutCalendarItem";
-const defaultProps$K = {
+const defaultProps$L = {
   type: "one",
   isAutoBackFill: false,
   poppable: true,
@@ -4274,7 +4402,7 @@ const Calendar = (props) => {
     endDate,
     onClose,
     onChoose
-  } = { ...defaultProps$K, ...props };
+  } = { ...defaultProps$L, ...props };
   const close = () => {
     onClose && onClose();
   };
@@ -4317,33 +4445,43 @@ const Calendar = (props) => {
     onChoose: choose
   }));
 };
-Calendar.defaultProps = defaultProps$K;
+Calendar.defaultProps = defaultProps$L;
 Calendar.displayName = "NutCalendar";
-const defaultProps$J = {
+const defaultProps$K = {
   disabled: false,
   checkedValue: [],
+  max: void 0,
   onChange: (value) => {
   }
 };
 const CheckboxGroup = React__default.forwardRef((props, ref) => {
-  const { children } = { ...defaultProps$J, ...props };
+  const { children } = { ...defaultProps$K, ...props };
   const b2 = cn("checkboxgroup");
-  const { className, disabled, onChange, checkedValue, ...rest } = props;
+  const { className, disabled, onChange, checkedValue, max, ...rest } = props;
   const [innerDisabled, setInnerDisabled] = useState(disabled);
   const [innerValue, setInnerValue] = useState(checkedValue);
   useImperativeHandle(ref, () => ({
     toggleAll(state) {
-      console.log(state);
       if (state === false) {
         setInnerValue([]);
       } else {
         const childrenLabel = [];
         React__default.Children.map(children, (child) => {
           const childProps = child.props;
+          console.log(child);
           childrenLabel.push(childProps.label || child.children);
         });
         setInnerValue(childrenLabel);
       }
+    },
+    toggleReverse() {
+      const childrenLabel = [];
+      React__default.Children.map(children, (child) => {
+        const childProps = child.props;
+        childrenLabel.push(childProps.label || child.children);
+      });
+      const reverse = childrenLabel.filter((c6) => (innerValue == null ? void 0 : innerValue.findIndex((v2) => v2 === c6)) === -1);
+      setInnerValue(reverse);
     }
   }));
   useEffect(() => {
@@ -4351,6 +4489,8 @@ const CheckboxGroup = React__default.forwardRef((props, ref) => {
     setInnerValue(checkedValue);
   }, [disabled, checkedValue]);
   function handleChildChange(state, label) {
+    if (max !== void 0 && innerValue && innerValue.length > max)
+      return;
     if (innerValue) {
       let clippedValue = [];
       if (state) {
@@ -4368,6 +4508,9 @@ const CheckboxGroup = React__default.forwardRef((props, ref) => {
       return false;
     return (innerValue == null ? void 0 : innerValue.indexOf(child.props.label || child.children)) > -1;
   }
+  function getParentVals() {
+    return innerValue;
+  }
   function cloneChildren() {
     return React__default.Children.map(children, (child) => {
       const childChecked = validateChildChecked(child);
@@ -4377,7 +4520,9 @@ const CheckboxGroup = React__default.forwardRef((props, ref) => {
       return React__default.cloneElement(child, {
         disabled: innerDisabled,
         checked: childChecked,
-        onChange: handleChildChange
+        onChange: handleChildChange,
+        getParentVals,
+        max
       });
     });
   }
@@ -4386,20 +4531,23 @@ const CheckboxGroup = React__default.forwardRef((props, ref) => {
     ...rest
   }, cloneChildren());
 });
-CheckboxGroup.defaultProps = defaultProps$J;
+CheckboxGroup.defaultProps = defaultProps$K;
 CheckboxGroup.displayName = "NutCheckboxGroup";
-const defaultProps$I = {
+const defaultProps$J = {
   checked: false,
   disabled: false,
   textPosition: "right",
   iconSize: 18,
   iconName: "check-normal",
   iconActiveName: "checked",
+  iconClassPrefix: "nut-icon",
+  iconFontClassName: "nutui-iconfont",
+  iconIndeterminateName: "check-disabled",
   onChange: (state, label) => {
   }
 };
 const Checkbox = (props) => {
-  const { children } = { ...defaultProps$I, ...props };
+  const { children } = { ...defaultProps$J, ...props };
   const b2 = cn("checkbox");
   const {
     iconName,
@@ -4411,34 +4559,67 @@ const Checkbox = (props) => {
     checked,
     disabled,
     onChange,
+    indeterminate,
+    iconClassPrefix,
+    iconFontClassName,
+    iconIndeterminateName,
+    getParentVals,
+    max,
     ...rest
   } = props;
   const [innerChecked, setInnerChecked] = useState(checked);
   const [innerDisabled, setDisabled] = useState(disabled);
+  const [_indeterminate, setIndeterminate] = useState(indeterminate);
   useEffect(() => {
     setInnerChecked(checked);
     setDisabled(disabled);
   }, [disabled, checked]);
+  useEffect(() => {
+    setIndeterminate(indeterminate);
+  }, [indeterminate]);
+  const getIconName = () => {
+    if (!innerChecked) {
+      return iconName;
+    }
+    if (_indeterminate) {
+      return iconIndeterminateName;
+    }
+    return iconActiveName;
+  };
   const renderIcon = () => {
     return /* @__PURE__ */ React__default.createElement(Icon, {
-      name: innerChecked ? iconActiveName : iconName,
+      name: getIconName(),
       size: iconSize,
-      color: color()
+      className: color(),
+      classPrefix: iconClassPrefix,
+      fontClassName: iconFontClassName
     });
   };
   const color = () => {
-    return !innerDisabled ? !innerChecked ? "#d6d6d6" : "#fa2c19" : "#f5f5f5";
+    if (innerDisabled) {
+      return "nut-checkbox__icon--disable";
+    }
+    if (innerChecked) {
+      if (_indeterminate) {
+        return "nut-checkbox__icon--indeterminate";
+      }
+      return "nut-checkbox__icon";
+    }
+    return "nut-checkbox__icon--unchecked";
   };
   const renderLabel = () => {
     return /* @__PURE__ */ React__default.createElement("span", {
       className: `${b2("label", { disabled: innerDisabled })} `
-    }, label || children);
+    }, children || label);
   };
   const handleClick = () => {
-    if (disabled)
-      return;
-    onChange && onChange(!innerChecked, label || children);
-    return setInnerChecked(!innerChecked);
+    if (!disabled) {
+      const latest = !innerChecked;
+      if (max !== void 0 && latest && getParentVals().length >= max)
+        return;
+      onChange && onChange(latest, label || children);
+      setInnerChecked(latest);
+    }
   };
   return /* @__PURE__ */ React__default.createElement("div", {
     className: `${b2({ reverse: textPosition === "left" })} ${className || ""}`,
@@ -4446,7 +4627,7 @@ const Checkbox = (props) => {
     onClick: handleClick
   }, renderIcon(), renderLabel());
 };
-Checkbox.defaultProps = defaultProps$I;
+Checkbox.defaultProps = defaultProps$J;
 Checkbox.displayName = "NutCheckBox";
 Checkbox.Group = CheckboxGroup;
 const InternalPickerSlot = (props, ref) => {
@@ -4759,7 +4940,7 @@ const InternalPicker = (props, ref) => {
 };
 const Picker = React__default.forwardRef(InternalPicker);
 const currentYear = new Date().getFullYear();
-const defaultProps$H = {
+const defaultProps$I = {
   modelValue: new Date(),
   visible: false,
   title: "",
@@ -4786,7 +4967,7 @@ const DatePicker = (props) => {
     style,
     ...rest
   } = {
-    ...defaultProps$H,
+    ...defaultProps$I,
     ...props
   };
   const [show, setShow] = useState(false);
@@ -5021,9 +5202,9 @@ const DatePicker = (props) => {
     ref: pickerRef
   }));
 };
-DatePicker.defaultProps = defaultProps$H;
+DatePicker.defaultProps = defaultProps$I;
 DatePicker.displayName = "NutDatePicker";
-const defaultProps$G = {
+const defaultProps$H = {
   disabled: false,
   buttonSize: "",
   min: 1,
@@ -5061,7 +5242,7 @@ const InputNumber = (props) => {
     focus,
     ...restProps
   } = {
-    ...defaultProps$G,
+    ...defaultProps$H,
     ...props
   };
   const [inputValue, setInputValue] = useState(modelValue);
@@ -5182,7 +5363,7 @@ const InputNumber = (props) => {
     click: addNumber
   }));
 };
-InputNumber.defaultProps = defaultProps$G;
+InputNumber.defaultProps = defaultProps$H;
 InputNumber.displayName = "NutInputNumber";
 function trimExtraChar(value, char, regExp) {
   const index2 = value.indexOf(char);
@@ -5198,7 +5379,7 @@ function formatNumber(value, allowDot = true, allowMinus = true) {
   if (allowDot) {
     value = trimExtraChar(value, ".", /\./g);
   } else {
-    value = value.replace(/\./g, "");
+    value = value.split(".")[0];
   }
   if (allowMinus) {
     value = trimExtraChar(value, "-", /-/g);
@@ -5208,130 +5389,304 @@ function formatNumber(value, allowDot = true, allowMinus = true) {
   const regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g;
   return value.replace(regExp, "");
 }
-const defaultProps$F = {
+const defaultProps$G = {
   type: "text",
   defaultValue: "",
   placeholder: "",
   label: "",
-  requireShow: false,
+  labelClass: "",
+  labelWidth: "80",
+  labelAlign: "left",
+  colon: false,
+  inputAlign: "left",
+  center: false,
+  required: false,
   disabled: false,
   readonly: false,
-  textAlign: "left",
-  maxLength: "",
-  clearable: true
+  error: false,
+  maxlength: "9999",
+  leftIcon: "",
+  leftIconSize: "",
+  rightIcon: "",
+  rightIconSize: "",
+  clearable: false,
+  clearIcon: "mask-close",
+  clearSize: "14",
+  border: true,
+  formatTrigger: "onChange",
+  rules: [],
+  rows: null,
+  errorMessage: "",
+  errorMessageAlign: "",
+  showWordLimit: false,
+  autofocus: false,
+  slotButton: null,
+  slotInput: null
 };
 const Input = (props) => {
   const { locale } = useConfig();
   const {
+    children,
     type,
     defaultValue,
     placeholder,
     label,
-    requireShow,
+    labelClass,
+    labelWidth,
+    labelAlign,
+    colon,
+    inputAlign,
+    center,
+    required,
     disabled,
     readonly,
-    textAlign,
-    maxLength,
+    error,
+    maxlength,
+    leftIcon,
+    leftIconSize,
+    rightIcon,
+    rightIconSize,
     clearable,
+    clearIcon,
+    clearSize,
+    border,
+    formatTrigger,
+    rules,
+    errorMessage,
+    errorMessageAlign,
+    showWordLimit,
+    autofocus,
     style,
     className,
+    rows,
+    slotButton,
+    slotInput,
     change,
     blur,
     focus,
-    clear
-  } = { ...defaultProps$F, ...props };
+    clear,
+    formatter,
+    keypress,
+    clickInput,
+    clickLeftIcon,
+    clickRightIcon,
+    click,
+    ...rest
+  } = { ...defaultProps$G, ...props };
   locale.placeholder = placeholder || locale.placeholder;
-  const inputBem = cn("input");
   const [inputValue, SetInputValue] = useState("");
   const [active, SetActive] = useState(false);
+  const [classes, setClasses] = useState("");
+  const getModelValue = () => String(inputValue != null ? inputValue : "");
+  const inputRef = useRef(null);
+  useLayoutEffect$1(() => {
+    updateValue(getModelValue(), formatTrigger);
+  });
   useEffect(() => {
+    setClasses(inputClass);
     if (defaultValue) {
       SetInputValue(defaultValue);
     }
   }, [defaultValue]);
-  const valueChange = (event) => {
-    let val = event.target.value;
+  useEffect(() => {
+    if (inputValue) {
+      updateValue(getModelValue());
+      resetValidation();
+    }
+  }, [inputValue]);
+  const inputClass = useCallback(() => {
+    const prefixCls = "nut-input";
+    return [
+      prefixCls,
+      `${center ? "center" : ""}`,
+      `${disabled ? `${prefixCls}-disabled` : ""}`,
+      `${required ? `${prefixCls}-required` : ""}`,
+      `${error ? `${prefixCls}-error` : ""}`,
+      `${border ? `${prefixCls}-border` : ""}`
+    ].filter(Boolean).join(" ");
+  }, [disabled, required, error, border]);
+  const updateValue = (value, trigger = "onChange") => {
+    var _a;
+    let val = value;
     if (type === "digit") {
-      val = formatNumber(val, true);
+      val = formatNumber(val, false, false);
     }
     if (type === "number") {
-      val = formatNumber(val, false);
+      val = formatNumber(val, true, true);
     }
-    if (maxLength && val.length > Number(maxLength)) {
-      val = val.slice(0, Number(maxLength));
+    if (formatter && trigger === formatTrigger) {
+      val = formatter(val);
+    }
+    if (((_a = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _a.value) !== val) {
+      inputRef.current.value = val;
     }
-    change && change(val, event);
     SetInputValue(val);
   };
-  const valueFocus = (event) => {
+  const onFocus = (event) => {
     const val = event.target.value;
     SetActive(true);
-    if (focus) {
-      focus(val, event);
+    focus && focus(val, event);
+  };
+  const onInput = (event) => {
+    let val = event.target.value;
+    if (maxlength && val.length > Number(maxlength)) {
+      val = val.slice(0, Number(maxlength));
     }
+    updateValue(val);
+    change && change(val, event);
   };
-  const valueBlur = (event) => {
+  const onBlur = (event) => {
     setTimeout(() => {
       SetActive(false);
-    }, 0);
-    const val = event.target.value;
-    if (blur) {
-      blur(val, event);
+    }, 200);
+    let val = event.target.value;
+    if (maxlength && val.length > Number(maxlength)) {
+      val = val.slice(0, Number(maxlength));
     }
+    updateValue(getModelValue(), "onBlur");
+    blur && blur(val, event);
   };
-  const handleClear = (event) => {
-    if (clear) {
-      clear("", event);
+  const onClickInput = (event) => {
+    clickInput && clickInput(event);
+  };
+  const onClickLeftIcon = (event) => {
+    clickLeftIcon && clickLeftIcon(event);
+  };
+  const onClickRightIcon = (event) => {
+    clickRightIcon && clickRightIcon(event);
+  };
+  const resetValidation = () => {
+  };
+  const inputType = (type2) => {
+    if (type2 === "number") {
+      return "text";
+    }
+    if (type2 === "digit") {
+      return "tel";
     }
-    SetInputValue("");
+    return type2;
   };
-  const textAlignStyle = {
-    textAlign
+  const handleClear = (event) => {
+    updateValue("");
+    clear && clear("", event);
   };
   return /* @__PURE__ */ React__default.createElement("div", {
-    className: `${inputBem()} ${disabled ? inputBem("disabled") : ""}  ${className || ""}`
+    className: `${classes}  ${className || ""}`,
+    style,
+    ...rest,
+    onClick: (e2) => {
+      click && click(e2);
+    }
+  }, slotInput ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", {
+    className: `nut-input-label ${labelClass}`,
+    style: { width: `${labelWidth}px`, textAlign: labelAlign }
+  }, /* @__PURE__ */ React__default.createElement("div", {
+    className: "label-string"
+  }, label, colon ? ":" : "")), /* @__PURE__ */ React__default.createElement("div", {
+    className: "nut-input-value"
+  }, /* @__PURE__ */ React__default.createElement("div", {
+    className: "nut-input-inner",
+    onClick: (e2) => {
+      onClickInput(e2);
+    }
+  }, slotInput))) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, leftIcon && leftIcon.length > 0 ? /* @__PURE__ */ React__default.createElement("div", {
+    className: "nut-input-left-icon",
+    onClick: (e2) => {
+      onClickLeftIcon(e2);
+    }
+  }, /* @__PURE__ */ React__default.createElement(Icon, {
+    name: leftIcon,
+    size: leftIconSize
+  })) : null, /* @__PURE__ */ React__default.createElement("div", {
+    className: `nut-input-label ${labelClass}`,
+    style: { width: `${labelWidth}px`, textAlign: labelAlign }
   }, /* @__PURE__ */ React__default.createElement("div", {
-    className: inputBem("label")
-  }, requireShow ? /* @__PURE__ */ React__default.createElement("div", {
-    className: inputBem("require")
-  }, "*") : null, label ? /* @__PURE__ */ React__default.createElement("div", {
     className: "label-string"
-  }, label) : null), /* @__PURE__ */ React__default.createElement("input", {
+  }, label, colon ? ":" : "")), /* @__PURE__ */ React__default.createElement("div", {
+    className: "nut-input-value"
+  }, /* @__PURE__ */ React__default.createElement("div", {
+    className: "nut-input-inner",
+    onClick: (e2) => {
+      onClickInput(e2);
+    }
+  }, type === "textarea" ? /* @__PURE__ */ React__default.createElement("textarea", {
     className: "input-text",
-    type,
-    placeholder,
+    ref: inputRef,
+    style: {
+      textAlign: inputAlign,
+      height: `${Number(rows) * 24}px`
+    },
+    maxLength: maxlength,
+    placeholder: placeholder || locale.placeholder,
     disabled,
     readOnly: readonly,
     value: inputValue,
-    style: { ...style, ...textAlignStyle },
-    maxLength,
+    autoFocus: autofocus,
     onBlur: (e2) => {
-      valueBlur(e2);
+      onBlur(e2);
     },
     onFocus: (e2) => {
-      valueFocus(e2);
+      onFocus(e2);
     },
-    onChange: (e2) => {
-      valueChange(e2);
+    onInput: (e2) => {
+      onInput(e2);
     }
-  }), clearable && !readonly && active ? /* @__PURE__ */ React__default.createElement("div", {
-    onClick: (e2) => {
-      handleClear(e2);
+  }) : /* @__PURE__ */ React__default.createElement("input", {
+    className: "input-text",
+    ref: inputRef,
+    style: { textAlign: inputAlign },
+    type: inputType(type),
+    maxLength: maxlength,
+    placeholder: placeholder || locale.placeholder,
+    disabled,
+    readOnly: readonly,
+    value: inputValue,
+    autoFocus: autofocus,
+    onBlur: (e2) => {
+      onBlur(e2);
     },
-    className: inputBem("clear")
-  }, active && inputValue.length > 0 ? /* @__PURE__ */ React__default.createElement(Icon, {
-    name: "close-little",
-    size: "12px"
-  }) : null) : null);
+    onFocus: (e2) => {
+      onFocus(e2);
+    },
+    onInput: (e2) => {
+      onInput(e2);
+    }
+  }), clearable && !readonly && active && inputValue.length > 0 ? /* @__PURE__ */ React__default.createElement(Icon, {
+    className: "nut-input-clear",
+    name: clearIcon,
+    size: clearSize,
+    click: (e2) => {
+      handleClear(e2);
+    }
+  }) : null, rightIcon && rightIcon.length > 0 ? /* @__PURE__ */ React__default.createElement("div", {
+    className: "nut-input-right-icon",
+    onClick: (e2) => {
+      onClickRightIcon(e2);
+    }
+  }, /* @__PURE__ */ React__default.createElement(Icon, {
+    name: rightIcon,
+    size: rightIconSize
+  })) : null, slotButton ? /* @__PURE__ */ React__default.createElement("div", {
+    className: "nut-input-button"
+  }, slotButton) : null), showWordLimit && maxlength ? /* @__PURE__ */ React__default.createElement("div", {
+    className: "nut-input-word-limit"
+  }, /* @__PURE__ */ React__default.createElement("span", {
+    className: "nut-input-word-num"
+  }, inputValue ? inputValue.length : 0), "/", maxlength) : null, errorMessage ? /* @__PURE__ */ React__default.createElement("div", {
+    className: "nut-input-error-message",
+    style: {
+      textAlign: errorMessageAlign
+    }
+  }, errorMessage) : null)));
 };
-Input.defaultProps = defaultProps$F;
+Input.defaultProps = defaultProps$G;
 Input.displayName = "NutInput";
 const radioContext = {
   onChange: (val) => {
   }
 };
 var RadioContext = React__default.createContext(radioContext);
-const defaultProps$E = {
+const defaultProps$F = {
   value: null,
   textPosition: "right",
   onChange: (value) => {
@@ -5339,7 +5694,7 @@ const defaultProps$E = {
   direction: "vertical"
 };
 const RadioGroup = React__default.forwardRef((props, ref) => {
-  const { children } = { ...defaultProps$E, ...props };
+  const { children } = { ...defaultProps$F, ...props };
   cn("RadioGroup");
   const { className, value, onChange, textPosition, direction, ...rest } = props;
   const [val2State, setVal2State] = useState(value);
@@ -5375,9 +5730,9 @@ const RadioGroup = React__default.forwardRef((props, ref) => {
     ...rest
   }, cloneChildren()));
 });
-RadioGroup.defaultProps = defaultProps$E;
+RadioGroup.defaultProps = defaultProps$F;
 RadioGroup.displayName = "NutRadioGroup";
-const defaultProps$D = {
+const defaultProps$E = {
   disabled: false,
   checked: false,
   shape: "round",
@@ -5390,7 +5745,7 @@ const defaultProps$D = {
   }
 };
 const Radio = (props) => {
-  const { children } = { ...defaultProps$D, ...props };
+  const { children } = { ...defaultProps$E, ...props };
   const {
     className,
     disabled,
@@ -5449,10 +5804,10 @@ const Radio = (props) => {
     ...rest
   }, props.shape == "button" ? renderButton() : reverseState ? [renderLabel(), renderIcon()] : [renderIcon(), renderLabel()]);
 };
-Radio.defaultProps = defaultProps$D;
+Radio.defaultProps = defaultProps$E;
 Radio.displayName = "NutRadio";
 Radio.RadioGroup = RadioGroup;
-const defaultProps$C = {
+const defaultProps$D = {
   count: 5,
   modelValue: 0,
   minimizeValue: 0,
@@ -5481,7 +5836,7 @@ const Rate = (props) => {
     allowHalf,
     spacing,
     change
-  } = { ...defaultProps$C, ...props };
+  } = { ...defaultProps$D, ...props };
   const b2 = cn("rate");
   const bi = cn("rate-item");
   const [countArray, setCountArray] = useState([1, 2, 3, 4, 5]);
@@ -5545,9 +5900,9 @@ const Rate = (props) => {
     }));
   }));
 };
-Rate.defaultProps = defaultProps$C;
+Rate.defaultProps = defaultProps$D;
 Rate.displayName = "NutRate";
-const defaultProps$B = {
+const defaultProps$C = {
   title: "\u8BF7\u8F93\u5165\u5BC6\u7801",
   desc: "\u60A8\u4F7F\u7528\u4E86\u865A\u62DF\u8D44\u4EA7\uFF0C\u8BF7\u8FDB\u884C\u9A8C\u8BC1",
   tips: "\u5FD8\u8BB0\u5BC6\u7801",
@@ -5707,9 +6062,9 @@ const ShortPassword = (props) => {
     onClick: () => sure()
   }, locale.confirm)) : null)));
 };
-ShortPassword.defaultProps = defaultProps$B;
+ShortPassword.defaultProps = defaultProps$C;
 ShortPassword.displayName = "NutShortPassword";
-const defaultProps$A = {
+const defaultProps$B = {
   defaultValue: "",
   textAlign: "left",
   limitshow: false,
@@ -5737,7 +6092,7 @@ const TextArea = (props) => {
     onChange,
     onBlur,
     onFocus
-  } = { ...defaultProps$A, ...props };
+  } = { ...defaultProps$B, ...props };
   const textareaBem = cn("textarea");
   const [inputValue, SetInputValue] = useState("");
   useEffect(() => {
@@ -5801,7 +6156,7 @@ const TextArea = (props) => {
     className: textareaBem("limit")
   }, inputValue.length, "/", maxlength < 0 ? 0 : maxlength) : null);
 };
-TextArea.defaultProps = defaultProps$A;
+TextArea.defaultProps = defaultProps$B;
 TextArea.displayName = "NutTextArea";
 class UploadOptions {
   constructor() {
@@ -5850,7 +6205,7 @@ class Upload {
     }
   }
 }
-const defaultProps$z = {
+const defaultProps$A = {
   url: "",
   maximum: 1,
   uploadIcon: "photograph",
@@ -5925,7 +6280,7 @@ const InternalUploader = (props, ref) => {
     beforeUpload,
     beforeDelete,
     ...restProps
-  } = { ...defaultProps$z, ...props };
+  } = { ...defaultProps$A, ...props };
   const [fileList, setFileList] = useState([]);
   const [uploadQueue, setUploadQueue] = useState([]);
   useEffect(() => {
@@ -6214,9 +6569,9 @@ const InternalUploader = (props, ref) => {
   })));
 };
 const Uploader = React__default.forwardRef(InternalUploader);
-Uploader.defaultProps = defaultProps$z;
+Uploader.defaultProps = defaultProps$A;
 Uploader.displayName = "NutUploader";
-const defaultProps$y = {
+const defaultProps$z = {
   cancelTxt: "",
   optionTag: "name",
   optionSubTag: "subname",
@@ -6249,7 +6604,7 @@ const ActionSheet = (props) => {
     className,
     style,
     ...rest
-  } = { ...defaultProps$y, ...props };
+  } = { ...defaultProps$z, ...props };
   const b2 = cn("actionsheet");
   const isHighlight = (item) => {
     return props.chooseTagValue && props.chooseTagValue === item[props.optionTag || "name"] ? props.color : "#1a1a1a";
@@ -6293,12 +6648,12 @@ const ActionSheet = (props) => {
     onClick: () => cancelActionSheet()
   }, cancelTxt)));
 };
-ActionSheet.defaultProps = defaultProps$y;
+ActionSheet.defaultProps = defaultProps$z;
 ActionSheet.displayName = "NutActionSheet";
-const defaultProps$x = {
+const defaultProps$y = {
   bottom: 20,
   right: 10,
-  elId: "",
+  elId: "body",
   distance: 200,
   zIndex: 10,
   isAnimation: true,
@@ -6316,9 +6671,9 @@ const BackTop = (props) => {
     className,
     duration,
     style,
-    backTopClick
+    onClick
   } = {
-    ...defaultProps$x,
+    ...defaultProps$y,
     ...props
   };
   const [backTop, SetBackTop] = useState(false);
@@ -6357,11 +6712,11 @@ const BackTop = (props) => {
   };
   const scrollAnimation = () => {
     let cid = requestAniFrame2()(function fn() {
-      const t2 = duration - Math.max(0, startTime - +new Date() + duration);
+      const t2 = duration - Math.max(0, startTime - +new Date() + duration / 2);
       const y2 = t2 * -scrollTop / duration + scrollTop;
       scroll(y2);
       cid = requestAniFrame2()(fn);
-      if (t2 == duration || y2 == 0) {
+      if (t2 === duration || y2 === 0) {
         window.cancelAnimationFrame(cid);
       }
     });
@@ -6385,7 +6740,7 @@ const BackTop = (props) => {
     (_b = scrollEl.current) == null ? void 0 : _b.removeEventListener("resize", scrollListener, false);
   }
   const goTop = (e2) => {
-    backTopClick(e2);
+    onClick && onClick(e2);
     const otime = +new Date();
     startTime = otime;
     isAnimation && duration > 0 ? scrollAnimation() : scroll();
@@ -6398,14 +6753,16 @@ const BackTop = (props) => {
   return /* @__PURE__ */ React__default.createElement("div", {
     className: `nut-backtop ${backTop ? "show" : ""} ${className || ""}`,
     style: { ...backTopClass, ...style },
-    onClick: goTop
+    onClick: (e2) => {
+      goTop(e2);
+    }
   }, children || /* @__PURE__ */ React__default.createElement(Icon, {
     size: "19px",
     className: "nut-backtop-main",
     name: "top"
   }));
 };
-BackTop.defaultProps = defaultProps$x;
+BackTop.defaultProps = defaultProps$y;
 BackTop.displayName = "NutBackTop";
 function clamp(v2, min, max) {
   return Math.max(min, Math.min(v2, max));
@@ -10808,7 +11165,7 @@ const host = createHost(primitives, {
   }
 });
 const animated = host.animated;
-const defaultProps$w = {
+const defaultProps$x = {
   attract: false,
   direction: void 0,
   boundary: {
@@ -10821,7 +11178,7 @@ const defaultProps$w = {
 };
 const Drag = (props) => {
   const { attract, direction, boundary, children, className, style, ...reset } = {
-    ...defaultProps$w,
+    ...defaultProps$x,
     ...props
   };
   const b2 = cn("drag");
@@ -10880,7 +11237,7 @@ const Drag = (props) => {
     ...bind()
   }, children));
 };
-Drag.defaultProps = defaultProps$w;
+Drag.defaultProps = defaultProps$x;
 Drag.displayName = "NutDrag";
 const Content = (props) => {
   const {
@@ -11072,7 +11429,7 @@ function confirm(config2, renderFunc) {
     update: update2
   };
 }
-const defaultProps$v = {
+const defaultProps$w = {
   okText: "",
   cancelText: "",
   mask: true,
@@ -11163,9 +11520,9 @@ Dialog.confirm = (props) => {
     });
   };
 });
-Dialog.defaultProps = defaultProps$v;
+Dialog.defaultProps = defaultProps$w;
 Dialog.displayName = "NutDialog";
-const defaultProps$u = {
+const defaultProps$v = {
   hasMore: true,
   threshold: 200,
   containerId: "",
@@ -11199,7 +11556,7 @@ const Infiniteloading = (props) => {
     scrollChange,
     ...restProps
   } = {
-    ...defaultProps$u,
+    ...defaultProps$v,
     ...props
   };
   const [isInfiniting, setIsInfiniting] = useState(false);
@@ -11356,7 +11713,7 @@ const Infiniteloading = (props) => {
     className: "tips"
   }, locale.infiniteloading.loadMoreText || loadMoreTxt)));
 };
-Infiniteloading.defaultProps = defaultProps$u;
+Infiniteloading.defaultProps = defaultProps$v;
 Infiniteloading.displayName = "NutInfiniteloading";
 class Notification extends React.PureComponent {
   constructor(props) {
@@ -11515,7 +11872,7 @@ var Notify = {
     }
   }
 };
-const defaultProps$t = {
+const defaultProps$u = {
   isAsync: false,
   checked: false,
   disable: false,
@@ -11538,7 +11895,7 @@ const Switch = (props) => {
     className,
     style
   } = {
-    ...defaultProps$t,
+    ...defaultProps$u,
     ...props
   };
   const [value, setValue] = useState(false);
@@ -11578,10 +11935,10 @@ const Switch = (props) => {
     className: `${b2("label")} close`
   }, inactiveText))));
 };
-Switch.defaultProps = defaultProps$t;
+Switch.defaultProps = defaultProps$u;
 Switch.displayName = "NutSwitch";
 const isObject = (val) => val !== null && typeof val === "object";
-const defaultProps$s = {
+const defaultProps$t = {
   strokeWidth: 5,
   radius: 50,
   strokeLinecap: "round",
@@ -11604,7 +11961,7 @@ const CircleProgress = (props) => {
     strokeLinecap,
     ...restProps
   } = {
-    ...defaultProps$s,
+    ...defaultProps$t,
     ...props
   };
   const b2 = cn("circleprogress");
@@ -11688,9 +12045,9 @@ const CircleProgress = (props) => {
     className: "nut-circleprogress-text"
   }, children || /* @__PURE__ */ React__default.createElement("div", null, progress, "%")));
 };
-CircleProgress.defaultProps = defaultProps$s;
+CircleProgress.defaultProps = defaultProps$t;
 CircleProgress.displayName = "NutCircleProgress";
-const defaultProps$r = {
+const defaultProps$s = {
   direction: "across",
   list: [],
   standTime: 1e3,
@@ -11728,7 +12085,7 @@ const NoticeBar = (props) => {
     rightIcon,
     close,
     click
-  } = { ...defaultProps$r, ...props };
+  } = { ...defaultProps$s, ...props };
   const wrap = useRef(null);
   const content = useRef(null);
   const [showNoticeBar, SetShowNoticeBar] = useState(true);
@@ -11941,16 +12298,16 @@ const NoticeBar = (props) => {
     size: "11px"
   }) : null))) : null);
 };
-NoticeBar.defaultProps = defaultProps$r;
+NoticeBar.defaultProps = defaultProps$s;
 NoticeBar.displayName = "NutNoticeBar";
 const DataContext$1 = createContext({});
-const defaultProps$q = {
+const defaultProps$r = {
   current: 0,
   direction: "horizontal",
   progressDot: false
 };
 const Steps = (props) => {
-  const propSteps = { ...defaultProps$q, ...props };
+  const propSteps = { ...defaultProps$r, ...props };
   const {
     children,
     current,
@@ -11975,9 +12332,9 @@ const Steps = (props) => {
     ...restProps
   }, children));
 };
-Steps.defaultProps = defaultProps$q;
+Steps.defaultProps = defaultProps$r;
 Steps.displayName = "NutSteps";
-const defaultProps$p = {
+const defaultProps$q = {
   title: "",
   content: "",
   activeIndex: 0,
@@ -11998,7 +12355,7 @@ const Step = (props) => {
     renderContent,
     ...restProps
   } = {
-    ...defaultProps$p,
+    ...defaultProps$q,
     ...props
   };
   const parent = useContext$1(DataContext$1);
@@ -12010,13 +12367,24 @@ const Step = (props) => {
     return index2 === +parent.propSteps.current ? "process" : "wait";
   };
   const handleClickStep = () => {
-    var _a;
-    (_a = parent.propSteps) == null ? void 0 : _a.clickStep(activeIndex);
+    var _a, _b;
+    if ((_a = parent.propSteps) == null ? void 0 : _a.clickStep) {
+      (_b = parent.propSteps) == null ? void 0 : _b.clickStep(activeIndex);
+    }
   };
   const b2 = cn("step");
   const classes = classNames({
     [`${b2("")}-${getCurrentStatus()}`]: true
   }, className, b2(""));
+  const renderIconClass = () => {
+    if (!dot && icon) {
+      return "nut-step-icon is-icon";
+    }
+    if (!dot && !icon) {
+      return "nut-step-icon is-text";
+    }
+    return "nut-step-icon";
+  };
   return /* @__PURE__ */ React__default.createElement("div", {
     className: classes,
     ...restProps,
@@ -12026,13 +12394,13 @@ const Step = (props) => {
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-step-line"
   }), /* @__PURE__ */ React__default.createElement("div", {
-    className: `nut-step-icon ${!dot ? icon ? "is-icon" : "is-text" : ""}`
+    className: renderIconClass()
   }, icon ? /* @__PURE__ */ React__default.createElement(Icon, {
     className: "nut-step-icon-inner",
     color: iconColor,
     name: icon,
     size
-  }) : dot ? /* @__PURE__ */ React__default.createElement("span", null) : /* @__PURE__ */ React__default.createElement("span", {
+  }) : !dot && /* @__PURE__ */ React__default.createElement("span", {
     className: "nut-step-inner"
   }, activeIndex))), /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-step-main"
@@ -12044,10 +12412,10 @@ const Step = (props) => {
     className: "nut-step-content"
   }, renderContent())));
 };
-Step.defaultProps = defaultProps$p;
+Step.defaultProps = defaultProps$q;
 Step.displayName = "NutStep";
 const DataContext = createContext({});
-const defaultProps$o = {
+const defaultProps$p = {
   width: typeof window === "object" ? window.innerWidth : 375,
   height: 0,
   duration: 500,
@@ -12064,7 +12432,7 @@ const defaultProps$o = {
 };
 const DISTANCE = 5;
 const Swiper = React__default.forwardRef((props, ref) => {
-  const propSwiper = { ...defaultProps$o, ...props };
+  const propSwiper = { ...defaultProps$p, ...props };
   const {
     children,
     direction,
@@ -12453,13 +12821,13 @@ const Swiper = React__default.forwardRef((props, ref) => {
     });
   })) : /* @__PURE__ */ React__default.createElement("div", null, pageContent)));
 });
-Swiper.defaultProps = defaultProps$o;
+Swiper.defaultProps = defaultProps$p;
 Swiper.displayName = "NutSwiper";
-const defaultProps$n = {
+const defaultProps$o = {
   direction: "horizontal"
 };
 const SwiperItem = React__default.forwardRef((props, ref) => {
-  const _props = { ...defaultProps$n, ...props };
+  const _props = { ...defaultProps$o, ...props };
   const { children, direction, size } = _props;
   const parent = useContext$1(DataContext);
   const [offset, setOffset] = useState(0);
@@ -12484,10 +12852,10 @@ const SwiperItem = React__default.forwardRef((props, ref) => {
     style: style()
   }, children);
 });
-SwiperItem.defaultProps = defaultProps$n;
+SwiperItem.defaultProps = defaultProps$o;
 SwiperItem.displayName = "NutSwiperItem";
 const AvatarContext = createContext({});
-const defaultProps$m = {
+const defaultProps$n = {
   size: "",
   icon: "",
   bgColor: "#eee",
@@ -12514,7 +12882,7 @@ const Avatar = (props) => {
     onError,
     ...rest
   } = {
-    ...defaultProps$m,
+    ...defaultProps$n,
     ...props
   };
   const [maxSum, setMaxSum] = useState(0);
@@ -12594,9 +12962,9 @@ const Avatar = (props) => {
     className: "text"
   }, ((_l = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _l.maxContent) ? (_m = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _m.maxContent : `+ ${avatarIndex - ((_n = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _n.maxCount)}`)));
 };
-Avatar.defaultProps = defaultProps$m;
+Avatar.defaultProps = defaultProps$n;
 Avatar.displayName = "NutAvatar";
-const defaultProps$l = {
+const defaultProps$m = {
   maxContent: "",
   maxCount: "",
   maxBgColor: "#eee",
@@ -12608,7 +12976,7 @@ const defaultProps$l = {
 };
 const AvatarGroup = (props) => {
   useConfig();
-  const propAvatarGroup = { ...defaultProps$l, ...props };
+  const propAvatarGroup = { ...defaultProps$m, ...props };
   const { className, style, children } = propAvatarGroup;
   const avatarGroupRef = useRef(null);
   const b2 = cn("avatar-group");
@@ -12625,9 +12993,9 @@ const AvatarGroup = (props) => {
     ref: avatarGroupRef
   }, children));
 };
-AvatarGroup.defaultProps = defaultProps$l;
+AvatarGroup.defaultProps = defaultProps$m;
 AvatarGroup.displayName = "NutAvatarGroup";
-const defaultProps$k = {
+const defaultProps$l = {
   price: 0,
   needSymbol: true,
   symbol: "&yen;",
@@ -12645,7 +13013,7 @@ const Price = (props) => {
     className,
     ...rest
   } = {
-    ...defaultProps$k,
+    ...defaultProps$l,
     ...props
   };
   const b2 = cn("price");
@@ -12698,9 +13066,9 @@ const Price = (props) => {
     className: `${b2("small")}`
   }, formatDecimal(price)));
 };
-Price.defaultProps = defaultProps$k;
+Price.defaultProps = defaultProps$l;
 Price.displayName = "NutPrice";
-const defaultProps$j = {
+const defaultProps$k = {
   value: "",
   dot: false,
   max: 1e4,
@@ -12712,7 +13080,7 @@ const defaultProps$j = {
 };
 const Badge = (props) => {
   const { children, dot, top, right, zIndex, color, icons } = {
-    ...defaultProps$j,
+    ...defaultProps$k,
     ...props
   };
   const content = () => {
@@ -12747,9 +13115,9 @@ const Badge = (props) => {
     style: getStyle()
   }, content()));
 };
-Badge.defaultProps = defaultProps$j;
+Badge.defaultProps = defaultProps$k;
 Badge.displayName = "NutBadge";
-const defaultProps$i = {
+const defaultProps$j = {
   type: "default",
   color: "",
   textColor: "",
@@ -12776,7 +13144,7 @@ const Tag = (props) => {
     isShow,
     onClick
   } = {
-    ...defaultProps$i,
+    ...defaultProps$j,
     ...props
   };
   const [btnName, setBtnName] = useState("");
@@ -12842,7 +13210,7 @@ const Tag = (props) => {
     className: "text"
   }, children)));
 };
-Tag.defaultProps = defaultProps$i;
+Tag.defaultProps = defaultProps$j;
 Tag.displayName = "NutTag";
 function fillRef(ref, node) {
   if (typeof ref === "function") {
@@ -12901,7 +13269,7 @@ const getEleAttr = (ele) => {
   }
   return null;
 };
-const defaultProps$h = {
+const defaultProps$i = {
   list: [],
   theme: "light",
   location: "bottom",
@@ -12922,7 +13290,7 @@ const Popover = (props) => {
     onClick,
     ...reset
   } = {
-    ...defaultProps$h,
+    ...defaultProps$i,
     ...props
   };
   const goodItem = useRef(null);
@@ -13031,9 +13399,9 @@ const Popover = (props) => {
     }, item.name));
   })) : null)));
 };
-Popover.defaultProps = defaultProps$h;
+Popover.defaultProps = defaultProps$i;
 Popover.displayName = "NutPopover";
-const defaultProps$g = {
+const defaultProps$h = {
   width: "100px",
   height: "100px",
   row: 1,
@@ -13061,7 +13429,7 @@ const Skeleton = (props) => {
     avatarShape,
     ...restProps
   } = {
-    ...defaultProps$g,
+    ...defaultProps$h,
     ...props
   };
   const b2 = cn("skeleton");
@@ -13116,9 +13484,9 @@ const Skeleton = (props) => {
     });
   })))));
 };
-Skeleton.defaultProps = defaultProps$g;
+Skeleton.defaultProps = defaultProps$h;
 Skeleton.displayName = "NutSkeleton";
-const defaultProps$f = {
+const defaultProps$g = {
   showPlainText: false,
   showDays: false,
   paused: false,
@@ -13141,7 +13509,7 @@ const CountDown = (props) => {
     onUpdate,
     children,
     ...rest
-  } = { ...defaultProps$f, ...props };
+  } = { ...defaultProps$g, ...props };
   const b2 = cn("countdown");
   const [restTimeStamp, setRestTime] = useState(0);
   const stateRef = useRef({
@@ -13288,9 +13656,9 @@ const CountDown = (props) => {
     className: b2("block")
   }, resttime.s))));
 };
-CountDown.defaultProps = defaultProps$f;
+CountDown.defaultProps = defaultProps$g;
 CountDown.displayName = "NutCountDown";
-const defaultProps$e = {
+const defaultProps$f = {
   activeName: ["0"],
   accordion: false,
   icon: "",
@@ -13312,7 +13680,7 @@ const Collapse = memo((props) => {
     iconColor,
     change
   } = {
-    ...defaultProps$e,
+    ...defaultProps$f,
     ...props
   };
   const childrenDom = React__default.Children.toArray(children);
@@ -13367,9 +13735,9 @@ const Collapse = memo((props) => {
     });
   }));
 }, areEqual);
-Collapse.defaultProps = defaultProps$e;
+Collapse.defaultProps = defaultProps$f;
 Collapse.displayName = "NutCollapse";
-const defaultProps$d = {
+const defaultProps$e = {
   title: "",
   name: "",
   isOpen: false,
@@ -13403,7 +13771,7 @@ const CollapseItem = (props) => {
     iconColor,
     ...rest
   } = {
-    ...defaultProps$d,
+    ...defaultProps$e,
     ...props
   };
   const [domHeight, setDomHeight] = useState(-1);
@@ -13472,9 +13840,9 @@ const CollapseItem = (props) => {
     className: colBem("content-text")
   }, children)));
 };
-CollapseItem.defaultProps = defaultProps$d;
+CollapseItem.defaultProps = defaultProps$e;
 CollapseItem.displayName = "NutCollapseItem";
-const defaultProps$c = {
+const defaultProps$d = {
   maxLen: 0,
   endNumber: "",
   delaySpeed: 300,
@@ -13492,7 +13860,7 @@ const CountUp = (props) => {
     thousands,
     ...reset
   } = {
-    ...defaultProps$c,
+    ...defaultProps$d,
     ...props
   };
   const b2 = cn("countup");
@@ -13509,18 +13877,16 @@ const CountUp = (props) => {
   const setNumberTransform = () => {
     if (countupRef.current) {
       const numberItems = countupRef.current.querySelectorAll(".nut-countup__number");
-      const numberFilterArr = numerArr.filter((item) => !isNaN(item));
-      for (const index2 in numberItems) {
-        if (!Object.prototype.hasOwnProperty.call(numberItems, index2))
-          continue;
-        const elem = numberItems[Number(index2)];
-        const idx = Number(numberFilterArr[Number(index2)]);
-        if ((idx || idx == 0) && elem) {
-          const transform = `translate(0, -${(idx == 0 ? 10 : idx) * 5}%)`;
+      const numberFilterArr = numerArr.filter((item) => !Number.isNaN(Number(item)));
+      Object.keys(numberItems).forEach((key) => {
+        const elem = numberItems[Number(key)];
+        const idx = Number(numberFilterArr[Number(key)]);
+        if ((idx || idx === 0) && elem) {
+          const transform = `translate(0, -${(idx === 0 ? 10 : idx) * 5}%)`;
           elem.style.transform = transform;
           elem.style.webkitTransform = transform;
         }
-      }
+      });
     }
   };
   const numberEaseStyle = {
@@ -13544,9 +13910,11 @@ const CountUp = (props) => {
     className: b2("list")
   }, numerArr.map((item, idx) => {
     return /* @__PURE__ */ React__default.createElement("li", {
-      className: `${b2("listitem", { number: !isNaN(item) })}`,
+      className: `${b2("listitem", {
+        number: !Number.isNaN(Number(item))
+      })}`,
       key: idx
-    }, !isNaN(item) ? /* @__PURE__ */ React__default.createElement("span", {
+    }, !Number.isNaN(Number(item)) ? /* @__PURE__ */ React__default.createElement("span", {
       className: b2("number"),
       style: numberEaseStyle
     }, [...numbers, ...numbers].map((number, subidx) => {
@@ -13558,9 +13926,9 @@ const CountUp = (props) => {
     }, item));
   })));
 };
-CountUp.defaultProps = defaultProps$c;
+CountUp.defaultProps = defaultProps$d;
 CountUp.displayName = "NutCountUp";
-const defaultProps$b = {};
+const defaultProps$c = {};
 class AnimatingNumbers extends Component {
   constructor(props) {
     super(props);
@@ -13572,7 +13940,7 @@ class AnimatingNumbers extends Component {
     });
   }
 }
-AnimatingNumbers.defaultProps = defaultProps$b;
+AnimatingNumbers.defaultProps = defaultProps$c;
 AnimatingNumbers.displayName = "NutAnimatingNumbers";
 AnimatingNumbers.CountUp = CountUp;
 AnimatingNumbers.CountUp = CountUp;
@@ -13581,7 +13949,7 @@ const defaultStatus = {
   error: "https://ftcms.jd.com/p/files/61a9e33ee7dcdbcc0ce62736.png",
   network: "https://static-ftcms.jd.com/p/files/61a9e31de7dcdbcc0ce62734.png"
 };
-const defaultProps$a = {
+const defaultProps$b = {
   description: "\u65E0\u5185\u5BB9",
   image: "empty",
   imageSize: "",
@@ -13589,9 +13957,9 @@ const defaultProps$a = {
 };
 const Empty = (props) => {
   const { locale } = useConfig();
-  defaultProps$a.description = locale.noData || defaultProps$a.description;
+  defaultProps$b.description = locale.noData || defaultProps$b.description;
   const { image, imageSize, description, children, className, ...rest } = {
-    ...defaultProps$a,
+    ...defaultProps$b,
     ...props
   };
   const [imgStyle, setImgStyle] = useState({});
@@ -13633,7 +14001,7 @@ const Empty = (props) => {
     className: b2("description")
   }, description) : { description }, children);
 };
-Empty.defaultProps = defaultProps$a;
+Empty.defaultProps = defaultProps$b;
 Empty.displayName = "NutEmpty";
 const initPositinoCache = (reaItemSize, length = 0) => {
   let index2 = 0;
@@ -13746,7 +14114,7 @@ const updateItemSize = (positions, items, sizeKey) => {
     }
   });
 };
-const defaultProps$9 = {};
+const defaultProps$a = {};
 const VirtualList = (props) => {
   const {
     sourceData = [],
@@ -13905,8 +14273,89 @@ const VirtualList = (props) => {
     }) : data);
   }))));
 };
-VirtualList.defaultProps = defaultProps$9;
+VirtualList.defaultProps = defaultProps$a;
 VirtualList.displayName = "NutVirtualList";
+const defaultProps$9 = {
+  source: {
+    type: {},
+    src: ""
+  },
+  options: {
+    controls: true,
+    muted: false,
+    autoplay: false,
+    poster: "",
+    playsinline: false,
+    loop: false
+  }
+};
+const Video = (props) => {
+  const {
+    children,
+    source,
+    options: options2,
+    className,
+    play,
+    pause,
+    playend,
+    ...restProps
+  } = {
+    ...defaultProps$9,
+    ...props
+  };
+  const rootRef = useRef(null);
+  const b2 = cn("video");
+  const classes = classNames(className, b2(""));
+  useEffect(() => {
+    init();
+  }, []);
+  const init = () => {
+    if (rootRef.current) {
+      const videoRef = rootRef.current;
+      if (options2.autoplay) {
+        setTimeout(() => {
+          videoRef.play();
+        }, 200);
+      }
+      if (options2.playsinline) {
+        videoRef.setAttribute("playsinline", String(options2.playsinline));
+        videoRef.setAttribute("webkit-playsinline", String(options2.playsinline));
+        videoRef.setAttribute("x5-video-player-type", "h5-page");
+        videoRef.setAttribute("x5-video-player-fullscreen", "false");
+      }
+      videoRef.addEventListener("play", () => {
+        play && play(videoRef);
+      });
+      videoRef.addEventListener("pause", () => {
+        pause && pause(videoRef);
+      });
+      videoRef.addEventListener("ended", () => {
+        videoRef.currentTime = 0;
+        playend && playend(videoRef);
+      });
+    }
+  };
+  return /* @__PURE__ */ React__default.createElement("div", {
+    className: classes,
+    ...restProps
+  }, /* @__PURE__ */ React__default.createElement("video", {
+    className: "nut-video-player",
+    muted: options2.muted,
+    autoPlay: options2.autoplay,
+    loop: options2.loop,
+    poster: options2.poster,
+    controls: options2.controls,
+    ref: rootRef,
+    src: source.src
+  }, /* @__PURE__ */ React__default.createElement("source", {
+    src: source.src,
+    type: source.type
+  }), /* @__PURE__ */ React__default.createElement("track", {
+    kind: "captions"
+  })));
+};
+Video.defaultProps = defaultProps$9;
+Video.displayName = "NutVideo";
 const defaultProps$8 = {
   type: "custom",
   existAddress: [],
@@ -14859,4 +15308,4 @@ const TimeSelect = (props) => {
 };
 TimeSelect.defaultProps = defaultProps;
 TimeSelect.displayName = "NutTimeSelect";
-export { ActionSheet, Address, AnimatingNumbers, Avatar, AvatarGroup, BackTop, Badge, Barrage, Button, Calendar, CalendarItem, Card, Cell, CellGroup, Checkbox, CheckboxGroup, CircleProgress, Col, Collapse, CollapseItem, ConfigProvider, CountDown, DatePicker, Dialog, Divider, Drag, Elevator, Empty, FixedNav, Icon, Indicator, Infiniteloading, Input, InputNumber, Layout, NavBar, NoticeBar, Notify, Overlay, Pagination, Picker, Popover, Popup, Price, Radio, RadioGroup, Range, Rate, Row, ShortPassword, Signature, Skeleton, Step, Steps, Swiper, SwiperItem, Switch, TabPane, Tabbar, TabbarItem, Tabs, Tag, TextArea, TimeDetail, TimePannel, TimeSelect, Toast, Uploader, VirtualList };
+export { ActionSheet, Address, AnimatingNumbers, Avatar, AvatarGroup, BackTop, Badge, Barrage, Button, Calendar, CalendarItem, Card, Cell, CellGroup, Checkbox, CheckboxGroup, CircleProgress, Col, Collapse, CollapseItem, ConfigProvider, CountDown, DatePicker, Dialog, Divider, Drag, Elevator, Empty, FixedNav, Icon, Indicator, Infiniteloading, Input, InputNumber, Layout, NavBar, NoticeBar, Notify, Overlay, Pagination, Picker, Popover, Popup, Price, Radio, RadioGroup, Range, Rate, Row, ShortPassword, Signature, Skeleton, Step, Steps, Swiper, SwiperItem, Switch, TabPane, Tabbar, TabbarItem, Tabs, Tag, TextArea, TimeDetail, TimePannel, TimeSelect, Toast, Uploader, Video, VirtualList };