antd-mobile 5.25.1 → 5.26.0

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

@@ -23,35 +23,45 @@ export const Stepper = p => {
     step,
     max,
     min,
-    inputReadOnly
+    inputReadOnly,
+    digits,
+    formatter,
+    parser
   } = props;
   const {
     locale
   } = useConfig();
+  // ========================== Parse / Format ==========================
+  const parseValue = text => {
+    if (text === '') return null;
+    return parser ? parser(text) : parseFloat(text);
+  };
+  const formatValue = value => {
+    if (value === null) return '';
+    if (formatter) {
+      return formatter(value);
+    } else if (digits !== undefined) {
+      return value.toFixed(digits);
+    } else {
+      return value.toString();
+    }
+  };
+  // ======================== Value & InputValue ========================
   const [value, setValue] = usePropsValue(props);
-  const [inputValue, setInputValue] = useState(() => convertValueToText(value, props.digits));
+  const [inputValue, setInputValue] = useState(() => formatValue(value));
+  // >>>>> Value
   function setValueWithCheck(v) {
     if (isNaN(v)) return;
     let target = bound(v, props.min, props.max);
-    if (props.digits !== undefined) {
-      target = parseFloat(target.toFixed(props.digits));
+    if (digits !== undefined) {
+      target = parseFloat(target.toFixed(digits));
     }
     setValue(target);
   }
-  const [hasFocus, setHasFocus] = useState(false);
-  useEffect(() => {
-    if (!hasFocus) {
-      setInputValue(convertValueToText(value, props.digits));
-    }
-  }, [hasFocus]);
-  useEffect(() => {
-    if (!hasFocus) {
-      setInputValue(convertValueToText(value, props.digits));
-    }
-  }, [value, props.digits]);
+  // >>>>> Input
   const handleInputChange = v => {
     setInputValue(v);
-    const value = convertTextToValue(v);
+    const value = parseValue(v);
     if (value === null) {
       if (props.allowEmpty) {
         setValue(null);
@@ -62,6 +72,29 @@ export const Stepper = p => {
       setValueWithCheck(value);
     }
   };
+  // ============================== Focus ===============================
+  const [focused, setFocused] = useState(false);
+  const inputRef = React.useRef(null);
+  function triggerFocus(nextFocus) {
+    setFocused(nextFocus);
+    // We will convert value to original text when focus
+    if (nextFocus) {
+      setInputValue(typeof value === 'number' ? String(value) : '');
+    }
+  }
+  useEffect(() => {
+    var _a, _b, _c;
+    if (focused) {
+      (_c = (_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.nativeElement) === null || _b === void 0 ? void 0 : _b.select) === null || _c === void 0 ? void 0 : _c.call(_b);
+    }
+  }, [focused]);
+  // Focus change to format value
+  useEffect(() => {
+    if (!focused) {
+      setInputValue(formatValue(value));
+    }
+  }, [focused, value, digits]);
+  // ============================ Operations ============================
   const handleMinus = () => {
     setValueWithCheck(Big(value !== null && value !== void 0 ? value : 0).minus(step).toNumber());
   };
@@ -84,9 +117,10 @@ export const Stepper = p => {
     }
     return false;
   };
+  // ============================== Render ==============================
   return withNativeProps(props, React.createElement("div", {
     className: classNames(classPrefix, {
-      [`${classPrefix}-active`]: hasFocus
+      [`${classPrefix}-active`]: focused
     })
   }, React.createElement(Button, {
     className: `${classPrefix}-minus`,
@@ -99,10 +133,11 @@ export const Stepper = p => {
   }, React.createElement(MinusOutline, null)), React.createElement("div", {
     className: `${classPrefix}-middle`
   }, React.createElement(Input, {
+    ref: inputRef,
     className: `${classPrefix}-input`,
     onFocus: e => {
       var _a;
-      setHasFocus(true);
+      triggerFocus(true);
       (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, e);
     },
     value: inputValue,
@@ -112,7 +147,7 @@ export const Stepper = p => {
     disabled: disabled,
     onBlur: e => {
       var _a;
-      setHasFocus(false);
+      triggerFocus(false);
       (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, e);
     },
     readOnly: inputReadOnly,
@@ -130,16 +165,4 @@ export const Stepper = p => {
     color: 'primary',
     "aria-label": locale.Stepper.increase
   }, React.createElement(AddOutline, null))));
-};
-function convertValueToText(value, digits) {
-  if (value === null) return '';
-  if (digits !== undefined) {
-    return value.toFixed(digits);
-  } else {
-    return value.toString();
-  }
-}
-function convertTextToValue(text) {
-  if (text === '') return null;
-  return parseFloat(text);
-}
+};

package/2x/es/components/water-mark/water-mark.d.ts

@@ -10,7 +10,7 @@ export declare type WaterMarkProps = {
     image?: string;
     imageWidth?: number;
     imageHeight?: number;
-    content?: string;
+    content?: string | string[];
     fontColor?: string;
     fontStyle?: 'none' | 'normal' | 'italic' | 'oblique';
     fontFamily?: string;

package/2x/es/components/water-mark/water-mark.js

@@ -58,7 +58,11 @@ export const WaterMark = p => {
         const markSize = Number(fontSize) * ratio;
         ctx.font = `${fontStyle} normal ${fontWeight} ${markSize}px/${markHeight}px ${fontFamily}`;
         ctx.fillStyle = fontColor;
-        ctx.fillText(content, 0, 0);
+        if (Array.isArray(content)) {
+          content.forEach((item, index) => ctx.fillText(item, 0, index * markSize));
+        } else {
+          ctx.fillText(content, 0, 0);
+        }
         ctx.restore();
         setBase64Url(canvas.toDataURL());
       }

package/2x/package.json

@@ -1,23 +1,23 @@
 {
   "name": "antd-mobile",
-  "version": "5.25.1",
+  "version": "5.26.0",
   "dependencies": {
-    "@floating-ui/dom": "^1.0.0",
-    "@react-spring/web": "^9.4.5",
+    "@floating-ui/dom": "^1.0.6",
+    "@react-spring/web": "^9.5.5",
     "@use-gesture/react": "10.2.20",
-    "ahooks": "^3.7.0",
+    "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.1",
-    "dayjs": "^1.11.4",
+    "classnames": "^2.3.2",
+    "dayjs": "^1.11.6",
     "lodash": "^4.17.21",
-    "rc-field-form": "~1.27.0",
+    "rc-field-form": "~1.27.3",
     "react-is": "^17.0.2",
     "runes": "^0.4.3",
     "staged-components": "^1.1.3",
-    "tslib": "^2.4.0",
-    "use-sync-external-store": "^1.1.0"
+    "tslib": "^2.4.1",
+    "use-sync-external-store": "^1.2.0"
   },
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0"