antd-mobile 5.26.0 → 5.27.0

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

@@ -1,30 +1,32 @@
 import classNames from 'classnames';
 import React, { useEffect, useState } from 'react';
 import { MinusOutline, AddOutline } from 'antd-mobile-icons';
+import useMergedState from 'rc-util/lib/hooks/useMergedState';
+import getMiniDecimal, { toFixed } from '@rc-component/mini-decimal';
 import { withNativeProps } from '../../utils/native-props';
-import { usePropsValue } from '../../utils/use-props-value';
 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';
 import { useConfig } from '../config-provider';
 const classPrefix = `adm-stepper`;
 const defaultProps = {
-  defaultValue: 0,
   step: 1,
   disabled: false,
   allowEmpty: false
 };
-export const Stepper = p => {
+export function Stepper(p) {
   const props = mergeProps(defaultProps, p);
   const {
+    defaultValue = 0,
+    value,
+    onChange,
     disabled,
     step,
     max,
     min,
     inputReadOnly,
     digits,
+    stringMode,
     formatter,
     parser
   } = props;
@@ -32,44 +34,70 @@ export const Stepper = p => {
     locale
   } = useConfig();
   // ========================== Parse / Format ==========================
+  const fixedValue = value => {
+    const fixedValue = digits !== undefined ? toFixed(value.toString(), '.', digits) : value;
+    return fixedValue.toString();
+  };
+  const getValueAsType = value => stringMode ? value.toString() : value.toNumber();
   const parseValue = text => {
     if (text === '') return null;
-    return parser ? parser(text) : parseFloat(text);
+    if (parser) {
+      return String(parser(text));
+    }
+    const decimal = getMiniDecimal(text);
+    return decimal.isInvalidate() ? null : decimal.toString();
   };
   const formatValue = value => {
     if (value === null) return '';
     if (formatter) {
       return formatter(value);
-    } else if (digits !== undefined) {
-      return value.toFixed(digits);
     } else {
-      return value.toString();
+      return fixedValue(value);
     }
   };
   // ======================== Value & InputValue ========================
-  const [value, setValue] = usePropsValue(props);
-  const [inputValue, setInputValue] = useState(() => formatValue(value));
+  const [mergedValue, setMergedValue] = useMergedState(defaultValue, {
+    value,
+    onChange: nextValue => {
+      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue);
+    }
+  });
+  const [inputValue, setInputValue] = useState(() => formatValue(mergedValue));
   // >>>>> Value
-  function setValueWithCheck(v) {
-    if (isNaN(v)) return;
-    let target = bound(v, props.min, props.max);
+  function setValueWithCheck(nextValue) {
+    if (nextValue.isNaN()) return;
+    let target = nextValue;
+    // Put into range
+    if (min !== undefined) {
+      const minDecimal = getMiniDecimal(min);
+      if (target.lessEquals(minDecimal)) {
+        target = minDecimal;
+      }
+    }
+    if (max !== undefined) {
+      const maxDecimal = getMiniDecimal(max);
+      if (maxDecimal.lessEquals(target)) {
+        target = maxDecimal;
+      }
+    }
+    // Fix digits
     if (digits !== undefined) {
-      target = parseFloat(target.toFixed(digits));
+      target = getMiniDecimal(fixedValue(getValueAsType(target)));
     }
-    setValue(target);
+    setMergedValue(getValueAsType(target));
   }
   // >>>>> Input
   const handleInputChange = v => {
     setInputValue(v);
-    const value = parseValue(v);
-    if (value === null) {
+    const valueStr = parseValue(v);
+    if (valueStr === null) {
       if (props.allowEmpty) {
-        setValue(null);
+        setMergedValue(null);
       } else {
-        setValue(props.defaultValue);
+        setMergedValue(defaultValue);
       }
     } else {
-      setValueWithCheck(value);
+      setValueWithCheck(getMiniDecimal(valueStr));
     }
   };
   // ============================== Focus ===============================
@@ -79,7 +107,7 @@ export const Stepper = p => {
     setFocused(nextFocus);
     // We will convert value to original text when focus
     if (nextFocus) {
-      setInputValue(typeof value === 'number' ? String(value) : '');
+      setInputValue(mergedValue !== null && mergedValue !== undefined ? String(mergedValue) : '');
     }
   }
   useEffect(() => {
@@ -91,29 +119,36 @@ export const Stepper = p => {
   // Focus change to format value
   useEffect(() => {
     if (!focused) {
-      setInputValue(formatValue(value));
+      setInputValue(formatValue(mergedValue));
     }
-  }, [focused, value, digits]);
+  }, [focused, mergedValue, digits]);
   // ============================ Operations ============================
+  const handleOffset = positive => {
+    let stepValue = getMiniDecimal(step);
+    if (!positive) {
+      stepValue = stepValue.negate();
+    }
+    setValueWithCheck(getMiniDecimal(mergedValue !== null && mergedValue !== void 0 ? mergedValue : 0).add(stepValue.toString()));
+  };
   const handleMinus = () => {
-    setValueWithCheck(Big(value !== null && value !== void 0 ? value : 0).minus(step).toNumber());
+    handleOffset(false);
   };
   const handlePlus = () => {
-    setValueWithCheck(Big(value !== null && value !== void 0 ? value : 0).add(step).toNumber());
+    handleOffset(true);
   };
   const minusDisabled = () => {
     if (disabled) return true;
-    if (value === null) return false;
+    if (mergedValue === null) return false;
     if (min !== undefined) {
-      return value <= min;
+      return mergedValue <= min;
     }
     return false;
   };
   const plusDisabled = () => {
     if (disabled) return true;
-    if (value === null) return false;
+    if (mergedValue === null) return false;
     if (max !== undefined) {
-      return value >= max;
+      return mergedValue >= max;
     }
     return false;
   };
@@ -153,8 +188,8 @@ export const Stepper = p => {
     readOnly: inputReadOnly,
     role: 'spinbutton',
     "aria-valuenow": Number(inputValue),
-    "aria-valuemax": max,
-    "aria-valuemin": min,
+    "aria-valuemax": Number(max),
+    "aria-valuemin": Number(min),
     inputMode: 'decimal'
   })), React.createElement(Button, {
     className: `${classPrefix}-plus`,
@@ -165,4 +200,4 @@ export const Stepper = p => {
     color: 'primary',
     "aria-label": locale.Stepper.increase
   }, React.createElement(AddOutline, null))));
-};
+}

package/2x/es/components/steps/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import './steps.less';
 export type { StepsProps } from './steps';
 export type { StepProps } from './step';

package/2x/es/components/swiper/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import './swiper.less';
 export type { SwiperProps, SwiperRef } from './swiper';
 declare const _default: import("react").ForwardRefExoticComponent<{

package/2x/es/components/tab-bar/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import './tab-bar.less';
 export type { TabBarProps, TabBarItemProps } from './tab-bar';
 declare const _default: import("react").FC<import("./tab-bar").TabBarProps> & {

package/2x/es/components/tabs/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import './tabs.less';
 export type { TabsProps, TabProps } from './tabs';
 declare const _default: import("react").FC<import("./tabs").TabsProps> & {

package/2x/es/components/tree-select/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import './tree-select.less';
 export type { TreeSelectProps, TreeSelectOption } from './tree-select';
 export type { MultipleProps } from './multiple';

package/2x/es/locales/base.d.ts

@@ -15,6 +15,9 @@ export declare const base: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/base.js

@@ -16,6 +16,9 @@ export const base = {
   Dialog: {
     ok: 'OK'
   },
+  DatePicker: {
+    tillNow: 'Till Now'
+  },
   ErrorBlock: {
     default: {
       title: 'Oops, something went wrong',

package/2x/es/locales/en-US.d.ts

@@ -15,6 +15,9 @@ declare const enUS: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/es-ES.d.ts

@@ -15,6 +15,9 @@ declare const esES: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/fa-IR.d.ts

@@ -15,6 +15,9 @@ declare const faIR: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/fr-FR.d.ts

@@ -15,6 +15,9 @@ declare const frFR: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/id-ID.d.ts

@@ -15,6 +15,9 @@ declare const idID: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/ja-JP.d.ts

@@ -15,6 +15,9 @@ declare const jaJP: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/kk-KZ.d.ts

@@ -15,6 +15,9 @@ declare const kkKZ: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/ko-KR.d.ts

@@ -15,6 +15,9 @@ declare const koKR: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/zh-CN.d.ts

@@ -15,6 +15,9 @@ declare const zhCN: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/zh-CN.js

@@ -18,6 +18,9 @@ const zhCN = mergeLocale(base, {
   Dialog: {
     ok: '我知道了'
   },
+  DatePicker: {
+    tillNow: '至今'
+  },
   ErrorBlock: {
     default: {
       title: '页面遇到一些小问题',

package/2x/es/locales/zh-HK.d.ts

@@ -15,6 +15,9 @@ declare const zhHK: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/locales/zh-TW.d.ts

@@ -15,6 +15,9 @@ declare const zhTW: {
     Dialog: {
         ok: string;
     };
+    DatePicker: {
+        tillNow: string;
+    };
     ErrorBlock: {
         default: {
             title: string;

package/2x/es/utils/use-isomorphic-update-layout-effect.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const useIsomorphicUpdateLayoutEffect: typeof import("react").useEffect | typeof import("react").useLayoutEffect;

package/2x/es/utils/use-ref-state.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function useRefState<T>(initialState: T | (() => T)): readonly [T, import("react").Dispatch<import("react").SetStateAction<T>>, import("react").MutableRefObject<T>];

package/2x/package.json

@@ -1,18 +1,19 @@
 {
   "name": "antd-mobile",
-  "version": "5.26.0",
+  "version": "5.27.0",
   "dependencies": {
     "@floating-ui/dom": "^1.0.6",
+    "@rc-component/mini-decimal": "^1.0.1",
     "@react-spring/web": "^9.5.5",
     "@use-gesture/react": "10.2.20",
     "ahooks": "^3.7.2",
     "antd-mobile-icons": "^0.3.0",
     "antd-mobile-v5-count": "^1.0.1",
-    "big.js": "^6.2.1",
     "classnames": "^2.3.2",
     "dayjs": "^1.11.6",
     "lodash": "^4.17.21",
     "rc-field-form": "~1.27.3",
+    "rc-util": "^5.24.8",
     "react-is": "^17.0.2",
     "runes": "^0.4.3",
     "staged-components": "^1.1.3",

package/README.md

@@ -7,17 +7,7 @@
     Essential UI blocks for building mobile web apps. 
   </p>
 
-[![npm (tag)](https://img.shields.io/npm/v/antd-mobile)](https://www.npmjs.com/package/antd-mobile)
-[![GitHub Release Date](https://img.shields.io/github/release-date/ant-design/ant-design-mobile)](https://github.com/ant-design/ant-design-mobile/releases)
-[![npm](https://img.shields.io/npm/dw/antd-mobile)](https://www.npmjs.com/package/antd-mobile)
-[![npm](https://img.shields.io/npm/dw/antd-mobile-v5-count?label=downloads%285.x%29)](https://www.npmjs.com/package/antd-mobile)
-[![jsdelivr](https://img.shields.io/jsdelivr/npm/hm/antd-mobile)](https://www.jsdelivr.com/package/npm/antd-mobile)
-[![gzip size](https://img.badgesize.io/https:/unpkg.com/antd-mobile/umd/antd-mobile.js?label=gzip%20size&compression=gzip)](https://unpkg.com/browse/antd-mobile@5/umd/antd-mobile.js)
-[![Commit Activity](https://img.shields.io/github/commit-activity/m/ant-design/ant-design-mobile/master)](https://github.com/ant-design/ant-design-mobile/graphs/contributors)
-[![Issues help wanted](https://img.shields.io/github/issues-raw/ant-design/ant-design-mobile/help%20wanted?label=help%20wanted)](https://github.com/ant-design/ant-design-mobile/issues?q=is%3Aissue+is%3Aopen+label%3A%22help+wanted%22)
-![GitHub Workflow Status (branch)](https://img.shields.io/github/workflow/status/ant-design/ant-design-mobile/Check/v5)
-[![codecov](https://img.shields.io/codecov/c/gh/ant-design/ant-design-mobile?token=2kJyJBg1nK)](https://codecov.io/gh/ant-design/ant-design-mobile)
-[![GitHub](https://img.shields.io/github/license/ant-design/ant-design-mobile)](https://github.com/ant-design/ant-design-mobile)
+[![npm (tag)](https://img.shields.io/npm/v/antd-mobile)](https://www.npmjs.com/package/antd-mobile) [![GitHub Release Date](https://img.shields.io/github/release-date/ant-design/ant-design-mobile)](https://github.com/ant-design/ant-design-mobile/releases) [![npm](https://img.shields.io/npm/dw/antd-mobile)](https://www.npmjs.com/package/antd-mobile) [![npm](https://img.shields.io/npm/dw/antd-mobile-v5-count?label=downloads%285.x%29)](https://www.npmjs.com/package/antd-mobile) [![jsdelivr](https://img.shields.io/jsdelivr/npm/hm/antd-mobile)](https://www.jsdelivr.com/package/npm/antd-mobile) [![gzip size](https://img.badgesize.io/https:/unpkg.com/antd-mobile/umd/antd-mobile.js?label=gzip%20size&compression=gzip)](https://unpkg.com/browse/antd-mobile@5/umd/antd-mobile.js) [![Commit Activity](https://img.shields.io/github/commit-activity/m/ant-design/ant-design-mobile/master)](https://github.com/ant-design/ant-design-mobile/graphs/contributors) [![Issues help wanted](https://img.shields.io/github/issues-raw/ant-design/ant-design-mobile/help%20wanted?label=help%20wanted)](https://github.com/ant-design/ant-design-mobile/issues?q=is%3Aissue+is%3Aopen+label%3A%22help+wanted%22) ![GitHub Workflow Status (branch)](https://img.shields.io/github/workflow/status/ant-design/ant-design-mobile/Check/v5) [![codecov](https://img.shields.io/codecov/c/gh/ant-design/ant-design-mobile?token=2kJyJBg1nK)](https://codecov.io/gh/ant-design/ant-design-mobile) [![GitHub](https://img.shields.io/github/license/ant-design/ant-design-mobile)](https://github.com/ant-design/ant-design-mobile)
 
   <h4>
     <a href="https://mobile.ant.design">English Doc</a>
@@ -38,22 +28,16 @@ $ yarn add antd-mobile
 $ pnpm add antd-mobile
 ```
 
-- **Fast**: It is carefully optimized for harsh scenes, without configuration, you can have the best package size and
-  ultimate performance.
-- **Customizable**: Based on CSS variables, you can reliably and efficiently adjust the appearance of components or
-  create your own themes.
+- **Fast**: It is carefully optimized for harsh scenes, without configuration, you can have the best package size and ultimate performance.
+- **Customizable**: Based on CSS variables, you can reliably and efficiently adjust the appearance of components or create your own themes.
 - **Atomic**: The function of each component, neither more nor less, is exactly what you need.
 - **Fluent**: With smooth gestures and delicate animation, it helps the product create the ultimate experience.
 
-You can also play with antd-mobile just in browser
-with [Codesandbox](https://codesandbox.io/s/antd-mobile-snrxr?file=/package.json). No need to prepare development
-environment.
+You can also play with antd-mobile just in browser with [Codesandbox](https://codesandbox.io/s/antd-mobile-snrxr?file=/package.json). No need to prepare development environment.
 
-If you found bugs or would like to request some new features, please consider opening
-an [issue](https://github.com/ant-design/ant-design-mobile/issues/new).
+If you found bugs or would like to request some new features, please consider opening an [issue](https://github.com/ant-design/ant-design-mobile/issues/new).
 
-If you have some question about how to use ant-mobile, you can start
-a [discussion thread](https://github.com/ant-design/ant-design-mobile/discussions).
+If you have some question about how to use ant-mobile, you can start a [discussion thread](https://github.com/ant-design/ant-design-mobile/discussions).
 
 ---