antd-mobile 5.40.0 → 5.41.0-alpha.1

package/2x/bundle/antd-mobile.cjs.development.js

@@ -9685,6 +9685,73 @@ const Button = React$2.forwardRef((p, ref2) => {
     className: `${classPrefix$1h}-loading-wrapper`
   }, props.loadingIcon, props.loadingText) : React$2.createElement("span", null, props.children)));
 });
+var isoWeek$1 = { exports: {} };
+(function(module2, exports2) {
+  !function(e2, t) {
+    module2.exports = t();
+  }(commonjsGlobal, function() {
+    var e2 = "day";
+    return function(t, i2, s) {
+      var a = function(t2) {
+        return t2.add(4 - t2.isoWeekday(), e2);
+      }, d = i2.prototype;
+      d.isoWeekYear = function() {
+        return a(this).year();
+      }, d.isoWeek = function(t2) {
+        if (!this.$utils().u(t2))
+          return this.add(7 * (t2 - this.isoWeek()), e2);
+        var i3, d2, n3, o, r = a(this), u = (i3 = this.isoWeekYear(), d2 = this.$u, n3 = (d2 ? s.utc : s)().year(i3).startOf("year"), o = 4 - n3.isoWeekday(), n3.isoWeekday() > 4 && (o += 7), n3.add(o, e2));
+        return r.diff(u, "week") + 1;
+      }, d.isoWeekday = function(e3) {
+        return this.$utils().u(e3) ? this.day() || 7 : this.day(this.day() % 7 ? e3 : e3 - 7);
+      };
+      var n2 = d.startOf;
+      d.startOf = function(e3, t2) {
+        var i3 = this.$utils(), s2 = !!i3.u(t2) || t2;
+        return "isoweek" === i3.p(e3) ? s2 ? this.date(this.date() - (this.isoWeekday() - 1)).startOf("day") : this.date(this.date() - 1 - (this.isoWeekday() - 1) + 7).endOf("day") : n2.bind(this)(e3, t2);
+      };
+    };
+  });
+})(isoWeek$1);
+var isoWeekExports = isoWeek$1.exports;
+const isoWeek = /* @__PURE__ */ getDefaultExportFromCjs(isoWeekExports);
+function devWarning(component, message) {
+  {
+    console.warn(`[antd-mobile: ${component}] ${message}`);
+  }
+}
+function devError(component, message) {
+  {
+    console.error(`[antd-mobile: ${component}] ${message}`);
+  }
+}
+function replaceMessage$1(template, kv) {
+  return template.replace(/\$\{\w+\}/g, (str) => {
+    const key = str.slice(2, -1);
+    return kv[key];
+  });
+}
+function usePropsValue(options) {
+  const {
+    value,
+    defaultValue,
+    onChange
+  } = options;
+  const update2 = useUpdate$1();
+  const stateRef = React$2.useRef(value !== void 0 ? value : defaultValue);
+  if (value !== void 0) {
+    stateRef.current = value;
+  }
+  const setState = useMemoizedFn((v, forceTrigger = false) => {
+    const nextValue = typeof v === "function" ? v(stateRef.current) : v;
+    if (!forceTrigger && nextValue === stateRef.current)
+      return;
+    stateRef.current = nextValue;
+    update2();
+    return onChange === null || onChange === void 0 ? void 0 : onChange(nextValue);
+  });
+  return [stateRef.current, setState];
+}
 const ArrowLeft = () => {
   return React$2.createElement("svg", {
     height: "1em",
@@ -9739,73 +9806,6 @@ const ArrowLeftDouble = () => {
     d: "M19.5305114,17.0699744 C19.0173831,17.5315665 18.9752295,18.3220903 19.436308,18.8357433 C19.4660129,18.8688164 19.4974585,18.9002801 19.5305113,18.9300007 L29.4833057,27.2801611 C30.1234001,27.8559077 30.1759552,28.8420707 29.6007967,29.4827774 C29.0256382,30.1235263 28.0404824,30.1761351 27.400388,29.6003885 L17.4475937,21.2502703 C17.3320874,21.1463692 17.2222026,21.036372 17.1184079,20.920748 C15.5069703,19.1256817 15.6543605,16.3628317 17.4475933,14.7497465 L27.4003877,6.39962828 C28.0404821,5.82383957 29.0256378,5.87649058 29.6007963,6.51723942 C30.1759548,7.1579461 30.1233997,8.14410915 29.4833053,8.7198557 L19.5305114,17.0699744 Z"
   }))))));
 };
-var isoWeek$1 = { exports: {} };
-(function(module2, exports2) {
-  !function(e2, t) {
-    module2.exports = t();
-  }(commonjsGlobal, function() {
-    var e2 = "day";
-    return function(t, i2, s) {
-      var a = function(t2) {
-        return t2.add(4 - t2.isoWeekday(), e2);
-      }, d = i2.prototype;
-      d.isoWeekYear = function() {
-        return a(this).year();
-      }, d.isoWeek = function(t2) {
-        if (!this.$utils().u(t2))
-          return this.add(7 * (t2 - this.isoWeek()), e2);
-        var i3, d2, n3, o, r = a(this), u = (i3 = this.isoWeekYear(), d2 = this.$u, n3 = (d2 ? s.utc : s)().year(i3).startOf("year"), o = 4 - n3.isoWeekday(), n3.isoWeekday() > 4 && (o += 7), n3.add(o, e2));
-        return r.diff(u, "week") + 1;
-      }, d.isoWeekday = function(e3) {
-        return this.$utils().u(e3) ? this.day() || 7 : this.day(this.day() % 7 ? e3 : e3 - 7);
-      };
-      var n2 = d.startOf;
-      d.startOf = function(e3, t2) {
-        var i3 = this.$utils(), s2 = !!i3.u(t2) || t2;
-        return "isoweek" === i3.p(e3) ? s2 ? this.date(this.date() - (this.isoWeekday() - 1)).startOf("day") : this.date(this.date() - 1 - (this.isoWeekday() - 1) + 7).endOf("day") : n2.bind(this)(e3, t2);
-      };
-    };
-  });
-})(isoWeek$1);
-var isoWeekExports = isoWeek$1.exports;
-const isoWeek = /* @__PURE__ */ getDefaultExportFromCjs(isoWeekExports);
-function usePropsValue(options) {
-  const {
-    value,
-    defaultValue,
-    onChange
-  } = options;
-  const update2 = useUpdate$1();
-  const stateRef = React$2.useRef(value !== void 0 ? value : defaultValue);
-  if (value !== void 0) {
-    stateRef.current = value;
-  }
-  const setState = useMemoizedFn((v, forceTrigger = false) => {
-    const nextValue = typeof v === "function" ? v(stateRef.current) : v;
-    if (!forceTrigger && nextValue === stateRef.current)
-      return;
-    stateRef.current = nextValue;
-    update2();
-    return onChange === null || onChange === void 0 ? void 0 : onChange(nextValue);
-  });
-  return [stateRef.current, setState];
-}
-function replaceMessage$1(template, kv) {
-  return template.replace(/\$\{\w+\}/g, (str) => {
-    const key = str.slice(2, -1);
-    return kv[key];
-  });
-}
-function devWarning(component, message) {
-  {
-    console.warn(`[antd-mobile: ${component}] ${message}`);
-  }
-}
-function devError(component, message) {
-  {
-    console.error(`[antd-mobile: ${component}] ${message}`);
-  }
-}
 function convertValueToRange$1(selectionMode, value) {
   if (selectionMode === void 0 || value === null)
     return null;
@@ -9947,7 +9947,7 @@ const Calendar = React$2.forwardRef((p, ref2) => {
       }
       const inThisMonth = d.month() === current.month();
       const disabled = props.shouldDisableDate ? props.shouldDisableDate(d.toDate()) : maxDay && d.isAfter(maxDay, "day") || minDay && d.isBefore(minDay, "day");
-      cells.push(React$2.createElement("div", {
+      const originalCell = React$2.createElement("div", {
         key: d.valueOf(),
         className: classNames(`${classPrefix$1g}-cell`, (disabled || !inThisMonth) && `${classPrefix$1g}-cell-disabled`, inThisMonth && {
           [`${classPrefix$1g}-cell-today`]: d.isSame(today, "day"),
@@ -10005,7 +10005,13 @@ const Calendar = React$2.forwardRef((p, ref2) => {
         className: `${classPrefix$1g}-cell-top`
       }, props.renderDate ? props.renderDate(d.toDate()) : d.date()), React$2.createElement("div", {
         className: `${classPrefix$1g}-cell-bottom`
-      }, (_a = props.renderLabel) === null || _a === void 0 ? void 0 : _a.call(props, d.toDate()))));
+      }, (_a = props.renderLabel) === null || _a === void 0 ? void 0 : _a.call(props, d.toDate())));
+      const cellWithKey = props.cellRender ? React$2.createElement(React$2.Fragment, {
+        key: d.valueOf()
+      }, props.cellRender(originalCell, {
+        date: d.toDate()
+      })) : originalCell;
+      cells.push(cellWithKey);
       iterator = iterator.add(1, "day");
     }
     return cells;
@@ -12250,6 +12256,7 @@ const Tabs$1 = (p) => {
   const props = mergeProps(defaultProps$S, p);
   const tabListContainerRef = React$2.useRef(null);
   const activeLineRef = React$2.useRef(null);
+  const tabRefs = React$2.useRef({});
   const keyToIndexRecord = {};
   let firstActiveKey = null;
   const panes = [];
@@ -12389,7 +12396,7 @@ const Tabs$1 = (p) => {
   });
   const {
     run: updateMask
-  } = useThrottleFn((immediate = false) => {
+  } = useThrottleFn((immediate) => {
     const container = tabListContainerRef.current;
     if (!container)
       return;
@@ -12416,6 +12423,35 @@ const Tabs$1 = (p) => {
   useIsomorphicLayoutEffect$3(() => {
     updateMask(true);
   }, []);
+  const handleKeyDown = (e2) => {
+    const keys2 = Object.keys(keyToIndexRecord);
+    const currentIndex = keyToIndexRecord[activeKey];
+    const isNext = isRTL2 ? e2.key === "ArrowLeft" : e2.key === "ArrowRight";
+    const isPrev = isRTL2 ? e2.key === "ArrowRight" : e2.key === "ArrowLeft";
+    const offsetDirection = isNext ? 1 : -1;
+    const findNextEnabledTab = (startIndex, direction) => {
+      const length = keys2.length;
+      for (let i2 = 0; i2 < length; i2++) {
+        const index2 = (startIndex + direction * (i2 + 1) + length) % length;
+        const key = keys2[index2];
+        const pane = panes.find((p2) => p2.key === key);
+        if (!(pane === null || pane === void 0 ? void 0 : pane.props.disabled))
+          return key;
+      }
+      return keys2[startIndex];
+    };
+    const currentKey = findNextEnabledTab(currentIndex, offsetDirection);
+    if (isNext || isPrev) {
+      e2.preventDefault();
+      setActiveKey(currentKey);
+    }
+  };
+  React$2.useEffect(() => {
+    var _a2;
+    if (activeKey && tabRefs.current[activeKey]) {
+      (_a2 = tabRefs.current[activeKey]) === null || _a2 === void 0 ? void 0 : _a2.focus();
+    }
+  }, [activeKey]);
   return withNativeProps(props, React$2.createElement("div", {
     className: classPrefix$15,
     style: {
@@ -12438,6 +12474,7 @@ const Tabs$1 = (p) => {
     ref: tabListContainerRef,
     scrollLeft,
     onScroll: updateMask,
+    onKeyDown: handleKeyDown,
     role: "tablist"
   }, React$2.createElement(animated.div, {
     ref: activeLineRef,
@@ -12452,6 +12489,10 @@ const Tabs$1 = (p) => {
       [`${classPrefix$15}-tab-wrapper-stretch`]: props.stretch
     })
   }, React$2.createElement("div", {
+    role: "tab",
+    "aria-selected": pane.key === activeKey,
+    tabIndex: pane.key === activeKey ? 0 : -1,
+    ref: (el) => tabRefs.current[pane.key] = el,
     onClick: () => {
       const {
         key
@@ -12466,9 +12507,7 @@ const Tabs$1 = (p) => {
     className: classNames(`${classPrefix$15}-tab`, {
       [`${classPrefix$15}-tab-active`]: pane.key === activeKey,
       [`${classPrefix$15}-tab-disabled`]: pane.props.disabled
-    }),
-    role: "tab",
-    "aria-selected": pane.key === activeKey
+    })
   }, pane.props.title)))))), panes.map((pane) => {
     if (pane.props.children === void 0) {
       return null;
@@ -13856,7 +13895,7 @@ function convertStringArrayToDate$1(value) {
   const yearString = (_a = value[0]) !== null && _a !== void 0 ? _a : "1900";
   const weekString = (_b = value[1]) !== null && _b !== void 0 ? _b : "1";
   const weekdayString = (_c = value[2]) !== null && _c !== void 0 ? _c : "1";
-  const day = dayjs(`${parseInt(yearString)}-01-01`).isoWeek(parseInt(weekString)).isoWeekday(parseInt(weekdayString)).hour(0).minute(0).second(0);
+  const day = dayjs(`${parseInt(yearString)}-01-04`).isoWeek(parseInt(weekString)).isoWeekday(parseInt(weekdayString)).hour(0).minute(0).second(0);
   return day.toDate();
 }
 const precisionLengthRecord = {
@@ -14583,13 +14622,21 @@ const Ellipsis = (p) => {
   const rootRef = React$2.useRef(null);
   const [expanded, setExpanded] = React$2.useState(defaultExpanded);
   const expandNode = expandText ? withStopPropagation(stopPropagationForActionButtons, React$2.createElement("a", {
-    onClick: () => {
+    onClick: (e2) => {
+      var _a;
       setExpanded(true);
+      (_a = props.onExpand) === null || _a === void 0 ? void 0 : _a.call(props, true, {
+        event: e2
+      });
     }
   }, expandText)) : null;
   const collapseNode = collapseText ? withStopPropagation(stopPropagationForActionButtons, React$2.createElement("a", {
-    onClick: () => {
+    onClick: (e2) => {
+      var _a;
       setExpanded(false);
+      (_a = props.onExpand) === null || _a === void 0 ? void 0 : _a.call(props, false, {
+        event: e2
+      });
     }
   }, collapseText)) : null;
   const [measureNodes, forceResize] = useMeasure(rootRef, content, rows, direction, expanded, expandNode, collapseNode);
@@ -26606,7 +26653,7 @@ const Swiper = React$2.forwardRef(staged_1((p, ref2) => {
         return React$2.createElement(React$2.Fragment, null, React$2.createElement("div", {
           className: `${classPrefix$a}-slide-placeholder`,
           style: {
-            width: `${startIndex * 100}%`
+            [isVertical ? "height" : "width"]: `${startIndex * 100}%`
           }
         }), items);
       }
@@ -27477,7 +27524,10 @@ const index = attachPropertiesToComponent(TreeSelect, {
 });
 const classPrefix$2 = "adm-virtual-input";
 const defaultProps$2 = {
-  defaultValue: ""
+  defaultValue: "",
+  cursor: {
+    movable: false
+  }
 };
 const VirtualInput = React$2.forwardRef((props, ref2) => {
   const {
@@ -27490,6 +27540,13 @@ const VirtualInput = React$2.forwardRef((props, ref2) => {
   const contentRef = React$2.useRef(null);
   const [hasFocus, setHasFocus] = React$2.useState(false);
   const [caretPosition, setCaretPosition] = React$2.useState(value.length);
+  const keyboardDataRef = React$2.useRef({});
+  const touchDataRef = React$2.useRef();
+  const charRef = React$2.useRef(null);
+  const charWidthRef = React$2.useRef(0);
+  const caretRef = React$2.useRef(null);
+  const [isCaretDragging, setIsCaretDragging] = React$2.useState(false);
+  const touchMoveTimeoutRef = React$2.useRef();
   const clearIcon = mergeProp(React$2.createElement(CloseCircleFill, null), componentConfig.clearIcon, props.clearIcon);
   function scrollToEnd() {
     const root2 = rootRef.current;
@@ -27503,6 +27560,22 @@ const VirtualInput = React$2.forwardRef((props, ref2) => {
       return;
     content.scrollLeft = content.clientWidth;
   }
+  React$2.useEffect(() => {
+    if (charRef.current) {
+      charWidthRef.current = charRef.current.getBoundingClientRect().width;
+    }
+  }, [value]);
+  React$2.useEffect(() => {
+    if (value === keyboardDataRef.current.newValue) {
+      if (keyboardDataRef.current.mode === "input") {
+        setCaretPosition((c) => c + 1);
+      } else if (keyboardDataRef.current.mode === "delete") {
+        setCaretPosition((c) => c - 1);
+      }
+    } else {
+      setCaretPosition(value.length);
+    }
+  }, [value]);
   useIsomorphicLayoutEffect$3(() => {
     scrollToEnd();
   }, [value]);
@@ -27536,8 +27609,11 @@ const VirtualInput = React$2.forwardRef((props, ref2) => {
     onInput: (v) => {
       var _a, _b;
       const newValue = value.substring(0, caretPosition) + v + value.substring(caretPosition);
+      keyboardDataRef.current = {
+        newValue,
+        mode: "input"
+      };
       setValue(newValue);
-      setCaretPosition((c) => c + 1);
       (_b = (_a = keyboard.props).onInput) === null || _b === void 0 ? void 0 : _b.call(_a, v);
     },
     onDelete: () => {
@@ -27545,8 +27621,11 @@ const VirtualInput = React$2.forwardRef((props, ref2) => {
       if (caretPosition === 0)
         return;
       const newValue = value.substring(0, caretPosition - 1) + value.substring(caretPosition);
+      keyboardDataRef.current = {
+        newValue,
+        mode: "delete"
+      };
       setValue(newValue);
-      setCaretPosition(caretPosition - 1);
       (_b = (_a = keyboard.props).onDelete) === null || _b === void 0 ? void 0 : _b.call(_a);
     },
     visible: hasFocus,
@@ -27563,21 +27642,78 @@ const VirtualInput = React$2.forwardRef((props, ref2) => {
     getContainer: null
   });
   const setCaretPositionToEnd = () => {
-    setCaretPosition(value.length);
+    var _a, _b;
+    if (caretPosition !== value.length) {
+      setCaretPosition(value.length);
+      (_b = (_a = mergedProps.cursor) === null || _a === void 0 ? void 0 : _a.onMove) === null || _b === void 0 ? void 0 : _b.call(_a, value.length);
+    }
   };
   const changeCaretPosition = (index2) => (e2) => {
+    var _a, _b, _c;
+    if (mergedProps.disabled || !((_a = mergedProps.cursor) === null || _a === void 0 ? void 0 : _a.movable))
+      return;
     e2.stopPropagation();
     const rect = e2.target.getBoundingClientRect();
     const midX = rect.left + rect.width / 2;
     const clickX = e2.clientX;
     const isRight = clickX > midX;
-    setCaretPosition(isRight ? index2 + 1 : index2);
+    const newCaretPosition = isRight ? index2 + 1 : index2;
+    setCaretPosition(newCaretPosition);
+    (_c = (_b = mergedProps.cursor) === null || _b === void 0 ? void 0 : _b.onMove) === null || _c === void 0 ? void 0 : _c.call(_b, newCaretPosition);
+  };
+  const handleTouchStart = (e2) => {
+    var _a;
+    if (mergedProps.disabled || !((_a = mergedProps.cursor) === null || _a === void 0 ? void 0 : _a.movable))
+      return;
+    if (!caretRef.current)
+      return;
+    const touch = e2.touches[0];
+    const caretRect = caretRef.current.getBoundingClientRect();
+    const distance = Math.abs(touch.clientX - (caretRect.left + caretRect.width / 2));
+    if (distance < 20) {
+      touchDataRef.current = {
+        startX: touch.clientX,
+        startCaretPosition: caretPosition
+      };
+    } else {
+      touchDataRef.current = null;
+    }
+  };
+  const handleTouchMove = (e2) => {
+    var _a, _b, _c;
+    if (!touchDataRef.current || !((_a = mergedProps.cursor) === null || _a === void 0 ? void 0 : _a.movable))
+      return;
+    setIsCaretDragging(true);
+    const touch = e2.touches[0];
+    const deltaX = touch.clientX - touchDataRef.current.startX;
+    const charWidth = charWidthRef.current;
+    const moveChars = Math.round(deltaX / charWidth);
+    let newCaretPosition = touchDataRef.current.startCaretPosition + moveChars;
+    newCaretPosition = Math.max(0, Math.min(newCaretPosition, value.length));
+    setCaretPosition(newCaretPosition);
+    (_c = (_b = mergedProps.cursor) === null || _b === void 0 ? void 0 : _b.onMove) === null || _c === void 0 ? void 0 : _c.call(_b, newCaretPosition);
+    if (touchMoveTimeoutRef.current) {
+      clearTimeout(touchMoveTimeoutRef.current);
+    }
+    touchMoveTimeoutRef.current = setTimeout(() => {
+      setIsCaretDragging(false);
+      touchMoveTimeoutRef.current = null;
+    }, 500);
+  };
+  const handleTouchEnd = () => {
+    touchDataRef.current = null;
+    setIsCaretDragging(false);
+    if (touchMoveTimeoutRef.current) {
+      clearTimeout(touchMoveTimeoutRef.current);
+      touchMoveTimeoutRef.current = null;
+    }
   };
   const chars = (value + "").split("");
   return withNativeProps(mergedProps, React$2.createElement("div", {
     ref: rootRef,
     className: classNames(classPrefix$2, {
-      [`${classPrefix$2}-disabled`]: mergedProps.disabled
+      [`${classPrefix$2}-disabled`]: mergedProps.disabled,
+      [`${classPrefix$2}-caret-dragging`]: isCaretDragging
     }),
     tabIndex: mergedProps.disabled ? void 0 : 0,
     role: "textbox",
@@ -27589,13 +27725,18 @@ const VirtualInput = React$2.forwardRef((props, ref2) => {
     ref: contentRef,
     "aria-disabled": mergedProps.disabled,
     "aria-label": mergedProps.placeholder,
-    onClick: setCaretPositionToEnd
+    onClick: setCaretPositionToEnd,
+    onTouchStart: handleTouchStart,
+    onTouchMove: handleTouchMove,
+    onTouchEnd: handleTouchEnd
   }, chars.slice(0, caretPosition).map((i2, index2) => React$2.createElement("span", {
+    ref: index2 === 0 ? charRef : void 0,
     key: index2,
     onClick: changeCaretPosition(index2)
   }, i2)), React$2.createElement("div", {
     className: `${classPrefix$2}-caret-container`
   }, hasFocus && React$2.createElement("div", {
+    ref: caretRef,
     className: `${classPrefix$2}-caret`
   })), chars.slice(caretPosition).map((i2, index2) => React$2.createElement("span", {
     key: index2,
@@ -27606,7 +27747,6 @@ const VirtualInput = React$2.forwardRef((props, ref2) => {
       var _a;
       e2.stopPropagation();
       setValue("");
-      setCaretPosition(0);
       (_a = mergedProps.onClear) === null || _a === void 0 ? void 0 : _a.call(mergedProps);
     },
     role: "button",