antd-mobile 5.9.5 → 5.10.0

package/2x/es/components/image-uploader/image-uploader.d.ts

@@ -1,5 +1,6 @@
 import { FC, InputHTMLAttributes } from 'react';
 import { NativeProps } from '../../utils/native-props';
+import type { ImageProps } from '../image';
 export declare type TaskStatus = 'pending' | 'fail';
 export interface ImageUploadItem {
     key?: string | number;
@@ -25,5 +26,6 @@ export declare type ImageUploaderProps = {
     onDelete?: (item: ImageUploadItem) => boolean | Promise<boolean> | void;
     preview?: boolean;
     showFailed?: boolean;
+    imageFit?: ImageProps['fit'];
 } & NativeProps<'--cell-size'>;
 export declare const ImageUploader: FC<ImageUploaderProps>;

package/2x/es/components/image-uploader/image-uploader.js

@@ -18,7 +18,8 @@ const defaultProps = {
   defaultValue: [],
   accept: 'image/*',
   preview: true,
-  showFailed: true
+  showFailed: true,
+  imageFit: 'cover'
 };
 export const ImageUploader = p => {
   const props = mergeProps(defaultProps, p);
@@ -157,6 +158,7 @@ export const ImageUploader = p => {
       key: (_a = fileItem.key) !== null && _a !== void 0 ? _a : index,
       url: (_b = fileItem.thumbnailUrl) !== null && _b !== void 0 ? _b : fileItem.url,
       deletable: props.deletable,
+      imageFit: props.imageFit,
       onClick: () => {
         if (props.preview) {
           previewImage(index);
@@ -182,6 +184,7 @@ export const ImageUploader = p => {
       file: task.file,
       deletable: task.status !== 'pending',
       status: task.status,
+      imageFit: props.imageFit,
       onDelete: () => {
         setTasks(tasks.filter(x => x.id !== task.id));
       }

package/2x/es/components/image-uploader/preview-item.d.ts

@@ -1,5 +1,6 @@
 import { FC } from 'react';
 import { TaskStatus } from './image-uploader';
+import type { ImageProps } from '../image';
 declare type Props = {
     onClick?: () => void;
     onDelete?: () => void;
@@ -7,6 +8,7 @@ declare type Props = {
     url?: string;
     file?: File;
     status?: TaskStatus;
+    imageFit: ImageProps['fit'];
 };
 declare const PreviewItem: FC<Props>;
 export default PreviewItem;

package/2x/es/components/image-uploader/preview-item.js

@@ -14,7 +14,8 @@ const PreviewItem = props => {
     url,
     file,
     deletable,
-    onDelete
+    onDelete,
+    imageFit
   } = props;
   const src = useMemo(() => {
     if (url) {
@@ -54,7 +55,7 @@ const PreviewItem = props => {
   }, React.createElement(Image, {
     className: `${classPrefix}-cell-image`,
     src: src,
-    fit: 'cover',
+    fit: imageFit,
     onClick: props.onClick
   }), renderLoading(), renderDelete());
 };

package/2x/es/components/index-bar/index-bar.js

@@ -7,6 +7,7 @@ import { Sidebar } from './sidebar';
 import { convertPx } from '../../utils/convert-px';
 import { Panel } from './panel';
 import { devWarning } from '../../utils/dev-log';
+import { traverseReactNode } from '../../utils/traverse-react-node';
 const classPrefix = `adm-index-bar`;
 const defaultProps = {
   sticky: true
@@ -17,7 +18,7 @@ export const IndexBar = forwardRef((p, ref) => {
   const bodyRef = useRef(null);
   const indexItems = [];
   const panels = [];
-  React.Children.forEach(props.children, child => {
+  traverseReactNode(props.children, child => {
     var _a;
 
     if (!React.isValidElement(child)) return;

package/2x/es/components/jumbo-tabs/jumbo-tabs.js

@@ -7,6 +7,7 @@ import { useResizeEffect } from '../../utils/use-resize-effect';
 import { useTabListScroll } from '../../utils/use-tab-list-scroll';
 import ScrollMask from '../scroll-mask';
 import { ShouldRender } from '../../utils/should-render';
+import { traverseReactNode } from '../../utils/traverse-react-node';
 const classPrefix = `adm-jumbo-tabs`;
 export const JumboTab = () => {
   return null;
@@ -19,7 +20,7 @@ export const JumboTabs = props => {
   const keyToIndexRecord = {};
   let firstActiveKey = null;
   const panes = [];
-  React.Children.forEach(props.children, (child, index) => {
+  traverseReactNode(props.children, (child, index) => {
     if (!React.isValidElement(child)) return;
     const key = child.key;
     if (typeof key !== 'string') return;

package/2x/es/components/picker-view/picker-view.d.ts

@@ -9,6 +9,7 @@ export declare type PickerValueExtend = {
 export declare type PickerColumnItem = {
     label: ReactNode;
     value: string;
+    key?: string | number;
 };
 export declare type PickerColumn = (string | PickerColumnItem)[];
 export declare type PickerViewProps = {

package/2x/es/components/picker-view/wheel.js

@@ -140,6 +140,8 @@ export const Wheel = memo(props => {
     className: `${classPrefix}-column-wheel`,
     "aria-hidden": true
   }, column.map((item, index) => {
+    var _a;
+
     const selected = props.value === item.value;
     if (selected) selectedIndex = index;
 
@@ -149,7 +151,7 @@ export const Wheel = memo(props => {
     }
 
     return React.createElement("div", {
-      key: item.value,
+      key: (_a = item.key) !== null && _a !== void 0 ? _a : item.value,
       "data-selected": item.value === value,
       className: `${classPrefix}-column-item`,
       onClick: handleClick,

package/2x/es/components/popover/popover-menu.js

@@ -3,7 +3,8 @@ import classNames from 'classnames';
 import { Popover } from './popover';
 const classPrefix = `adm-popover-menu`;
 export const PopoverMenu = forwardRef((props, ref) => {
-  const innerRef = useRef(null);
+  const innerRef = useRef(null); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+
   useImperativeHandle(ref, () => innerRef.current, []);
   const onClick = useCallback(e => {
     var _a;

package/2x/es/components/side-bar/side-bar.js

@@ -4,6 +4,7 @@ import Badge from '../badge';
 import { withNativeProps } from '../../utils/native-props';
 import { usePropsValue } from '../../utils/use-props-value';
 import { Corner } from './corner';
+import { traverseReactNode } from '../../utils/traverse-react-node';
 const classPrefix = `adm-side-bar`;
 export const SideBarItem = () => {
   return null;
@@ -13,7 +14,7 @@ export const SideBar = props => {
 
   let firstActiveKey = null;
   const items = [];
-  React.Children.forEach(props.children, (child, index) => {
+  traverseReactNode(props.children, (child, index) => {
     if (!React.isValidElement(child)) return;
     const key = child.key;
     if (typeof key !== 'string') return;

package/2x/es/components/stepper/stepper.js

@@ -7,6 +7,7 @@ import { mergeProps } from '../../utils/with-default-props';
 import { bound } from '../../utils/bound';
 import Input from '../input';
 import Button from '../button';
+import Big from 'big.js';
 const classPrefix = `adm-stepper`;
 const defaultProps = {
   defaultValue: 0,
@@ -24,13 +25,13 @@ export const Stepper = p => {
     inputReadOnly
   } = props;
   const [value, setValue] = usePropsValue(props);
-  const [inputValue, setInputValue] = useState(() => convertValueToText(value));
+  const [inputValue, setInputValue] = useState(() => convertValueToText(value, props.digits));
 
   function setValueWithCheck(v) {
     if (isNaN(v)) return;
     let target = bound(v, props.min, props.max);
 
-    if (props.digits || props.digits === 0) {
+    if (props.digits !== undefined) {
       target = parseFloat(target.toFixed(props.digits));
     }
 
@@ -40,12 +41,12 @@ export const Stepper = p => {
   const [hasFocus, setHasFocus] = useState(false);
   useEffect(() => {
     if (!hasFocus) {
-      setInputValue(convertValueToText(value));
+      setInputValue(convertValueToText(value, props.digits));
     }
   }, [hasFocus]);
   useEffect(() => {
     if (!hasFocus) {
-      setInputValue(convertValueToText(value));
+      setInputValue(convertValueToText(value, props.digits));
     }
   }, [value]);
 
@@ -65,11 +66,11 @@ export const Stepper = p => {
   };
 
   const handleMinus = () => {
-    setValueWithCheck((value !== null && value !== void 0 ? value : 0) - step);
+    setValueWithCheck(Big(value !== null && value !== void 0 ? value : 0).minus(step).toNumber());
   };
 
   const handlePlus = () => {
-    setValueWithCheck((value !== null && value !== void 0 ? value : 0) + step);
+    setValueWithCheck(Big(value !== null && value !== void 0 ? value : 0).add(step).toNumber());
   };
 
   const minusDisabled = () => {
@@ -137,9 +138,14 @@ export const Stepper = p => {
   }, React.createElement(AddOutline, null))));
 };
 
-function convertValueToText(value) {
+function convertValueToText(value, digits) {
   if (value === null) return '';
-  return value.toString();
+
+  if (digits !== undefined) {
+    return value.toFixed(digits);
+  } else {
+    return value.toString();
+  }
 }
 
 function convertTextToValue(text) {

package/2x/es/components/tab-bar/tab-bar.js

@@ -5,6 +5,7 @@ import { mergeProps } from '../../utils/with-default-props';
 import Badge from '../badge';
 import SafeArea from '../safe-area';
 import { usePropsValue } from '../../utils/use-props-value';
+import { traverseReactNode } from '../../utils/traverse-react-node';
 export const TabBarItem = () => {
   return null;
 };
@@ -18,7 +19,7 @@ export const TabBar = p => {
   const props = mergeProps(defaultProps, p);
   let firstActiveKey = null;
   const items = [];
-  React.Children.forEach(props.children, (child, index) => {
+  traverseReactNode(props.children, (child, index) => {
     if (!React.isValidElement(child)) return;
     const key = child.key;
     if (typeof key !== 'string') return;

package/2x/es/components/tabs/tabs.js

@@ -10,6 +10,7 @@ import { useResizeEffect } from '../../utils/use-resize-effect';
 import { mergeProps } from '../../utils/with-default-props';
 import { useIsomorphicUpdateLayoutEffect } from '../../utils/use-isomorphic-update-layout-effect';
 import { ShouldRender } from '../../utils/should-render';
+import { traverseReactNode } from '../../utils/traverse-react-node';
 const classPrefix = `adm-tabs`;
 export const Tab = () => {
   return null;
@@ -27,7 +28,7 @@ export const Tabs = p => {
   const keyToIndexRecord = {};
   let firstActiveKey = null;
   const panes = [];
-  React.Children.forEach(props.children, (child, index) => {
+  traverseReactNode(props.children, (child, index) => {
     if (!React.isValidElement(child)) return;
     const key = child.key;
     if (typeof key !== 'string') return;

package/2x/es/components/tree-select/multiple.js

@@ -137,7 +137,8 @@ export const Multiple = p => {
       walker(groupKeys);
     }
 
-    groupKeys = groupKeys.filter(i => !unusedKeys.includes(i));
+    groupKeys = groupKeys.filter(i => !unusedKeys.includes(i)); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+
     const groupOptions = groupKeys.map(i => optionsMap.get(i));
     setValue(groupKeys);
     (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, groupKeys, groupOptions);

package/2x/es/utils/traverse-react-node.d.ts

@@ -0,0 +1,2 @@
+import { ReactNode } from 'react';
+export declare function traverseReactNode(children: ReactNode, fn: (child: ReactNode, index: number) => void): void;

package/2x/es/utils/traverse-react-node.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import { isFragment } from 'react-is';
+export function traverseReactNode(children, fn) {
+  let i = 0;
+
+  function handle(target) {
+    React.Children.forEach(target, child => {
+      if (!isFragment(child)) {
+        fn(child, i);
+        i += 1;
+      } else {
+        handle(child.props.children);
+      }
+    });
+  }
+
+  handle(children);
+}

package/2x/package.json

@@ -1,18 +1,22 @@
 {
   "name": "antd-mobile",
-  "version": "5.9.5",
+  "version": "5.10.0",
   "dependencies": {
     "@floating-ui/dom": "^0.4.2",
     "@react-spring/web": "^9.4.4",
+    "@types/big.js": "^6.1.3",
+    "@types/react-is": "^17.0.3",
     "@types/resize-observer-browser": "^0.1.7",
     "@use-gesture/react": "^10.2.10",
     "ahooks": "^3.1.14",
     "antd-mobile-icons": "^0.2.2",
     "antd-mobile-v5-count": "^1.0.1",
+    "big.js": "^6.1.1",
     "classnames": "^2.3.1",
     "dayjs": "^1.11.0",
     "lodash": "^4.17.21",
     "rc-field-form": "^1.24.0",
+    "react-is": "^17.0.2",
     "staged-components": "^1.1.2",
     "tslib": "^2.3.1"
   },

package/bundle/antd-mobile.cjs.js

@@ -6,11 +6,13 @@ var classNames = require("classnames");
 var ahooks = require("ahooks");
 var web = require("@react-spring/web");
 var dayjs = require("dayjs");
+var reactIs = require("react-is");
 var react = require("@use-gesture/react");
 var antdMobileIcons = require("antd-mobile-icons");
 var stagedComponents = require("staged-components");
 var RcForm = require("rc-field-form");
 var dom = require("@floating-ui/dom");
+var Big = require("big.js");
 function _interopDefaultLegacy(e) {
   return e && typeof e === "object" && "default" in e ? e : { "default": e };
 }
@@ -18,6 +20,7 @@ var React__default = /* @__PURE__ */ _interopDefaultLegacy(React$1);
 var classNames__default = /* @__PURE__ */ _interopDefaultLegacy(classNames);
 var dayjs__default = /* @__PURE__ */ _interopDefaultLegacy(dayjs);
 var RcForm__default = /* @__PURE__ */ _interopDefaultLegacy(RcForm);
+var Big__default = /* @__PURE__ */ _interopDefaultLegacy(Big);
 var global$1 = "";
 const canUseDom = !!(typeof window !== "undefined" && typeof document !== "undefined" && window.document && window.document.createElement);
 if (canUseDom) {
@@ -9144,6 +9147,20 @@ const ScrollMask = (props) => {
     }
   }));
 };
+function traverseReactNode(children, fn) {
+  let i = 0;
+  function handle(target) {
+    React__default["default"].Children.forEach(target, (child) => {
+      if (!reactIs.isFragment(child)) {
+        fn(child, i);
+        i += 1;
+      } else {
+        handle(child.props.children);
+      }
+    });
+  }
+  handle(children);
+}
 const classPrefix$15 = `adm-capsule-tabs`;
 const CapsuleTab = () => {
   return null;
@@ -9155,7 +9172,7 @@ const CapsuleTabs = (props) => {
   const keyToIndexRecord = {};
   let firstActiveKey = null;
   const panes = [];
-  React__default["default"].Children.forEach(props.children, (child, index2) => {
+  traverseReactNode(props.children, (child, index2) => {
     if (!React__default["default"].isValidElement(child))
       return;
     const key = child.key;
@@ -9673,6 +9690,7 @@ const Wheel = React$1.memo((props) => {
     className: `${classPrefix$13}-column-wheel`,
     "aria-hidden": true
   }, column.map((item, index2) => {
+    var _a;
     const selected = props.value === item.value;
     if (selected)
       selectedIndex = index2;
@@ -9681,7 +9699,7 @@ const Wheel = React$1.memo((props) => {
       scrollSelect(index2);
     }
     return React__default["default"].createElement("div", {
-      key: item.value,
+      key: (_a = item.key) !== null && _a !== void 0 ? _a : item.value,
       "data-selected": item.value === value,
       className: `${classPrefix$13}-column-item`,
       onClick: handleClick,
@@ -10058,7 +10076,7 @@ const Tabs$1 = (p) => {
   const keyToIndexRecord = {};
   let firstActiveKey = null;
   const panes = [];
-  React__default["default"].Children.forEach(props.children, (child, index2) => {
+  traverseReactNode(props.children, (child, index2) => {
     if (!React__default["default"].isValidElement(child))
       return;
     const key = child.key;
@@ -10921,7 +10939,7 @@ const CollapsePanelContent = (props) => {
 const Collapse = (props) => {
   var _a;
   const panels = [];
-  React__default["default"].Children.forEach(props.children, (child) => {
+  traverseReactNode(props.children, (child) => {
     if (!React__default["default"].isValidElement(child))
       return;
     const key = child.key;
@@ -11733,12 +11751,13 @@ var index$b = attachPropertiesToComponent(Dialog, {
 var divider = "";
 const classPrefix$R = `adm-divider`;
 const defaultProps$E = {
-  contentPosition: "center"
+  contentPosition: "center",
+  direction: "horizontal"
 };
 const Divider = (p) => {
   const props = mergeProps(defaultProps$E, p);
   return withNativeProps(props, React__default["default"].createElement("div", {
-    className: classNames__default["default"](classPrefix$R, `${classPrefix$R}-${props.contentPosition}`)
+    className: classNames__default["default"](classPrefix$R, `${classPrefix$R}-${props.direction}`, `${classPrefix$R}-${props.contentPosition}`)
   }, props.children && React__default["default"].createElement("div", {
     className: `${classPrefix$R}-content`
   }, props.children)));
@@ -12891,7 +12910,7 @@ const Form$1 = React$1.forwardRef((p, ref) => {
     }, items));
     items = [];
   }
-  React__default["default"].Children.forEach(props.children, (child) => {
+  traverseReactNode(props.children, (child) => {
     if (React__default["default"].isValidElement(child)) {
       if (child.type === Header) {
         collect();
@@ -14022,7 +14041,8 @@ const PreviewItem = (props) => {
     url,
     file,
     deletable,
-    onDelete
+    onDelete,
+    imageFit
   } = props;
   const src = React$1.useMemo(() => {
     if (url) {
@@ -14057,7 +14077,7 @@ const PreviewItem = (props) => {
   }, React__default["default"].createElement(Image$1, {
     className: `${classPrefix$B}-cell-image`,
     src,
-    fit: "cover",
+    fit: imageFit,
     onClick: props.onClick
   }), renderLoading(), renderDelete());
 };
@@ -14097,7 +14117,8 @@ const defaultProps$t = {
   defaultValue: [],
   accept: "image/*",
   preview: true,
-  showFailed: true
+  showFailed: true,
+  imageFit: "cover"
 };
 const ImageUploader = (p) => {
   const props = mergeProps(defaultProps$t, p);
@@ -14223,6 +14244,7 @@ const ImageUploader = (p) => {
       key: (_a = fileItem.key) !== null && _a !== void 0 ? _a : index2,
       url: (_b = fileItem.thumbnailUrl) !== null && _b !== void 0 ? _b : fileItem.url,
       deletable: props.deletable,
+      imageFit: props.imageFit,
       onClick: () => {
         if (props.preview) {
           previewImage(index2);
@@ -14246,6 +14268,7 @@ const ImageUploader = (p) => {
       file: task.file,
       deletable: task.status !== "pending",
       status: task.status,
+      imageFit: props.imageFit,
       onDelete: () => {
         setTasks(tasks.filter((x) => x.id !== task.id));
       }
@@ -14343,7 +14366,7 @@ const IndexBar = React$1.forwardRef((p, ref) => {
   const bodyRef = React$1.useRef(null);
   const indexItems = [];
   const panels = [];
-  React__default["default"].Children.forEach(props.children, (child) => {
+  traverseReactNode(props.children, (child) => {
     var _a;
     if (!React__default["default"].isValidElement(child))
       return;
@@ -14611,7 +14634,7 @@ const JumboTabs = (props) => {
   const keyToIndexRecord = {};
   let firstActiveKey = null;
   const panes = [];
-  React__default["default"].Children.forEach(props.children, (child, index2) => {
+  traverseReactNode(props.children, (child, index2) => {
     if (!React__default["default"].isValidElement(child))
       return;
     const key = child.key;
@@ -15909,7 +15932,7 @@ const SideBar = (props) => {
   var _a;
   let firstActiveKey = null;
   const items = [];
-  React__default["default"].Children.forEach(props.children, (child, index2) => {
+  traverseReactNode(props.children, (child, index2) => {
     if (!React__default["default"].isValidElement(child))
       return;
     const key = child.key;
@@ -16285,12 +16308,12 @@ const Stepper = (p) => {
     inputReadOnly
   } = props;
   const [value, setValue] = usePropsValue(props);
-  const [inputValue, setInputValue] = React$1.useState(() => convertValueToText(value));
+  const [inputValue, setInputValue] = React$1.useState(() => convertValueToText(value, props.digits));
   function setValueWithCheck(v) {
     if (isNaN(v))
       return;
     let target = bound(v, props.min, props.max);
-    if (props.digits || props.digits === 0) {
+    if (props.digits !== void 0) {
       target = parseFloat(target.toFixed(props.digits));
     }
     setValue(target);
@@ -16298,12 +16321,12 @@ const Stepper = (p) => {
   const [hasFocus, setHasFocus] = React$1.useState(false);
   React$1.useEffect(() => {
     if (!hasFocus) {
-      setInputValue(convertValueToText(value));
+      setInputValue(convertValueToText(value, props.digits));
     }
   }, [hasFocus]);
   React$1.useEffect(() => {
     if (!hasFocus) {
-      setInputValue(convertValueToText(value));
+      setInputValue(convertValueToText(value, props.digits));
     }
   }, [value]);
   const handleInputChange = (v) => {
@@ -16320,10 +16343,10 @@ const Stepper = (p) => {
     }
   };
   const handleMinus = () => {
-    setValueWithCheck((value !== null && value !== void 0 ? value : 0) - step);
+    setValueWithCheck(Big__default["default"](value !== null && value !== void 0 ? value : 0).minus(step).toNumber());
   };
   const handlePlus = () => {
-    setValueWithCheck((value !== null && value !== void 0 ? value : 0) + step);
+    setValueWithCheck(Big__default["default"](value !== null && value !== void 0 ? value : 0).add(step).toNumber());
   };
   const minusDisabled = () => {
     if (disabled)
@@ -16385,10 +16408,14 @@ const Stepper = (p) => {
     color: "primary"
   }, React__default["default"].createElement(antdMobileIcons.AddOutline, null))));
 };
-function convertValueToText(value) {
+function convertValueToText(value, digits) {
   if (value === null)
     return "";
-  return value.toString();
+  if (digits !== void 0) {
+    return value.toFixed(digits);
+  } else {
+    return value.toString();
+  }
 }
 function convertTextToValue(text) {
   if (text === "")
@@ -16980,7 +17007,7 @@ const TabBar = (p) => {
   const props = mergeProps(defaultProps$7, p);
   let firstActiveKey = null;
   const items = [];
-  React__default["default"].Children.forEach(props.children, (child, index2) => {
+  traverseReactNode(props.children, (child, index2) => {
     if (!React__default["default"].isValidElement(child))
       return;
     const key = child.key;