@ant-design/pro-components 3.0.2-0 → 3.1.1-0

package/es/form/BaseForm/BaseForm.js

@@ -1,20 +1,11 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
-import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import _typeof from "@babel/runtime/helpers/esm/typeof";
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["children", "contentRender", "submitter", "fieldProps", "formItemProps", "groupProps", "transformKey", "formRef", "onInit", "form", "loading", "formComponentType", "extraUrlParams", "syncToUrl", "onUrlSearchChange", "onReset", "omitNil", "isKeyPressSubmit", "autoFocusFirstInput", "grid", "rowProps", "colProps"],
-  _excluded2 = ["extraUrlParams", "syncToUrl", "isKeyPressSubmit", "syncToUrlAsImportant", "syncToInitialValues", "children", "contentRender", "submitter", "fieldProps", "proFieldProps", "formItemProps", "groupProps", "dateFormatter", "formRef", "onInit", "form", "formComponentType", "onReset", "grid", "rowProps", "colProps", "omitNil", "request", "params", "initialValues", "formKey", "readonly", "onLoadingChange", "loading"];
-/* eslint-disable react-hooks/exhaustive-deps */import { get, set as namePathSet, omit, set, warning } from '@rc-component/util';
+/* eslint-disable react-hooks/exhaustive-deps */
+import { get, set as namePathSet, omit, set, useControlledState, warning } from '@rc-component/util';
 import { useUrlSearchParams } from '@umijs/use-params';
 import { ConfigProvider, Form, Spin } from 'antd';
-import classNames from 'classnames';
-import React, { useContext, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import { clsx } from 'clsx';
+import React, { useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { ProConfigProvider } from "../../provider";
-import { ProFormContext, conversionMomentValue, isDeepEqualReact, nanoid, runFunction, transformKeySubmitValue, useFetchData, useMountMergeState, usePrevious, useRefFunction, useStyle } from "../../utils";
+import { conversionMomentValue, isDeepEqualReact, nanoid, ProFormContext, runFunction, transformKeySubmitValue, useFetchData, usePrevious, useRefFunction, useStyle } from "../../utils";
 import { FormListContext } from "../components/List";
 import FieldContext from "../FieldContext";
 import { GridContext, useGridHelpers } from "../helpers";
@@ -22,11 +13,13 @@ import { EditOrReadOnlyContext } from "./EditOrReadOnlyContext";
 import Submitter from "./Submitter";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var noteOnce = warning.noteOnce;
+const {
+  noteOnce
+} = warning;
 
 // Define ProFormInstance and ProFormRef
 
-var genParams = function genParams(syncUrl, params, type) {
+const genParams = (syncUrl, params, type) => {
   if (syncUrl === true) {
     return params;
   }
@@ -41,228 +34,198 @@ var genParams = function genParams(syncUrl, params, type) {
  * a-> [a]
  * [a] -> [a]
  */
-var covertFormName = function covertFormName(name) {
+const covertFormName = name => {
   if (!name) return name;
   if (Array.isArray(name)) return name;
   return [name];
 };
-var defaultExtraUrlParams = {};
+const defaultExtraUrlParams = {};
 function BaseFormComponents(props) {
-  var _ConfigProvider$useCo;
-  var children = props.children,
-    contentRender = props.contentRender,
-    submitter = props.submitter,
-    fieldProps = props.fieldProps,
-    formItemProps = props.formItemProps,
-    groupProps = props.groupProps,
-    transformKey = props.transformKey,
-    propsFormRef = props.formRef,
-    onInit = props.onInit,
-    form = props.form,
-    loading = props.loading,
-    formComponentType = props.formComponentType,
-    _props$extraUrlParams = props.extraUrlParams,
-    extraUrlParams = _props$extraUrlParams === void 0 ? defaultExtraUrlParams : _props$extraUrlParams,
-    syncToUrl = props.syncToUrl,
-    onUrlSearchChange = props.onUrlSearchChange,
-    _onReset = props.onReset,
-    _props$omitNil = props.omitNil,
-    omitNil = _props$omitNil === void 0 ? true : _props$omitNil,
-    isKeyPressSubmit = props.isKeyPressSubmit,
-    _props$autoFocusFirst = props.autoFocusFirstInput,
-    autoFocusFirstInput = _props$autoFocusFirst === void 0 ? true : _props$autoFocusFirst,
-    grid = props.grid,
-    rowProps = props.rowProps,
-    colProps = props.colProps,
-    rest = _objectWithoutProperties(props, _excluded);
+  const {
+    children,
+    contentRender,
+    submitter,
+    fieldProps,
+    formItemProps,
+    groupProps,
+    transformKey,
+    formRef: propsFormRef,
+    onInit,
+    form,
+    loading,
+    formComponentType,
+    extraUrlParams = defaultExtraUrlParams,
+    syncToUrl,
+    onUrlSearchChange,
+    onReset,
+    omitNil = true,
+    isKeyPressSubmit,
+    autoFocusFirstInput = true,
+    grid,
+    rowProps,
+    colProps,
+    ...rest
+  } = props;
 
   /**
    * 获取 form 实例
    */
-  var formInstance = Form.useFormInstance();
-  var _ref = (ConfigProvider === null || ConfigProvider === void 0 || (_ConfigProvider$useCo = ConfigProvider.useConfig) === null || _ConfigProvider$useCo === void 0 ? void 0 : _ConfigProvider$useCo.call(ConfigProvider)) || {
-      componentSize: 'middle'
-    },
-    componentSize = _ref.componentSize;
+  const formInstance = Form.useFormInstance();
+  const {
+    componentSize
+  } = ConfigProvider?.useConfig?.() || {
+    componentSize: 'middle'
+  };
 
   /** 同步 url 上的参数 */
-  var formRef = useRef(form || formInstance);
+  const formRef = useRef(form || formInstance);
 
   /**
    * 获取布局
    */
-  var _useGridHelpers = useGridHelpers({
-      grid: grid,
-      rowProps: rowProps
-    }),
-    RowWrapper = _useGridHelpers.RowWrapper;
-  var getFormInstance = useRefFunction(function () {
-    return formInstance;
+  const {
+    RowWrapper
+  } = useGridHelpers({
+    grid,
+    rowProps
   });
-  var formatValues = useMemo(function () {
-    return {
-      /**
-       * 获取被 ProForm 格式化后的所有数据
-       * @param allData boolean
-       * @param omitNilParam boolean
-       * @returns T
-       *
-       * @example  getFieldsFormatValue(true) ->返回所有数据，即使没有被 form 托管的
-       */
-      getFieldsFormatValue: function getFieldsFormatValue(allData, omitNilParam) {
-        var formInstance = getFormInstance();
-        if (!formInstance) {
-          return {};
-        }
-        var values = formInstance.getFieldsValue(allData);
-        return transformKey(values, omitNilParam !== undefined ? omitNilParam : omitNil);
-      },
-      /**
-       * 获取被 ProForm 格式化后的单个数据
-       * @param nameList (string|number)[]
-       * @param omitNilParam boolean
-       * @returns T
-       *
-       * @example {a:{b:value}} -> getFieldFormatValue(['a', 'b']) -> value
-       */
-      /** 获取格式化之后的单个数据 */
-      getFieldFormatValue: function getFieldFormatValue() {
-        var paramsNameList = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-        var omitNilParam = arguments.length > 1 ? arguments[1] : undefined;
-        var formInstance = getFormInstance();
-        if (!formInstance) {
-          return undefined;
-        }
-        var nameList = covertFormName(paramsNameList);
-        if (!nameList) throw new Error('nameList is require');
-        var value = formInstance.getFieldValue(nameList);
-        var obj = nameList ? set({}, nameList, value) : value;
-        //transformKey会将keys重新和nameList拼接，所以这里要将nameList的首个元素弹出
-        var newNameList = _toConsumableArray(nameList);
-        newNameList.shift();
-        var transformed = transformKey(obj, omitNilParam !== undefined ? omitNilParam : omitNil, newNameList);
-        var result = get(transformed, nameList);
-        // 如果结果是对象，返回对象的值
-        if (result && _typeof(result) === 'object' && !Array.isArray(result)) {
-          var objValue = Object.values(result)[0];
-          // 如果对象的值是数组，返回数组
-          if (Array.isArray(objValue)) {
-            return objValue;
-          }
+  const getFormInstance = useRefFunction(() => formInstance);
+  const formatValues = useMemo(() => ({
+    /**
+     * 获取被 ProForm 格式化后的所有数据
+     * @param allData boolean
+     * @param omitNilParam boolean
+     * @returns T
+     *
+     * @example  getFieldsFormatValue(true) ->返回所有数据，即使没有被 form 托管的
+     */
+    getFieldsFormatValue: (allData, omitNilParam) => {
+      const formInstance = getFormInstance();
+      if (!formInstance) {
+        return {};
+      }
+      const values = formInstance.getFieldsValue(allData);
+      return transformKey(values, omitNilParam !== undefined ? omitNilParam : omitNil);
+    },
+    /**
+     * 获取被 ProForm 格式化后的单个数据
+     * @param nameList (string|number)[]
+     * @param omitNilParam boolean
+     * @returns T
+     *
+     * @example {a:{b:value}} -> getFieldFormatValue(['a', 'b']) -> value
+     */
+    /** 获取格式化之后的单个数据 */
+    getFieldFormatValue: (paramsNameList = [], omitNilParam) => {
+      const formInstance = getFormInstance();
+      if (!formInstance) {
+        return undefined;
+      }
+      const nameList = covertFormName(paramsNameList);
+      if (!nameList) throw new Error('nameList is require');
+      const value = formInstance.getFieldValue(nameList);
+      const obj = nameList ? set({}, nameList, value) : value;
+      //transformKey会将keys重新和nameList拼接，所以这里要将nameList的首个元素弹出
+      const newNameList = [...nameList];
+      newNameList.shift();
+      const transformed = transformKey(obj, omitNilParam !== undefined ? omitNilParam : omitNil, newNameList);
+      const result = get(transformed, nameList);
+      // 如果结果是对象，返回对象的值
+      if (result && typeof result === 'object' && !Array.isArray(result)) {
+        const objValue = Object.values(result)[0];
+        // 如果对象的值是数组，返回数组
+        if (Array.isArray(objValue)) {
           return objValue;
         }
-        return result;
-      },
-      /**
-       * 获取被 ProForm 格式化后的单个数据, 包含他的 name
-       * @param nameList (string|number)[]
-       * @param omitNilParam boolean
-       * @returns T
-       *
-       * @example  {a:{b:value}} -> getFieldFormatValueObject(['a', 'b']) -> {a:{b:value}}
-       */
-      /** 获取格式化之后的单个数据 */
-      getFieldFormatValueObject: function getFieldFormatValueObject(paramsNameList, omitNilParam) {
-        var formInstance = getFormInstance();
-        if (!formInstance) {
-          return {};
-        }
-        var nameList = covertFormName(paramsNameList);
-        var value = formInstance.getFieldValue(nameList);
-        var obj = nameList ? set({}, nameList, value) : value;
-        return transformKey(obj, omitNilParam !== undefined ? omitNilParam : omitNil, nameList);
-      },
-      /** 
-      /**
-       *验字段后返回格式化之后的所有数据
-       * @param nameList (string|number)[]
-       * @param omitNilParam boolean
-       * @returns T
-       * 
-       * @example validateFieldsReturnFormatValue -> {a:{b:value}}
-       */
-      validateFieldsReturnFormatValue: function () {
-        var _validateFieldsReturnFormatValue = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(nameList, omitNilParam) {
-          var formInstance, values, transformedKey;
-          return _regeneratorRuntime().wrap(function _callee$(_context) {
-            while (1) switch (_context.prev = _context.next) {
-              case 0:
-                formInstance = getFormInstance();
-                if (formInstance) {
-                  _context.next = 3;
-                  break;
-                }
-                return _context.abrupt("return", {});
-              case 3:
-                if (!(!Array.isArray(nameList) && nameList)) {
-                  _context.next = 5;
-                  break;
-                }
-                throw new Error('nameList must be array');
-              case 5:
-                _context.next = 7;
-                return formInstance.validateFields(nameList);
-              case 7:
-                values = _context.sent;
-                transformedKey = transformKey(values, omitNilParam !== undefined ? omitNilParam : omitNil);
-                return _context.abrupt("return", transformedKey ? transformedKey : {});
-              case 10:
-              case "end":
-                return _context.stop();
-            }
-          }, _callee);
-        }));
-        function validateFieldsReturnFormatValue(_x, _x2) {
-          return _validateFieldsReturnFormatValue.apply(this, arguments);
-        }
-        return validateFieldsReturnFormatValue;
-      }()
-    };
-  }, [omitNil, transformKey, getFormInstance]);
-  var items = useMemo(function () {
-    return React.Children.toArray(children).map(function (item, index) {
+        return objValue;
+      }
+      return result;
+    },
+    /**
+     * 获取被 ProForm 格式化后的单个数据, 包含他的 name
+     * @param nameList (string|number)[]
+     * @param omitNilParam boolean
+     * @returns T
+     *
+     * @example  {a:{b:value}} -> getFieldFormatValueObject(['a', 'b']) -> {a:{b:value}}
+     */
+    /** 获取格式化之后的单个数据 */
+    getFieldFormatValueObject: (paramsNameList, omitNilParam) => {
+      const formInstance = getFormInstance();
+      if (!formInstance) {
+        return {};
+      }
+      const nameList = covertFormName(paramsNameList);
+      const value = formInstance.getFieldValue(nameList);
+      const obj = nameList ? set({}, nameList, value) : value;
+      return transformKey(obj, omitNilParam !== undefined ? omitNilParam : omitNil, nameList);
+    },
+    /** 
+    /**
+     *验字段后返回格式化之后的所有数据
+     * @param nameList (string|number)[]
+     * @param omitNilParam boolean
+     * @returns T
+     * 
+     * @example validateFieldsReturnFormatValue -> {a:{b:value}}
+     */
+    validateFieldsReturnFormatValue: async (nameList, omitNilParam) => {
+      const formInstance = getFormInstance();
+      if (!formInstance) {
+        return {};
+      }
+      if (!Array.isArray(nameList) && nameList) throw new Error('nameList must be array');
+      const values = await formInstance.validateFields(nameList);
+      const transformedKey = transformKey(values, omitNilParam !== undefined ? omitNilParam : omitNil);
+      return transformedKey ? transformedKey : {};
+    }
+  }), [omitNil, transformKey, getFormInstance]);
+  const items = useMemo(() => {
+    return React.Children.toArray(children).map((item, index) => {
       if (index === 0 && /*#__PURE__*/React.isValidElement(item) && autoFocusFirstInput) {
-        return /*#__PURE__*/React.cloneElement(item, _objectSpread(_objectSpread({}, item.props), {}, {
+        return /*#__PURE__*/React.cloneElement(item, {
+          ...item.props,
           autoFocus: autoFocusFirstInput
-        }));
+        });
       }
       return item;
     });
   }, [autoFocusFirstInput, children]);
 
   /** 计算 props 的对象 */
-  var submitterProps = useMemo(function () {
-    return typeof submitter === 'boolean' || !submitter ? {} : submitter;
-  }, [submitter]);
+  const submitterProps = useMemo(() => typeof submitter === 'boolean' || !submitter ? {} : submitter, [submitter]);
 
   /** 渲染提交按钮与重置按钮 */
-  var submitterNode = useMemo(function () {
+  const submitterNode = useMemo(() => {
     if (submitter === false) return undefined;
-    return /*#__PURE__*/_jsx(Submitter, _objectSpread(_objectSpread({}, submitterProps), {}, {
-      onReset: function onReset() {
-        var _formRef$current, _submitterProps$onRes;
-        var finalValues = transformKey((_formRef$current = formRef.current) === null || _formRef$current === void 0 ? void 0 : _formRef$current.getFieldsValue(), omitNil);
-        submitterProps === null || submitterProps === void 0 || (_submitterProps$onRes = submitterProps.onReset) === null || _submitterProps$onRes === void 0 || _submitterProps$onRes.call(submitterProps, finalValues);
-        _onReset === null || _onReset === void 0 || _onReset(finalValues);
+    return /*#__PURE__*/_jsx(Submitter, {
+      ...submitterProps,
+      onReset: () => {
+        const finalValues = transformKey(formRef.current?.getFieldsValue(), omitNil);
+        submitterProps?.onReset?.(finalValues);
+        onReset?.(finalValues);
         // 如果 syncToUrl，清空一下数据
         if (syncToUrl) {
-          var _formRef$current2;
           // 把没有的值设置为未定义可以删掉 url 的参数
-          var params = Object.keys(transformKey((_formRef$current2 = formRef.current) === null || _formRef$current2 === void 0 ? void 0 : _formRef$current2.getFieldsValue(), false)).reduce(function (pre, next) {
-            return _objectSpread(_objectSpread({}, pre), {}, _defineProperty({}, next, finalValues[next] || undefined));
+          const params = Object.keys(transformKey(formRef.current?.getFieldsValue(), false)).reduce((pre, next) => {
+            return {
+              ...pre,
+              [next]: finalValues[next] || undefined
+            };
           }, extraUrlParams);
 
           /** 在同步到 url 上时对参数进行转化 */
           onUrlSearchChange(genParams(syncToUrl, params || {}, 'set'));
         }
       },
-      submitButtonProps: _objectSpread({
-        loading: loading
-      }, submitterProps.submitButtonProps)
-    }), "submitter");
-  }, [submitter, submitterProps, loading, transformKey, omitNil, _onReset, syncToUrl, extraUrlParams, onUrlSearchChange]);
-  var content = useMemo(function () {
-    var wrapItems = grid ? /*#__PURE__*/_jsx(RowWrapper, {
+      submitButtonProps: {
+        loading,
+        ...submitterProps.submitButtonProps
+      }
+    }, "submitter");
+  }, [submitter, submitterProps, loading, transformKey, omitNil, onReset, syncToUrl, extraUrlParams, onUrlSearchChange]);
+  const content = useMemo(() => {
+    const wrapItems = grid ? /*#__PURE__*/_jsx(RowWrapper, {
       children: items
     }) : items;
     if (contentRender) {
@@ -270,47 +233,46 @@ function BaseFormComponents(props) {
     }
     return wrapItems;
   }, [grid, RowWrapper, items, contentRender, submitterNode]);
-  var preInitialValues = usePrevious(props.initialValues);
+  const preInitialValues = usePrevious(props.initialValues);
 
   // 提示一个 initialValues ，问的人实在是太多了
-  useEffect(function () {
+  useEffect(() => {
     if (syncToUrl || !props.initialValues || !preInitialValues || rest.request) return;
-    var isEqual = isDeepEqualReact(props.initialValues, preInitialValues);
-    noteOnce(isEqual, "initialValues \u53EA\u5728 form \u521D\u59CB\u5316\u65F6\u751F\u6548\uFF0C\u5982\u679C\u4F60\u9700\u8981\u5F02\u6B65\u52A0\u8F7D\u63A8\u8350\u4F7F\u7528 request\uFF0C\u6216\u8005 initialValues ? <Form/> : null ");
-    noteOnce(isEqual, "The initialValues only take effect when the form is initialized, if you need to load asynchronously recommended request, or the initialValues ? <Form/> : null ");
+    const isEqual = isDeepEqualReact(props.initialValues, preInitialValues);
+    noteOnce(isEqual, `initialValues 只在 form 初始化时生效，如果你需要异步加载推荐使用 request，或者 initialValues ? <Form/> : null `);
+    noteOnce(isEqual, `The initialValues only take effect when the form is initialized, if you need to load asynchronously recommended request, or the initialValues ? <Form/> : null `);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [props.initialValues]);
 
   // 初始化给一个默认的 form
-  useImperativeHandle(propsFormRef, function () {
-    return _objectSpread(_objectSpread({}, formRef.current), {}, {
-      getFieldsFormatValue: function getFieldsFormatValue(allData, omitNilParam) {
-        var formInstance = formRef.current;
+  useImperativeHandle(propsFormRef, () => {
+    return {
+      ...formRef.current,
+      getFieldsFormatValue: (allData, omitNilParam) => {
+        const formInstance = formRef.current;
         if (!formInstance) {
           return {};
         }
-        var values = formInstance.getFieldsValue(allData);
+        const values = formInstance.getFieldsValue(allData);
         return transformKey(values, omitNilParam !== undefined ? omitNilParam : omitNil);
       },
-      getFieldFormatValue: function getFieldFormatValue() {
-        var paramsNameList = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-        var omitNilParam = arguments.length > 1 ? arguments[1] : undefined;
-        var formInstance = formRef.current;
+      getFieldFormatValue: (paramsNameList = [], omitNilParam) => {
+        const formInstance = formRef.current;
         if (!formInstance) {
           return undefined;
         }
-        var nameList = covertFormName(paramsNameList);
+        const nameList = covertFormName(paramsNameList);
         if (!nameList) throw new Error('nameList is require');
-        var value = formInstance.getFieldValue(nameList);
-        var obj = nameList ? set({}, nameList, value) : value;
+        const value = formInstance.getFieldValue(nameList);
+        const obj = nameList ? set({}, nameList, value) : value;
         //transformKey会将keys重新和nameList拼接，所以这里要将nameList的首个元素弹出
-        var newNameList = _toConsumableArray(nameList);
+        const newNameList = [...nameList];
         newNameList.shift();
-        var transformed = transformKey(obj, omitNilParam !== undefined ? omitNilParam : omitNil, newNameList);
-        var result = get(transformed, nameList);
+        const transformed = transformKey(obj, omitNilParam !== undefined ? omitNilParam : omitNil, newNameList);
+        const result = get(transformed, nameList);
         // 如果结果是对象，返回对象的值
-        if (result && _typeof(result) === 'object' && !Array.isArray(result)) {
-          var objValue = Object.values(result)[0];
+        if (result && typeof result === 'object' && !Array.isArray(result)) {
+          const objValue = Object.values(result)[0];
           // 如果对象的值是数组，返回数组
           if (Array.isArray(objValue)) {
             return objValue;
@@ -319,69 +281,46 @@ function BaseFormComponents(props) {
         }
         return result;
       },
-      getFieldFormatValueObject: function getFieldFormatValueObject(paramsNameList, omitNilParam) {
-        var formInstance = formRef.current;
+      getFieldFormatValueObject: (paramsNameList, omitNilParam) => {
+        const formInstance = formRef.current;
         if (!formInstance) {
           return {};
         }
-        var nameList = covertFormName(paramsNameList);
-        var value = formInstance.getFieldValue(nameList);
-        var obj = nameList ? set({}, nameList, value) : value;
+        const nameList = covertFormName(paramsNameList);
+        const value = formInstance.getFieldValue(nameList);
+        const obj = nameList ? set({}, nameList, value) : value;
         return transformKey(obj, omitNilParam !== undefined ? omitNilParam : omitNil, nameList);
       },
-      validateFieldsReturnFormatValue: function () {
-        var _validateFieldsReturnFormatValue2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(nameList, omitNilParam) {
-          var formInstance, values, transformedKey;
-          return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-            while (1) switch (_context2.prev = _context2.next) {
-              case 0:
-                formInstance = formRef.current;
-                if (formInstance) {
-                  _context2.next = 3;
-                  break;
-                }
-                return _context2.abrupt("return", {});
-              case 3:
-                if (!(!Array.isArray(nameList) && nameList)) {
-                  _context2.next = 5;
-                  break;
-                }
-                throw new Error('nameList must be array');
-              case 5:
-                _context2.next = 7;
-                return formInstance.validateFields(nameList);
-              case 7:
-                values = _context2.sent;
-                transformedKey = transformKey(values, omitNilParam !== undefined ? omitNilParam : omitNil);
-                return _context2.abrupt("return", transformedKey ? transformedKey : {});
-              case 10:
-              case "end":
-                return _context2.stop();
-            }
-          }, _callee2);
-        }));
-        function validateFieldsReturnFormatValue(_x3, _x4) {
-          return _validateFieldsReturnFormatValue2.apply(this, arguments);
+      validateFieldsReturnFormatValue: async (nameList, omitNilParam) => {
+        const formInstance = formRef.current;
+        if (!formInstance) {
+          return {};
         }
-        return validateFieldsReturnFormatValue;
-      }()
-    });
+        if (!Array.isArray(nameList) && nameList) throw new Error('nameList must be array');
+        const values = await formInstance.validateFields(nameList);
+        const transformedKey = transformKey(values, omitNilParam !== undefined ? omitNilParam : omitNil);
+        return transformedKey ? transformedKey : {};
+      }
+    };
   }, [omitNil, transformKey, formRef.current]);
-  useEffect(function () {
-    var _formRef$current3, _formRef$current3$get;
-    var finalValues = transformKey((_formRef$current3 = formRef.current) === null || _formRef$current3 === void 0 || (_formRef$current3$get = _formRef$current3.getFieldsValue) === null || _formRef$current3$get === void 0 ? void 0 : _formRef$current3$get.call(_formRef$current3, true), omitNil);
-    onInit === null || onInit === void 0 || onInit(finalValues, _objectSpread(_objectSpread({}, formRef.current), formatValues));
+  useEffect(() => {
+    const finalValues = transformKey(formRef.current?.getFieldsValue?.(true), omitNil);
+    onInit?.(finalValues, {
+      ...formRef.current,
+      ...formatValues
+    });
   }, []);
   return /*#__PURE__*/_jsx(ProFormContext.Provider, {
-    value: _objectSpread(_objectSpread({}, formatValues), {}, {
-      formRef: formRef
-    }),
+    value: {
+      ...formatValues,
+      formRef
+    },
     children: /*#__PURE__*/_jsx(ConfigProvider, {
       componentSize: rest.size || componentSize,
       children: /*#__PURE__*/_jsxs(GridContext.Provider, {
         value: {
-          grid: grid,
-          colProps: colProps
+          grid,
+          colProps
         },
         children: [rest.component !== false && /*#__PURE__*/_jsx("input", {
           type: "text",
@@ -395,236 +334,203 @@ function BaseFormComponents(props) {
 }
 
 /** 自动的formKey 防止重复 */
-var requestFormCacheId = 0;
+let requestFormCacheId = 0;
 export function BaseForm(props) {
-  var _props$extraUrlParams2 = props.extraUrlParams,
-    extraUrlParams = _props$extraUrlParams2 === void 0 ? defaultExtraUrlParams : _props$extraUrlParams2,
-    syncToUrl = props.syncToUrl,
-    isKeyPressSubmit = props.isKeyPressSubmit,
-    _props$syncToUrlAsImp = props.syncToUrlAsImportant,
-    syncToUrlAsImportant = _props$syncToUrlAsImp === void 0 ? false : _props$syncToUrlAsImp,
-    _props$syncToInitialV = props.syncToInitialValues,
-    syncToInitialValues = _props$syncToInitialV === void 0 ? true : _props$syncToInitialV,
-    children = props.children,
-    contentRender = props.contentRender,
-    submitter = props.submitter,
-    fieldProps = props.fieldProps,
-    proFieldProps = props.proFieldProps,
-    formItemProps = props.formItemProps,
-    groupProps = props.groupProps,
-    _props$dateFormatter = props.dateFormatter,
-    dateFormatter = _props$dateFormatter === void 0 ? 'string' : _props$dateFormatter,
-    propsFormRef = props.formRef,
-    onInit = props.onInit,
-    form = props.form,
-    formComponentType = props.formComponentType,
-    onReset = props.onReset,
-    grid = props.grid,
-    rowProps = props.rowProps,
-    colProps = props.colProps,
-    _props$omitNil2 = props.omitNil,
-    omitNil = _props$omitNil2 === void 0 ? true : _props$omitNil2,
-    request = props.request,
-    params = props.params,
-    initialValues = props.initialValues,
-    _props$formKey = props.formKey,
-    formKey = _props$formKey === void 0 ? requestFormCacheId : _props$formKey,
-    readonly = props.readonly,
-    onLoadingChange = props.onLoadingChange,
-    propsLoading = props.loading,
-    propRest = _objectWithoutProperties(props, _excluded2);
-  var formRef = useRef({});
-  var _useMountMergeState = useMountMergeState(false, {
-      onChange: onLoadingChange,
-      value: propsLoading
-    }),
-    _useMountMergeState2 = _slicedToArray(_useMountMergeState, 2),
-    loading = _useMountMergeState2[0],
-    setLoading = _useMountMergeState2[1];
-  var _useUrlSearchParams = useUrlSearchParams({}, {
-      disabled: !syncToUrl
-    }),
-    _useUrlSearchParams2 = _slicedToArray(_useUrlSearchParams, 2),
-    urlSearch = _useUrlSearchParams2[0],
-    setUrlSearch = _useUrlSearchParams2[1];
-  var curFormKey = useRef(nanoid());
-  useEffect(function () {
+  const {
+    extraUrlParams = defaultExtraUrlParams,
+    syncToUrl,
+    isKeyPressSubmit,
+    syncToUrlAsImportant = false,
+    syncToInitialValues = true,
+    children,
+    contentRender,
+    submitter,
+    fieldProps,
+    proFieldProps,
+    formItemProps,
+    groupProps,
+    dateFormatter = 'string',
+    formRef: propsFormRef,
+    onInit,
+    form,
+    formComponentType,
+    onReset,
+    grid,
+    rowProps,
+    colProps,
+    omitNil = true,
+    request,
+    params,
+    initialValues,
+    formKey = requestFormCacheId,
+    readonly,
+    onLoadingChange,
+    loading: propsLoading,
+    ...propRest
+  } = props;
+  const formRef = useRef({});
+  const [loading, setLoadingInner] = useControlledState(false, propsLoading);
+  const setLoading = useCallback(updater => {
+    setLoadingInner(prev => {
+      const next = typeof updater === 'function' ? updater(prev) : updater;
+      onLoadingChange?.(next);
+      return next;
+    });
+  }, [onLoadingChange]);
+  const [urlSearch, setUrlSearch] = useUrlSearchParams({}, {
+    disabled: !syncToUrl
+  });
+  const curFormKey = useRef(nanoid());
+  useEffect(() => {
     requestFormCacheId += 0;
   }, []);
-  var _useFetchData = useFetchData({
-      request: request,
-      params: params,
-      proFieldKey: formKey
-    }),
-    _useFetchData2 = _slicedToArray(_useFetchData, 2),
-    initialData = _useFetchData2[0],
-    initialDataLoading = _useFetchData2[1];
-  var _useContext = useContext(ConfigProvider.ConfigContext),
-    getPrefixCls = _useContext.getPrefixCls;
-  var prefixCls = getPrefixCls('pro-form');
+  const [initialData, initialDataLoading] = useFetchData({
+    request,
+    params,
+    proFieldKey: formKey
+  });
+  const {
+    getPrefixCls
+  } = useContext(ConfigProvider.ConfigContext);
+  const prefixCls = getPrefixCls('pro-form');
   // css
-  var _useStyle = useStyle('ProForm', function (token) {
-      return _defineProperty({}, ".".concat(prefixCls), _defineProperty({}, "> div:not(".concat(token.proComponentsCls, "-form-light-filter)"), {
-        '.pro-field': {
-          maxWidth: '100%',
-          '@media screen and (max-width: 575px)': {
-            // 减少了 form 的 padding
-            maxWidth: 'calc(93vw - 48px)'
-          },
-          // 适用于短数字，短文本或者选项
-          '&-xs': {
-            width: 104
-          },
-          '&-s': {
-            width: 216
-          },
-          // 适用于较短字段录入、如姓名、电话、ID 等。
-          '&-sm': {
-            width: 216
-          },
-          '&-m': {
-            width: 328
-          },
-          // 标准宽度，适用于大部分字段长度
-          '&-md': {
-            width: 328
-          },
-          '&-l': {
-            width: 440
-          },
-          // 适用于较长字段录入，如长网址、标签组、文件路径等。
-          '&-lg': {
-            width: 440
-          },
-          // 适用于长文本录入，如长链接、描述、备注等，通常搭配自适应多行输入框或定高文本域使用。
-          '&-xl': {
-            width: 552
+  const {
+    wrapSSR,
+    hashId
+  } = useStyle('ProForm', token => {
+    return {
+      [`.${prefixCls}`]: {
+        [`> div:not(${token.proComponentsCls}-form-light-filter)`]: {
+          '.pro-field': {
+            maxWidth: '100%',
+            '@media screen and (max-width: 575px)': {
+              // 减少了 form 的 padding
+              maxWidth: 'calc(93vw - 48px)'
+            },
+            // 适用于短数字，短文本或者选项
+            '&-xs': {
+              width: 104
+            },
+            '&-s': {
+              width: 216
+            },
+            // 适用于较短字段录入、如姓名、电话、ID 等。
+            '&-sm': {
+              width: 216
+            },
+            '&-m': {
+              width: 328
+            },
+            // 标准宽度，适用于大部分字段长度
+            '&-md': {
+              width: 328
+            },
+            '&-l': {
+              width: 440
+            },
+            // 适用于较长字段录入，如长网址、标签组、文件路径等。
+            '&-lg': {
+              width: 440
+            },
+            // 适用于长文本录入，如长链接、描述、备注等，通常搭配自适应多行输入框或定高文本域使用。
+            '&-xl': {
+              width: 552
+            }
           }
         }
-      }));
-    }),
-    wrapSSR = _useStyle.wrapSSR,
-    hashId = _useStyle.hashId;
+      }
+    };
+  });
 
   // 如果为 false，不需要触发设置进去
-  var _useState = useState(function () {
-      if (!syncToUrl) {
-        return {};
-      }
-      return genParams(syncToUrl, urlSearch, 'get');
-    }),
-    _useState2 = _slicedToArray(_useState, 2),
-    urlParamsMergeInitialValues = _useState2[0],
-    setUrlParamsMergeInitialValues = _useState2[1];
+  const [urlParamsMergeInitialValues, setUrlParamsMergeInitialValues] = useState(() => {
+    if (!syncToUrl) {
+      return {};
+    }
+    return genParams(syncToUrl, urlSearch, 'get');
+  });
 
   /** 保存 transformKeyRef，用于对表单key transform */
-  var transformKeyRef = useRef({});
-  var fieldsValueType = useRef({});
+  const transformKeyRef = useRef({});
+  const fieldsValueType = useRef({});
 
   /** 使用 callback 的类型 */
-  var transformKey = useRefFunction(function (values, paramsOmitNil, parentKey) {
-    if (!values || _typeof(values) !== 'object') {
+  const transformKey = useRefFunction((values, paramsOmitNil, parentKey) => {
+    if (!values || typeof values !== 'object') {
       return values;
     }
     return transformKeySubmitValue(conversionMomentValue(values, dateFormatter, fieldsValueType.current, paramsOmitNil, parentKey), transformKeyRef.current);
   });
-  useEffect(function () {
+  useEffect(() => {
     if (syncToInitialValues) return;
     setUrlParamsMergeInitialValues({});
   }, [syncToInitialValues]);
-  var getGenParams = useRefFunction(function () {
-    return _objectSpread(_objectSpread({}, urlSearch), extraUrlParams);
+  const getGenParams = useRefFunction(() => {
+    return {
+      ...urlSearch,
+      ...extraUrlParams
+    };
   });
-  useEffect(function () {
+  useEffect(() => {
     if (!syncToUrl) return;
     setUrlSearch(genParams(syncToUrl, getGenParams(), 'set'));
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [extraUrlParams, getGenParams, syncToUrl]);
-  var getPopupContainer = useMemo(function () {
+  const getPopupContainer = useMemo(() => {
     if (typeof window === 'undefined') return undefined;
     // 如果在 drawerForm 和  modalForm 里就渲染dom到父节点里
     // modalForm 可能高度太小不适合
     if (formComponentType && ['DrawerForm'].includes(formComponentType)) {
-      return function (e) {
-        return e.parentNode || document.body;
-      };
+      return e => e.parentNode || document.body;
     }
     return undefined;
   }, [formComponentType]);
-  var onFinish = useRefFunction( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
-    var _formRef$current4, _formRef$current4$get, finalValues, response, _formRef$current5, _formRef$current5$get, syncToUrlParams;
-    return _regeneratorRuntime().wrap(function _callee3$(_context3) {
-      while (1) switch (_context3.prev = _context3.next) {
-        case 0:
-          if (propRest.onFinish) {
-            _context3.next = 2;
-            break;
-          }
-          return _context3.abrupt("return");
-        case 2:
-          if (!loading) {
-            _context3.next = 4;
-            break;
-          }
-          return _context3.abrupt("return");
-        case 4:
-          _context3.prev = 4;
-          setLoading(true);
-          finalValues = (formRef === null || formRef === void 0 || (_formRef$current4 = formRef.current) === null || _formRef$current4 === void 0 || (_formRef$current4$get = _formRef$current4.getFieldsFormatValue) === null || _formRef$current4$get === void 0 ? void 0 : _formRef$current4$get.call(_formRef$current4)) || {};
-          response = propRest.onFinish(finalValues);
-          if (!(response && _typeof(response) === 'object' && typeof response.then === 'function')) {
-            _context3.next = 21;
-            break;
-          }
-          _context3.prev = 9;
-          _context3.next = 12;
-          return response;
-        case 12:
-          _context3.next = 18;
-          break;
-        case 14:
-          _context3.prev = 14;
-          _context3.t0 = _context3["catch"](9);
+  const onFinish = useRefFunction(async () => {
+    // 没设置 onFinish 就不执行
+    if (!propRest.onFinish) return;
+    // 防止重复提交
+    if (loading) return;
+    try {
+      setLoading(true);
+      const finalValues = formRef?.current?.getFieldsFormatValue?.() || {};
+      const response = propRest.onFinish(finalValues);
+      if (response && typeof response === 'object' && typeof response.then === 'function') {
+        try {
+          await response;
+        } catch (error) {
           // 确保在 Promise 被拒绝时也重置 loading 状态
           setLoading(false);
-          throw _context3.t0;
-        case 18:
-          // 只有在 Promise 成功完成时才重置 loading 状态
-          setLoading(false);
-          _context3.next = 22;
-          break;
-        case 21:
-          setLoading(false);
-        case 22:
-          if (syncToUrl) {
-            // 把没有的值设置为未定义可以删掉 url 的参数
-            syncToUrlParams = Object.keys((formRef === null || formRef === void 0 || (_formRef$current5 = formRef.current) === null || _formRef$current5 === void 0 || (_formRef$current5$get = _formRef$current5.getFieldsFormatValue) === null || _formRef$current5$get === void 0 ? void 0 : _formRef$current5$get.call(_formRef$current5, true, false)) || {}).reduce(function (pre, next) {
-              var _finalValues$next;
-              return _objectSpread(_objectSpread({}, pre), {}, _defineProperty({}, next, (_finalValues$next = finalValues[next]) !== null && _finalValues$next !== void 0 ? _finalValues$next : undefined));
-            }, extraUrlParams); // fix #3547: 当原先在url中存在的字段被删除时，应该将 params 中的该字段设置为 undefined,以便触发url同步删除
-            Object.keys(urlSearch).forEach(function (key) {
-              if (syncToUrlParams[key] !== false && syncToUrlParams[key] !== 0 && !syncToUrlParams[key]) {
-                syncToUrlParams[key] = undefined;
-              }
-            });
-            /** 在同步到 url 上时对参数进行转化 */
-            setUrlSearch(genParams(syncToUrl, syncToUrlParams, 'set'));
+          throw error;
+        }
+        // 只有在 Promise 成功完成时才重置 loading 状态
+        setLoading(false);
+      } else {
+        setLoading(false);
+      }
+      if (syncToUrl) {
+        // 把没有的值设置为未定义可以删掉 url 的参数
+        const syncToUrlParams = Object.keys(formRef?.current?.getFieldsFormatValue?.(true, false) || {}).reduce((pre, next) => {
+          return {
+            ...pre,
+            [next]: finalValues[next] ?? undefined
+          };
+        }, extraUrlParams);
+        // fix #3547: 当原先在url中存在的字段被删除时，应该将 params 中的该字段设置为 undefined,以便触发url同步删除
+        Object.keys(urlSearch).forEach(key => {
+          if (syncToUrlParams[key] !== false && syncToUrlParams[key] !== 0 && !syncToUrlParams[key]) {
+            syncToUrlParams[key] = undefined;
           }
-          _context3.next = 28;
-          break;
-        case 25:
-          _context3.prev = 25;
-          _context3.t1 = _context3["catch"](4);
-          setLoading(false);
-        case 28:
-        case "end":
-          return _context3.stop();
+        });
+        /** 在同步到 url 上时对参数进行转化 */
+        setUrlSearch(genParams(syncToUrl, syncToUrlParams, 'set'));
       }
-    }, _callee3, null, [[4, 25], [9, 14]]);
-  })));
+    } catch (error) {
+      setLoading(false);
+    }
+  });
 
   // 初始化给一个默认的 form
-  useImperativeHandle(propsFormRef, function () {
+  useImperativeHandle(propsFormRef, () => {
     return formRef.current;
   }, [!initialData]);
   if (request && initialDataLoading) {
@@ -645,19 +551,19 @@ export function BaseForm(props) {
       needDeps: true,
       children: /*#__PURE__*/_jsx(FieldContext.Provider, {
         value: {
-          formRef: formRef,
-          fieldProps: fieldProps,
-          proFieldProps: proFieldProps,
-          formItemProps: formItemProps,
-          groupProps: groupProps,
-          formComponentType: formComponentType,
-          getPopupContainer: getPopupContainer,
+          formRef,
+          fieldProps,
+          proFieldProps,
+          formItemProps,
+          groupProps,
+          formComponentType,
+          getPopupContainer,
           formKey: curFormKey.current,
-          setFieldValueType: function setFieldValueType(name, _ref4) {
-            var _ref4$valueType = _ref4.valueType,
-              valueType = _ref4$valueType === void 0 ? 'text' : _ref4$valueType,
-              dateFormat = _ref4.dateFormat,
-              transform = _ref4.transform;
+          setFieldValueType: (name, {
+            valueType = 'text',
+            dateFormat,
+            transform
+          }) => {
             if (!Array.isArray(name)) return;
 
             // Store transform function in the correct nested structure
@@ -665,47 +571,61 @@ export function BaseForm(props) {
               transformKeyRef.current = namePathSet(transformKeyRef.current, name, transform);
             }
             fieldsValueType.current = namePathSet(fieldsValueType.current, name, {
-              valueType: valueType,
-              dateFormat: dateFormat
+              valueType,
+              dateFormat
             });
           }
         },
         children: /*#__PURE__*/_jsx(FormListContext.Provider, {
           value: {},
-          children: /*#__PURE__*/_jsx(Form, _objectSpread(_objectSpread({
-            onKeyPress: function onKeyPress(event) {
+          children: /*#__PURE__*/_jsx(Form, {
+            onKeyPress: event => {
               if (!isKeyPressSubmit) return;
               if (event.key === 'Enter') {
-                var _formRef$current6;
-                (_formRef$current6 = formRef.current) === null || _formRef$current6 === void 0 || _formRef$current6.submit();
+                formRef.current?.submit();
               }
             },
             autoComplete: "off",
-            form: form
-          }, omit(propRest, ['ref', 'labelWidth', 'autoFocusFirstInput'])), {}, {
-            ref: function ref(instance) {
+            form: form,
+            ...omit(propRest, ['ref', 'labelWidth', 'autoFocusFirstInput']),
+            ref: instance => {
               if (!formRef.current) return;
-              formRef.current.nativeElement = instance === null || instance === void 0 ? void 0 : instance.nativeElement;
+              formRef.current.nativeElement = instance?.nativeElement;
+              formRef.current.focus = () => {
+                // 聚焦到表单的第一个输入框
+                const firstInput = instance?.nativeElement?.querySelector('input, textarea, select');
+                firstInput?.focus();
+              };
             }
             // 组合 urlSearch 和 initialValues
             ,
-            initialValues: syncToUrlAsImportant ? _objectSpread(_objectSpread(_objectSpread({}, initialValues), initialData), urlParamsMergeInitialValues) : _objectSpread(_objectSpread(_objectSpread({}, urlParamsMergeInitialValues), initialValues), initialData),
-            onValuesChange: function onValuesChange(changedValues, values) {
-              var _propRest$onValuesCha;
-              propRest === null || propRest === void 0 || (_propRest$onValuesCha = propRest.onValuesChange) === null || _propRest$onValuesCha === void 0 || _propRest$onValuesCha.call(propRest, transformKey(changedValues, !!omitNil), transformKey(values, !!omitNil));
+            initialValues: syncToUrlAsImportant ? {
+              ...initialValues,
+              ...initialData,
+              ...urlParamsMergeInitialValues
+            } : {
+              ...urlParamsMergeInitialValues,
+              ...initialValues,
+              ...initialData
             },
-            className: classNames(props.className, prefixCls, hashId),
+            onValuesChange: (changedValues, values) => {
+              propRest?.onValuesChange?.(transformKey(changedValues, !!omitNil), transformKey(values, !!omitNil));
+            },
+            className: clsx(props.className, prefixCls, hashId),
             onFinish: onFinish,
-            children: /*#__PURE__*/_jsx(BaseFormComponents, _objectSpread(_objectSpread({
+            children: /*#__PURE__*/_jsx(BaseFormComponents, {
               transformKey: transformKey,
               autoComplete: "off",
               loading: loading || !!(request && !initialData && initialDataLoading),
-              onUrlSearchChange: setUrlSearch
-            }, props), {}, {
+              onUrlSearchChange: setUrlSearch,
+              ...props,
               formRef: formRef,
-              initialValues: _objectSpread(_objectSpread({}, initialValues), initialData)
-            }))
-          }))
+              initialValues: {
+                ...initialValues,
+                ...initialData
+              }
+            })
+          })
         })
       })
     })