@nutui/nutui-react 1.3.12 → 1.3.13-beta.0

package/dist/nutui.react.umd.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v1.3.12-beta.0 Wed Nov 23 2022 14:51:03 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.3.13-beta.0 Wed Nov 30 2022 17:47:10 GMT+0800 (China Standard Time)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
@@ -72,7 +72,7 @@
     classname.exports = classname_production_min;
   }
   const cn = classname.exports.withNaming({ n: "nut-", e: "__", m: "--", v: "-" });
-  const defaultProps$1n = {
+  const defaultProps$1q = {
     name: "",
     size: "",
     classPrefix: "nut-icon",
@@ -100,7 +100,7 @@
       onClick,
       ...rest
     } = {
-      ...defaultProps$1n,
+      ...defaultProps$1q,
       ...props
     };
     const isImage = name ? name.indexOf("/") !== -1 : false;
@@ -134,13 +134,13 @@
       children
     );
   }
-  Icon$1.defaultProps = defaultProps$1n;
+  Icon$1.defaultProps = defaultProps$1q;
   Icon$1.displayName = "NutIcon";
   const ComponentDefaults = {
     iconClassPrefix: "nut-icon",
     iconFontClassName: "nutui-iconfont"
   };
-  const defaultProps$1m = {
+  const defaultProps$1p = {
     ...ComponentDefaults,
     className: "",
     color: "",
@@ -176,7 +176,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$1m,
+      ...defaultProps$1p,
       ...props
     };
     const getStyle = React.useCallback(() => {
@@ -254,7 +254,7 @@
       className: icon || loading ? "text" : ""
     }, children)));
   };
-  Button.defaultProps = defaultProps$1m;
+  Button.defaultProps = defaultProps$1p;
   Button.displayName = "NutButton";
   function _setPrototypeOf$1(o, p2) {
     _setPrototypeOf$1 = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf2(o2, p3) {
@@ -1479,7 +1479,7 @@
   function useHistory() {
     return useContext(historyContext);
   }
-  const defaultProps$1l = {
+  const defaultProps$1o = {
     ...ComponentDefaults,
     title: null,
     subTitle: null,
@@ -1525,7 +1525,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$1l,
+      ...defaultProps$1o,
       ...props
     };
     const b2 = cn("cell");
@@ -1579,9 +1579,9 @@
       className: b2("link")
     }) : linkSlot));
   };
-  Cell.defaultProps = defaultProps$1l;
+  Cell.defaultProps = defaultProps$1o;
   Cell.displayName = "NutCell";
-  const defaultProps$1k = {
+  const defaultProps$1n = {
     title: "",
     desc: "",
     className: "",
@@ -1590,7 +1590,7 @@
   };
   const CellGroup = (props) => {
     const { children, className, title, desc, titleSlot, descSlot } = {
-      ...defaultProps$1k,
+      ...defaultProps$1n,
       ...props
     };
     const b2 = cn("cell-group");
@@ -1604,7 +1604,7 @@
       className: b2("wrap")
     }, children));
   };
-  CellGroup.defaultProps = defaultProps$1k;
+  CellGroup.defaultProps = defaultProps$1n;
   CellGroup.displayName = "NutCellGroup";
   var classnames = { exports: {} };
   /*!
@@ -2157,7 +2157,7 @@
   };
   CSSTransition.propTypes = {};
   var CSSTransition$1 = CSSTransition;
-  const defaultProps$1j = {
+  const defaultProps$1m = {
     ...ComponentDefaults,
     position: "center",
     transition: "",
@@ -2343,7 +2343,7 @@
     }, [position]);
     return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, renderToContainer(teleport, renderNode()));
   };
-  Popup.defaultProps = defaultProps$1j;
+  Popup.defaultProps = defaultProps$1m;
   Popup.displayName = "NutPopup";
   const zhCN = {
     save: "\u4FDD\u5B58",
@@ -2468,9 +2468,12 @@
       canReleaseText: "\u677E\u5F00\u5237\u65B0",
       refreshingText: "\u52A0\u8F7D\u4E2D...",
       completeText: "\u5237\u65B0\u6210\u529F"
+    },
+    watermark: {
+      errorCanvasTips: "\u5F53\u524D\u73AF\u5883\u4E0D\u652F\u6301Canvas"
     }
   };
-  const defaultProps$1i = {
+  const defaultProps$1l = {
     locale: zhCN
   };
   const defaultConfigRef = {
@@ -2487,7 +2490,7 @@
   };
   const ConfigContext = React.createContext(null);
   const ConfigProvider = (props) => {
-    const { children, ...config2 } = { ...defaultProps$1i, ...props };
+    const { children, ...config2 } = { ...defaultProps$1l, ...props };
     const parentConfig = useConfig();
     return /* @__PURE__ */ React__default["default"].createElement(ConfigContext.Provider, {
       value: {
@@ -2496,19 +2499,110 @@
       }
     }, children);
   };
-  ConfigProvider.defaultProps = defaultProps$1i;
+  ConfigProvider.defaultProps = defaultProps$1l;
   ConfigProvider.displayName = "NutConfigProvider";
-  const defaultProps$1h = {};
+  const defaultProps$1k = {
+    fit: "fill",
+    position: "center",
+    alt: "",
+    width: "center",
+    height: "",
+    round: false,
+    showError: true,
+    showLoading: true
+  };
+  const Image$1 = (props) => {
+    useConfig();
+    const {
+      children,
+      className,
+      style,
+      src,
+      fit,
+      position,
+      alt,
+      width,
+      height,
+      round,
+      radius,
+      showError,
+      showLoading,
+      slotError,
+      slotLoding,
+      onClick,
+      onLoad,
+      onError
+    } = { ...defaultProps$1k, ...props };
+    const [loading, setLoading] = React.useState(true);
+    const [isError, setIsError] = React.useState(false);
+    React.useEffect(() => {
+      if (src) {
+        setIsError(false);
+        setLoading(true);
+      }
+    }, [src]);
+    const load = () => {
+      setLoading(false);
+      onLoad && onLoad();
+    };
+    const error = () => {
+      setIsError(true);
+      setLoading(false);
+      onError && onError();
+    };
+    const pxCheck2 = (value) => {
+      return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
+    };
+    const stylebox = {
+      height: height ? pxCheck2(height) : "",
+      width: width ? pxCheck2(width) : "",
+      overflow: radius !== void 0 && radius !== null ? "hidden" : "",
+      borderRadius: radius !== void 0 && radius !== null ? pxCheck2(radius) : ""
+    };
+    const styles = {
+      objectFit: fit,
+      objectPosition: position,
+      ...style
+    };
+    const imageClick = (event) => {
+      onClick && onClick(event);
+    };
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `nut-image ${round ? "nut-image-round" : ""} ${className || ""}`,
+      style: stylebox,
+      onClick: (e2) => {
+        imageClick(e2);
+      }
+    }, /* @__PURE__ */ React__default["default"].createElement("img", {
+      className: "nut-img",
+      style: styles,
+      src,
+      alt,
+      onLoad: load,
+      onError: error
+    }), showLoading && loading ? /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: "nut-img-loading"
+    }, slotLoding || children || /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
+      name: "image"
+    })) : null, showError && isError && !loading ? /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: "nut-img-error"
+    }, slotError || children || /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
+      name: "image-error"
+    })) : null);
+  };
+  Image$1.defaultProps = defaultProps$1k;
+  Image$1.displayName = "NutImage";
+  const defaultProps$1j = {};
   const Layout = (props) => {
-    ({ ...defaultProps$1h, ...props });
+    ({ ...defaultProps$1j, ...props });
     return /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "nut-layout"
     }, "Layout");
   };
-  Layout.defaultProps = defaultProps$1h;
+  Layout.defaultProps = defaultProps$1j;
   Layout.displayName = "NutLayout";
   const DataContext$2 = React.createContext({});
-  const defaultProps$1g = {
+  const defaultProps$1i = {
     span: "24",
     offset: "0",
     gutter: "0"
@@ -2521,7 +2615,7 @@
       offset,
       children,
       onClick
-    } = { ...defaultProps$1g, ...props };
+    } = { ...defaultProps$1i, ...props };
     const [colName, setColName] = React.useState("");
     const [colStyle, setColStyle] = React.useState({});
     const { gutter } = React.useContext(DataContext$2);
@@ -2547,9 +2641,9 @@
       }
     }, children);
   };
-  Col.defaultProps = defaultProps$1g;
+  Col.defaultProps = defaultProps$1i;
   Col.displayName = "NutCol";
-  const defaultProps$1f = {
+  const defaultProps$1h = {
     type: "",
     justify: "start",
     align: "flex-start",
@@ -2568,7 +2662,7 @@
       gutter,
       onClick
     } = {
-      ...defaultProps$1f,
+      ...defaultProps$1h,
       ...props
     };
     const prefixCls = "nut-row";
@@ -2603,9 +2697,9 @@
       children
     ));
   };
-  Row.defaultProps = defaultProps$1f;
+  Row.defaultProps = defaultProps$1h;
   Row.displayName = "NutRow";
-  const defaultProps$1e = {
+  const defaultProps$1g = {
     contentPosition: "center",
     dashed: false,
     hairline: true,
@@ -2622,7 +2716,7 @@
       direction,
       ...rest
     } = {
-      ...defaultProps$1e,
+      ...defaultProps$1g,
       ...props
     };
     const dividerBem = cn("divider");
@@ -2643,9 +2737,9 @@
       ...rest
     }, children);
   };
-  Divider.defaultProps = defaultProps$1e;
+  Divider.defaultProps = defaultProps$1g;
   Divider.displayName = "NutDivider";
-  const defaultProps$1d = {
+  const defaultProps$1f = {
     columnNum: 4,
     border: true,
     gutter: 0,
@@ -2672,7 +2766,7 @@
       iconColor,
       className,
       ...rest
-    } = { ...defaultProps$1d, ...props };
+    } = { ...defaultProps$1f, ...props };
     const childrenDom = React__default["default"].Children.toArray(children);
     const pxCheck2 = (value) => {
       return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
@@ -2711,9 +2805,9 @@
       });
     }));
   };
-  Grid.defaultProps = defaultProps$1d;
+  Grid.defaultProps = defaultProps$1f;
   Grid.displayName = "NutGrid";
-  const defaultProps$1c = {
+  const defaultProps$1e = {
     ...ComponentDefaults,
     text: "",
     icon: "",
@@ -2752,7 +2846,7 @@
       onClick,
       ...rest
     } = {
-      ...defaultProps$1c,
+      ...defaultProps$1e,
       ...props
     };
     const b2 = cn("grid-item");
@@ -2800,7 +2894,7 @@
       className: "nut-grid-item__text"
     }, text), children && /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, children)));
   };
-  GridItem.defaultProps = defaultProps$1c;
+  GridItem.defaultProps = defaultProps$1e;
   GridItem.displayName = "NutGridItem";
   const canUseDom = !!(typeof window !== "undefined" && typeof document !== "undefined" && window.document && window.document.createElement);
   const defaultRoot = canUseDom ? window : void 0;
@@ -3014,7 +3108,7 @@
     }, children));
   };
   Sticky.displayName = "NutSticky";
-  const defaultProps$1b = {
+  const defaultProps$1d = {
     ...ComponentDefaults,
     title: "",
     desc: "",
@@ -3050,7 +3144,7 @@
       iconClassPrefix,
       iconFontClassName
     } = {
-      ...defaultProps$1b,
+      ...defaultProps$1d,
       ...props
     };
     const b2 = cn("navbar");
@@ -3119,9 +3213,9 @@
       className: `${b2("")}--placeholder`
     }, renderWrapper()) : renderWrapper());
   };
-  NavBar.defaultProps = defaultProps$1b;
+  NavBar.defaultProps = defaultProps$1d;
   NavBar.displayName = "NutNavBar";
-  const defaultProps$1a = {
+  const defaultProps$1c = {
     ...ComponentDefaults,
     fixednavClass: "nut-fixednav",
     activeText: "",
@@ -3151,7 +3245,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$1a,
+      ...defaultProps$1c,
       ...props
     };
     const b2 = cn("fixednav");
@@ -3206,9 +3300,9 @@
       className: "text"
     }, visible ? activeText || locale.fixednav.activeText : unActiveText || locale.fixednav.unActiveText))));
   };
-  FixedNav.defaultProps = defaultProps$1a;
+  FixedNav.defaultProps = defaultProps$1c;
   FixedNav.displayName = "NutFixedNav";
-  const defaultProps$19 = {
+  const defaultProps$1b = {
     visible: 0,
     bottom: false,
     size: 20,
@@ -3236,7 +3330,7 @@
       tabSwitch,
       onSwitch
     } = {
-      ...defaultProps$19,
+      ...defaultProps$1b,
       ...props
     };
     const b2 = cn("tabbar");
@@ -3272,9 +3366,9 @@
       return React__default["default"].cloneElement(child, childProps);
     }));
   };
-  Tabbar.defaultProps = defaultProps$19;
+  Tabbar.defaultProps = defaultProps$1b;
   Tabbar.displayName = "NutTabbar";
-  const defaultProps$18 = {
+  const defaultProps$1a = {
     ...ComponentDefaults,
     dot: false,
     size: "",
@@ -3310,7 +3404,7 @@
       iconClassPrefix,
       iconFontClassName
     } = {
-      ...defaultProps$18,
+      ...defaultProps$1a,
       ...props
     };
     const b2 = cn("tabbar-item");
@@ -8366,7 +8460,7 @@
   });
   const animated = host.animated;
   const elevatorContext = React.createContext({});
-  const defaultProps$17 = {
+  const defaultProps$19 = {
     height: "200px",
     acceptKey: "title",
     indexList: [],
@@ -8389,7 +8483,7 @@
       children,
       ...rest
     } = {
-      ...defaultProps$17,
+      ...defaultProps$19,
       ...props
     };
     const b2 = cn("elevator");
@@ -8576,9 +8670,9 @@
       }, item[acceptKey]);
     }))));
   };
-  Elevator.defaultProps = defaultProps$17;
+  Elevator.defaultProps = defaultProps$19;
   Elevator.displayName = "NutElevator";
-  const defaultProps$16 = {
+  const defaultProps$18 = {
     defaultValue: 1,
     mode: "multi",
     prevText: "",
@@ -8595,7 +8689,7 @@
   };
   const Pagination = (props) => {
     const { locale } = useConfig();
-    ({ ...defaultProps$16, ...props });
+    ({ ...defaultProps$18, ...props });
     const {
       modelValue,
       mode,
@@ -8712,7 +8806,7 @@
       onClick: (e2) => selectPage(Number(currentPage) + 1, true)
     }, nextText || locale.pagination.next));
   };
-  Pagination.defaultProps = defaultProps$16;
+  Pagination.defaultProps = defaultProps$18;
   Pagination.displayName = "NutPagination";
   class Title {
     constructor() {
@@ -8722,7 +8816,7 @@
       this.index = 0;
     }
   }
-  const defaultProps$15 = {
+  const defaultProps$17 = {
     ...ComponentDefaults,
     tabStyle: {},
     value: 0,
@@ -8763,7 +8857,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$15,
+      ...defaultProps$17,
       ...props
     };
     const [currentItem, setCurrentItem] = React.useState({ index: 0 });
@@ -8881,9 +8975,9 @@
       return React__default["default"].cloneElement(child, childProps);
     }))));
   };
-  Tabs.defaultProps = defaultProps$15;
+  Tabs.defaultProps = defaultProps$17;
   Tabs.displayName = "NutTabs";
-  const defaultProps$14 = {
+  const defaultProps$16 = {
     title: "",
     paneKey: "",
     activeKey: "",
@@ -8891,7 +8985,7 @@
   };
   const TabPane = (props) => {
     const { children, paneKey, activeKey, autoHeightClassName, className } = {
-      ...defaultProps$14,
+      ...defaultProps$16,
       ...props
     };
     const b2 = cn("tabpane");
@@ -8907,7 +9001,7 @@
       className: classes
     }, children);
   };
-  const defaultProps$13 = {
+  const defaultProps$15 = {
     size: 3,
     current: 1,
     block: false,
@@ -8927,7 +9021,7 @@
       vertical,
       ...rest
     } = {
-      ...defaultProps$13,
+      ...defaultProps$15,
       ...props
     };
     const b2 = cn("indicator");
@@ -8961,7 +9055,7 @@
       ...rest
     }, renderEles());
   };
-  Indicator.defaultProps = defaultProps$13;
+  Indicator.defaultProps = defaultProps$15;
   Indicator.displayName = "NutIndicator";
   const handleClick = (e2) => {
     e2.stopPropagation();
@@ -8977,7 +9071,7 @@
     }
   };
   const OffsetContext = React.createContext(20);
-  const defaultProps$12 = {
+  const defaultProps$14 = {
     showhead: false,
     position: "left",
     width: "80%"
@@ -8995,7 +9089,7 @@
       onClose,
       ...rest
     } = {
-      ...defaultProps$12,
+      ...defaultProps$14,
       ...props
     };
     const offset = props.offset ? Number(props.offset) : 20;
@@ -9023,14 +9117,14 @@
       className: "nut-sidenavbar__content"
     }, children))))));
   };
-  SideNavBar.defaultProps = defaultProps$12;
+  SideNavBar.defaultProps = defaultProps$14;
   SideNavBar.displayName = "NutSideNavBar";
-  const defaultProps$11 = {
+  const defaultProps$13 = {
     open: true
   };
   const SubSideNavBar = (props) => {
     const { title, ikey, children, onClick, open, ...rest } = {
-      ...defaultProps$11,
+      ...defaultProps$13,
       ...props
     };
     const offset = React.useContext(OffsetContext);
@@ -9101,7 +9195,7 @@
       ...rest
     }, title);
   };
-  const defaultProps$10 = {
+  const defaultProps$12 = {
     ...ComponentDefaults,
     className: "",
     style: {},
@@ -9124,7 +9218,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$10,
+      ...defaultProps$12,
       ...props
     };
     const parentRef = React.useRef(null);
@@ -9229,9 +9323,9 @@
       })));
     })), cloneChildren()));
   };
-  Menu.defaultProps = defaultProps$10;
+  Menu.defaultProps = defaultProps$12;
   Menu.displayName = "NutMenu";
-  const defaultProps$$ = {
+  const defaultProps$11 = {
     ...ComponentDefaults,
     className: "",
     style: {},
@@ -9246,7 +9340,7 @@
   };
   const MenuItem = React.forwardRef((props, ref) => {
     useConfig();
-    const mergedProps = { ...defaultProps$$, ...props };
+    const mergedProps = { ...defaultProps$11, ...props };
     const {
       style,
       options: options2,
@@ -9262,7 +9356,7 @@
       iconClassPrefix,
       iconFontClassName
     } = {
-      ...defaultProps$$,
+      ...defaultProps$11,
       ...props
     };
     const { activeColor, showPopup, parent, orderKey } = mergedProps;
@@ -9383,7 +9477,7 @@
       }, item.text));
     }), children))));
   });
-  MenuItem.defaultProps = defaultProps$$;
+  MenuItem.defaultProps = defaultProps$11;
   MenuItem.displayName = "NutMenuItem";
   const MIN_DISTANCE = 10;
   function getDirection(x2, y2) {
@@ -9681,7 +9775,7 @@
       }
     }
   };
-  const defaultProps$_ = {
+  const defaultProps$10 = {
     range: false,
     hiddenRange: false,
     hiddenTag: false,
@@ -9718,8 +9812,8 @@
       minDesc,
       maxDesc,
       curValueDesc
-    } = { ...defaultProps$_, ...props };
-    let { min, max, step } = { ...defaultProps$_, ...props };
+    } = { ...defaultProps$10, ...props };
+    let { min, max, step } = { ...defaultProps$10, ...props };
     min = Number(min);
     max = Number(max);
     step = Number(step);
@@ -10057,7 +10151,7 @@
       className: "max"
     }, maxDesc || +max) : null);
   };
-  Range.defaultProps = defaultProps$_;
+  Range.defaultProps = defaultProps$10;
   Range.displayName = "NutRange";
   const Utils = {
     isLeapYear(y2) {
@@ -10151,7 +10245,7 @@
     };
   }
   var requestAniFrame$1 = requestAniFrame();
-  const defaultProps$Z = {
+  const defaultProps$$ = {
     type: "one",
     isAutoBackFill: false,
     poppable: true,
@@ -10200,7 +10294,7 @@
       onChoose,
       onUpdate,
       onSelected
-    } = { ...defaultProps$Z, ...props };
+    } = { ...defaultProps$$, ...props };
     const weeks = locale.calendaritem.weekdays;
     const [yearMonthTitle, setYearMonthTitle] = React.useState("");
     const [monthsData, setMonthsData] = React.useState([]);
@@ -10787,9 +10881,9 @@
       onClick: confirm2
     }, confirmText || locale.confirm)) : ""));
   });
-  CalendarItem.defaultProps = defaultProps$Z;
+  CalendarItem.defaultProps = defaultProps$$;
   CalendarItem.displayName = "NutCalendarItem";
-  const defaultProps$Y = {
+  const defaultProps$_ = {
     type: "one",
     isAutoBackFill: false,
     poppable: true,
@@ -10841,7 +10935,7 @@
       onClose,
       onChoose,
       onSelected
-    } = { ...defaultProps$Y, ...props };
+    } = { ...defaultProps$_, ...props };
     const calendarRef = React.useRef(null);
     const close = () => {
       onClose && onClose();
@@ -10900,9 +10994,9 @@
       style: { height: "85vh" }
     }, renderItem()) : renderItem());
   });
-  Calendar.defaultProps = defaultProps$Y;
+  Calendar.defaultProps = defaultProps$_;
   Calendar.displayName = "NutCalendar";
-  const defaultProps$X = {
+  const defaultProps$Z = {
     disabled: false,
     checkedValue: [],
     max: void 0,
@@ -10912,7 +11006,7 @@
   };
   const CheckboxGroup = React__default["default"].forwardRef(
     (props, ref) => {
-      const { children } = { ...defaultProps$X, ...props };
+      const { children } = { ...defaultProps$Z, ...props };
       const b2 = cn("checkboxgroup");
       const {
         className,
@@ -11019,9 +11113,9 @@
       }, (options2 == null ? void 0 : options2.length) ? renderOptionsChildren() : cloneChildren());
     }
   );
-  CheckboxGroup.defaultProps = defaultProps$X;
+  CheckboxGroup.defaultProps = defaultProps$Z;
   CheckboxGroup.displayName = "NutCheckboxGroup";
-  const defaultProps$W = {
+  const defaultProps$Y = {
     ...ComponentDefaults,
     checked: false,
     disabled: false,
@@ -11037,7 +11131,7 @@
   };
   const Checkbox = (props) => {
     const { children } = {
-      ...defaultProps$W,
+      ...defaultProps$Y,
       ...props
     };
     const b2 = cn("checkbox");
@@ -11119,7 +11213,7 @@
       onClick: handleClick2
     }, renderIcon(), renderLabel());
   };
-  Checkbox.defaultProps = defaultProps$W;
+  Checkbox.defaultProps = defaultProps$Y;
   Checkbox.displayName = "NutCheckBox";
   Checkbox.Group = CheckboxGroup;
   const InternalPickerSlot = (props, ref) => {
@@ -11544,7 +11638,7 @@
   };
   const Picker = React__default["default"].forwardRef(InternalPicker);
   const currentYear = new Date().getFullYear();
-  const defaultProps$V = {
+  const defaultProps$X = {
     modelValue: null,
     visible: false,
     title: "",
@@ -11575,7 +11669,7 @@
       style,
       ...rest
     } = {
-      ...defaultProps$V,
+      ...defaultProps$X,
       ...props
     };
     const { locale } = useConfig();
@@ -11841,9 +11935,9 @@
       ref: pickerRef
     }));
   };
-  DatePicker.defaultProps = defaultProps$V;
+  DatePicker.defaultProps = defaultProps$X;
   DatePicker.displayName = "NutDatePicker";
-  const defaultProps$U = {
+  const defaultProps$W = {
     ...ComponentDefaults,
     disabled: false,
     buttonSize: "",
@@ -11890,7 +11984,7 @@
       iconFontClassName,
       ...restProps
     } = {
-      ...defaultProps$U,
+      ...defaultProps$W,
       ...props
     };
     const [inputValue, setInputValue] = React.useState(modelValue);
@@ -12027,7 +12121,7 @@
       onClick: addNumber
     }));
   };
-  InputNumber.defaultProps = defaultProps$U;
+  InputNumber.defaultProps = defaultProps$W;
   InputNumber.displayName = "NutInputNumber";
   function trimExtraChar(value, char, regExp) {
     const index = value.indexOf(char);
@@ -12053,7 +12147,7 @@
     const regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g;
     return value.replace(regExp, "");
   }
-  const defaultProps$T = {
+  const defaultProps$V = {
     ...ComponentDefaults,
     type: "text",
     name: "",
@@ -12150,7 +12244,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$T,
+      ...defaultProps$V,
       ...props
     };
     locale.placeholder = placeholder || locale.placeholder;
@@ -12381,14 +12475,14 @@
       }
     }, errorMessage) : null)));
   });
-  Input.defaultProps = defaultProps$T;
+  Input.defaultProps = defaultProps$V;
   Input.displayName = "NutInput";
   const radioContext = {
     onChange: (val) => {
     }
   };
   var RadioContext = React__default["default"].createContext(radioContext);
-  const defaultProps$S = {
+  const defaultProps$U = {
     value: null,
     textPosition: "right",
     onChange: (value) => {
@@ -12398,7 +12492,7 @@
   };
   const RadioGroup = React__default["default"].forwardRef(
     (props, ref) => {
-      const { children } = { ...defaultProps$S, ...props };
+      const { children } = { ...defaultProps$U, ...props };
       cn("RadioGroup");
       const {
         className,
@@ -12463,9 +12557,9 @@
       }, (options2 == null ? void 0 : options2.length) ? renderOptionsChildren() : cloneChildren()));
     }
   );
-  RadioGroup.defaultProps = defaultProps$S;
+  RadioGroup.defaultProps = defaultProps$U;
   RadioGroup.displayName = "NutRadioGroup";
-  const defaultProps$R = {
+  const defaultProps$T = {
     ...ComponentDefaults,
     className: "",
     style: {},
@@ -12482,7 +12576,7 @@
   };
   const Radio = (props) => {
     const { children } = {
-      ...defaultProps$R,
+      ...defaultProps$T,
       ...props
     };
     const {
@@ -12562,10 +12656,10 @@
       ...rest
     }, renderRadioItem());
   };
-  Radio.defaultProps = defaultProps$R;
+  Radio.defaultProps = defaultProps$T;
   Radio.displayName = "NutRadio";
   Radio.RadioGroup = RadioGroup;
-  const defaultProps$Q = {
+  const defaultProps$S = {
     ...ComponentDefaults,
     count: 5,
     modelValue: 0,
@@ -12600,7 +12694,7 @@
       iconClassPrefix,
       iconFontClassName
     } = {
-      ...defaultProps$Q,
+      ...defaultProps$S,
       ...props
     };
     const b2 = cn("rate");
@@ -12673,9 +12767,9 @@
       }));
     }));
   };
-  Rate.defaultProps = defaultProps$Q;
+  Rate.defaultProps = defaultProps$S;
   Rate.displayName = "NutRate";
-  const defaultProps$P = {
+  const defaultProps$R = {
     ...ComponentDefaults,
     title: "",
     desc: "",
@@ -12843,9 +12937,9 @@
       onClick: () => sure()
     }, locale.confirm)) : null)));
   };
-  ShortPassword.defaultProps = defaultProps$P;
+  ShortPassword.defaultProps = defaultProps$R;
   ShortPassword.displayName = "NutShortPassword";
-  const defaultProps$O = {
+  const defaultProps$Q = {
     defaultValue: "",
     textAlign: "left",
     limitshow: false,
@@ -12873,7 +12967,7 @@
       onChange,
       onBlur,
       onFocus
-    } = { ...defaultProps$O, ...props };
+    } = { ...defaultProps$Q, ...props };
     const textareaBem = cn("textarea");
     const [inputValue, SetInputValue] = React.useState("");
     const textareaRef = React.useRef(null);
@@ -12970,9 +13064,9 @@
       className: textareaBem("limit")
     }, [...inputValue].length, "/", maxlength < 0 ? 0 : maxlength) : null);
   };
-  TextArea.defaultProps = defaultProps$O;
+  TextArea.defaultProps = defaultProps$Q;
   TextArea.displayName = "NutTextArea";
-  const defaultProps$N = {
+  const defaultProps$P = {
     name: "",
     size: "",
     classPrefix: "nut-icon",
@@ -13000,7 +13094,7 @@
       onClick,
       ...rest
     } = {
-      ...defaultProps$N,
+      ...defaultProps$P,
       ...props
     };
     const isImage = name ? name.indexOf("/") !== -1 : false;
@@ -13034,9 +13128,9 @@
       children
     );
   }
-  Icon.defaultProps = defaultProps$N;
+  Icon.defaultProps = defaultProps$P;
   Icon.displayName = "NutIcon";
-  const defaultProps$M = {
+  const defaultProps$O = {
     ...ComponentDefaults,
     className: "",
     style: {},
@@ -13084,7 +13178,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$M,
+      ...defaultProps$O,
       ...props
     };
     const b2 = cn("progress");
@@ -13162,7 +13256,7 @@
       color: iconColor
     })));
   };
-  Progress.defaultProps = defaultProps$M;
+  Progress.defaultProps = defaultProps$O;
   Progress.displayName = "NutProgress";
   class UploadOptions {
     constructor() {
@@ -13260,7 +13354,7 @@
       }
     }
   }
-  const defaultProps$L = {
+  const defaultProps$N = {
     ...ComponentDefaults,
     url: "",
     maximum: 1,
@@ -13340,7 +13434,7 @@
       onBeforeXhrUpload,
       onBeforeDelete,
       ...restProps
-    } = { ...defaultProps$L, ...props };
+    } = { ...defaultProps$N, ...props };
     const [fileList, setFileList] = React.useState([]);
     const [uploadQueue, setUploadQueue] = React.useState([]);
     React.useEffect(() => {
@@ -13661,9 +13755,9 @@
     })));
   };
   const Uploader = React__default["default"].forwardRef(InternalUploader);
-  Uploader.defaultProps = defaultProps$L;
+  Uploader.defaultProps = defaultProps$N;
   Uploader.displayName = "NutUploader";
-  const defaultProps$K = {
+  const defaultProps$M = {
     data: {
       text: "",
       value: "",
@@ -13672,13 +13766,14 @@
       loading: false,
       children: []
     },
+    activeColor: "#fa2c19",
     checked: false,
     chooseItem: () => {
     }
   };
   const InternalCascaderItem = (props) => {
-    const { data, checked, chooseItem } = {
-      ...defaultProps$K,
+    const { data, checked, chooseItem, activeColor } = {
+      ...defaultProps$M,
       ...props
     };
     const b2 = cn("cascader-item");
@@ -13698,6 +13793,7 @@
     const initData = () => {
     };
     return /* @__PURE__ */ React__default["default"].createElement("div", {
+      style: { color: checked ? activeColor : "" },
       className: classes,
       onClick: () => {
         chooseItem(data);
@@ -13714,7 +13810,7 @@
     }));
   };
   const CascaderItem = React__default["default"].forwardRef(InternalCascaderItem);
-  CascaderItem.defaultProps = defaultProps$K;
+  CascaderItem.defaultProps = defaultProps$M;
   CascaderItem.displayName = "NutCascaderItem";
   const formatTree = (tree, parent, config2) => tree.map((node) => {
     const {
@@ -13848,9 +13944,11 @@
       return pathNodes;
     }
   }
-  const defaultProps$J = {
+  const defaultProps$L = {
     className: "",
     style: {},
+    activeColor: "#fa2c19",
+    tabsColor: "",
     poppable: true,
     visible: false,
     options: [],
@@ -13878,6 +13976,7 @@
     const {
       className,
       style,
+      tabsColor,
       poppable,
       visible,
       options: options2,
@@ -13895,7 +13994,7 @@
       onClose,
       onChange,
       onPathChange
-    } = { ...defaultProps$J, ...props };
+    } = { ...defaultProps$L, ...props };
     const [tabvalue, setTabvalue] = React.useState("c1");
     const [optiosData, setOptiosData] = React.useState([]);
     const isLazy = () => state.configs.lazy && Boolean(state.configs.lazyLoad);
@@ -14119,7 +14218,8 @@
             }, /* @__PURE__ */ React__default["default"].createElement("span", {
               className: "nut-tabs__titles-item__text"
             }, !state.initLoading && state.panes.length && ((_a = pane == null ? void 0 : pane.selectedNode) == null ? void 0 : _a.text), !state.initLoading && state.panes.length && !((_b = pane == null ? void 0 : pane.selectedNode) == null ? void 0 : _b.text) && "\u8BF7\u9009\u62E9", !(!state.initLoading && state.panes.length) && "Loading..."), /* @__PURE__ */ React__default["default"].createElement("span", {
-              className: "nut-tabs__titles-item__line"
+              className: "nut-tabs__titles-item__line",
+              style: { background: tabsColor }
             }));
           });
         }
@@ -14154,9 +14254,9 @@
     }, renderItem()) : renderItem());
   };
   const Cascader = React__default["default"].forwardRef(InternalCascader);
-  Cascader.defaultProps = defaultProps$J;
+  Cascader.defaultProps = defaultProps$L;
   Cascader.displayName = "NutCascader";
-  const defaultProps$I = {
+  const defaultProps$K = {
     ...ComponentDefaults,
     placeholder: "",
     shape: "square",
@@ -14207,7 +14307,7 @@
       iconClassPrefix,
       iconFontClassName
     } = {
-      ...defaultProps$I,
+      ...defaultProps$K,
       ...props
     };
     const alignClass = `${align}`;
@@ -14356,9 +14456,9 @@
       className: `${searchbarBem("content")}`
     }, renderLeftinIcon(), renderField(), renderRightinIcon(), clearable && value && handleClear()), renderRightoutIcon(), renderRightLabel());
   };
-  SearchBar.defaultProps = defaultProps$I;
+  SearchBar.defaultProps = defaultProps$K;
   SearchBar.displayName = "NutSearchBar";
-  const defaultProps$H = {
+  const defaultProps$J = {
     confirmText: "",
     title: "",
     visible: false,
@@ -14556,7 +14656,7 @@
       })
     }, confirmText || locale.done))) : null))));
   };
-  NumberKeyboard.defaultProps = defaultProps$H;
+  NumberKeyboard.defaultProps = defaultProps$J;
   NumberKeyboard.displayName = "NutNumberKeyboard";
   const FormItemContext = React.createContext({});
   function _extends() {
@@ -15713,7 +15813,7 @@
     }
     return [formRef.current];
   };
-  const defaultProps$G = {
+  const defaultProps$I = {
     ...ComponentDefaults,
     name: "",
     label: "",
@@ -15760,7 +15860,7 @@
           showErrorLine,
           showErrorMessage
         } = {
-          ...defaultProps$G,
+          ...defaultProps$I,
           ...this.props
         };
         const item = ((_a = this.context.errList) == null ? void 0 : _a.length) > 0 && ((_b = this.context.errList) == null ? void 0 : _b.filter((item2) => {
@@ -15809,9 +15909,9 @@
       return this.renderLayout(returnChildNode);
     }
   }
-  FormItem.defaultProps = defaultProps$G;
+  FormItem.defaultProps = defaultProps$I;
   FormItem.contextType = FormItemContext;
-  const defaultProps$F = {
+  const defaultProps$H = {
     ...ComponentDefaults,
     className: "",
     style: void 0,
@@ -15838,7 +15938,7 @@
       starPositon,
       ...rest
     } = {
-      ...defaultProps$F,
+      ...defaultProps$H,
       ...props
     };
     const [formInstance] = useForm();
@@ -15859,10 +15959,10 @@
       value: formInstance
     }, children)));
   };
-  Form.defaultProps = defaultProps$F;
+  Form.defaultProps = defaultProps$H;
   Form.displayName = "NutForm";
   Form.Item = FormItem;
-  const defaultProps$E = {
+  const defaultProps$G = {
     cancelTxt: "",
     optionTag: "name",
     optionSubTag: "subname",
@@ -15896,7 +15996,7 @@
       className,
       style,
       ...rest
-    } = { ...defaultProps$E, ...props };
+    } = { ...defaultProps$G, ...props };
     const b2 = cn("actionsheet");
     const isHighlight = (item) => {
       return props.chooseTagValue && props.chooseTagValue === item[props.optionTag || "name"] ? props.color : "#1a1a1a";
@@ -15940,9 +16040,9 @@
       onClick: () => cancelActionSheet()
     }, cancelTxt)));
   };
-  ActionSheet.defaultProps = defaultProps$E;
+  ActionSheet.defaultProps = defaultProps$G;
   ActionSheet.displayName = "NutActionSheet";
-  const defaultProps$D = {
+  const defaultProps$F = {
     ...ComponentDefaults,
     bottom: 20,
     right: 10,
@@ -15968,7 +16068,7 @@
       iconClassPrefix,
       iconFontClassName
     } = {
-      ...defaultProps$D,
+      ...defaultProps$F,
       ...props
     };
     const [backTop, SetBackTop] = React.useState(false);
@@ -16059,9 +16159,9 @@
       name: "top"
     }));
   };
-  BackTop.defaultProps = defaultProps$D;
+  BackTop.defaultProps = defaultProps$F;
   BackTop.displayName = "NutBackTop";
-  const defaultProps$C = {
+  const defaultProps$E = {
     attract: false,
     direction: void 0,
     boundary: {
@@ -16074,7 +16174,7 @@
   };
   const Drag = (props) => {
     const { attract, direction, boundary, children, className, style, ...reset } = {
-      ...defaultProps$C,
+      ...defaultProps$E,
       ...props
     };
     const b2 = cn("drag");
@@ -16136,7 +16236,7 @@
       ...bind()
     }, children));
   };
-  Drag.defaultProps = defaultProps$C;
+  Drag.defaultProps = defaultProps$E;
   Drag.displayName = "NutDrag";
   const Content = (props) => {
     const {
@@ -16331,7 +16431,7 @@
       update: update2
     };
   }
-  const defaultProps$B = {
+  const defaultProps$D = {
     okText: "\u786E\u8BA4",
     cancelText: "\u53D6\u6D88",
     mask: true,
@@ -16422,9 +16522,9 @@
       });
     };
   });
-  Dialog.defaultProps = defaultProps$B;
+  Dialog.defaultProps = defaultProps$D;
   Dialog.displayName = "NutDialog";
-  const defaultProps$A = {
+  const defaultProps$C = {
     ...ComponentDefaults,
     hasMore: true,
     threshold: 200,
@@ -16461,7 +16561,7 @@
       iconFontClassName,
       ...restProps
     } = {
-      ...defaultProps$A,
+      ...defaultProps$C,
       ...props
     };
     const [isInfiniting, setIsInfiniting] = React.useState(false);
@@ -16625,7 +16725,7 @@
       className: "tips"
     }, loadMoreTxt || locale.infiniteloading.loadMoreText)));
   };
-  Infiniteloading.defaultProps = defaultProps$A;
+  Infiniteloading.defaultProps = defaultProps$C;
   Infiniteloading.displayName = "NutInfiniteloading";
   class Notification extends React__namespace.PureComponent {
     constructor(props) {
@@ -16800,7 +16900,7 @@
       }
     }
   };
-  const defaultProps$z = {
+  const defaultProps$B = {
     isAsync: false,
     checked: false,
     disable: false,
@@ -16823,7 +16923,7 @@
       className,
       style
     } = {
-      ...defaultProps$z,
+      ...defaultProps$B,
       ...props
     };
     const [value, setValue] = React.useState(false);
@@ -16863,7 +16963,7 @@
       className: `${b2("label")} close`
     }, inactiveText))));
   };
-  Switch.defaultProps = defaultProps$z;
+  Switch.defaultProps = defaultProps$B;
   Switch.displayName = "NutSwitch";
   function preventDefault(event, isStopPropagation) {
     if (typeof event.cancelable !== "boolean" || event.cancelable) {
@@ -16873,7 +16973,7 @@
       event.stopPropagation();
     }
   }
-  const defaultProps$y = {
+  const defaultProps$A = {
     name: "",
     leftWidth: 0,
     rightWidth: 0
@@ -16881,7 +16981,7 @@
   const Swipe = React.forwardRef((props, instanceRef) => {
     const swipeBem = cn("swipe");
     const touch = useTouch();
-    const { children, className, style } = { ...defaultProps$y, ...props };
+    const { children, className, style } = { ...defaultProps$A, ...props };
     const root = React.useRef();
     const opened = React.useRef(false);
     const lockClick = React.useRef(false);
@@ -17047,7 +17147,7 @@
       style: wrapperStyle
     }, renderActionContent("left", leftRef), children, renderActionContent("right", rightRef)));
   });
-  Swipe.defaultProps = defaultProps$y;
+  Swipe.defaultProps = defaultProps$A;
   Swipe.displayName = "NutSwipe";
   function bound(position, min, max) {
     let ret = position;
@@ -17085,7 +17185,7 @@
       console.log(e2);
     }
   }
-  const defaultProps$x = {
+  const defaultProps$z = {
     className: "",
     style: {},
     pullingText: "",
@@ -17102,7 +17202,7 @@
   const PullToRefresh = (p2) => {
     const { locale } = useConfig();
     const props = {
-      ...defaultProps$x,
+      ...defaultProps$z,
       ...p2,
       ...{
         pullingText: p2.pullingText || locale.pullToRefresh.pullingText,
@@ -17241,10 +17341,10 @@
       className: "nut-pulltorefresh-content"
     }, props.children));
   };
-  PullToRefresh.defaultProps = defaultProps$x;
+  PullToRefresh.defaultProps = defaultProps$z;
   PullToRefresh.displayName = "NutPullToRefresh";
   const isObject = (val) => val !== null && typeof val === "object";
-  const defaultProps$w = {
+  const defaultProps$y = {
     strokeWidth: 5,
     radius: 50,
     strokeLinecap: "round",
@@ -17267,7 +17367,7 @@
       strokeLinecap,
       ...restProps
     } = {
-      ...defaultProps$w,
+      ...defaultProps$y,
       ...props
     };
     const b2 = cn("circleprogress");
@@ -17353,9 +17453,9 @@
       className: "nut-circleprogress-text"
     }, children || /* @__PURE__ */ React__default["default"].createElement("div", null, progress, "%")));
   };
-  CircleProgress.defaultProps = defaultProps$w;
+  CircleProgress.defaultProps = defaultProps$y;
   CircleProgress.displayName = "NutCircleProgress";
-  const defaultProps$v = {
+  const defaultProps$x = {
     ...ComponentDefaults,
     direction: "across",
     list: [],
@@ -17399,7 +17499,7 @@
       iconClassPrefix,
       iconFontClassName
     } = {
-      ...defaultProps$v,
+      ...defaultProps$x,
       ...props
     };
     const wrap = React.useRef(null);
@@ -17646,16 +17746,16 @@
       size: "11px"
     }) : null))) : null);
   };
-  NoticeBar.defaultProps = defaultProps$v;
+  NoticeBar.defaultProps = defaultProps$x;
   NoticeBar.displayName = "NutNoticeBar";
   const DataContext$1 = React.createContext({});
-  const defaultProps$u = {
+  const defaultProps$w = {
     current: 0,
     direction: "horizontal",
     progressDot: false
   };
   const Steps = (props) => {
-    const propSteps = { ...defaultProps$u, ...props };
+    const propSteps = { ...defaultProps$w, ...props };
     const {
       children,
       current,
@@ -17689,9 +17789,9 @@
       children
     ));
   };
-  Steps.defaultProps = defaultProps$u;
+  Steps.defaultProps = defaultProps$w;
   Steps.displayName = "NutSteps";
-  const defaultProps$t = {
+  const defaultProps$v = {
     ...ComponentDefaults,
     title: "",
     content: "",
@@ -17715,7 +17815,7 @@
       iconFontClassName,
       ...restProps
     } = {
-      ...defaultProps$t,
+      ...defaultProps$v,
       ...props
     };
     const parent = React.useContext(DataContext$1);
@@ -17777,10 +17877,10 @@
       className: "nut-step-content"
     }, renderContent())));
   };
-  Step.defaultProps = defaultProps$t;
+  Step.defaultProps = defaultProps$v;
   Step.displayName = "NutStep";
   const DataContext = React.createContext({});
-  const defaultProps$s = {
+  const defaultProps$u = {
     width: typeof window === "object" ? window.innerWidth : 375,
     height: 0,
     duration: 500,
@@ -17798,7 +17898,7 @@
   };
   const DISTANCE = 5;
   const Swiper = React__default["default"].forwardRef((props, ref) => {
-    const propSwiper = { ...defaultProps$s, ...props };
+    const propSwiper = { ...defaultProps$u, ...props };
     const {
       children,
       direction,
@@ -18208,13 +18308,13 @@
       });
     })) : /* @__PURE__ */ React__default["default"].createElement("div", null, pageContent)));
   });
-  Swiper.defaultProps = defaultProps$s;
+  Swiper.defaultProps = defaultProps$u;
   Swiper.displayName = "NutSwiper";
-  const defaultProps$r = {
+  const defaultProps$t = {
     direction: "horizontal"
   };
   const SwiperItem = React__default["default"].forwardRef((props, ref) => {
-    const _props = { ...defaultProps$r, ...props };
+    const _props = { ...defaultProps$t, ...props };
     const { className, style, children, direction, size } = _props;
     const parent = React.useContext(DataContext);
     const b2 = cn("swiper-item");
@@ -18233,10 +18333,10 @@
       style: { ...style, ...getStyle() }
     }, children);
   });
-  SwiperItem.defaultProps = defaultProps$r;
+  SwiperItem.defaultProps = defaultProps$t;
   SwiperItem.displayName = "NutSwiperItem";
   const AvatarContext = React.createContext({});
-  const defaultProps$q = {
+  const defaultProps$s = {
     ...ComponentDefaults,
     size: "",
     icon: "",
@@ -18269,7 +18369,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$q,
+      ...defaultProps$s,
       ...props
     };
     const [maxSum, setMaxSum] = React.useState(0);
@@ -18352,9 +18452,9 @@
       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$q;
+  Avatar.defaultProps = defaultProps$s;
   Avatar.displayName = "NutAvatar";
-  const defaultProps$p = {
+  const defaultProps$r = {
     maxContent: "",
     maxCount: "",
     maxBgColor: "#eee",
@@ -18366,7 +18466,7 @@
   };
   const AvatarGroup = (props) => {
     useConfig();
-    const propAvatarGroup = { ...defaultProps$p, ...props };
+    const propAvatarGroup = { ...defaultProps$r, ...props };
     const { className, style, children } = propAvatarGroup;
     const avatarGroupRef = React.useRef(null);
     const b2 = cn("avatar-group");
@@ -18383,9 +18483,9 @@
       ref: avatarGroupRef
     }, children));
   };
-  AvatarGroup.defaultProps = defaultProps$p;
+  AvatarGroup.defaultProps = defaultProps$r;
   AvatarGroup.displayName = "NutAvatarGroup";
-  const defaultProps$o = {
+  const defaultProps$q = {
     price: 0,
     needSymbol: true,
     symbol: "&yen;",
@@ -18407,7 +18507,7 @@
       className,
       ...rest
     } = {
-      ...defaultProps$o,
+      ...defaultProps$q,
       ...props
     };
     const b2 = cn("price");
@@ -18463,9 +18563,9 @@
       className: `${b2("decimal")} ${b2(`decimal-${size}`)}`
     }, formatDecimal(price)), needSymbol && position === "after" ? renderSymbol() : null);
   };
-  Price.defaultProps = defaultProps$o;
+  Price.defaultProps = defaultProps$q;
   Price.displayName = "NutPrice";
-  const defaultProps$n = {
+  const defaultProps$p = {
     ...ComponentDefaults,
     value: "",
     dot: false,
@@ -18490,7 +18590,7 @@
       iconClassPrefix,
       iconFontClassName
     } = {
-      ...defaultProps$n,
+      ...defaultProps$p,
       ...props
     };
     function content() {
@@ -18528,9 +18628,9 @@
       style: getStyle()
     }, content()));
   };
-  Badge.defaultProps = defaultProps$n;
+  Badge.defaultProps = defaultProps$p;
   Badge.displayName = "NutBadge";
-  const defaultProps$m = {
+  const defaultProps$o = {
     ...ComponentDefaults,
     type: "default",
     color: "",
@@ -18563,7 +18663,7 @@
       iconClassPrefix,
       iconFontClassName
     } = {
-      ...defaultProps$m,
+      ...defaultProps$o,
       ...props
     };
     const [btnName, setBtnName] = React.useState("");
@@ -18637,7 +18737,7 @@
       className: "text"
     }, children)));
   };
-  Tag.defaultProps = defaultProps$m;
+  Tag.defaultProps = defaultProps$o;
   Tag.displayName = "NutTag";
   function fillRef(ref, node) {
     if (typeof ref === "function") {
@@ -18681,7 +18781,7 @@
       return trigger;
     }
   }
-  const defaultProps$l = {
+  const defaultProps$n = {
     ...ComponentDefaults,
     list: [],
     theme: "light",
@@ -18710,7 +18810,7 @@
       iconFontClassName,
       ...reset
     } = {
-      ...defaultProps$l,
+      ...defaultProps$n,
       ...props
     };
     const goodItem = React.useRef(null);
@@ -18804,9 +18904,9 @@
       style: { background: "transparent" }
     }) : "");
   };
-  Popover.defaultProps = defaultProps$l;
+  Popover.defaultProps = defaultProps$n;
   Popover.displayName = "NutPopover";
-  const defaultProps$k = {
+  const defaultProps$m = {
     width: "100px",
     height: "100px",
     row: 1,
@@ -18834,7 +18934,7 @@
       avatarShape,
       ...restProps
     } = {
-      ...defaultProps$k,
+      ...defaultProps$m,
       ...props
     };
     const b2 = cn("skeleton");
@@ -18889,9 +18989,9 @@
       });
     })))));
   };
-  Skeleton.defaultProps = defaultProps$k;
+  Skeleton.defaultProps = defaultProps$m;
   Skeleton.displayName = "NutSkeleton";
-  const defaultProps$j = {
+  const defaultProps$l = {
     paused: false,
     startTime: Date.now(),
     endTime: Date.now(),
@@ -18918,7 +19018,7 @@
       onUpdate,
       children,
       ...rest
-    } = { ...defaultProps$j, ...props };
+    } = { ...defaultProps$l, ...props };
     const b2 = cn("countdown");
     const [restTimeStamp, setRestTime] = React.useState(0);
     const stateRef = React.useRef({
@@ -19114,9 +19214,9 @@
     }));
   };
   const CountDown = React__default["default"].forwardRef(InternalCountDown);
-  CountDown.defaultProps = defaultProps$j;
+  CountDown.defaultProps = defaultProps$l;
   CountDown.displayName = "NutCountDown";
-  const defaultProps$i = {
+  const defaultProps$k = {
     style: {},
     activeName: ["0"],
     accordion: false,
@@ -19142,7 +19242,7 @@
         iconColor,
         onChange
       } = {
-        ...defaultProps$i,
+        ...defaultProps$k,
         ...props
       };
       const childrenDom = React__default["default"].Children.toArray(children);
@@ -19201,9 +19301,9 @@
     },
     areEqual
   );
-  Collapse.defaultProps = defaultProps$i;
+  Collapse.defaultProps = defaultProps$k;
   Collapse.displayName = "NutCollapse";
-  const defaultProps$h = {
+  const defaultProps$j = {
     ...ComponentDefaults,
     title: "",
     name: "",
@@ -19242,7 +19342,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$h,
+      ...defaultProps$j,
       ...props
     };
     const [domHeight, setDomHeight] = React.useState(-1);
@@ -19322,9 +19422,9 @@
       className: colBem("content-text")
     }, children)));
   };
-  CollapseItem.defaultProps = defaultProps$h;
+  CollapseItem.defaultProps = defaultProps$j;
   CollapseItem.displayName = "NutCollapseItem";
-  const defaultProps$g = {
+  const defaultProps$i = {
     maxLen: 0,
     endNumber: "",
     delaySpeed: 300,
@@ -19342,7 +19442,7 @@
       thousands,
       ...reset
     } = {
-      ...defaultProps$g,
+      ...defaultProps$i,
       ...props
     };
     const b2 = cn("countup");
@@ -19412,9 +19512,9 @@
       }, item));
     })));
   };
-  CountUp.defaultProps = defaultProps$g;
+  CountUp.defaultProps = defaultProps$i;
   CountUp.displayName = "NutCountUp";
-  const defaultProps$f = {};
+  const defaultProps$h = {};
   class AnimatingNumbers extends React.Component {
     constructor(props) {
       super(props);
@@ -19426,7 +19526,7 @@
       });
     }
   }
-  AnimatingNumbers.defaultProps = defaultProps$f;
+  AnimatingNumbers.defaultProps = defaultProps$h;
   AnimatingNumbers.displayName = "NutAnimatingNumbers";
   AnimatingNumbers.CountUp = CountUp;
   AnimatingNumbers.CountUp = CountUp;
@@ -19435,7 +19535,7 @@
     error: "https://ftcms.jd.com/p/files/61a9e33ee7dcdbcc0ce62736.png",
     network: "https://static-ftcms.jd.com/p/files/61a9e31de7dcdbcc0ce62734.png"
   };
-  const defaultProps$e = {
+  const defaultProps$g = {
     description: "\u65E0\u5185\u5BB9",
     image: "empty",
     imageSize: "",
@@ -19443,9 +19543,9 @@
   };
   const Empty = (props) => {
     const { locale } = useConfig();
-    defaultProps$e.description = locale.noData || defaultProps$e.description;
+    defaultProps$g.description = locale.noData || defaultProps$g.description;
     const { image, imageSize, description, children, className, ...rest } = {
-      ...defaultProps$e,
+      ...defaultProps$g,
       ...props
     };
     const [imgStyle, setImgStyle] = React.useState({});
@@ -19487,7 +19587,7 @@
       className: b2("description")
     }, description) : { description }, children));
   };
-  Empty.defaultProps = defaultProps$e;
+  Empty.defaultProps = defaultProps$g;
   Empty.displayName = "NutEmpty";
   const initPositinoCache = (reaItemSize, length = 0) => {
     let index = 0;
@@ -19600,7 +19700,7 @@
       }
     });
   };
-  const defaultProps$d = {};
+  const defaultProps$f = {};
   const VirtualList = (props) => {
     const {
       sourceData = [],
@@ -19764,9 +19864,9 @@
       }) : data);
     }))));
   };
-  VirtualList.defaultProps = defaultProps$d;
+  VirtualList.defaultProps = defaultProps$f;
   VirtualList.displayName = "NutVirtualList";
-  const defaultProps$c = {
+  const defaultProps$e = {
     ...ComponentDefaults,
     className: "",
     style: {},
@@ -19778,7 +19878,7 @@
   };
   const Table = (props) => {
     const { locale } = useConfig();
-    defaultProps$c.noData = locale.noData;
+    defaultProps$e.noData = locale.noData;
     const {
       children,
       className,
@@ -19794,7 +19894,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$c,
+      ...defaultProps$e,
       ...props
     };
     const [curData, setCurData] = React.useState(data);
@@ -19892,9 +19992,9 @@
       className: "nut-table__nodata__text"
     }, noData))));
   };
-  Table.defaultProps = defaultProps$c;
+  Table.defaultProps = defaultProps$e;
   Table.displayName = "NutTable";
-  const defaultProps$b = {
+  const defaultProps$d = {
     source: {
       type: {},
       src: ""
@@ -19922,7 +20022,7 @@
       onPlayend,
       ...restProps
     } = {
-      ...defaultProps$b,
+      ...defaultProps$d,
       ...props
     };
     const rootRef = React.useRef(null);
@@ -19979,9 +20079,9 @@
       kind: "captions"
     })));
   };
-  Video.defaultProps = defaultProps$b;
+  Video.defaultProps = defaultProps$d;
   Video.displayName = "NutVideo";
-  const defaultProps$a = {
+  const defaultProps$c = {
     ...ComponentDefaults,
     className: "",
     url: "",
@@ -20026,7 +20126,7 @@
       iconFontClassName,
       ...rest
     } = {
-      ...defaultProps$a,
+      ...defaultProps$c,
       ...props
     };
     const [playing, setPlaying] = React.useState(false);
@@ -20222,9 +20322,9 @@
       kind: "captions"
     })));
   };
-  Audio.defaultProps = defaultProps$a;
+  Audio.defaultProps = defaultProps$c;
   Audio.displayName = "NutAudio";
-  const defaultProps$9 = {
+  const defaultProps$b = {
     images: [],
     videos: [],
     show: false,
@@ -20416,8 +20516,208 @@
       className: "nut-imagepreview-index"
     }, active, "/", (images ? images.length : 0) + (videos ? videos.length : 0)));
   };
-  ImagePreview.defaultProps = defaultProps$9;
+  ImagePreview.defaultProps = defaultProps$b;
   ImagePreview.displayName = "NutImagePreview";
+  const defaultProps$a = {
+    rate: 0,
+    digits: 2,
+    showSign: false,
+    showZero: false,
+    arrowLeft: false,
+    syncTextColor: true,
+    textColor: "#333",
+    riseColor: "#fa2c19",
+    dropColor: "#64b578",
+    iconSize: "12px",
+    upIconName: "triangle-up",
+    downIconName: "triangle-down",
+    className: ""
+  };
+  const TrendArrow = (props) => {
+    const {
+      rate,
+      digits,
+      showSign,
+      showZero,
+      arrowLeft,
+      syncTextColor,
+      textColor,
+      riseColor,
+      dropColor,
+      iconSize,
+      upIconName,
+      downIconName,
+      className,
+      children,
+      ...rest
+    } = { ...defaultProps$a, ...props };
+    const b2 = cn("trendarrow");
+    const handleClick2 = () => {
+    };
+    const rateTrend = React.useRef(rate > 0);
+    const myFixed = (num, digit = 2) => {
+      if (Object.is(parseFloat(num), NaN)) {
+        return console.log(`\u4F20\u5165\u7684\u503C\uFF1A${num}\u4E0D\u662F\u4E00\u4E2A\u6570\u5B57`);
+      }
+      num = parseFloat(num);
+      const numPow = Math.pow(10, digit);
+      return (Math.round((num + Number.EPSILON) * numPow) / numPow).toFixed(digit);
+    };
+    const calcStyle = (() => {
+      const arrowColor = rateTrend.current ? riseColor : dropColor;
+      const textEquArrowColor = syncTextColor ? arrowColor : textColor;
+      const style = {
+        color: rate === 0 ? textColor : textEquArrowColor
+      };
+      return style;
+    })();
+    const calcRate = (() => {
+      rateTrend.current = rate > 0;
+      const absRate = Math.abs(rate);
+      if (!showZero && rate === 0) {
+        return "--";
+      }
+      const resultRate = `${showSign && rate !== 0 ? rateTrend.current ? "+" : "-" : ""}${myFixed(Number(absRate), digits)}%`;
+      return resultRate;
+    })();
+    const calcIconProps = (() => {
+      const iconProps = {
+        name: rateTrend.current ? upIconName : downIconName,
+        color: rateTrend.current ? riseColor : dropColor,
+        size: iconSize
+      };
+      return iconProps;
+    })();
+    const renderContent = (arrowLeft2) => {
+      const classNameSuffix = !arrowLeft2 ? "icon-after" : "icon-before";
+      return /* @__PURE__ */ React__default["default"].createElement("span", {
+        className: `${b2(classNameSuffix)} ${b2("rate")}`,
+        style: calcStyle
+      }, calcRate);
+    };
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${b2()} ${className}`,
+      ...rest,
+      onClick: handleClick2
+    }, !arrowLeft && renderContent(!arrowLeft), children || /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, Number(rate) !== 0 && /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
+      size: calcIconProps.size,
+      name: calcIconProps.name,
+      color: calcIconProps.color
+    })), arrowLeft && renderContent(!arrowLeft));
+  };
+  TrendArrow.defaultProps = defaultProps$a;
+  TrendArrow.displayName = "NutTrendArrow";
+  const defaultProps$9 = {
+    content: "",
+    fullPage: true,
+    zIndex: 2e3,
+    gapX: 24,
+    gapY: 48,
+    width: 120,
+    height: 64,
+    image: "",
+    imageWidth: 120,
+    imageHeight: 64,
+    rotate: -22,
+    fontColor: "rgba(0,0,0,.15)",
+    fontStyle: "normal",
+    fontFamily: "PingFang SC",
+    fontWeight: "normal",
+    fontSize: 14
+  };
+  const WaterMark = (props) => {
+    const { locale } = useConfig();
+    const {
+      content,
+      fullPage,
+      zIndex,
+      className,
+      gapX,
+      gapY,
+      width,
+      height,
+      image,
+      imageWidth,
+      imageHeight,
+      rotate,
+      fontColor,
+      fontStyle,
+      fontFamily,
+      fontWeight,
+      fontSize,
+      style,
+      children
+    } = {
+      ...defaultProps$9,
+      ...props
+    };
+    const [base64Url, setBase64Url] = React.useState("");
+    const b2 = cn("watermark");
+    const classes = classNames({
+      [`${b2("")}`]: true,
+      [`${b2("")}-full-page`]: fullPage
+    });
+    const cls = classNames(classes, className);
+    React.useEffect(() => {
+      init();
+    }, []);
+    const init = () => {
+      const canvas = document.createElement("canvas");
+      const ratio = window.devicePixelRatio;
+      const ctx2 = canvas.getContext("2d");
+      const canvasWidth = `${(gapX + width) * ratio}px`;
+      const canvasHeight = `${(gapY + height) * ratio}px`;
+      const markWidth = width * ratio;
+      const markHeight = height * ratio;
+      canvas.setAttribute("width", canvasWidth);
+      canvas.setAttribute("height", canvasHeight);
+      if (ctx2) {
+        if (image) {
+          ctx2.translate(markWidth / 2, markHeight / 2);
+          ctx2.rotate(Math.PI / 180 * Number(rotate));
+          const img = new Image();
+          img.crossOrigin = "anonymous";
+          img.referrerPolicy = "no-referrer";
+          img.src = image;
+          img.onload = () => {
+            ctx2.drawImage(
+              img,
+              -imageWidth * ratio / 2,
+              -imageHeight * ratio / 2,
+              imageWidth * ratio,
+              imageHeight * ratio
+            );
+            ctx2.restore();
+            setBase64Url(canvas.toDataURL());
+          };
+        } else if (content) {
+          ctx2.textBaseline = "middle";
+          ctx2.textAlign = "center";
+          ctx2.translate(markWidth / 2, markHeight / 2);
+          ctx2.rotate(Math.PI / 180 * Number(rotate));
+          const markSize = Number(fontSize) * ratio;
+          ctx2.font = `${fontStyle} normal ${fontWeight} ${markSize}px/${markHeight}px ${fontFamily}`;
+          ctx2.fillStyle = fontColor;
+          ctx2.fillText(content, 0, 0);
+          ctx2.restore();
+          setBase64Url(canvas.toDataURL());
+        }
+      } else {
+        throw new Error(locale.watermark.errorCanvasTips);
+      }
+    };
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: cls,
+      style: {
+        zIndex,
+        backgroundSize: `${gapX + width}px`,
+        backgroundImage: `url('${base64Url}')`,
+        ...style
+      }
+    });
+  };
+  WaterMark.defaultProps = defaultProps$9;
+  WaterMark.displayName = "NutWaterMark";
   const defaultProps$8 = {
     type: "custom",
     existAddress: [],
@@ -21517,6 +21817,7 @@
   exports2.Grid = Grid;
   exports2.GridItem = GridItem;
   exports2.Icon = Icon$1;
+  exports2.Image = Image$1;
   exports2.ImagePreview = ImagePreview;
   exports2.Indicator = Indicator;
   exports2.Infiniteloading = Infiniteloading;
@@ -21567,8 +21868,10 @@
   exports2.TimePannel = TimePannel;
   exports2.TimeSelect = TimeSelect;
   exports2.Toast = Toast;
+  exports2.TrendArrow = TrendArrow;
   exports2.Uploader = Uploader;
   exports2.Video = Video;
   exports2.VirtualList = VirtualList;
+  exports2.WaterMark = WaterMark;
   Object.defineProperties(exports2, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 });