antd-mobile 5.12.3 → 5.12.6

package/bundle/antd-mobile.cjs.js

@@ -1489,11 +1489,11 @@ function useConfig() {
   return (_a = React$1.useContext(ConfigContext)) !== null && _a !== void 0 ? _a : getDefaultConfig();
 }
 var actionSheet = "";
-function attachPropertiesToComponent(component, properties2) {
+function attachPropertiesToComponent(component, properties) {
   const ret = component;
-  for (const key in properties2) {
-    if (properties2.hasOwnProperty(key)) {
-      ret[key] = properties2[key];
+  for (const key in properties) {
+    if (properties.hasOwnProperty(key)) {
+      ret[key] = properties[key];
     }
   }
   return ret;
@@ -9033,127 +9033,11 @@ const Popup = (p2) => {
   }, shouldRender && props.children))));
   return renderToContainer(props.getContainer, node);
 };
-var button = "";
-var dotLoading = "";
-const classPrefix$1e = `adm-dot-loading`;
-const colorRecord$3 = {
-  default: "var(--adm-color-weak)",
-  primary: "var(--adm-color-primary)",
-  white: "var(--adm-color-white)"
-};
-const defaultProps$X = {
-  color: "default"
-};
-const DotLoading = React$1.memo((p2) => {
-  var _a;
-  const props = mergeProps(defaultProps$X, p2);
-  return withNativeProps(props, React__default["default"].createElement("div", {
-    style: {
-      color: (_a = colorRecord$3[props.color]) !== null && _a !== void 0 ? _a : props.color
-    },
-    className: classNames__default["default"]("adm-loading", classPrefix$1e)
-  }, React__default["default"].createElement("svg", {
-    height: "1em",
-    viewBox: "0 0 100 40",
-    style: {
-      verticalAlign: "-0.125em"
-    }
-  }, React__default["default"].createElement("g", {
-    stroke: "none",
-    strokeWidth: "1",
-    fill: "none",
-    fillRule: "evenodd"
-  }, React__default["default"].createElement("g", {
-    transform: "translate(-100.000000, -71.000000)"
-  }, React__default["default"].createElement("g", {
-    transform: "translate(95.000000, 71.000000)"
-  }, React__default["default"].createElement("g", {
-    transform: "translate(5.000000, 0.000000)"
-  }, [0, 1, 2].map((i) => React__default["default"].createElement("rect", {
-    key: i,
-    fill: "currentColor",
-    x: 20 + i * 26,
-    y: "16",
-    width: "8",
-    height: "8",
-    rx: "2"
-  }, React__default["default"].createElement("animate", {
-    attributeName: "y",
-    from: "16",
-    to: "16",
-    dur: "2s",
-    begin: `${i * 0.2}s`,
-    repeatCount: "indefinite",
-    values: "16; 6; 26; 16; 16",
-    keyTimes: "0; 0.1; 0.3; 0.4; 1"
-  }))))))))));
-});
-function isPromise(obj) {
-  return !!obj && typeof obj === "object" && typeof obj.then === "function";
-}
-const classPrefix$1d = `adm-button`;
-const defaultProps$W = {
-  color: "default",
-  fill: "solid",
-  block: false,
-  loading: false,
-  loadingIcon: React__default["default"].createElement(DotLoading, {
-    color: "currentColor"
-  }),
-  type: "button",
-  shape: "default",
-  size: "middle"
-};
-const Button = React$1.forwardRef((p2, ref) => {
-  const props = mergeProps(defaultProps$W, p2);
-  const [innerLoading, setInnerLoading] = React$1.useState(false);
-  const nativeButtonRef = React$1.useRef(null);
-  const loading = props.loading === "auto" ? innerLoading : props.loading;
-  const disabled = props.disabled || loading;
-  React$1.useImperativeHandle(ref, () => ({
-    get nativeElement() {
-      return nativeButtonRef.current;
-    }
-  }));
-  const handleClick = (e) => tslib.__awaiter(void 0, void 0, void 0, function* () {
-    if (!props.onClick)
-      return;
-    const promise = props.onClick(e);
-    if (isPromise(promise)) {
-      try {
-        setInnerLoading(true);
-        yield promise;
-        setInnerLoading(false);
-      } catch (e2) {
-        setInnerLoading(false);
-        throw e2;
-      }
-    }
-  });
-  return withNativeProps(props, React__default["default"].createElement("button", {
-    ref: nativeButtonRef,
-    type: props.type,
-    onClick: handleClick,
-    className: classNames__default["default"](classPrefix$1d, props.color ? `${classPrefix$1d}-${props.color}` : null, {
-      [`${classPrefix$1d}-block`]: props.block,
-      [`${classPrefix$1d}-disabled`]: disabled,
-      [`${classPrefix$1d}-fill-outline`]: props.fill === "outline",
-      [`${classPrefix$1d}-fill-none`]: props.fill === "none",
-      [`${classPrefix$1d}-mini`]: props.size === "mini",
-      [`${classPrefix$1d}-small`]: props.size === "small",
-      [`${classPrefix$1d}-large`]: props.size === "large",
-      [`${classPrefix$1d}-loading`]: loading
-    }, `${classPrefix$1d}-shape-${props.shape}`),
-    disabled
-  }, loading ? React__default["default"].createElement("div", {
-    className: `${classPrefix$1d}-loading-wrapper`
-  }, props.loadingIcon, props.loadingText) : props.children));
-});
 var safeArea = "";
-const classPrefix$1c = "adm-safe-area";
+const classPrefix$1e = "adm-safe-area";
 const SafeArea = (props) => {
   return withNativeProps(props, React__default["default"].createElement("div", {
-    className: classNames__default["default"](classPrefix$1c, `${classPrefix$1c}-position-${props.position}`)
+    className: classNames__default["default"](classPrefix$1e, `${classPrefix$1e}-position-${props.position}`)
   }));
 };
 const fullClone = Object.assign({}, ReactDOM);
@@ -9269,8 +9153,8 @@ function renderImperatively(element) {
     close
   };
 }
-const classPrefix$1b = `adm-action-sheet`;
-const defaultProps$V = {
+const classPrefix$1d = `adm-action-sheet`;
+const defaultProps$X = {
   visible: false,
   actions: [],
   cancelText: "",
@@ -9279,7 +9163,7 @@ const defaultProps$V = {
   safeArea: true
 };
 const ActionSheet = (p2) => {
-  const props = mergeProps(defaultProps$V, p2);
+  const props = mergeProps(defaultProps$X, p2);
   return React__default["default"].createElement(Popup, {
     visible: props.visible,
     onMaskClick: () => {
@@ -9290,23 +9174,23 @@ const ActionSheet = (p2) => {
       }
     },
     afterClose: props.afterClose,
-    className: classNames__default["default"](`${classPrefix$1b}-popup`, props.popupClassName),
+    className: classNames__default["default"](`${classPrefix$1d}-popup`, props.popupClassName),
     style: props.popupStyle,
     getContainer: props.getContainer
   }, withNativeProps(props, React__default["default"].createElement("div", {
-    className: classPrefix$1b
+    className: classPrefix$1d
   }, props.extra && React__default["default"].createElement("div", {
-    className: `${classPrefix$1b}-extra`
+    className: `${classPrefix$1d}-extra`
   }, props.extra), React__default["default"].createElement("div", {
-    className: `${classPrefix$1b}-button-list`
+    className: `${classPrefix$1d}-button-list`
   }, props.actions.map((action, index2) => React__default["default"].createElement("div", {
     key: action.key,
-    className: `${classPrefix$1b}-button-item-wrapper`
-  }, React__default["default"].createElement(Button, {
-    block: true,
-    fill: "none",
-    shape: "rectangular",
-    disabled: action.disabled,
+    className: `${classPrefix$1d}-button-item-wrapper`
+  }, React__default["default"].createElement("a", {
+    className: classNames__default["default"]("adm-plain-anchor", `${classPrefix$1d}-button-item`, {
+      [`${classPrefix$1d}-button-item-danger`]: action.danger,
+      [`${classPrefix$1d}-button-item-disabled`]: action.disabled
+    }),
     onClick: () => {
       var _a, _b, _c;
       (_a = action.onClick) === null || _a === void 0 ? void 0 : _a.call(action);
@@ -9314,29 +9198,23 @@ const ActionSheet = (p2) => {
       if (props.closeOnAction) {
         (_c = props.onClose) === null || _c === void 0 ? void 0 : _c.call(props);
       }
-    },
-    className: classNames__default["default"](`${classPrefix$1b}-button-item`, {
-      [`${classPrefix$1b}-button-item-danger`]: action.danger
-    })
+    }
   }, React__default["default"].createElement("div", {
-    className: `${classPrefix$1b}-button-item-name`
+    className: `${classPrefix$1d}-button-item-name`
   }, action.text), action.description && React__default["default"].createElement("div", {
-    className: `${classPrefix$1b}-button-item-description`
+    className: `${classPrefix$1d}-button-item-description`
   }, action.description))))), props.cancelText && React__default["default"].createElement("div", {
-    className: `${classPrefix$1b}-cancel`
+    className: `${classPrefix$1d}-cancel`
   }, React__default["default"].createElement("div", {
-    className: `${classPrefix$1b}-button-item-wrapper`
-  }, React__default["default"].createElement(Button, {
-    block: true,
-    fill: "none",
-    shape: "rectangular",
-    className: `${classPrefix$1b}-button-item`,
+    className: `${classPrefix$1d}-button-item-wrapper`
+  }, React__default["default"].createElement("a", {
+    className: classNames__default["default"]("adm-plain-anchor", `${classPrefix$1d}-button-item`),
     onClick: () => {
       var _a;
       (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
     }
   }, React__default["default"].createElement("div", {
-    className: `${classPrefix$1b}-button-item-name`
+    className: `${classPrefix$1d}-button-item-name`
   }, props.cancelText)))), props.safeArea && React__default["default"].createElement(SafeArea, {
     position: "bottom"
   }))));
@@ -9348,12 +9226,12 @@ var index$h = attachPropertiesToComponent(ActionSheet, {
   show: showActionSheet
 });
 var autoCenter = "";
-const classPrefix$1a = "adm-auto-center";
+const classPrefix$1c = "adm-auto-center";
 const AutoCenter = (props) => {
   return withNativeProps(props, React__default["default"].createElement("div", {
-    className: classPrefix$1a
+    className: classPrefix$1c
   }, React__default["default"].createElement("div", {
-    className: `${classPrefix$1a}-content`
+    className: `${classPrefix$1c}-content`
   }, props.children)));
 };
 var avatar = "";
@@ -9395,15 +9273,15 @@ const Fallback = React$1.memo(() => React__default["default"].createElement("svg
   fillRule: "nonzero",
   mask: "url(#mask-2)"
 }))))));
-const classPrefix$19 = "adm-avatar";
-const defaultProps$U = {
+const classPrefix$1b = "adm-avatar";
+const defaultProps$W = {
   fallback: React__default["default"].createElement(Fallback, null),
   fit: "cover"
 };
 const Avatar = (p2) => {
-  const props = mergeProps(defaultProps$U, p2);
+  const props = mergeProps(defaultProps$W, p2);
   return withNativeProps(props, React__default["default"].createElement(Image$1, {
-    className: classPrefix$19,
+    className: classPrefix$1b,
     src: props.src,
     fallback: props.fallback,
     placeholder: props.fallback,
@@ -9415,8 +9293,8 @@ const Avatar = (p2) => {
   }));
 };
 var badge = "";
-const classPrefix$18 = `adm-badge`;
-const dot = Symbol();
+const classPrefix$1a = `adm-badge`;
+const dot = React__default["default"].createElement(React__default["default"].Fragment, null);
 const Badge$1 = (props) => {
   const {
     content,
@@ -9424,23 +9302,142 @@ const Badge$1 = (props) => {
     children
   } = props;
   const isDot = content === dot;
-  const badgeCls = classNames__default["default"](classPrefix$18, !!children && `${classPrefix$18}-fixed`, isDot && `${classPrefix$18}-dot`, props.bordered && `${classPrefix$18}-bordered`);
+  const badgeCls = classNames__default["default"](classPrefix$1a, !!children && `${classPrefix$1a}-fixed`, isDot && `${classPrefix$1a}-dot`, props.bordered && `${classPrefix$1a}-bordered`);
   const element = content || content === 0 ? withNativeProps(props, React__default["default"].createElement("div", {
     className: badgeCls,
     style: {
       "--color": color
     }
   }, !isDot && React__default["default"].createElement("div", {
-    className: `${classPrefix$18}-content`
+    className: `${classPrefix$1a}-content`
   }, content))) : null;
   return children ? React__default["default"].createElement("div", {
-    className: `${classPrefix$18}-wrap`
+    className: `${classPrefix$1a}-wrap`
   }, children, element) : element;
 };
-const properties = {
+var Badge = attachPropertiesToComponent(Badge$1, {
   dot
+});
+var button = "";
+var dotLoading = "";
+const classPrefix$19 = `adm-dot-loading`;
+const colorRecord$3 = {
+  default: "var(--adm-color-weak)",
+  primary: "var(--adm-color-primary)",
+  white: "var(--adm-color-white)"
+};
+const defaultProps$V = {
+  color: "default"
 };
-var Badge = attachPropertiesToComponent(Badge$1, properties);
+const DotLoading = React$1.memo((p2) => {
+  var _a;
+  const props = mergeProps(defaultProps$V, p2);
+  return withNativeProps(props, React__default["default"].createElement("div", {
+    style: {
+      color: (_a = colorRecord$3[props.color]) !== null && _a !== void 0 ? _a : props.color
+    },
+    className: classNames__default["default"]("adm-loading", classPrefix$19)
+  }, React__default["default"].createElement("svg", {
+    height: "1em",
+    viewBox: "0 0 100 40",
+    style: {
+      verticalAlign: "-0.125em"
+    }
+  }, React__default["default"].createElement("g", {
+    stroke: "none",
+    strokeWidth: "1",
+    fill: "none",
+    fillRule: "evenodd"
+  }, React__default["default"].createElement("g", {
+    transform: "translate(-100.000000, -71.000000)"
+  }, React__default["default"].createElement("g", {
+    transform: "translate(95.000000, 71.000000)"
+  }, React__default["default"].createElement("g", {
+    transform: "translate(5.000000, 0.000000)"
+  }, [0, 1, 2].map((i) => React__default["default"].createElement("rect", {
+    key: i,
+    fill: "currentColor",
+    x: 20 + i * 26,
+    y: "16",
+    width: "8",
+    height: "8",
+    rx: "2"
+  }, React__default["default"].createElement("animate", {
+    attributeName: "y",
+    from: "16",
+    to: "16",
+    dur: "2s",
+    begin: `${i * 0.2}s`,
+    repeatCount: "indefinite",
+    values: "16; 6; 26; 16; 16",
+    keyTimes: "0; 0.1; 0.3; 0.4; 1"
+  }))))))))));
+});
+function isPromise(obj) {
+  return !!obj && typeof obj === "object" && typeof obj.then === "function";
+}
+const classPrefix$18 = `adm-button`;
+const defaultProps$U = {
+  color: "default",
+  fill: "solid",
+  block: false,
+  loading: false,
+  loadingIcon: React__default["default"].createElement(DotLoading, {
+    color: "currentColor"
+  }),
+  type: "button",
+  shape: "default",
+  size: "middle"
+};
+const Button = React$1.forwardRef((p2, ref) => {
+  const props = mergeProps(defaultProps$U, p2);
+  const [innerLoading, setInnerLoading] = React$1.useState(false);
+  const nativeButtonRef = React$1.useRef(null);
+  const loading = props.loading === "auto" ? innerLoading : props.loading;
+  const disabled = props.disabled || loading;
+  React$1.useImperativeHandle(ref, () => ({
+    get nativeElement() {
+      return nativeButtonRef.current;
+    }
+  }));
+  const handleClick = (e) => tslib.__awaiter(void 0, void 0, void 0, function* () {
+    if (!props.onClick)
+      return;
+    const promise = props.onClick(e);
+    if (isPromise(promise)) {
+      try {
+        setInnerLoading(true);
+        yield promise;
+        setInnerLoading(false);
+      } catch (e2) {
+        setInnerLoading(false);
+        throw e2;
+      }
+    }
+  });
+  return withNativeProps(props, React__default["default"].createElement("button", {
+    ref: nativeButtonRef,
+    type: props.type,
+    onClick: handleClick,
+    className: classNames__default["default"](classPrefix$18, props.color ? `${classPrefix$18}-${props.color}` : null, {
+      [`${classPrefix$18}-block`]: props.block,
+      [`${classPrefix$18}-disabled`]: disabled,
+      [`${classPrefix$18}-fill-outline`]: props.fill === "outline",
+      [`${classPrefix$18}-fill-none`]: props.fill === "none",
+      [`${classPrefix$18}-mini`]: props.size === "mini",
+      [`${classPrefix$18}-small`]: props.size === "small",
+      [`${classPrefix$18}-large`]: props.size === "large",
+      [`${classPrefix$18}-loading`]: loading
+    }, `${classPrefix$18}-shape-${props.shape}`),
+    disabled,
+    onMouseDown: props.onMouseDown,
+    onMouseUp: props.onMouseUp,
+    onTouchStart: props.onTouchStart,
+    onTouchEnd: props.onTouchEnd
+  }, loading ? React__default["default"].createElement("div", {
+    className: `${classPrefix$18}-loading-wrapper`
+  }, props.loadingIcon, props.loadingText) : props.children));
+});
 var calendar = "";
 const ArrowLeft = () => {
   return React__default["default"].createElement("svg", {
@@ -9662,7 +9659,7 @@ const Calendar = React$1.forwardRef((p2, ref) => {
         isSelect = isBegin || isEnd || d.isAfter(begin, "day") && d.isBefore(end, "day");
       }
       const inThisMonth = d.month() === current.month();
-      const disabled = maxDay && d.isAfter(maxDay, "day") || minDay && d.isBefore(minDay, "day");
+      const disabled = props.shouldDisableDate ? props.shouldDisableDate(d.toDate()) : maxDay && d.isAfter(maxDay, "day") || minDay && d.isBefore(minDay, "day");
       cells.push(React__default["default"].createElement("div", {
         key: d.valueOf(),
         className: classNames__default["default"](`${classPrefix$17}-cell`, (disabled || !inThisMonth) && `${classPrefix$17}-cell-disabled`, inThisMonth && {
@@ -12264,16 +12261,33 @@ const LazyDetector = (props) => {
     ref
   });
 };
+const ImageIcon = () => React__default["default"].createElement("svg", {
+  viewBox: "0 0 48 48",
+  xmlns: "http://www.w3.org/2000/svg"
+}, React__default["default"].createElement("path", {
+  d: "M41.396 6.234c1.923 0 3.487 1.574 3.487 3.505v29.14c0 1.937-1.568 3.51-3.491 3.51H6.604c-1.923 0-3.487-1.573-3.487-3.51V9.745c0-1.936 1.564-3.51 3.487-3.51Zm0 2.847H6.604c-.355 0-.654.3-.654.658V34.9l5.989-8.707a2.373 2.373 0 0 1 1.801-1.005 2.405 2.405 0 0 1 1.933.752l4.182 4.525 7.58-11.005a2.374 2.374 0 0 1 1.96-1.01c.79 0 1.532.38 1.966 1.01L42.05 34.89V9.74a.664.664 0 0 0-.654-.658Zm-28.305 2.763a3.119 3.119 0 0 1 3.117 3.117 3.119 3.119 0 0 1-3.117 3.117 3.122 3.122 0 0 1-3.117-3.117 3.119 3.119 0 0 1 3.117-3.117Z",
+  fill: "#DBDBDB",
+  fillRule: "nonzero"
+}));
+const BrokenImageIcon = () => React__default["default"].createElement("svg", {
+  viewBox: "0 0 48 48",
+  xmlns: "http://www.w3.org/2000/svg"
+}, React__default["default"].createElement("path", {
+  d: "M19.233 6.233 17.42 9.08l-10.817.001a.665.665 0 0 0-.647.562l-.007.096V34.9l5.989-8.707a2.373 2.373 0 0 1 1.801-1.005 2.415 2.415 0 0 1 1.807.625l.126.127 4.182 4.525 2.267-3.292 5.461 7.841-4.065 7.375H6.604c-1.86 0-3.382-1.47-3.482-3.317l-.005-.192V9.744c0-1.872 1.461-3.405 3.296-3.505l.19-.005h12.63Zm22.163 0c1.86 0 3.382 1.472 3.482 3.314l.005.192v29.14a3.507 3.507 0 0 1-3.3 3.505l-.191.006H27.789l3.63-6.587.06-.119a1.87 1.87 0 0 0-.163-1.853l-6.928-9.949 3.047-4.422a2.374 2.374 0 0 1 1.96-1.01 2.4 2.4 0 0 1 1.86.87l.106.14L42.05 34.89V9.74a.664.664 0 0 0-.654-.658H21.855l1.812-2.848h17.73Zm-28.305 5.611c.794 0 1.52.298 2.07.788l-.843 1.325-.067.114a1.87 1.87 0 0 0 .11 1.959l.848 1.217c-.556.515-1.3.83-2.118.83a3.122 3.122 0 0 1-3.117-3.116 3.119 3.119 0 0 1 3.117-3.117Z",
+  fill: "#DBDBDB",
+  fillRule: "nonzero"
+}));
 const classPrefix$S = `adm-image`;
 const defaultProps$H = {
   fit: "fill",
   placeholder: React__default["default"].createElement("div", {
     className: `${classPrefix$S}-tip`
-  }, React__default["default"].createElement(antdMobileIcons.PictureOutline, null)),
+  }, React__default["default"].createElement(ImageIcon, null)),
   fallback: React__default["default"].createElement("div", {
     className: `${classPrefix$S}-tip`
-  }, React__default["default"].createElement(antdMobileIcons.PictureWrongOutline, null)),
-  lazy: false
+  }, React__default["default"].createElement(BrokenImageIcon, null)),
+  lazy: false,
+  draggable: false
 };
 const Image$1 = stagedComponents.staged((p2) => {
   const props = mergeProps(defaultProps$H, p2);
@@ -12318,7 +12332,8 @@ const Image$1 = stagedComponents.staged((p2) => {
       referrerPolicy: props.referrerPolicy,
       sizes: props.sizes,
       srcSet,
-      useMap: props.useMap
+      useMap: props.useMap,
+      draggable: props.draggable
     });
     return React__default["default"].createElement(React__default["default"].Fragment, null, !loaded && props.placeholder, img);
   }
@@ -14327,9 +14342,7 @@ const FormItem = (props) => {
     return renderLayout(children);
   }
   let Variables = {};
-  if (typeof label === "string") {
-    Variables.label = label;
-  }
+  Variables.label = typeof label === "string" ? label : "";
   if (messageVariables) {
     Variables = Object.assign(Object.assign({}, Variables), messageVariables);
   }
@@ -15274,6 +15287,7 @@ const InfiniteScroll = (p2) => {
   const elementRef = React$1.useRef(null);
   const [flag, setFlag] = React$1.useState({});
   const nextFlagRef = React$1.useRef(flag);
+  const [scrollParent, setScrollParent] = React$1.useState();
   const check = ahooks.useMemoizedFn(() => tslib.__awaiter(void 0, void 0, void 0, function* () {
     if (nextFlagRef.current !== flag)
       return;
@@ -15285,6 +15299,7 @@ const InfiniteScroll = (p2) => {
     if (!element.offsetParent)
       return;
     const parent = getScrollParent(element);
+    setScrollParent(parent);
     if (!parent)
       return;
     const rect = element.getBoundingClientRect();
@@ -15304,17 +15319,16 @@ const InfiniteScroll = (p2) => {
     const element = elementRef.current;
     if (!element)
       return;
-    const parent = getScrollParent(element);
-    if (!parent)
+    if (!scrollParent)
       return;
     function onScroll() {
       check();
     }
-    parent.addEventListener("scroll", onScroll);
+    scrollParent.addEventListener("scroll", onScroll);
     return () => {
-      parent.removeEventListener("scroll", onScroll);
+      scrollParent.removeEventListener("scroll", onScroll);
     };
-  }, []);
+  }, [scrollParent]);
   return withNativeProps(props, React__default["default"].createElement("div", {
     className: classPrefix$w,
     ref: elementRef
@@ -16578,6 +16592,9 @@ const SearchBar = React$1.forwardRef((p2, ref) => {
         }
         (_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.blur();
         (_c = props.onCancel) === null || _c === void 0 ? void 0 : _c.call(props);
+      },
+      onMouseDown: (e) => {
+        e.preventDefault();
       }
     }, props.cancelText));
   };
@@ -17994,7 +18011,8 @@ const TextArea = React$1.forwardRef((p2, ref) => {
       var _a;
       compositingRef.current = false;
       if (maxLength) {
-        setValue([...value].slice(0, maxLength).join(""));
+        const v = e.target.value;
+        setValue([...v].slice(0, maxLength).join(""));
       }
       (_a = props.onCompositionEnd) === null || _a === void 0 ? void 0 : _a.call(props, e);
     },