@ant-design/pro-components 3.1.12-0 → 3.1.13-0

package/lib/form/components/List/ListItem.js

@@ -25,6 +25,35 @@ const listToArray = children => {
   }
   return (0, _util.toArray)(children);
 };
+/**
+ * 统一渲染一个带 Tooltip 的操作 icon，内置 loading 状态。
+ * 消除 copyIcon/deleteIcon/upIcon/downIcon 四处结构重复。
+ *
+ * 这是一个纯渲染辅助函数（不含任何 hook），可以在条件分支中安全调用。
+ */
+function renderActionIcon({
+  iconProps,
+  defaultIcon: DefaultIcon,
+  actionClassName,
+  prefixCls,
+  hashId,
+  loading = false,
+  hidden = false,
+  onClick
+}) {
+  if (iconProps === false || hidden) return null;
+  const {
+    Icon = DefaultIcon,
+    tooltipText
+  } = iconProps ?? {};
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
+    title: tooltipText,
+    children: loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.LoadingOutlined, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
+      className: (0, _clsx.clsx)(`${prefixCls}-action-icon`, actionClassName, hashId),
+      onClick: onClick
+    })
+  });
+}
 const ProFormListItem = props => {
   const {
     creatorButtonProps,
@@ -75,14 +104,19 @@ const ProFormListItem = props => {
       unmountedRef.current = true;
     };
   }, []);
+  /** 当前行的字段路径，供 getCurrentRowData/setCurrentRowData/copyIcon/options.record 复用 */
+  const rowFieldPath = [listContext.listName, originName, field.name].filter(item => item !== undefined).flat(1);
+
+  /** 当前行（用 index 字符串，与 set 保持一致）的路径 */
+  const rowKeyPath = [listContext.listName, originName, index?.toString()].flat(1).filter(item => item !== null && item !== undefined);
   const getCurrentRowData = () => {
-    return formInstance.getFieldValue([listContext.listName, originName, index?.toString()].flat(1).filter(item => item !== null && item !== undefined));
+    return formInstance.getFieldValue(rowKeyPath);
   };
   const formListAction = {
     getCurrentRowData,
     setCurrentRowData: data => {
       const oldTableDate = formInstance?.getFieldsValue?.() || {};
-      const rowKeyName = [listContext.listName, originName, index?.toString()].flat(1).filter(item => item !== null && item !== undefined);
+      const rowKeyName = rowKeyPath;
       const updateValues = (0, _util.set)(oldTableDate, rowKeyName, {
         // 只是简单的覆盖，如果很复杂的话，需要自己处理
         ...getCurrentRowData(),
@@ -108,96 +142,62 @@ const ProFormListItem = props => {
     }
     return childrenItem;
   });
-  const copyIcon = (0, _react.useMemo)(() => {
-    if (mode === 'read') return null;
-    /** 复制按钮的配置 */
-    if (copyIconProps === false || max === count) return null;
-    const {
-      Icon = _icons.CopyOutlined,
-      tooltipText
-    } = copyIconProps;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
-      title: tooltipText,
-      children: loadingCopy ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.LoadingOutlined, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
-        className: (0, _clsx.clsx)(`${prefixCls}-action-icon action-copy`, hashId),
-        onClick: async () => {
-          setLoadingCopy(true);
-          const row = formInstance?.getFieldValue([listContext.listName, originName, field.name].filter(item => item !== undefined).flat(1));
-          await action.add(row, count);
-          setLoadingCopy(false);
-        }
-      })
-    }, "copy");
-  }, [copyIconProps, max, count, loadingCopy, prefixCls, hashId, formInstance, listContext.listName, field.name, originName, action]);
-  const deleteIcon = (0, _react.useMemo)(() => {
-    if (mode === 'read') return null;
-    if (deleteIconProps === false || min === count) return null;
-    const {
-      Icon = _icons.DeleteOutlined,
-      tooltipText
-    } = deleteIconProps;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
-      title: tooltipText,
-      children: loadingRemove ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.LoadingOutlined, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
-        className: (0, _clsx.clsx)(`${prefixCls}-action-icon action-remove`, hashId),
-        onClick: async () => {
-          setLoadingRemove(true);
-          await action.remove(field.name);
-          if (!unmountedRef.current) {
-            setLoadingRemove(false);
-          }
-        }
-      })
-    }, "delete");
-  }, [deleteIconProps, min, count, loadingRemove, prefixCls, hashId, action, field.name]);
-  const upIcon = (0, _react.useMemo)(() => {
-    if (!arrowSort) {
-      return null;
+  const isReadMode = mode === 'read';
+
+  // 4 个操作 icon 无条件调用 renderActionIcon（纯函数，无 hook），通过 hidden 控制是否渲染
+  const copyIcon = renderActionIcon({
+    iconProps: copyIconProps,
+    defaultIcon: _icons.CopyOutlined,
+    actionClassName: 'action-copy',
+    prefixCls,
+    hashId,
+    hidden: isReadMode || max === count,
+    loading: loadingCopy,
+    onClick: async () => {
+      setLoadingCopy(true);
+      const row = formInstance?.getFieldValue(rowFieldPath);
+      await action.add(row, count);
+      setLoadingCopy(false);
     }
-    if (mode === 'read') return null;
-    if (upIconProps === false) return null;
-    const toIndex = index - 1;
-    if (toIndex < 0) {
-      return null;
+  });
+  const deleteIcon = renderActionIcon({
+    iconProps: deleteIconProps,
+    defaultIcon: _icons.DeleteOutlined,
+    actionClassName: 'action-remove',
+    prefixCls,
+    hashId,
+    hidden: isReadMode || min === count,
+    loading: loadingRemove,
+    onClick: async () => {
+      setLoadingRemove(true);
+      await action.remove(field.name);
+      if (!unmountedRef.current) {
+        setLoadingRemove(false);
+      }
     }
-    const {
-      Icon = _icons.ArrowUpOutlined,
-      tooltipText
-    } = upIconProps;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
-      title: tooltipText,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
-        className: (0, _clsx.clsx)(`${prefixCls}-action-icon action-up`, hashId),
-        onClick: async () => {
-          await action.move(index, toIndex);
-        }
-      })
-    }, "up");
-  }, [upIconProps, prefixCls, hashId, action, arrowSort]);
-  const downIcon = (0, _react.useMemo)(() => {
-    if (!arrowSort) {
-      return null;
+  });
+  const upIcon = renderActionIcon({
+    iconProps: upIconProps,
+    defaultIcon: _icons.ArrowUpOutlined,
+    actionClassName: 'action-up',
+    prefixCls,
+    hashId,
+    hidden: isReadMode || !arrowSort || index <= 0,
+    onClick: async () => {
+      await action.move(index, index - 1);
     }
-    if (mode === 'read') return null;
-    if (downIconProps === false) return null;
-    const toIndex = index + 1;
-    if (toIndex >= count) {
-      return null;
+  });
+  const downIcon = renderActionIcon({
+    iconProps: downIconProps,
+    defaultIcon: _icons.ArrowDownOutlined,
+    actionClassName: 'action-down',
+    prefixCls,
+    hashId,
+    hidden: isReadMode || !arrowSort || index + 1 >= count,
+    onClick: async () => {
+      await action.move(index, index + 1);
     }
-    const {
-      Icon = _icons.ArrowDownOutlined,
-      tooltipText
-    } = downIconProps;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
-      title: tooltipText,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
-        className: (0, _clsx.clsx)(`${prefixCls}-action-icon action-down`, hashId),
-        onClick: async () => {
-          await action.move(index, toIndex);
-        }
-      })
-    }, "down");
-  }, [upIconProps, prefixCls, hashId, action, arrowSort]);
+  });
   const defaultActionDom = (0, _react.useMemo)(() => [copyIcon, deleteIcon, upIcon, downIcon].filter(item => item !== null && item !== undefined), [copyIcon, deleteIcon, upIcon, downIcon]);
   const actions = actionRender?.(field, action, defaultActionDom, count) || defaultActionDom;
   const dom = actions.length > 0 && mode !== 'read' ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -210,7 +210,7 @@ const ProFormListItem = props => {
     name: rest.name,
     field,
     index,
-    record: formInstance?.getFieldValue?.([listContext.listName, originName, field.name].filter(item => item !== undefined).flat(1)),
+    record: formInstance?.getFieldValue?.(rowFieldPath),
     fields,
     operation: action,
     meta
@@ -250,7 +250,7 @@ const ProFormListItem = props => {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.FormListContext.Provider, {
     value: {
       ...field,
-      listName: [listContext.listName, originName, field.name].filter(item => item !== undefined).flat(1)
+      listName: rowFieldPath
     },
     children: contentDom
   });

package/lib/form/components/List/index.js

@@ -123,6 +123,12 @@ function ProFormList(props) {
       transform
     });
   }, [props.name, setFieldValueType, transform]);
+
+  /** 当 isValidateList=true 时触发校验，提取消除 onAfterAdd/onAfterRemove 里的重复判断 */
+  const validateIfNeeded = () => {
+    if (!isValidateList) return;
+    proFormContext.formRef.current.validateFields([name]);
+  };
   const {
     wrapSSR,
     hashId
@@ -185,17 +191,11 @@ function ProFormList(props) {
                 max: max,
                 count: fields.length,
                 onAfterAdd: (defaultValue, insertIndex, count) => {
-                  if (isValidateList) {
-                    proFormContext.formRef.current.validateFields([name]);
-                  }
+                  validateIfNeeded();
                   onAfterAdd?.(defaultValue, insertIndex, count);
                 },
                 onAfterRemove: (index, count) => {
-                  if (isValidateList) {
-                    if (count === 0) {
-                      proFormContext.formRef.current.validateFields([name]);
-                    }
-                  }
+                  if (count === 0) validateIfNeeded();
                   onAfterRemove?.(index, count);
                 },
                 containerClassName: containerClassName,

package/lib/form/components/SchemaForm/index.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { FormSchema } from './typing';
 export * from './typing';
 /**
@@ -5,5 +6,5 @@ export * from './typing';
  *
  * @see 此组件仍为 beta 版本，api 可能发生变化
  */
-declare function BetaSchemaForm<T, ValueType = 'text'>(props: FormSchema<T, ValueType>): import("react/jsx-runtime").JSX.Element;
+declare function BetaSchemaForm<T, ValueType = 'text'>(props: FormSchema<T, ValueType>): React.JSX.Element;
 export default BetaSchemaForm;

package/lib/form/components/SchemaForm/index.js

@@ -13,7 +13,7 @@ var _ValueTypeToComponent = _interopRequireDefault(require("../../../field/Value
 var _provider = _interopRequireWildcard(require("../../../provider"));
 var _utils = require("../../../utils");
 var _DrawerForm = require("../../layouts/DrawerForm");
-var _LightFilter = require("../../layouts/LightFilter");
+var _LightFilter = _interopRequireDefault(require("../../layouts/LightFilter"));
 var _ModalForm = require("../../layouts/ModalForm");
 var _ProForm = require("../../layouts/ProForm");
 var _QueryFilter = require("../../layouts/QueryFilter");
@@ -36,7 +36,7 @@ Object.keys(_typing).forEach(function (key) {
 const FormLayoutType = {
   DrawerForm: _DrawerForm.DrawerForm,
   QueryFilter: _QueryFilter.QueryFilter,
-  LightFilter: _LightFilter.LightFilter,
+  LightFilter: _LightFilter.default,
   StepForm: _StepsForm.StepsForm.StepForm,
   StepsForm: _layoutType.StepsForm,
   ModalForm: _ModalForm.ModalForm,

package/lib/form/components/SchemaForm/layoutType/StepsForm.d.ts

@@ -5,5 +5,5 @@ type StepsFormProps<T, ValueType> = ProFormPropsType<T, ValueType> & Pick<FormSc
     layoutType: 'StepsForm';
     forceUpdate: React.Dispatch<React.SetStateAction<[]>>;
 } & Pick<ProFormGridConfig, 'grid'>;
-declare const StepsForm: <T, ValueType>({ steps, columns, forceUpdate, grid, ...props }: StepsFormProps<T, ValueType>) => import("react/jsx-runtime").JSX.Element;
+declare const StepsForm: <T, ValueType>({ steps, columns, forceUpdate, grid, ...props }: StepsFormProps<T, ValueType>) => React.JSX.Element;
 export default StepsForm;

package/lib/form/components/SchemaForm/valueType/dependency.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { ItemType, ProFormRenderValueTypeHelpers } from '../typing';
-export declare const dependency: <DataType, ValueType>(item: ItemType<DataType, ValueType>, helpers: ProFormRenderValueTypeHelpers<DataType, ValueType>) => true | import("react/jsx-runtime").JSX.Element | null;
+export declare const dependency: <DataType, ValueType>(item: ItemType<DataType, ValueType>, helpers: ProFormRenderValueTypeHelpers<DataType, ValueType>) => true | import("react").JSX.Element | null;

package/lib/form/components/SchemaForm/valueType/divider.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { ItemType } from '../typing';
-export declare const divider: <DataType, ValueType = "divider">(item: ItemType<DataType, ValueType>) => true | import("react/jsx-runtime").JSX.Element;
+export declare const divider: <DataType, ValueType = "divider">(item: ItemType<DataType, ValueType>) => true | import("react").JSX.Element;

package/lib/form/components/Select/index.d.ts

@@ -22,8 +22,6 @@ export type ProFormSelectProps<ValueType = any, OptionType extends BaseOptionTyp
      * @default true
      */
     fetchDataOnSearch?: boolean;
-    /** 自定义选项渲染 */
-    optionItemRender?: (item: ValueType) => React.ReactNode;
 }, RefSelectProps> & {
     options?: SelectProps<ValueType, OptionType>['options'] | string[];
     mode?: SelectProps<ValueType, OptionType>['mode'] | 'single';

package/lib/form/components/UploadButton/index.d.ts

@@ -1,5 +1,5 @@
 import type { ButtonProps, ImageProps, UploadProps } from 'antd';
-import type { UploadRef } from 'antd/es/upload';
+import type { UploadRef } from 'antd/es/upload/Upload';
 import React from 'react';
 import type { ProFormFieldItemProps } from '../../typing';
 type PickUploadProps = Pick<UploadProps, 'listType' | 'action' | 'accept' | 'fileList' | 'onChange'>;

package/lib/form/index.d.ts

@@ -2,15 +2,17 @@ import { GridContext } from './helpers';
 import { ProForm } from './layouts';
 import type { ProFormGroupProps } from './typing';
 export { ProFormContext } from '../utils';
-export { LightWrapper } from './BaseForm';
-export type { LightWrapperProps, ProFormInstance } from './BaseForm';
+export { LightWrapper } from './layouts/LightFilter/LightWrapper';
+export type { LightWrapperProps } from './layouts/LightFilter/LightWrapper';
+export type { ProFormInstance } from './BaseForm';
 export type { SubmitterProps } from './BaseForm/Submitter';
 export * from './components';
 export type { FormListActionType, ProFormCaptchaProps, ProFormCheckboxGroupProps, ProFormCheckboxProps, ProFormColorPickerProps, ProFormColumnsType, ProFormDependencyProps, ProFormDigitProps, ProFormDigitRangeProps, ProFormFieldProps, ProFormFieldSetProps, ProFormLayoutType, ProFormListProps, ProFormMoneyProps, ProFormRadioGroupProps, ProFormSelectProps, ProFormSliderProps, ProFormSwitchProps, ProFormTreeSelectProps, ProFormUploadButtonProps, ProFormUploadDraggerProps, } from './components';
 export { FormListContext } from './components/List';
 export { FieldContext } from './FieldContext';
 export * from './layouts';
-export type { LightFilterFooterRender, ProFormFieldItemProps as ProFormItemProps, } from './typing';
+export type { LightFilterFooterRender, ProFormFieldItemProps as ProFormItemProps, ProFieldBuiltinValueType, ProFieldSchemaLayoutValueType, ProFieldValueObjectType, ProFieldValueType, ProFieldValueTypeInput, } from './typing';
+export { PRO_FIELD_SCHEMA_LAYOUT_VALUE_TYPES } from './typing';
 export { GridContext, ProForm };
 export type { ProFormGroupProps as GroupProps };
 export default ProForm;

package/lib/form/index.js

@@ -9,7 +9,8 @@ var _exportNames = {
   ProFormContext: true,
   LightWrapper: true,
   FormListContext: true,
-  FieldContext: true
+  FieldContext: true,
+  PRO_FIELD_SCHEMA_LAYOUT_VALUE_TYPES: true
 };
 Object.defineProperty(exports, "FieldContext", {
   enumerable: true,
@@ -32,7 +33,13 @@ Object.defineProperty(exports, "GridContext", {
 Object.defineProperty(exports, "LightWrapper", {
   enumerable: true,
   get: function () {
-    return _BaseForm.LightWrapper;
+    return _LightWrapper.LightWrapper;
+  }
+});
+Object.defineProperty(exports, "PRO_FIELD_SCHEMA_LAYOUT_VALUE_TYPES", {
+  enumerable: true,
+  get: function () {
+    return _typing.PRO_FIELD_SCHEMA_LAYOUT_VALUE_TYPES;
   }
 });
 Object.defineProperty(exports, "ProForm", {
@@ -62,7 +69,7 @@ Object.keys(_layouts).forEach(function (key) {
   });
 });
 var _utils = require("../utils");
-var _BaseForm = require("./BaseForm");
+var _LightWrapper = require("./layouts/LightFilter/LightWrapper");
 var _components = require("./components");
 Object.keys(_components).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -77,4 +84,5 @@ Object.keys(_components).forEach(function (key) {
 });
 var _List = require("./components/List");
 var _FieldContext = require("./FieldContext");
+var _typing = require("./typing");
 var _default = exports.default = _layouts.ProForm;

package/lib/form/layouts/DrawerForm/index.js

@@ -9,9 +9,9 @@ var _util = require("@rc-component/util");
 var _antd = require("antd");
 var _clsx = require("clsx");
 var _react = _interopRequireWildcard(require("react"));
-var _reactDom = require("react-dom");
 var _utils = require("../../../utils");
 var _BaseForm = require("../../BaseForm");
+var _useOverlayForm = require("../_shared/useOverlayForm");
 var _style = require("./style");
 var _jsxRuntime = require("react/jsx-runtime");
 const {
@@ -38,11 +38,7 @@ function DrawerForm({
       minWidth: 300
     };
     if (typeof resize === 'boolean') {
-      if (resize) {
-        return defaultResize;
-      } else {
-        return {};
-      }
+      return resize ? defaultResize : {};
     }
     return (0, _utils.omitUndefined)({
       onResize: resize?.onResize ?? defaultResize.onResize,
@@ -57,143 +53,34 @@ function DrawerForm({
     hashId
   } = (0, _style.useStyle)(baseClassName);
   const getCls = className => `${baseClassName}-${className}`;
-  const [, forceUpdate] = (0, _react.useState)([]);
-  const [loading, setLoading] = (0, _react.useState)(false);
-  const [resizableDrawer, setResizableDrawer] = (0, _react.useState)(false);
   const [drawerWidth, setDrawerWidth] = (0, _react.useState)(width ? width : resize ? resizeInfo?.minWidth : 800);
-  const [open, setOpenInner] = (0, _util.useControlledState)(!!propsOpen, propsOpen);
-
-  /**
-   * 使用 useRefFunction 包装回调，确保引用稳定
-   */
-  const onOpenChangeCallback = (0, _utils.useRefFunction)(o => {
-    onOpenChange?.(o);
-  });
-
-  /**
-   * 使用 queueMicrotask 延迟回调调用，避免在渲染阶段调用外部回调导致的 React 警告
-   * "Cannot update a component while rendering a different component"
-   */
-  const setOpen = (0, _react.useCallback)(updater => {
-    setOpenInner(prev => {
-      const next = typeof updater === 'function' ? updater(prev) : updater;
-      queueMicrotask(() => {
-        onOpenChangeCallback(next);
-      });
-      return next;
-    });
-  }, [onOpenChangeCallback]);
-  const footerRef = (0, _react.useRef)(null);
-  const footerDomRef = (0, _react.useCallback)(element => {
-    if (footerRef.current === null && element) {
-      forceUpdate([]);
-    }
-    footerRef.current = element;
-  }, []);
   const formRef = (0, _react.useRef)();
-  const resetFields = (0, _react.useCallback)(() => {
-    const form = rest.formRef?.current ?? rest.form ?? formRef.current;
-    // 重置表单
-    // issue: 8858 form.resetFields is not a function
-    if (form && drawerProps?.destroyOnHidden && typeof form.resetFields === 'function') {
-      form.resetFields();
-    }
-  }, [drawerProps?.destroyOnHidden, rest.form, rest.formRef]);
-  (0, _react.useEffect)(() => {
-    if (open && propsOpen) {
-      onOpenChange?.(true);
-    }
-    if (resizableDrawer) {
-      setDrawerWidth(resizeInfo?.minWidth);
-    }
-  }, [propsOpen, open, resizableDrawer]);
-  (0, _react.useImperativeHandle)(rest.formRef, () => {
-    return formRef.current;
-  }, [formRef.current]);
-  const triggerDom = (0, _react.useMemo)(() => {
-    if (!trigger) {
-      return null;
-    }
-    return /*#__PURE__*/_react.default.cloneElement(trigger, {
-      key: 'trigger',
-      ...trigger.props,
-      onClick: async e => {
-        setOpen(!open);
-        setResizableDrawer(!Object.keys(resizeInfo));
-        trigger.props?.onClick?.(e);
-      }
-    });
-  }, [setOpen, trigger, open, setResizableDrawer, resizableDrawer]);
-  const submitterConfig = (0, _react.useMemo)(() => {
-    if (rest.submitter === false) {
-      return false;
-    }
-    return (0, _util.merge)({
-      searchConfig: {
-        submitText: context.locale?.Modal?.okText ?? '确认',
-        resetText: context.locale?.Modal?.cancelText ?? '取消'
-      },
-      resetButtonProps: {
-        preventDefault: true,
-        disabled: submitTimeout && loading,
-        onClick: e => {
-          setOpen(false);
-          drawerProps?.onClose?.(e);
-        }
-      }
-    }, rest.submitter ?? {});
-  }, [rest.submitter, context.locale?.Modal?.okText, context.locale?.Modal?.cancelText, submitTimeout, loading, setOpen, drawerProps]);
-  const contentRender = (0, _react.useCallback)((formDom, submitter) => {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [formDom, footerRef.current && submitter ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.default.Fragment, {
-        children: /*#__PURE__*/(0, _reactDom.createPortal)(submitter, footerRef.current)
-      }, "submitter") : submitter]
-    });
-  }, []);
-  const onFinishHandle = (0, _utils.useRefFunction)(async values => {
-    const response = onFinish?.(values);
-    if (submitTimeout && response instanceof Promise) {
-      setLoading(true);
-      const timer = setTimeout(() => setLoading(false), submitTimeout);
-      try {
-        const result = await response;
-        clearTimeout(timer);
-        setLoading(false);
-        // 返回真值，关闭弹框
-        if (result) {
-          setOpen(false);
-        }
-        return result;
-      } catch (error) {
-        clearTimeout(timer);
-        setLoading(false);
-        throw error;
-      }
-    } else if (submitTimeout) {
-      // 如果 submitTimeout 存在但 response 不是 Promise，也要设置 loading
-      setLoading(true);
-      const timer = setTimeout(() => setLoading(false), submitTimeout);
-      try {
-        const result = await response;
-        clearTimeout(timer);
-        setLoading(false);
-        // 返回真值，关闭弹框
-        if (result) {
-          setOpen(false);
-        }
-        return result;
-      } catch (error) {
-        clearTimeout(timer);
-        setLoading(false);
-        throw error;
-      }
-    }
-    const result = await response;
-    // 返回真值，关闭弹框
-    if (result) {
-      setOpen(false);
-    }
-    return result;
+  const {
+    open,
+    setOpen,
+    loading,
+    footerDomRef,
+    footerRef,
+    triggerDom,
+    submitterConfig,
+    contentRender,
+    onFinishHandle,
+    resetFields
+  } = (0, _useOverlayForm.useOverlayForm)({
+    propsOpen,
+    onOpenChange,
+    formRef,
+    propsFormRef: rest.formRef,
+    destroyOnHidden: drawerProps?.destroyOnHidden,
+    submitTimeout,
+    onFinish,
+    onCloseExtra: drawerProps?.onClose,
+    submitter: rest.submitter,
+    searchConfig: {
+      submitText: context.locale?.Modal?.okText ?? '确认',
+      resetText: context.locale?.Modal?.cancelText ?? '取消'
+    },
+    trigger
   });
   const cbHandleMouseMove = (0, _react.useCallback)(e => {
     const offsetRight = (document.body.offsetWidth || 1000) - (e.clientX - document.body.offsetLeft);
@@ -220,15 +107,15 @@ function DrawerForm({
       title: title,
       size: typeof drawerWidth === 'number' ? drawerWidth : drawerWidth,
       open: open,
-      afterOpenChange: open => {
-        if (!open && drawerProps?.destroyOnHidden) {
+      afterOpenChange: nextOpen => {
+        // fix: #6006 destroyOnHidden 时在抽屉关闭后重置，避免关闭过程中闪烁
+        if (!nextOpen && drawerProps?.destroyOnHidden) {
           resetFields();
         }
-        drawerProps?.afterOpenChange?.(open);
-        onOpenChange?.(open);
+        drawerProps?.afterOpenChange?.(nextOpen);
       },
       onClose: e => {
-        // 提交表单loading时，阻止弹框关闭
+        // 提交时 loading，阻止关闭
         if (submitTimeout && loading) return;
         setOpen(false);
         drawerProps?.onClose?.(e);
@@ -251,30 +138,27 @@ function DrawerForm({
           e.preventDefault();
           document.addEventListener('mousemove', cbHandleMouseMove);
           document.addEventListener('mouseup', cbHandleMouseUp);
-          setResizableDrawer(true);
         }
-      }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_BaseForm.BaseForm, {
-          formComponentType: "DrawerForm",
-          layout: "vertical",
-          ...rest,
-          formRef: formRef,
-          onInit: (_, form) => {
-            if (rest.formRef) {
-              rest.formRef.current = form;
-            }
-            rest?.onInit?.(_, form);
-            formRef.current = form;
-          },
-          submitter: submitterConfig,
-          onFinish: async values => {
-            const result = await onFinishHandle(values);
-            // fix: #6006 如果 result 为 true,那么必然会触发抽屉关闭，我们无需在 此处重置表单，只需在抽屉关闭时重置即可
-            return result;
-          },
-          contentRender: contentRender,
-          children: children
-        })
+      }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_BaseForm.BaseForm, {
+        formComponentType: "DrawerForm",
+        layout: "vertical",
+        ...rest,
+        formRef: formRef,
+        onInit: (_, form) => {
+          if (rest.formRef) {
+            rest.formRef.current = form;
+          }
+          rest?.onInit?.(_, form);
+          formRef.current = form;
+        },
+        submitter: submitterConfig,
+        onFinish: async values => {
+          // fix: #6006 result 为 true 时抽屉关闭由 onFinishHandle 内部处理，
+          // 无需在此重置，等 afterOpenChange 触发时再重置
+          return onFinishHandle(values);
+        },
+        contentRender: contentRender,
+        children: children
       })]
     }), triggerDom]
   }));