@ant-design/pro-components 3.1.1-1 → 3.1.3-0

package/es/utils/useSelection.js

@@ -0,0 +1,86 @@
+import { Checkbox, Radio } from 'antd';
+import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+function useSelection(config, rowSelection) {
+  const {
+    getRowKey,
+    data
+  } = config;
+  const controlledKeys = rowSelection?.selectedRowKeys;
+  const [innerKeys, setInnerKeys] = React.useState(controlledKeys || []);
+
+  // Keep in sync with controlled keys
+  React.useEffect(() => {
+    if (controlledKeys) {
+      setInnerKeys(controlledKeys);
+    }
+  }, [controlledKeys && controlledKeys.join(';')]);
+  const selectedKeySet = React.useMemo(() => new Set(innerKeys), [innerKeys]);
+  const toggleKey = React.useCallback((key, record, checked) => {
+    setInnerKeys(prevKeys => {
+      if (rowSelection?.type === 'radio') {
+        const nextKeys = [key];
+        const selectedRows = [record];
+        rowSelection?.onChange?.(nextKeys, selectedRows, {
+          type: 'single',
+          selectedRows,
+          selectedRowKeys: nextKeys
+        });
+        rowSelection?.onSelect?.(record, checked, selectedRows, {});
+        if (!controlledKeys) {
+          return nextKeys;
+        }
+        return prevKeys;
+      }
+      const prevSet = new Set(prevKeys);
+      const next = new Set(prevSet);
+      if (checked) {
+        next.add(key);
+      } else {
+        next.delete(key);
+      }
+      const nextKeys = Array.from(next);
+
+      // Fire callbacks similar to antd rowSelection
+      const selectedRows = data.filter((item, idx) => next.has(getRowKey(item, idx)));
+      rowSelection?.onChange?.(nextKeys, selectedRows, {
+        type: 'multiple',
+        selectedRows,
+        selectedRowKeys: nextKeys
+      });
+      rowSelection?.onSelect?.(record, checked, data.filter((item, idx) => next.has(getRowKey(item, idx))), {});
+      if (!controlledKeys) {
+        return nextKeys;
+      }
+      return prevKeys;
+    });
+  }, [data, getRowKey, rowSelection, controlledKeys]);
+  const selectItemRender = React.useCallback(columns => {
+    void columns;
+    if (!rowSelection) {
+      return [];
+    }
+    return [{
+      render: (_text, record, index) => {
+        const key = getRowKey(record, index);
+        const checked = selectedKeySet.has(key);
+        if (rowSelection?.type === 'radio') {
+          return /*#__PURE__*/_jsx(Radio, {
+            checked: checked,
+            onChange: e => {
+              toggleKey(key, record, e.target.checked);
+            }
+          });
+        }
+        return /*#__PURE__*/_jsx(Checkbox, {
+          checked: checked,
+          onChange: e => {
+            toggleKey(key, record, e.target.checked);
+          }
+        });
+      }
+    }];
+  }, [getRowKey, selectedKeySet, toggleKey, rowSelection?.type]);
+  return [selectItemRender, selectedKeySet];
+}
+export default useSelection;

package/lib/card/components/Card/index.js

@@ -68,13 +68,27 @@ const Card = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     xxl: false
   };
   const [collapsed, setCollapsedInner] = (0, _util.useControlledState)(defaultCollapsed, controlCollapsed);
+
+  /**
+   * 使用 useRefFunction 包装回调，确保引用稳定
+   */
+  const onCollapseCallback = (0, _utils.useRefFunction)(c => {
+    onCollapse?.(c);
+  });
+
+  /**
+   * 使用 queueMicrotask 延迟回调调用，避免在渲染阶段调用外部回调导致的 React 警告
+   * "Cannot update a component while rendering a different component"
+   */
   const setCollapsed = (0, _react.useCallback)(updater => {
     setCollapsedInner(prev => {
       const next = typeof updater === 'function' ? updater(prev) : updater;
-      onCollapse?.(next);
+      queueMicrotask(() => {
+        onCollapseCallback(next);
+      });
       return next;
     });
-  }, [onCollapse]);
+  }, [onCollapseCallback]);
 
   // 顺序决定如何进行响应式取值，按最大响应值依次取值，请勿修改。
   const responsiveArray = ['xxl', 'xl', 'lg', 'md', 'sm', 'xs'];

package/lib/descriptions/index.d.ts

@@ -9,8 +9,6 @@ export interface DescriptionsItemProps {
     className?: string;
     style?: React.CSSProperties;
     label?: React.ReactNode;
-    labelStyle?: React.CSSProperties;
-    contentStyle?: React.CSSProperties;
     children: React.ReactNode;
     span?: number;
 }

package/lib/descriptions/index.js

@@ -17,8 +17,6 @@ var _skeleton = _interopRequireDefault(require("../skeleton"));
 var _utils = require("../utils");
 var _useFetchData = _interopRequireDefault(require("./useFetchData"));
 var _jsxRuntime = require("react/jsx-runtime");
-// todo remove it
-
 /**
  * 定义列表属性的类型定义，用于定义列表的一列
  * @typedef {Object} ProDescriptionsItemProps
@@ -304,7 +302,6 @@ const ProDescriptions = props => {
     actionRef,
     onRequestError,
     emptyText,
-    contentStyle,
     ...rest
   } = props;
   const proContext = (0, _react.useContext)(_provider.default);
@@ -422,8 +419,7 @@ const ProDescriptions = props => {
           ...rest,
           styles: {
             content: {
-              minWidth: 0,
-              ...(contentStyle || {})
+              minWidth: 0
             }
           },
           extra: rest.extra ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Space, {

package/lib/descriptions/useFetchData.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _util = require("@rc-component/util");
 var _react = require("react");
+var _utils = require("../utils");
 const useFetchData = (getData, options) => {
   const {
     onRequestError,
@@ -24,13 +25,27 @@ const useFetchData = (getData, options) => {
     });
   }, [onDataSourceChange]);
   const [loading, setLoadingInner] = (0, _util.useControlledState)(options?.loading, options?.loading);
+
+  /**
+   * 使用 useRefFunction 包装回调，确保引用稳定
+   */
+  const onLoadingChange = (0, _utils.useRefFunction)(l => {
+    options?.onLoadingChange?.(l);
+  });
+
+  /**
+   * 包装 setLoading，使用 queueMicrotask 延迟回调调用
+   * 避免在渲染阶段调用外部回调导致的 React 警告
+   */
   const setLoading = (0, _react.useCallback)(updater => {
     setLoadingInner(prev => {
       const next = typeof updater === 'function' ? updater(prev) : updater;
-      options?.onLoadingChange?.(next);
+      queueMicrotask(() => {
+        onLoadingChange(next);
+      });
       return next;
     });
-  }, [options?.onLoadingChange]);
+  }, [onLoadingChange]);
   const updateDataAndLoading = data => {
     setEntity(data);
     setLoading(false);

package/lib/field/components/Cascader/index.js

@@ -20,7 +20,6 @@ var _jsxRuntime = require("react/jsx-runtime");
  * @param ref
  */
 const FieldCascader = ({
-  radioType,
   placeholder,
   formItemRender,
   mode,
@@ -85,7 +84,6 @@ const FieldCascader = ({
   if (mode === 'edit') {
     const fieldProps = rest.fieldProps || {};
     let dom = /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Cascader, {
-      variant: !light ? variant : 'borderless',
       ref: cascaderRef,
       open: open,
       suffixIcon: loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.LoadingOutlined, {}) : undefined,

package/lib/field/components/Checkbox/index.js

@@ -107,6 +107,7 @@ const FieldCheckbox = ({
   if (mode === 'edit') {
     const {
       fieldNames,
+      variant,
       ...restFieldProps
     } = rest.fieldProps || {};
     const dom = wrapSSR(
@@ -114,6 +115,7 @@ const FieldCheckbox = ({
     //@ts-ignore
     (0, _jsxRuntime.jsx)(_antd.Checkbox.Group, {
       ...restFieldProps,
+      variant: variant,
       className: (0, _clsx.clsx)(rest.fieldProps?.className, hashId, `${layoutClassName}-${layout}`, {
         [`${layoutClassName}-error`]: status?.status === 'error',
         [`${layoutClassName}-warning`]: status?.status === 'warning'

package/lib/field/components/Code/index.js

@@ -34,7 +34,6 @@ const FieldCode = ({
   render,
   language = 'text',
   formItemRender,
-  plain,
   fieldProps
 }, ref) => {
   const code = languageFormat(text, language);
@@ -72,17 +71,11 @@ const FieldCode = ({
   }
   if (mode === 'edit' || mode === 'update') {
     fieldProps.value = code;
-    let dom = /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Input.TextArea, {
+    const dom = /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Input.TextArea, {
       rows: 5,
       ...fieldProps,
       ref: ref
     });
-    if (plain) {
-      dom = /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Input, {
-        ...fieldProps,
-        ref: ref
-      });
-    }
     if (formItemRender) {
       return formItemRender(code, {
         mode,

package/lib/field/components/DatePicker/index.js

@@ -36,12 +36,11 @@ const FieldDatePicker = ({
   light,
   render,
   formItemRender,
-  plain,
   showTime,
   fieldProps,
   picker,
-  variant,
-  lightLabel
+  lightLabel,
+  variant
 }, ref) => {
   const intl = (0, _provider.useIntl)();
   const [open, setOpen] = (0, _react.useState)(false);
@@ -89,7 +88,6 @@ const FieldDatePicker = ({
             setOpen(isOpen);
             fieldProps?.onOpenChange?.(isOpen);
           },
-          variant: "borderless",
           open: open
         }) : undefined,
         allowClear: false,
@@ -103,7 +101,7 @@ const FieldDatePicker = ({
         showTime: showTime,
         format: format,
         placeholder: placeholder,
-        variant: plain === undefined ? variant : plain ? 'borderless' : 'outlined',
+        variant: variant,
         ref: ref,
         ...fieldProps,
         value: dayValue

package/lib/field/components/FromNow/index.d.ts

@@ -2,5 +2,6 @@ import React from 'react';
 declare const _default: React.ForwardRefExoticComponent<import("../../../provider").BaseProFieldFC & import("../../../provider").ProRenderFieldPropsType & {
     text: string;
     format?: string | undefined;
+    variant?: "outlined" | "filled" | "borderless" | "underlined" | undefined;
 } & React.RefAttributes<any>>;
 export default _default;

package/lib/field/components/FromNow/index.js

@@ -21,7 +21,7 @@ _dayjs.default.extend(_relativeTime.default);
 const FieldFromNow = ({
   text,
   mode,
-  plain,
+  variant,
   render,
   formItemRender,
   format,
@@ -52,7 +52,7 @@ const FieldFromNow = ({
       ref: ref,
       placeholder: placeholder,
       showTime: true,
-      variant: plain === undefined ? 'outlined' : plain ? 'borderless' : 'outlined',
+      variant: variant ?? fieldProps?.variant ?? 'outlined',
       ...fieldProps,
       value: momentValue
     });

package/lib/field/components/Money/index.js

@@ -172,7 +172,6 @@ const FieldMoney = ({
   formItemRender,
   fieldProps,
   proFieldKey,
-  plain,
   valueEnum,
   placeholder,
   locale,

package/lib/field/components/Progress/index.js

@@ -33,7 +33,6 @@ const FieldProgress = ({
   text,
   mode,
   render,
-  plain,
   formItemRender,
   fieldProps,
   placeholder
@@ -50,7 +49,7 @@ const FieldProgress = ({
         maxWidth: 320
       },
       percent: realValue,
-      steps: plain ? 10 : undefined,
+      steps: fieldProps?.steps,
       status: getProgressStatus(realValue),
       ...fieldProps
     });

package/lib/field/components/RangePicker/index.js

@@ -26,10 +26,9 @@ const FieldRangePicker = ({
   render,
   picker,
   formItemRender,
-  plain,
   showTime,
   lightLabel,
-  variant,
+  variant: propsVariant,
   fieldProps
 }, ref) => {
   const intl = (0, _provider.useIntl)();
@@ -94,14 +93,8 @@ const FieldRangePicker = ({
           picker: picker,
           showTime: showTime,
           format: format,
-          variant: "borderless",
           ...fieldProps,
-          placeholder: fieldProps.placeholder ?? [intl.getMessage('tableForm.selectPlaceholder', '请选择'), intl.getMessage('tableForm.selectPlaceholder', '请选择')]
-          // onClear={() => {
-          //   setOpen(false);
-          //   fieldProps?.onClear?.();
-          // }}
-          ,
+          placeholder: fieldProps.placeholder ?? [intl.getMessage('tableForm.selectPlaceholder', '请选择'), intl.getMessage('tableForm.selectPlaceholder', '请选择')],
           value: dayValue,
           onOpenChange: isOpen => {
             if (dayValue) setOpen(isOpen);
@@ -109,8 +102,8 @@ const FieldRangePicker = ({
           },
           onChange: handleRangeChange
         }) : null,
+        variant: propsVariant,
         allowClear: false,
-        variant: variant,
         ref: lightLabel,
         downIcon: dayValue || open ? false : undefined
       });
@@ -120,7 +113,6 @@ const FieldRangePicker = ({
         format: format,
         showTime: showTime,
         placeholder: [intl.getMessage('tableForm.selectPlaceholder', '请选择'), intl.getMessage('tableForm.selectPlaceholder', '请选择')],
-        variant: plain === undefined ? variant : plain ? 'borderless' : 'outlined',
         ...fieldProps,
         value: dayValue
       });

package/lib/field/components/Select/LightSelect/index.d.ts

@@ -15,6 +15,7 @@ export type LightSelectProps = {
     fetchDataOnSearch?: boolean;
     /** 变体类型 */
     variant?: 'outlined' | 'borderless' | 'filled' | 'underlined';
+    labelVariant?: 'outlined' | 'borderless' | 'filled' | 'underlined';
 } & ProFieldLightProps & SelectProps;
 export declare const LightSelect: React.ForwardRefRenderFunction<any, SelectProps<any> & LightSelectProps>;
 declare const _default: React.ForwardRefExoticComponent<SelectProps<any, import("antd/es/select").DefaultOptionType> & {
@@ -31,5 +32,6 @@ declare const _default: React.ForwardRefExoticComponent<SelectProps<any, import(
     fetchDataOnSearch?: boolean | undefined;
     /** 变体类型 */
     variant?: "outlined" | "filled" | "borderless" | "underlined" | undefined;
+    labelVariant?: "outlined" | "filled" | "borderless" | "underlined" | undefined;
 } & ProFieldLightProps & SelectProps<any, import("antd/es/select").DefaultOptionType> & React.RefAttributes<any>>;
 export default _default;

package/lib/field/components/Select/LightSelect/index.js

@@ -32,6 +32,7 @@ const LightSelect = (props, ref) => {
     value,
     mode,
     defaultValue,
+    labelVariant,
     size,
     showSearch,
     disabled,
@@ -78,6 +79,7 @@ const LightSelect = (props, ref) => {
           width: '153px',
           height: '28px',
           visibility: 'hidden',
+          opacity: 0,
           '&-selector': {
             height: 28
           }
@@ -206,7 +208,7 @@ const LightSelect = (props, ref) => {
       label: label,
       placeholder: placeholder,
       disabled: disabled,
-      variant: variant,
+      variant: labelVariant,
       allowClear: !!allowClear,
       value: filterValue || value?.label || value,
       onClear: () => {

package/lib/field/components/Select/index.js

@@ -190,10 +190,8 @@ const useFieldFetchData = props => {
     keyWords: kw
   }, props), {
     revalidateIfStale: !cacheForSwr,
-    // 打开 cacheForSwr 的时候才应该支持两个功能
     revalidateOnReconnect: cacheForSwr,
     shouldRetryOnError: false,
-    // @todo 这个功能感觉应该搞个API出来
     revalidateOnFocus: false
   });
   const resOptions = (0, _react.useMemo)(() => {
@@ -317,7 +315,6 @@ const FieldSelect = (props, ref) => {
     const renderDom = () => {
       if (light) {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_LightSelect.default, {
-          variant: variant,
           id: id,
           loading: loading,
           ref: inputRef,
@@ -325,6 +322,7 @@ const FieldSelect = (props, ref) => {
           size: componentSize,
           options: options,
           label: label,
+          labelVariant: variant,
           placeholder: intl.getMessage('tableForm.selectPlaceholder', '请选择'),
           lightLabel: lightLabel,
           labelTrigger: labelTrigger,
@@ -338,7 +336,6 @@ const FieldSelect = (props, ref) => {
           minWidth: 100,
           ...rest.style
         },
-        variant: variant,
         id: id,
         loading: loading,
         ref: inputRef,

package/lib/field/components/Switch/index.js

@@ -24,9 +24,10 @@ const FieldSwitch = ({
   label,
   formItemRender,
   fieldProps,
-  variant
+  variant: propsVariant
 }, ref) => {
   const intl = (0, _provider.useIntl)();
+  const variant = propsVariant ?? fieldProps?.variant;
   const dom = (0, _react.useMemo)(() => {
     if (text === undefined || text === null || `${text}`.length < 1) return '-';
     return text ? fieldProps?.checkedChildren ?? intl.getMessage('switch.open', '打开') : fieldProps?.unCheckedChildren ?? intl.getMessage('switch.close', '关闭');

package/lib/field/components/TimePicker/index.d.ts

@@ -3,10 +3,12 @@ import type { ProFieldLightProps } from '../../PureProField';
 declare const FieldTimeRangePicker: React.ForwardRefExoticComponent<import("../../../provider").BaseProFieldFC & import("../../../provider").ProRenderFieldPropsType & {
     text: string[] | number[];
     format?: string | undefined;
+    variant?: "outlined" | "filled" | "borderless" | "underlined" | undefined;
 } & ProFieldLightProps & React.RefAttributes<any>>;
 export { FieldTimeRangePicker };
 declare const _default: React.ForwardRefExoticComponent<import("../../../provider").BaseProFieldFC & import("../../../provider").ProRenderFieldPropsType & {
     text: string | number;
     format?: string | undefined;
+    variant?: "outlined" | "filled" | "borderless" | "underlined" | undefined;
 } & ProFieldLightProps & React.RefAttributes<any>>;
 export default _default;

package/lib/field/components/TimePicker/index.js

@@ -25,9 +25,9 @@ const FieldTimePicker = ({
   format = 'HH:mm:ss',
   render,
   formItemRender,
-  plain,
   fieldProps,
-  lightLabel
+  lightLabel,
+  variant
 }, ref) => {
   const [open, setOpen] = (0, _react.useState)(false);
   const intl = (0, _provider.useIntl)();
@@ -66,8 +66,9 @@ const FieldTimePicker = ({
         } : undefined,
         label: label,
         disabled: disabled,
+        variant: variant ?? fieldProps?.variant,
         value: dayValue || open ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.TimePicker, {
-          variant: "borderless",
+          variant: variant ?? fieldProps?.variant,
           format: format,
           ref: ref,
           ...fieldProps,
@@ -87,7 +88,6 @@ const FieldTimePicker = ({
       dom = /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.DatePicker.TimePicker, {
         ref: ref,
         format: format,
-        variant: plain === undefined ? 'outlined' : plain ? 'borderless' : 'outlined',
         ...fieldProps,
         value: dayValue
       });
@@ -118,8 +118,8 @@ const FieldTimeRangePickerComponents = ({
   format = 'HH:mm:ss',
   render,
   formItemRender,
-  plain,
-  fieldProps
+  fieldProps,
+  variant
 }, ref) => {
   const intl = (0, _provider.useIntl)();
   const [open, setOpen] = (0, _react.useState)(false);
@@ -166,9 +166,10 @@ const FieldTimeRangePickerComponents = ({
         } : undefined,
         label: label,
         disabled: disabled,
+        variant: variant,
         placeholder: placeholder,
         value: dayValue || open ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.TimePicker.RangePicker, {
-          variant: "borderless",
+          variant: variant ?? fieldProps?.variant,
           format: format,
           ref: ref,
           ...fieldProps,
@@ -188,7 +189,7 @@ const FieldTimeRangePickerComponents = ({
       dom = /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.TimePicker.RangePicker, {
         ref: ref,
         format: format,
-        variant: plain === undefined ? 'outlined' : plain ? 'borderless' : 'outlined',
+        variant: variant,
         ...fieldProps,
         value: dayValue
       });

package/lib/field/components/TreeSelect/index.js

@@ -25,7 +25,7 @@ const FieldTreeSelect = ({
   light,
   label,
   render,
-  variant,
+  variant: propsVariant,
   ...rest
 }, ref) => {
   const {
@@ -46,6 +46,7 @@ const FieldTreeSelect = ({
     searchValue: propsSearchValue,
     ...fieldProps
   } = rest.fieldProps;
+  const variant = propsVariant ?? fieldProps?.variant;
   const intl = (0, _provider.useIntl)();
   const [loading, options, fetchData] = (0, _Select.useFieldFetchData)({
     ...rest,
@@ -136,7 +137,6 @@ const FieldTreeSelect = ({
             children: [item.label, " ", itemIndex < valuesLength - 1 ? ',' : '']
           });
         } : undefined,
-        variant: !light ? variant : 'borderless',
         ...fieldProps,
         treeData: options,
         showSearch: showSearch,

package/lib/form/BaseForm/BaseForm.js

@@ -378,13 +378,27 @@ function BaseForm(props) {
   } = props;
   const formRef = (0, _react.useRef)({});
   const [loading, setLoadingInner] = (0, _util.useControlledState)(false, propsLoading);
+
+  /**
+   * 使用 useRefFunction 包装回调，确保引用稳定
+   */
+  const onLoadingChangeCallback = (0, _utils.useRefFunction)(l => {
+    onLoadingChange?.(l);
+  });
+
+  /**
+   * 包装 setLoading，使用 queueMicrotask 延迟回调调用
+   * 避免在渲染阶段调用外部回调导致的 React 警告
+   */
   const setLoading = (0, _react.useCallback)(updater => {
     setLoadingInner(prev => {
       const next = typeof updater === 'function' ? updater(prev) : updater;
-      onLoadingChange?.(next);
+      queueMicrotask(() => {
+        onLoadingChangeCallback(next);
+      });
       return next;
     });
-  }, [onLoadingChange]);
+  }, [onLoadingChangeCallback]);
   const [urlSearch, setUrlSearch] = (0, _useParams.useUrlSearchParams)({}, {
     disabled: !syncToUrl
   });

package/lib/form/BaseForm/LightWrapper/index.js

@@ -101,7 +101,13 @@ const LightWrapper = props => {
         onChange: e => {
           setTempValue(e?.target ? e.target.value : e);
         },
-        ...children.props
+        ...children.props,
+        // light 模式下由外层 FilterDropdown 统一描边，内层 Select/TreeSelect/DatePicker 等统一使用 borderless，各 Field 组件无需再根据 light 判断
+        variant: 'borderless',
+        fieldProps: {
+          ...children.props?.fieldProps,
+          variant: 'borderless'
+        }
       })
     })
   }));

package/lib/form/BaseForm/Submitter/index.js

@@ -51,7 +51,7 @@ const Submitter = props => {
   const dom = [];
   if (resetButtonProps !== false) {
     dom.push( /*#__PURE__*/(0, _react.createElement)(_antd.Button, {
-      ...(0, _util.omit)(resetButtonProps ?? {}, ['preventDefault']),
+      ...(0, _util.omit)(resetButtonProps ?? {}, ['preventDefault', 'fieldProps']),
       key: "rest",
       onClick: e => {
         if (!resetButtonProps?.preventDefault) reset();
@@ -62,7 +62,7 @@ const Submitter = props => {
   if (submitButtonProps !== false) {
     dom.push( /*#__PURE__*/(0, _react.createElement)(_antd.Button, {
       type: "primary",
-      ...(0, _util.omit)(submitButtonProps || {}, ['preventDefault']),
+      ...(0, _util.omit)(submitButtonProps || {}, ['preventDefault', 'fieldProps']),
       key: "submit",
       onClick: e => {
         if (!submitButtonProps?.preventDefault) submit();

package/lib/form/components/DatePicker/DateTimePicker.js

@@ -28,6 +28,7 @@ const ProFormDateTimePicker = /*#__PURE__*/_react.default.forwardRef(({
       valueType,
       customLightMode: true
     },
+    fieldProps: fieldProps,
     ...rest
   });
 });

package/lib/form/components/DateRangePicker/DateTimeRangePicker.d.ts

@@ -1,4 +1,4 @@
-import { RangePickerProps } from 'antd/lib/date-picker';
+import type { RangePickerProps } from 'antd/lib/date-picker';
 import React from 'react';
 import type { ProFormFieldItemProps } from '../../typing';
 /**

package/lib/form/components/DateRangePicker/DateTimeRangePicker.js

@@ -23,9 +23,7 @@ const ProFormDateTimeRangePicker = exports.ProFormDateTimeRangePicker = /*#__PUR
 }, ref) => {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_BaseDateRanger.BaseDateRanger, {
     ref: ref,
-    fieldProps: {
-      ...fieldProps
-    },
+    fieldProps: fieldProps,
     valueType: valueType,
     proFieldProps: proFieldProps,
     fieldConfig: {