@nutui/nutui-react 1.1.4-beta.1 → 1.1.4-beta.2

package/dist/nutui.react.es.js

@@ -34,7 +34,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 /*!
-* @nutui/nutui-react v1.1.4-beta.1 Wed May 11 2022 10:28:15 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.1.4-beta.2 Fri May 20 2022 09:38:53 GMT+0800 (China Standard Time)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
@@ -2618,6 +2618,7 @@ const defaultProps$L = {
   tabTitle: "",
   icon: "",
   href: "",
+  to: "",
   num: "",
   active: false,
   activeColor: "",
@@ -2627,12 +2628,17 @@ const defaultProps$L = {
   }
 };
 const TabbarItem = (props) => {
-  const { tabTitle, icon, href, num, active, activeColor, unactiveColor, index: index2, handleClick } = __spreadValues(__spreadValues({}, defaultProps$L), props);
+  const { tabTitle, icon, href, to: to2, num, active, activeColor, unactiveColor, index: index2, handleClick } = __spreadValues(__spreadValues({}, defaultProps$L), props);
   const b2 = cn("tabbar-item");
   const bIcon = cn("tabbar-item__icon-box");
+  const history = useHistory();
   useEffect(() => {
     if (active && href) {
       window.location.href = href;
+      return;
+    }
+    if (active && to2) {
+      history.push(to2);
     }
   }, [active]);
   return /* @__PURE__ */ React__default.createElement("div", {
@@ -5801,6 +5807,8 @@ const defaultProps$t = {
   url: "",
   maximum: 1,
   uploadIcon: "photograph",
+  uploadIconSize: "",
+  listType: "picture",
   name: "file",
   accept: "*",
   disabled: false,
@@ -5825,6 +5833,7 @@ const defaultProps$t = {
 class FileItem {
   constructor() {
     __publicField(this, "status", "ready");
+    __publicField(this, "message", "\u51C6\u5907\u4E2D..");
     __publicField(this, "uid", new Date().getTime().toString());
     __publicField(this, "name");
     __publicField(this, "url");
@@ -5836,8 +5845,11 @@ const InternalUploader = (props, ref) => {
   const _a = __spreadValues(__spreadValues({}, defaultProps$t), props), {
     children,
     uploadIcon,
+    uploadIconSize,
     name,
     accept,
+    defaultFileList,
+    listType,
     disabled,
     multiple,
     url,
@@ -5858,6 +5870,8 @@ const InternalUploader = (props, ref) => {
     clearInput,
     start: start2,
     removeImage,
+    change,
+    fileItemClick,
     progress,
     success,
     update: update2,
@@ -5868,8 +5882,11 @@ const InternalUploader = (props, ref) => {
   } = _a, restProps = __objRest(_a, [
     "children",
     "uploadIcon",
+    "uploadIconSize",
     "name",
     "accept",
+    "defaultFileList",
+    "listType",
     "disabled",
     "multiple",
     "url",
@@ -5890,6 +5907,8 @@ const InternalUploader = (props, ref) => {
     "clearInput",
     "start",
     "removeImage",
+    "change",
+    "fileItemClick",
     "progress",
     "success",
     "update",
@@ -5900,6 +5919,11 @@ const InternalUploader = (props, ref) => {
   ]);
   const [fileList, setFileList] = useState([]);
   const [uploadQueue, setUploadQueue] = useState([]);
+  useEffect(() => {
+    if (defaultFileList) {
+      setFileList(defaultFileList);
+    }
+  }, [defaultFileList]);
   const b2 = cn("uploader");
   const classes = classNames(className, b2(""));
   useImperativeHandle(ref, () => ({
@@ -5938,6 +5962,7 @@ const InternalUploader = (props, ref) => {
         fileList2.map((item) => {
           if (item.uid === fileItem.uid) {
             item.status = "ready";
+            item.message = "\u51C6\u5907\u4E0A\u4F20";
           }
         });
         return [...fileList2];
@@ -5949,6 +5974,7 @@ const InternalUploader = (props, ref) => {
         fileList2.map((item) => {
           if (item.uid === fileItem.uid) {
             item.status = "uploading";
+            item.message = "\u4E0A\u4F20\u4E2D...";
           }
         });
         return [...fileList2];
@@ -5961,6 +5987,7 @@ const InternalUploader = (props, ref) => {
         fileList2.map((item) => {
           if (item.uid === fileItem.uid) {
             item.status = "success";
+            item.message = "\u4E0A\u4F20\u6210\u529F";
           }
         });
         return [...fileList2];
@@ -5975,6 +6002,7 @@ const InternalUploader = (props, ref) => {
         fileList2.map((item) => {
           if (item.uid === fileItem.uid) {
             item.status = "error";
+            item.message = "\u4E0A\u4F20\u5931\u8D25";
           }
         });
         return [...fileList2];
@@ -6004,6 +6032,7 @@ const InternalUploader = (props, ref) => {
       fileItem.type = file.type;
       fileItem.formData = formData;
       fileItem.uid = file.lastModified + fileItem.uid;
+      fileItem.message = "\u51C6\u5907\u4E0A\u4F20";
       executeUpload(fileItem, index2);
       if (isPreview && file.type.includes("image")) {
         const reader = new FileReader();
@@ -6071,9 +6100,12 @@ const InternalUploader = (props, ref) => {
       clearInputValue($el);
     }
   };
+  const handleItemClick = (file) => {
+    fileItemClick && fileItemClick(file);
+  };
   return /* @__PURE__ */ React__default.createElement("div", __spreadValues({
     className: classes
-  }, restProps), children ? /* @__PURE__ */ React__default.createElement("div", {
+  }, restProps), children && /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-uploader__slot"
   }, /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children, maximum > fileList.length && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, capture ? /* @__PURE__ */ React__default.createElement("input", {
     className: "nut-uploader__input",
@@ -6092,30 +6124,63 @@ const InternalUploader = (props, ref) => {
     disabled,
     multiple,
     onChange: fileChange
-  })))) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, fileList.length !== 0 && fileList.map((item, index2) => {
-    console.log("item", item);
+  })))), fileList.length !== 0 && fileList.map((item, index2) => {
     return /* @__PURE__ */ React__default.createElement("div", {
-      className: "nut-uploader__preview",
+      className: `nut-uploader__preview ${listType}`,
       key: item.uid
-    }, /* @__PURE__ */ React__default.createElement("div", {
+    }, listType == "picture" && !children && /* @__PURE__ */ React__default.createElement("div", {
       className: "nut-uploader__preview-img"
-    }, isDeletable && /* @__PURE__ */ React__default.createElement(Icon, {
+    }, item.status === "ready" ? /* @__PURE__ */ React__default.createElement("div", {
+      className: "nut-uploader__preview__progress"
+    }, /* @__PURE__ */ React__default.createElement("div", {
+      className: "nut-uploader__preview__progress__msg"
+    }, item.message)) : item.status !== "success" && /* @__PURE__ */ React__default.createElement("div", {
+      className: "nut-uploader__preview__progress"
+    }, /* @__PURE__ */ React__default.createElement(Icon, {
+      color: "#fff",
+      name: `${item.status == "error" ? "failure" : "loading"}`
+    }), /* @__PURE__ */ React__default.createElement("div", {
+      className: "nut-uploader__preview__progress__msg"
+    }, item.message)), isDeletable && /* @__PURE__ */ React__default.createElement(Icon, {
       color: "rgba(0,0,0,0.6)",
       className: "close",
-      name: "circle-close",
+      name: "failure",
       click: () => onDelete(item, index2)
-    }), item.type.includes("image") && item.url && /* @__PURE__ */ React__default.createElement("img", {
+    }), item.type.includes("image") ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, item.url && /* @__PURE__ */ React__default.createElement("img", {
       className: "nut-uploader__preview-img__c",
-      src: item.url
-    }), !item.type.includes("image") && defaultImg && /* @__PURE__ */ React__default.createElement("img", {
+      src: item.url,
+      onClick: () => handleItemClick(item)
+    })) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, defaultImg ? /* @__PURE__ */ React__default.createElement("img", {
       className: "nut-uploader__preview-img__c",
-      src: defaultImg
-    }), item.status !== "success" && /* @__PURE__ */ React__default.createElement("div", {
+      src: defaultImg,
+      onClick: () => handleItemClick(item)
+    }) : /* @__PURE__ */ React__default.createElement("div", {
+      className: "nut-uploader__preview-img__file"
+    }, /* @__PURE__ */ React__default.createElement("div", {
+      onClick: () => handleItemClick(item),
+      className: "nut-uploader__preview-img__file__name"
+    }, /* @__PURE__ */ React__default.createElement(Icon, {
+      color: "#808080",
+      name: "link"
+    }), "\xA0", item.name))), /* @__PURE__ */ React__default.createElement("div", {
       className: "tips"
-    }, item.status)));
-  }), maximum > fileList.length && /* @__PURE__ */ React__default.createElement("div", {
-    className: "nut-uploader__upload"
+    }, item.name)), listType == "list" && /* @__PURE__ */ React__default.createElement("div", {
+      className: "nut-uploader__preview-list"
+    }, /* @__PURE__ */ React__default.createElement("div", {
+      className: `nut-uploader__preview-img__file__name ${item.status}`,
+      onClick: () => handleItemClick(item)
+    }, /* @__PURE__ */ React__default.createElement(Icon, {
+      name: "link"
+    }), "\xA0", item.name), /* @__PURE__ */ React__default.createElement(Icon, {
+      color: "#808080",
+      className: "nut-uploader__preview-img__file__del",
+      name: "del",
+      click: () => onDelete(item, index2)
+    })));
+  }), maximum > fileList.length && listType == "picture" && !children && /* @__PURE__ */ React__default.createElement("div", {
+    className: `nut-uploader__upload ${listType}`
   }, /* @__PURE__ */ React__default.createElement(Icon, {
+    size: uploadIconSize,
     color: "#808080",
     name: uploadIcon
   }), capture ? /* @__PURE__ */ React__default.createElement("input", {
@@ -6135,7 +6200,7 @@ const InternalUploader = (props, ref) => {
     disabled,
     multiple,
     onChange: fileChange
-  }))));
+  })));
 };
 const Uploader = React__default.forwardRef(InternalUploader);
 Uploader.defaultProps = defaultProps$t;
@@ -11485,86 +11550,118 @@ const Switch = (props) => {
 };
 Switch.defaultProps = defaultProps$n;
 Switch.displayName = "NutSwitch";
+const isObject = (val) => val !== null && typeof val === "object";
 const defaultProps$m = {
-  strokeInnerWidth: 10,
-  progress: 10,
-  isAuto: false,
-  progressOption: {}
+  strokeWidth: 5,
+  radius: 50,
+  strokeLinecap: "round",
+  circleColor: "",
+  pathColor: "",
+  clockwise: true
 };
 const CircleProgress = (props) => {
+  var _b;
   const _a = __spreadValues(__spreadValues({}, defaultProps$m), props), {
     children,
-    strokeInnerWidth,
     progress,
-    isAuto,
-    progressOption,
     className,
-    style
+    radius,
+    pathColor,
+    clockwise,
+    circleColor,
+    strokeWidth,
+    style,
+    strokeLinecap
   } = _a, restProps = __objRest(_a, [
     "children",
-    "strokeInnerWidth",
     "progress",
-    "isAuto",
-    "progressOption",
     "className",
-    "style"
+    "radius",
+    "pathColor",
+    "clockwise",
+    "circleColor",
+    "strokeWidth",
+    "style",
+    "strokeLinecap"
   ]);
   const b2 = cn("circleprogress");
   const classes = classNames(className, b2(""));
-  const option = () => {
-    const baseOption = {
-      radius: 50,
-      strokeOutWidth: 10,
-      backColor: "#d9d9d9",
-      progressColor: "red",
-      cy: 1,
-      cx: 1,
-      size: 1,
-      startPosition: ""
-    };
-    Object.assign(baseOption, progressOption);
-    baseOption.cy = baseOption.cx = baseOption.radius + baseOption.strokeOutWidth;
-    baseOption.size = (baseOption.radius + baseOption.strokeOutWidth) * 2;
-    baseOption.startPosition = `rotate(-90,${baseOption.cx},${baseOption.cy})`;
-    return baseOption;
-  };
+  const refRandomId = Math.random().toString(36).slice(-8);
   const styles = __spreadValues({
-    height: `${option().size}px`,
-    width: `${option().size}px`
+    height: `${Number(radius) * 2}px`,
+    width: `${Number(radius) * 2}px`
   }, style);
-  const arcLength = () => {
-    const circleLength = Math.floor(2 * Math.PI * option().radius);
-    const progressLength = progress / 100 * circleLength;
-    return `${progressLength},${circleLength}`;
+  const pathStyle = {
+    stroke: pathColor
+  };
+  const hoverStyle = () => {
+    let perimeter = 283;
+    let offset = perimeter * Number(progress) / 100;
+    return {
+      stroke: isObject(circleColor) ? `url(#${refRandomId})` : circleColor,
+      strokeDasharray: `${offset}px ${perimeter}px`
+    };
+  };
+  const path = () => {
+    const isWise = clockwise ? 1 : 0;
+    return `M 50 50 m -45 0 a 45 45 0 1 ${isWise} 90 0  a 45 45 0 1 ${isWise} -90 0`;
+  };
+  const hoverColor = () => {
+    return isObject(circleColor) ? `url(#${refRandomId})` : circleColor;
+  };
+  const stop2 = () => {
+    if (!isObject(circleColor)) {
+      return;
+    }
+    let color = circleColor;
+    const colorArr = Object.keys(color).sort((a, b22) => parseFloat(a) - parseFloat(b22));
+    let stopArr = [];
+    colorArr.map((item) => {
+      let obj = {
+        key: "",
+        value: ""
+      };
+      obj.key = item;
+      obj.value = color[item];
+      stopArr.push(obj);
+    });
+    return stopArr;
   };
   return /* @__PURE__ */ React__default.createElement("div", __spreadValues({
     className: classes,
     style: styles
   }, restProps), /* @__PURE__ */ React__default.createElement("svg", {
-    height: option().size,
-    width: option().size,
-    "x-mlns": "http://www.w3.org/200/svg"
-  }, /* @__PURE__ */ React__default.createElement("circle", {
-    r: option().radius,
-    cx: option().cx,
-    cy: option().cy,
-    stroke: option().backColor,
-    strokeWidth: option().strokeOutWidth,
-    fill: "none"
-  }), /* @__PURE__ */ React__default.createElement("circle", {
-    r: option().radius,
-    cx: option().cx,
-    cy: option().cy,
-    stroke: option().progressColor,
-    strokeWidth: strokeInnerWidth,
-    strokeDasharray: arcLength(),
-    transform: option().startPosition,
+    viewBox: "0 0 100 100"
+  }, /* @__PURE__ */ React__default.createElement("defs", null, /* @__PURE__ */ React__default.createElement("linearGradient", {
+    id: refRandomId,
+    x1: "100%",
+    y1: "0%",
+    x2: "0%",
+    y2: "0%"
+  }, (_b = stop2()) == null ? void 0 : _b.map((item, index2) => {
+    return /* @__PURE__ */ React__default.createElement("stop", {
+      key: index2,
+      offset: item.key,
+      stopColor: item.value
+    });
+  }))), /* @__PURE__ */ React__default.createElement("path", {
+    className: "nut-circleprogress-path",
+    style: pathStyle,
+    d: path(),
+    fill: "none",
+    strokeWidth
+  }), /* @__PURE__ */ React__default.createElement("path", {
+    className: "nut-circleprogress-hover",
+    style: hoverStyle(),
+    d: path(),
     fill: "none",
-    strokeLinecap: "round",
-    style: { transition: "stroke-dasharray 0.6s ease 0s, stroke 0.6s ease 0s" }
+    stroke: hoverColor(),
+    strokeLinecap,
+    transform: "rotate(90,50,50)",
+    strokeWidth
   })), /* @__PURE__ */ React__default.createElement("div", {
-    className: "nut-circleprogress-content"
-  }, !isAuto ? `${progress}%` : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children)));
+    className: "nut-circleprogress-text"
+  }, children ? children : /* @__PURE__ */ React__default.createElement("div", null, progress, "%")));
 };
 CircleProgress.defaultProps = defaultProps$m;
 CircleProgress.displayName = "NutCircleProgress";
@@ -11829,7 +11926,7 @@ const defaultProps$k = {
 };
 const Steps = (props) => {
   const propSteps = __spreadValues(__spreadValues({}, defaultProps$k), props);
-  const _a = propSteps, { children, direction, className } = _a, restProps = __objRest(_a, ["children", "direction", "className"]);
+  const _a = propSteps, { children, current, direction, className, progressDot, clickStep } = _a, restProps = __objRest(_a, ["children", "current", "direction", "className", "progressDot", "clickStep"]);
   const parentSteps = {
     propSteps
   };
@@ -11851,6 +11948,7 @@ const defaultProps$j = {
   content: "",
   activeIndex: 0,
   icon: "",
+  iconColor: "",
   size: "12px"
 };
 const Step = (props) => {
@@ -11860,6 +11958,7 @@ const Step = (props) => {
     content,
     activeIndex,
     icon,
+    iconColor,
     size,
     className,
     renderContent
@@ -11869,6 +11968,7 @@ const Step = (props) => {
     "content",
     "activeIndex",
     "icon",
+    "iconColor",
     "size",
     "className",
     "renderContent"
@@ -11881,13 +11981,19 @@ const Step = (props) => {
       return "finish";
     return index2 === +parent.propSteps.current ? "process" : "wait";
   };
+  const handleClickStep = () => {
+    var _a2;
+    (_a2 = parent.propSteps) == null ? void 0 : _a2.clickStep(activeIndex);
+  };
   const b2 = cn("step");
   const classes = classNames({
     [`${b2("")}-${getCurrentStatus()}`]: true
   }, className, b2(""));
-  return /* @__PURE__ */ React__default.createElement("div", __spreadValues({
+  return /* @__PURE__ */ React__default.createElement("div", __spreadProps(__spreadValues({
     className: classes
-  }, restProps), /* @__PURE__ */ React__default.createElement("div", {
+  }, restProps), {
+    onClick: handleClickStep
+  }), /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-step-head"
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-step-line"
@@ -11895,6 +12001,7 @@ const Step = (props) => {
     className: `nut-step-icon ${!dot ? icon ? "is-icon" : "is-text" : ""}`
   }, 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", {
@@ -11913,7 +12020,7 @@ Step.defaultProps = defaultProps$j;
 Step.displayName = "NutStep";
 const DataContext = createContext({});
 const defaultProps$i = {
-  width: window.innerWidth,
+  width: typeof window === "object" ? window.innerWidth : 375,
   height: 0,
   duration: 500,
   initPage: 0,
@@ -12341,46 +12448,122 @@ const SwiperItem = React__default.forwardRef((props, ref) => {
 });
 SwiperItem.defaultProps = defaultProps$h;
 SwiperItem.displayName = "NutSwiperItem";
+const AvatarContext = createContext({});
 const defaultProps$g = {
-  size: "normal",
+  size: "",
   icon: "",
-  shape: "round",
   bgColor: "#eee",
+  color: "#666",
   prefixCls: "nut-avatar",
-  src: ""
+  url: "",
+  alt: ""
 };
 const Avatar = (props) => {
-  const _a = __spreadValues(__spreadValues({}, defaultProps$g), props), { children, prefixCls, size, shape, bgColor, src, icon, className, style } = _a, rest = __objRest(_a, ["children", "prefixCls", "size", "shape", "bgColor", "src", "icon", "className", "style"]);
-  const sizeValue = ["large", "normal", "small"];
+  var _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
+  const _a = __spreadValues(__spreadValues({}, defaultProps$g), props), {
+    children,
+    prefixCls,
+    size,
+    shape,
+    bgColor,
+    color,
+    url,
+    alt,
+    icon,
+    className,
+    style,
+    activeAvatar,
+    onError
+  } = _a, rest = __objRest(_a, [
+    "children",
+    "prefixCls",
+    "size",
+    "shape",
+    "bgColor",
+    "color",
+    "url",
+    "alt",
+    "icon",
+    "className",
+    "style",
+    "activeAvatar",
+    "onError"
+  ]);
+  const [maxSum, setMaxSum] = useState(0);
+  const [showMax, setShowMax] = useState(false);
+  const [avatarIndex, setAvatarIndex] = useState(1);
+  const avatarRef = useRef(null);
+  const parent = useContext$1(AvatarContext);
+  const b2 = cn("avatar");
   const classes = classNames({
-    [`${prefixCls}`]: true,
-    [`avatar-${size}`]: true,
-    [`avatar-${shape}`]: true
+    [`nut-avatar-${size || ((_b = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _b.size) || "normal"}`]: true,
+    [`nut-avatar-${shape || ((_c = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _c.shape) || "round"}`]: true
   });
-  const cls = classNames(classes, className);
+  const cls = classNames(b2(""), classes, className);
+  const sizeValue = ["large", "normal", "small"];
   const styles = __spreadValues({
     width: sizeValue.indexOf(size) > -1 ? "" : `${size}px`,
     height: sizeValue.indexOf(size) > -1 ? "" : `${size}px`,
-    backgroundImage: src ? `url(${src})` : "",
-    backgroundColor: `${bgColor}`
+    backgroundColor: `${bgColor}`,
+    color: `${color}`,
+    marginLeft: avatarIndex != 1 && ((_d = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _d.span) ? `${(_e = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _e.span}px` : "",
+    zIndex: ((_f = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _f.zIndex) == "right" ? `${Math.abs(maxSum - avatarIndex)}` : ""
   }, style);
-  const iconStyles = !!icon && !src ? icon : "";
-  const handleClick = (e2) => {
-    if (props.onClick) {
-      props.onClick(e2);
+  const maxStyles = {
+    backgroundColor: `${(_g = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _g.maxBgColor}`,
+    color: `${(_h = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _h.maxColor}`
+  };
+  const iconStyles = !!icon ? icon : "";
+  useEffect(() => {
+    var _a2;
+    const avatarChildren = (_a2 = parent == null ? void 0 : parent.avatarGroupRef) == null ? void 0 : _a2.current.children;
+    if (avatarChildren) {
+      avatarLength(avatarChildren);
+    }
+  }, []);
+  const avatarLength = (children2) => {
+    var _a2, _b2, _c2;
+    for (let i = 0; i < children2.length; i++) {
+      if (children2[i] && children2[i].classList && children2[i].classList[0] == "nut-avatar") {
+        children2[i].setAttribute("data-index", i + 1);
+      }
+    }
+    const index2 = (_b2 = (_a2 = avatarRef == null ? void 0 : avatarRef.current) == null ? void 0 : _a2.dataset) == null ? void 0 : _b2.index;
+    const maxCount = (_c2 = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _c2.maxCount;
+    setMaxSum(children2.length);
+    setAvatarIndex(index2);
+    if (index2 == children2.length && index2 != maxCount && children2.length > maxCount) {
+      setShowMax(true);
     }
   };
-  return /* @__PURE__ */ React__default.createElement("div", __spreadProps(__spreadValues({
+  const errorEvent = (e2) => {
+    if (props.onError) {
+      props.onError(e2);
+    }
+  };
+  const clickAvatar = (e2) => {
+    if (props.activeAvatar) {
+      props.activeAvatar(e2);
+    }
+  };
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, (showMax || !((_i = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _i.maxCount) || avatarIndex <= ((_j = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _j.maxCount)) && /* @__PURE__ */ React__default.createElement("div", __spreadProps(__spreadValues({
     className: cls
   }, rest), {
-    style: styles,
-    onClick: handleClick
-  }), /* @__PURE__ */ React__default.createElement(Icon, {
+    style: !showMax ? styles : maxStyles,
+    onClick: clickAvatar,
+    ref: avatarRef
+  }), (!((_k = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _k.maxCount) || avatarIndex <= ((_l = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _l.maxCount)) && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, url && /* @__PURE__ */ React__default.createElement("img", {
+    src: url,
+    alt,
+    onError: errorEvent
+  }), icon && /* @__PURE__ */ React__default.createElement(Icon, {
     className: "icon",
     name: iconStyles
   }), children && /* @__PURE__ */ React__default.createElement("span", {
     className: "text"
-  }, children));
+  }, children)), showMax && /* @__PURE__ */ React__default.createElement("div", {
+    className: "text"
+  }, ((_m = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _m.maxContent) ? (_n = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _n.maxContent : `+ ${avatarIndex - ((_o = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _o.maxCount)}`)));
 };
 Avatar.defaultProps = defaultProps$g;
 Avatar.displayName = "NutAvatar";
@@ -12746,8 +12929,8 @@ const Popover = (props) => {
 Popover.defaultProps = defaultProps$c;
 Popover.displayName = "NutPopover";
 const defaultProps$b = {
-  width: 100,
-  height: 100,
+  width: "100px",
+  height: "100px",
   row: 1,
   animated: false,
   title: false,
@@ -12799,33 +12982,40 @@ const Skeleton = (props) => {
     return Array.from({ length: num }, (v2, i) => i);
   };
   const getStyle = () => {
+    if (avatarSize) {
+      return {
+        width: avatarSize,
+        height: avatarSize
+      };
+    }
     return {
-      width: avatarSize,
-      height: avatarSize
+      width: "50px",
+      height: "50px"
     };
   };
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, loading ? /* @__PURE__ */ React__default.createElement("div", null, children) : /* @__PURE__ */ React__default.createElement("div", __spreadValues({
     className: classes
-  }, restProps), /* @__PURE__ */ React__default.createElement("div", {
+  }, restProps), animated2 && /* @__PURE__ */ React__default.createElement("div", {
     className: "skeleton-animation"
   }), /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-skeleton-content"
   }, avatar && /* @__PURE__ */ React__default.createElement(Avatar, {
     className: avatarClass,
     bgColor: "rgb(239, 239, 239)",
+    shape: avatarShape,
     style: getStyle()
-  }), row === 1 ? /* @__PURE__ */ React__default.createElement("div", {
+  }), row === 1 && /* @__PURE__ */ React__default.createElement("div", {
     className: blockClass,
-    style: { width: `${width}px`, height: `${height}px` }
-  }) : /* @__PURE__ */ React__default.createElement("div", {
+    style: { width, height }
+  }), /* @__PURE__ */ React__default.createElement("div", {
     className: "skeleton-content-line"
   }, title && /* @__PURE__ */ React__default.createElement("div", {
     className: "skeleton-title"
   }), repeatLines(row).map((item, index2) => {
     return /* @__PURE__ */ React__default.createElement("div", {
-      className: `${blockClass} skeleton-lines`,
+      className: blockClass,
       key: index2,
-      style: { width: `${width}px`, height: `${height}px` }
+      style: { width, height }
     });
   })))));
 };
@@ -13817,7 +14007,6 @@ const InternalBarrage = (props, ref) => {
     barrageContainer.current.appendChild(el);
     const width = el.offsetWidth;
     const height = el.offsetHeight;
-    console.log(el.offsetWidth, el.offsetHeight);
     el.classList.add("move");
     el.style.animationDuration = `${speeds}ms`;
     el.style.top = `${_index % rows * (height + top) + 20}px`;