antd-mobile 5.14.2 → 5.14.3

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

@@ -14471,18 +14471,25 @@ const FormItem = (props) => {
     return renderLayout(childNode, fieldId, meta, isRequired);
   });
 };
-const FormSubscribe = ({
-  children,
-  to
-}) => {
+const FormSubscribe = (props) => {
+  const update = ahooks.useUpdate();
   return React__default["default"].createElement(Form.Item, {
     noStyle: true,
-    dependencies: to
-  }, (form) => {
-    const changedValues = form.getFieldsValue(to);
-    return children(changedValues, form);
-  });
+    dependencies: props.to
+  }, (form) => React__default["default"].createElement(React__default["default"].Fragment, null, props.children(form.getFieldsValue(props.to), form), props.to.map((namePath) => React__default["default"].createElement(Watcher, {
+    key: namePath.toString(),
+    form,
+    namePath,
+    onChange: update
+  }))));
 };
+const Watcher = React$1.memo((props) => {
+  const value = RcForm.useWatch(props.namePath, props.form);
+  useIsomorphicUpdateLayoutEffect(() => {
+    props.onChange();
+  }, [value]);
+  return null;
+});
 var Form = attachPropertiesToComponent(Form$1, {
   Item: FormItem,
   Subscribe: FormSubscribe,
@@ -15500,6 +15507,7 @@ const InfiniteScroll = (p2) => {
   function retry() {
     setFailed(false);
     doLoadMore(true);
+    setFlag(nextFlagRef.current);
   }
   return withNativeProps(props, React__default["default"].createElement("div", {
     className: classPrefix$y,
@@ -18229,9 +18237,13 @@ const InternalToast = (p2) => {
       return null;
     switch (icon) {
       case "success":
-        return React__default["default"].createElement(antdMobileIcons.CheckOutline, null);
+        return React__default["default"].createElement(antdMobileIcons.CheckOutline, {
+          className: `${classPrefix$4}-icon-success`
+        });
       case "fail":
-        return React__default["default"].createElement(antdMobileIcons.CloseOutline, null);
+        return React__default["default"].createElement(antdMobileIcons.CloseOutline, {
+          className: `${classPrefix$4}-icon-fail`
+        });
       case "loading":
         return React__default["default"].createElement(SpinLoading, {
           color: "white",

package/2x/bundle/antd-mobile.es.js

@@ -8,7 +8,7 @@ import { isFragment, isMemo } from "react-is";
 import { useDrag, useWheel, createUseGesture, dragAction, pinchAction } from "@use-gesture/react";
 import { RightOutline, CheckOutline, DownOutline, DownFill, QuestionCircleOutline, CloseOutline, AddOutline, CloseCircleFill, LeftOutline, SoundOutline, TextDeletionOutline, StarFill, CheckCircleFill, InformationCircleFill, ClockCircleFill, ExclamationCircleFill, SearchOutline, MinusOutline } from "antd-mobile-icons";
 import { staged } from "staged-components";
-import RcForm, { List as List$2, Field, useForm, useWatch } from "rc-field-form";
+import RcForm, { List as List$2, Field, useWatch, useForm } from "rc-field-form";
 import { computePosition, offset, shift, limitShift, flip, hide, arrow, autoUpdate } from "@floating-ui/dom";
 import Big from "big.js";
 function _mergeNamespaces(n2, m2) {
@@ -14461,18 +14461,25 @@ const FormItem = (props) => {
     return renderLayout(childNode, fieldId, meta, isRequired);
   });
 };
-const FormSubscribe = ({
-  children,
-  to: to2
-}) => {
+const FormSubscribe = (props) => {
+  const update = useUpdate();
   return React$1.createElement(Form.Item, {
     noStyle: true,
-    dependencies: to2
-  }, (form) => {
-    const changedValues = form.getFieldsValue(to2);
-    return children(changedValues, form);
-  });
+    dependencies: props.to
+  }, (form) => React$1.createElement(React$1.Fragment, null, props.children(form.getFieldsValue(props.to), form), props.to.map((namePath) => React$1.createElement(Watcher, {
+    key: namePath.toString(),
+    form,
+    namePath,
+    onChange: update
+  }))));
 };
+const Watcher = memo((props) => {
+  const value = useWatch(props.namePath, props.form);
+  useIsomorphicUpdateLayoutEffect(() => {
+    props.onChange();
+  }, [value]);
+  return null;
+});
 var Form = attachPropertiesToComponent(Form$1, {
   Item: FormItem,
   Subscribe: FormSubscribe,
@@ -15490,6 +15497,7 @@ const InfiniteScroll = (p2) => {
   function retry() {
     setFailed(false);
     doLoadMore(true);
+    setFlag(nextFlagRef.current);
   }
   return withNativeProps(props, React$1.createElement("div", {
     className: classPrefix$y,
@@ -18219,9 +18227,13 @@ const InternalToast = (p2) => {
       return null;
     switch (icon) {
       case "success":
-        return React$1.createElement(CheckOutline, null);
+        return React$1.createElement(CheckOutline, {
+          className: `${classPrefix$4}-icon-success`
+        });
       case "fail":
-        return React$1.createElement(CloseOutline, null);
+        return React$1.createElement(CloseOutline, {
+          className: `${classPrefix$4}-icon-fail`
+        });
       case "loading":
         return React$1.createElement(SpinLoading, {
           color: "white",

package/2x/cjs/components/form/form-subscribe.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { FC } from 'react';
 import type { FormInstance } from 'rc-field-form';
 import type { NamePath } from 'rc-field-form/es/interface';
 declare type RenderChildren<Values = any> = (changedValues: Record<string, any>, form: FormInstance<Values>) => React.ReactNode;
@@ -7,5 +7,10 @@ export interface FormSubscribeProps {
     to: NamePath[];
     children: ChildrenType;
 }
-export declare const FormSubscribe: React.VFC<FormSubscribeProps>;
+export declare const FormSubscribe: FC<FormSubscribeProps>;
+export declare const Watcher: React.NamedExoticComponent<{
+    form: FormInstance;
+    namePath: NamePath;
+    onChange: () => void;
+}>;
 export {};

package/2x/cjs/components/form/form-subscribe.js

@@ -3,25 +3,43 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.FormSubscribe = void 0;
+exports.Watcher = exports.FormSubscribe = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
+
+var _rcFieldForm = require("rc-field-form");
+
+var _ahooks = require("ahooks");
 
 var _ = _interopRequireDefault(require("."));
 
+var _useIsomorphicUpdateLayoutEffect = require("../../utils/use-isomorphic-update-layout-effect");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const FormSubscribe = ({
-  children,
-  to
-}) => {
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const FormSubscribe = props => {
+  const update = (0, _ahooks.useUpdate)();
   return _react.default.createElement(_.default.Item, {
     noStyle: true,
-    dependencies: to
-  }, form => {
-    const changedValues = form.getFieldsValue(to);
-    return children(changedValues, form);
-  });
+    dependencies: props.to
+  }, form => _react.default.createElement(_react.default.Fragment, null, props.children(form.getFieldsValue(props.to), form), props.to.map(namePath => _react.default.createElement(Watcher, {
+    key: namePath.toString(),
+    form: form,
+    namePath: namePath,
+    onChange: update
+  }))));
 };
 
-exports.FormSubscribe = FormSubscribe;
+exports.FormSubscribe = FormSubscribe;
+const Watcher = (0, _react.memo)(props => {
+  const value = (0, _rcFieldForm.useWatch)(props.namePath, props.form);
+  (0, _useIsomorphicUpdateLayoutEffect.useIsomorphicUpdateLayoutEffect)(() => {
+    props.onChange();
+  }, [value]);
+  return null;
+});
+exports.Watcher = Watcher;

package/2x/cjs/components/form/index.d.ts

@@ -12,7 +12,7 @@ declare const _default: import("react").ForwardRefExoticComponent<Pick<import("r
     mode?: "default" | "card" | undefined;
 } & import("react").RefAttributes<import("./form").FormInstance>> & {
     Item: import("react").FC<import("./form-item").FormItemProps>;
-    Subscribe: import("react").VFC<import("./form-subscribe").FormSubscribeProps>;
+    Subscribe: import("react").FC<import("./form-subscribe").FormSubscribeProps>;
     Header: import("react").FC<{
         children?: import("react").ReactNode;
     }>;

package/2x/cjs/components/infinite-scroll/infinite-scroll.js

@@ -99,6 +99,7 @@ const InfiniteScroll = p => {
   function retry() {
     setFailed(false);
     doLoadMore(true);
+    setFlag(nextFlagRef.current);
   }
 
   return (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {

package/2x/cjs/components/toast/toast.js

@@ -44,10 +44,14 @@ const InternalToast = p => {
 
     switch (icon) {
       case 'success':
-        return _react.default.createElement(_antdMobileIcons.CheckOutline, null);
+        return _react.default.createElement(_antdMobileIcons.CheckOutline, {
+          className: `${classPrefix}-icon-success`
+        });
 
       case 'fail':
-        return _react.default.createElement(_antdMobileIcons.CloseOutline, null);
+        return _react.default.createElement(_antdMobileIcons.CloseOutline, {
+          className: `${classPrefix}-icon-fail`
+        });
 
       case 'loading':
         return _react.default.createElement(_spinLoading.default, {

package/2x/es/components/form/form-subscribe.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { FC } from 'react';
 import type { FormInstance } from 'rc-field-form';
 import type { NamePath } from 'rc-field-form/es/interface';
 declare type RenderChildren<Values = any> = (changedValues: Record<string, any>, form: FormInstance<Values>) => React.ReactNode;
@@ -7,5 +7,10 @@ export interface FormSubscribeProps {
     to: NamePath[];
     children: ChildrenType;
 }
-export declare const FormSubscribe: React.VFC<FormSubscribeProps>;
+export declare const FormSubscribe: FC<FormSubscribeProps>;
+export declare const Watcher: React.NamedExoticComponent<{
+    form: FormInstance;
+    namePath: NamePath;
+    onChange: () => void;
+}>;
 export {};

package/2x/es/components/form/form-subscribe.js

@@ -1,14 +1,24 @@
-import React from 'react';
+import React, { memo } from 'react';
+import { useWatch } from 'rc-field-form';
+import { useUpdate } from 'ahooks';
 import Form from '.';
-export const FormSubscribe = ({
-  children,
-  to
-}) => {
+import { useIsomorphicUpdateLayoutEffect } from '../../utils/use-isomorphic-update-layout-effect';
+export const FormSubscribe = props => {
+  const update = useUpdate();
   return React.createElement(Form.Item, {
     noStyle: true,
-    dependencies: to
-  }, form => {
-    const changedValues = form.getFieldsValue(to);
-    return children(changedValues, form);
-  });
-};
+    dependencies: props.to
+  }, form => React.createElement(React.Fragment, null, props.children(form.getFieldsValue(props.to), form), props.to.map(namePath => React.createElement(Watcher, {
+    key: namePath.toString(),
+    form: form,
+    namePath: namePath,
+    onChange: update
+  }))));
+};
+export const Watcher = memo(props => {
+  const value = useWatch(props.namePath, props.form);
+  useIsomorphicUpdateLayoutEffect(() => {
+    props.onChange();
+  }, [value]);
+  return null;
+});

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

@@ -12,7 +12,7 @@ declare const _default: import("react").ForwardRefExoticComponent<Pick<import("r
     mode?: "default" | "card" | undefined;
 } & import("react").RefAttributes<import("./form").FormInstance>> & {
     Item: import("react").FC<import("./form-item").FormItemProps>;
-    Subscribe: import("react").VFC<import("./form-subscribe").FormSubscribeProps>;
+    Subscribe: import("react").FC<import("./form-subscribe").FormSubscribeProps>;
     Header: import("react").FC<{
         children?: import("react").ReactNode;
     }>;

package/2x/es/components/infinite-scroll/infinite-scroll.js

@@ -78,6 +78,7 @@ export const InfiniteScroll = p => {
   function retry() {
     setFailed(false);
     doLoadMore(true);
+    setFlag(nextFlagRef.current);
   }
 
   return withNativeProps(props, React.createElement("div", {

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

@@ -23,10 +23,14 @@ export const InternalToast = p => {
 
     switch (icon) {
       case 'success':
-        return React.createElement(CheckOutline, null);
+        return React.createElement(CheckOutline, {
+          className: `${classPrefix}-icon-success`
+        });
 
       case 'fail':
-        return React.createElement(CloseOutline, null);
+        return React.createElement(CloseOutline, {
+          className: `${classPrefix}-icon-fail`
+        });
 
       case 'loading':
         return React.createElement(SpinLoading, {

package/2x/package.json

@@ -1,6 +1,6 @@
 {
   "name": "antd-mobile",
-  "version": "5.14.2",
+  "version": "5.14.3",
   "dependencies": {
     "@floating-ui/dom": "^0.5.2",
     "@react-spring/web": "^9.4.5",