@ant-design/pro-components 3.0.0-beta.1 → 3.0.0-beta.3

package/lib/form/components/FormItem/warpField.js

@@ -1,77 +1,28 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+"use strict";
 
-// src/form/components/FormItem/warpField.tsx
-var warpField_exports = {};
-__export(warpField_exports, {
-  TYPE: () => TYPE,
-  default: () => warpField_default,
-  warpField: () => warpField
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(warpField_exports);
-var import_classnames = __toESM(require("classnames"));
-var import_rc_field_form = require("rc-field-form");
-var import_react = __toESM(require("react"));
-var import_utils = require("../../../utils");
-var import_FieldContext = __toESM(require("../../FieldContext"));
-var import_helpers = require("../../helpers");
-var import_Dependency = __toESM(require("../Dependency"));
-var import_index = __toESM(require("./index"));
-var TYPE = Symbol("ProFormComponent");
+exports.default = exports.TYPE = void 0;
+exports.warpField = warpField;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _classnames2 = _interopRequireDefault(require("classnames"));
+var _rcFieldForm = require("rc-field-form");
+var _react = _interopRequireWildcard(require("react"));
+var _utils = require("../../../utils");
+var _FieldContext = _interopRequireDefault(require("../../FieldContext"));
+var _helpers = require("../../helpers");
+var _Dependency = _interopRequireDefault(require("../Dependency"));
+var _index = _interopRequireDefault(require("./index"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["valueType", "customLightMode", "lightFilterLabelFormatter", "valuePropName", "ignoreWidth", "defaultProps"],
+  _excluded2 = ["label", "tooltip", "placeholder", "width", "bordered", "messageVariables", "ignoreFormItem", "transform", "convertValue", "readonly", "allowClear", "colSize", "getFormItemProps", "getFieldProps", "filedConfig", "cacheForSwr", "proFieldProps"];
+var TYPE = exports.TYPE = Symbol('ProFormComponent');
 var WIDTH_SIZE_ENUM = {
   // 适用于短数字，短文本或者选项
   xs: 104,
@@ -87,258 +38,228 @@ var WIDTH_SIZE_ENUM = {
   // 适用于长文本录入，如长链接、描述、备注等，通常搭配自适应多行输入框或定高文本域使用。
   xl: 552
 };
-var ignoreWidthValueType = ["switch", "radioButton", "radio", "rate"];
+var ignoreWidthValueType = ['switch', 'radioButton', 'radio', 'rate'];
+
+/**
+ * 处理fieldProps和formItemProps为function时传进来的方法
+ * 目前只在SchemaForm时可能会有
+ */
+
+/**
+ * 这个方法的主要作用是帮助 Field 增加 FormItem 同时也会处理 lightFilter
+ *
+ * @param Field
+ * @param config
+ */
 function warpField(Field, config) {
-  Field.displayName = "ProFormComponent";
-  const FieldWithContext = (props) => {
-    const _a = __spreadValues(__spreadValues({}, props == null ? void 0 : props.filedConfig), config), {
-      valueType: tmpValueType,
-      customLightMode,
-      lightFilterLabelFormatter,
-      valuePropName = "value",
-      ignoreWidth,
-      defaultProps
-    } = _a, defaultFormItemProps = __objRest(_a, [
-      "valueType",
-      "customLightMode",
-      "lightFilterLabelFormatter",
-      "valuePropName",
-      "ignoreWidth",
-      "defaultProps"
-    ]);
-    const _b = __spreadValues(__spreadValues({}, defaultProps), props), {
-      label,
-      tooltip,
-      placeholder,
-      width,
-      bordered,
-      messageVariables,
-      ignoreFormItem,
-      transform,
-      convertValue,
-      readonly,
-      allowClear,
-      colSize,
-      getFormItemProps,
-      getFieldProps,
-      filedConfig,
-      cacheForSwr,
-      proFieldProps
-    } = _b, rest = __objRest(_b, [
-      "label",
-      "tooltip",
-      "placeholder",
-      "width",
-      "bordered",
-      "messageVariables",
-      "ignoreFormItem",
-      "transform",
-      "convertValue",
-      "readonly",
-      "allowClear",
-      "colSize",
-      "getFormItemProps",
-      "getFieldProps",
-      "filedConfig",
-      "cacheForSwr",
-      "proFieldProps"
-    ]);
-    const valueType = tmpValueType || rest.valueType;
-    const isIgnoreWidth = (0, import_react.useMemo)(
-      () => ignoreWidth || ignoreWidthValueType.includes(valueType),
-      [ignoreWidth, valueType]
-    );
-    const [, forceUpdate] = (0, import_react.useState)();
-    const [onlyChange, forceUpdateByOnChange] = (0, import_react.useState)();
-    const contextValue = import_react.default.useContext(import_FieldContext.default);
-    const changedProps = (0, import_utils.useDeepCompareMemo)(
-      () => {
-        return {
-          formItemProps: getFormItemProps == null ? void 0 : getFormItemProps(),
-          fieldProps: getFieldProps == null ? void 0 : getFieldProps()
-        };
-      },
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-      [getFieldProps, getFormItemProps, rest.dependenciesValues, onlyChange]
-    );
-    const fieldProps = (0, import_utils.useDeepCompareMemo)(() => {
-      const newFieldProps = __spreadValues(__spreadValues(__spreadValues(__spreadProps(__spreadValues({}, ignoreFormItem ? (0, import_utils.omitUndefined)({ value: rest.value }) : {}), {
-        placeholder,
+  // 标记是否是 ProForm 的组件
+  // @ts-ignore
+  // eslint-disable-next-line no-param-reassign
+  Field.displayName = 'ProFormComponent';
+  var FieldWithContext = function FieldWithContext(props) {
+    var _props$filedConfig$co = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props === null || props === void 0 ? void 0 : props.filedConfig), config),
+      tmpValueType = _props$filedConfig$co.valueType,
+      customLightMode = _props$filedConfig$co.customLightMode,
+      lightFilterLabelFormatter = _props$filedConfig$co.lightFilterLabelFormatter,
+      _props$filedConfig$co2 = _props$filedConfig$co.valuePropName,
+      valuePropName = _props$filedConfig$co2 === void 0 ? 'value' : _props$filedConfig$co2,
+      ignoreWidth = _props$filedConfig$co.ignoreWidth,
+      defaultProps = _props$filedConfig$co.defaultProps,
+      defaultFormItemProps = (0, _objectWithoutProperties2.default)(_props$filedConfig$co, _excluded);
+    var _defaultProps$props = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, defaultProps), props),
+      label = _defaultProps$props.label,
+      tooltip = _defaultProps$props.tooltip,
+      placeholder = _defaultProps$props.placeholder,
+      width = _defaultProps$props.width,
+      bordered = _defaultProps$props.bordered,
+      messageVariables = _defaultProps$props.messageVariables,
+      ignoreFormItem = _defaultProps$props.ignoreFormItem,
+      transform = _defaultProps$props.transform,
+      convertValue = _defaultProps$props.convertValue,
+      readonly = _defaultProps$props.readonly,
+      allowClear = _defaultProps$props.allowClear,
+      colSize = _defaultProps$props.colSize,
+      getFormItemProps = _defaultProps$props.getFormItemProps,
+      getFieldProps = _defaultProps$props.getFieldProps,
+      filedConfig = _defaultProps$props.filedConfig,
+      cacheForSwr = _defaultProps$props.cacheForSwr,
+      proFieldProps = _defaultProps$props.proFieldProps,
+      rest = (0, _objectWithoutProperties2.default)(_defaultProps$props, _excluded2);
+    var valueType = tmpValueType || rest.valueType;
+
+    // 有些 valueType 不需要宽度
+    var isIgnoreWidth = (0, _react.useMemo)(function () {
+      return ignoreWidth || ignoreWidthValueType.includes(valueType);
+    }, [ignoreWidth, valueType]);
+    var _useState = (0, _react.useState)(),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      forceUpdate = _useState2[1];
+
+    // onChange触发fieldProps,formItemProps重新执行
+    var _useState3 = (0, _react.useState)(),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      onlyChange = _useState4[0],
+      forceUpdateByOnChange = _useState4[1];
+
+    /**
+     * 从 context 中拿到的值
+     */
+    var contextValue = _react.default.useContext(_FieldContext.default);
+
+    /**
+     * dependenciesValues change to trigger re-execute of getFieldProps and getFormItemProps
+     */
+    var changedProps = (0, _utils.useDeepCompareMemo)(function () {
+      return {
+        formItemProps: getFormItemProps === null || getFormItemProps === void 0 ? void 0 : getFormItemProps(),
+        fieldProps: getFieldProps === null || getFieldProps === void 0 ? void 0 : getFieldProps()
+      };
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [getFieldProps, getFormItemProps, rest.dependenciesValues, onlyChange]);
+    var fieldProps = (0, _utils.useDeepCompareMemo)(function () {
+      var newFieldProps = (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, ignoreFormItem ? (0, _utils.omitUndefined)({
+        value: rest.value
+      }) : {}), {}, {
+        placeholder: placeholder,
         disabled: props.disabled
-      }), contextValue.fieldProps), changedProps.fieldProps), rest.fieldProps);
-      newFieldProps.style = (0, import_utils.omitUndefined)(newFieldProps == null ? void 0 : newFieldProps.style);
+      }, contextValue.fieldProps), changedProps.fieldProps), rest.fieldProps);
+      newFieldProps.style = (0, _utils.omitUndefined)(newFieldProps === null || newFieldProps === void 0 ? void 0 : newFieldProps.style);
       return newFieldProps;
-    }, [
-      ignoreFormItem,
-      rest.value,
-      rest.fieldProps,
-      placeholder,
-      props.disabled,
-      contextValue.fieldProps,
-      changedProps.fieldProps
-    ]);
-    const restFormItemProps = (0, import_utils.pickProFormItemProps)(rest);
-    const formItemProps = (0, import_utils.useDeepCompareMemo)(
-      () => __spreadValues(__spreadValues(__spreadValues(__spreadValues({}, contextValue.formItemProps), restFormItemProps), changedProps.formItemProps), rest.formItemProps),
-      [
-        changedProps.formItemProps,
-        contextValue.formItemProps,
-        rest.formItemProps,
-        restFormItemProps
-      ]
-    );
-    const otherProps = (0, import_utils.useDeepCompareMemo)(
-      () => __spreadValues(__spreadValues({
-        messageVariables
-      }, defaultFormItemProps), formItemProps),
-      [defaultFormItemProps, formItemProps, messageVariables]
-    );
-    const { prefixName } = (0, import_react.useContext)(import_rc_field_form.FieldContext);
-    const proFieldKey = (0, import_utils.useDeepCompareMemo)(() => {
-      var _a2;
-      let name = otherProps == null ? void 0 : otherProps.name;
-      if (Array.isArray(name))
-        name = name.join("_");
-      if (Array.isArray(prefixName) && name)
-        name = `${prefixName.join(".")}.${name}`;
-      const key = name && `form-${(_a2 = contextValue.formKey) != null ? _a2 : ""}-field-${name}`;
+    }, [ignoreFormItem, rest.value, rest.fieldProps, placeholder, props.disabled, contextValue.fieldProps, changedProps.fieldProps]);
+
+    // restFormItemProps is user props pass to Form.Item
+    var restFormItemProps = (0, _utils.pickProFormItemProps)(rest);
+    var formItemProps = (0, _utils.useDeepCompareMemo)(function () {
+      return (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, contextValue.formItemProps), restFormItemProps), changedProps.formItemProps), rest.formItemProps);
+    }, [changedProps.formItemProps, contextValue.formItemProps, rest.formItemProps, restFormItemProps]);
+    var otherProps = (0, _utils.useDeepCompareMemo)(function () {
+      return (0, _objectSpread2.default)((0, _objectSpread2.default)({
+        messageVariables: messageVariables
+      }, defaultFormItemProps), formItemProps);
+    }, [defaultFormItemProps, formItemProps, messageVariables]);
+    var _useContext = (0, _react.useContext)(_rcFieldForm.FieldContext),
+      prefixName = _useContext.prefixName;
+    var proFieldKey = (0, _utils.useDeepCompareMemo)(function () {
+      var _contextValue$formKey;
+      var name = otherProps === null || otherProps === void 0 ? void 0 : otherProps.name;
+      if (Array.isArray(name)) name = name.join('_');
+      if (Array.isArray(prefixName) && name) name = "".concat(prefixName.join('.'), ".").concat(name);
+      var key = name && "form-".concat((_contextValue$formKey = contextValue.formKey) !== null && _contextValue$formKey !== void 0 ? _contextValue$formKey : '', "-field-").concat(name);
       return key;
-    }, [(0, import_utils.stringify)(otherProps == null ? void 0 : otherProps.name), prefixName, contextValue.formKey]);
-    const onChange = (0, import_utils.useRefFunction)((...restParams) => {
-      var _a2;
+
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [(0, _utils.stringify)(otherProps === null || otherProps === void 0 ? void 0 : otherProps.name), prefixName, contextValue.formKey]);
+    var onChange = (0, _utils.useRefFunction)(function () {
+      var _fieldProps$onChange;
       if (getFormItemProps || getFieldProps) {
         forceUpdateByOnChange([]);
       } else if (rest.formItemRender) {
         forceUpdate([]);
       }
-      (_a2 = fieldProps == null ? void 0 : fieldProps.onChange) == null ? void 0 : _a2.call(fieldProps, ...restParams);
+      for (var _len = arguments.length, restParams = new Array(_len), _key = 0; _key < _len; _key++) {
+        restParams[_key] = arguments[_key];
+      }
+      fieldProps === null || fieldProps === void 0 || (_fieldProps$onChange = fieldProps.onChange) === null || _fieldProps$onChange === void 0 || _fieldProps$onChange.call.apply(_fieldProps$onChange, [fieldProps].concat(restParams));
     });
-    const style = (0, import_utils.useDeepCompareMemo)(() => {
-      const newStyle = __spreadValues({
-        width: width && !WIDTH_SIZE_ENUM[width] ? width : contextValue.grid ? "100%" : void 0
-      }, fieldProps == null ? void 0 : fieldProps.style);
-      if (isIgnoreWidth)
-        Reflect.deleteProperty(newStyle, "width");
-      return (0, import_utils.omitUndefined)(newStyle);
-    }, [(0, import_utils.stringify)(fieldProps == null ? void 0 : fieldProps.style), contextValue.grid, isIgnoreWidth, width]);
-    const className = (0, import_utils.useDeepCompareMemo)(() => {
-      const isSizeEnum = width && WIDTH_SIZE_ENUM[width];
-      return (0, import_classnames.default)(fieldProps == null ? void 0 : fieldProps.className, {
-        "pro-field": isSizeEnum,
-        [`pro-field-${width}`]: isSizeEnum && !isIgnoreWidth
-      }) || void 0;
-    }, [width, fieldProps == null ? void 0 : fieldProps.className, isIgnoreWidth]);
-    const fieldProFieldProps = (0, import_utils.useDeepCompareMemo)(() => {
-      return (0, import_utils.omitUndefined)(__spreadValues(__spreadProps(__spreadValues({}, contextValue.proFieldProps), {
-        mode: rest == null ? void 0 : rest.mode,
-        readonly,
+    var style = (0, _utils.useDeepCompareMemo)(function () {
+      var newStyle = (0, _objectSpread2.default)({
+        width: width && !WIDTH_SIZE_ENUM[width] ? width : contextValue.grid ? '100%' : undefined
+      }, fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.style);
+      if (isIgnoreWidth) Reflect.deleteProperty(newStyle, 'width');
+      return (0, _utils.omitUndefined)(newStyle);
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [(0, _utils.stringify)(fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.style), contextValue.grid, isIgnoreWidth, width]);
+    var className = (0, _utils.useDeepCompareMemo)(function () {
+      var isSizeEnum = width && WIDTH_SIZE_ENUM[width];
+      return (0, _classnames2.default)(fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.className, (0, _defineProperty2.default)({
+        'pro-field': isSizeEnum
+      }, "pro-field-".concat(width), isSizeEnum && !isIgnoreWidth)) || undefined;
+    }, [width, fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.className, isIgnoreWidth]);
+    var fieldProFieldProps = (0, _utils.useDeepCompareMemo)(function () {
+      return (0, _utils.omitUndefined)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, contextValue.proFieldProps), {}, {
+        mode: rest === null || rest === void 0 ? void 0 : rest.mode,
+        readonly: readonly,
         params: rest.params,
-        proFieldKey,
-        cacheForSwr
-      }), proFieldProps));
-    }, [
-      contextValue.proFieldProps,
-      rest == null ? void 0 : rest.mode,
-      rest.params,
-      readonly,
-      proFieldKey,
-      cacheForSwr,
-      proFieldProps
-    ]);
-    const fieldFieldProps = (0, import_utils.useDeepCompareMemo)(() => {
-      return __spreadProps(__spreadValues({
-        onChange,
-        allowClear
-      }, fieldProps), {
-        style,
-        className
+        proFieldKey: proFieldKey,
+        cacheForSwr: cacheForSwr
+      }, proFieldProps));
+    }, [contextValue.proFieldProps, rest === null || rest === void 0 ? void 0 : rest.mode, rest.params, readonly, proFieldKey, cacheForSwr, proFieldProps]);
+    var fieldFieldProps = (0, _utils.useDeepCompareMemo)(function () {
+      return (0, _objectSpread2.default)((0, _objectSpread2.default)({
+        onChange: onChange,
+        allowClear: allowClear
+      }, fieldProps), {}, {
+        style: style,
+        className: className
       });
     }, [allowClear, className, onChange, fieldProps, style]);
-    const field = (0, import_utils.useDeepCompareMemo)(() => {
-      return /* @__PURE__ */ import_react.default.createElement(
-        Field,
-        __spreadProps(__spreadValues({
-          key: props.proFormFieldKey || props.name
-        }, rest), {
-          fieldProps: fieldFieldProps,
-          proFieldProps: fieldProFieldProps,
-          ref: props == null ? void 0 : props.fieldRef
-        })
-      );
+    var field = (0, _utils.useDeepCompareMemo)(function () {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(Field
+      // @ts-ignore
+      , (0, _objectSpread2.default)((0, _objectSpread2.default)({}, rest), {}, {
+        fieldProps: fieldFieldProps,
+        proFieldProps: fieldProFieldProps,
+        ref: props === null || props === void 0 ? void 0 : props.fieldRef
+      }), props.proFormFieldKey || props.name);
+      // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [fieldProFieldProps, fieldFieldProps, rest]);
-    const formItem = (0, import_utils.useDeepCompareMemo)(() => {
-      var _a2, _b2, _c, _d;
-      return /* @__PURE__ */ import_react.default.createElement(
-        import_index.default,
-        __spreadProps(__spreadValues({
-          label: label && (proFieldProps == null ? void 0 : proFieldProps.light) !== true ? label : void 0,
-          tooltip: (proFieldProps == null ? void 0 : proFieldProps.light) !== true && tooltip,
-          valuePropName,
-          key: props.proFormFieldKey || ((_a2 = otherProps.name) == null ? void 0 : _a2.toString())
-        }, otherProps), {
-          ignoreFormItem,
-          transform,
-          dataFormat: fieldProps == null ? void 0 : fieldProps.format,
-          valueType,
-          messageVariables: __spreadValues({
-            label: label || ""
-          }, otherProps == null ? void 0 : otherProps.messageVariables),
-          convertValue,
-          lightProps: (0, import_utils.omitUndefined)(__spreadValues(__spreadValues(__spreadProps(__spreadValues({}, fieldProps), {
-            valueType,
-            bordered,
-            allowClear: (_c = (_b2 = field == null ? void 0 : field.props) == null ? void 0 : _b2.allowClear) != null ? _c : allowClear,
-            light: proFieldProps == null ? void 0 : proFieldProps.light,
-            label,
-            customLightMode,
-            labelFormatter: lightFilterLabelFormatter,
-            valuePropName,
-            footerRender: (_d = field == null ? void 0 : field.props) == null ? void 0 : _d.footerRender
-          }), rest.lightProps), otherProps.lightProps))
-        }),
-        field
-      );
-    }, [
-      label,
-      proFieldProps == null ? void 0 : proFieldProps.light,
-      tooltip,
-      valuePropName,
-      props.proFormFieldKey,
-      otherProps,
-      ignoreFormItem,
-      transform,
-      fieldProps,
-      valueType,
-      convertValue,
-      bordered,
-      field,
-      allowClear,
-      customLightMode,
-      lightFilterLabelFormatter,
-      rest.lightProps
-    ]);
-    const { ColWrapper } = (0, import_helpers.useGridHelpers)(rest);
-    return /* @__PURE__ */ import_react.default.createElement(ColWrapper, null, formItem);
+
+    // 使用useMemo包裹避免不必要的re-render
+    var formItem = (0, _utils.useDeepCompareMemo)(function () {
+      var _otherProps$name, _field$props$allowCle, _field$props, _field$props2;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.default
+      // 全局的提供一个 tip 功能，可以减少代码量
+      // 轻量模式下不通过 FormItem 显示 label
+      , (0, _objectSpread2.default)((0, _objectSpread2.default)({
+        label: label && (proFieldProps === null || proFieldProps === void 0 ? void 0 : proFieldProps.light) !== true ? label : undefined,
+        tooltip: (proFieldProps === null || proFieldProps === void 0 ? void 0 : proFieldProps.light) !== true && tooltip,
+        valuePropName: valuePropName
+        // @ts-ignore
+      }, otherProps), {}, {
+        ignoreFormItem: ignoreFormItem,
+        transform: transform,
+        dataFormat: fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.format,
+        valueType: valueType,
+        messageVariables: (0, _objectSpread2.default)({
+          label: label || ''
+        }, otherProps === null || otherProps === void 0 ? void 0 : otherProps.messageVariables),
+        convertValue: convertValue,
+        lightProps: (0, _utils.omitUndefined)((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, fieldProps), {}, {
+          valueType: valueType,
+          bordered: bordered,
+          allowClear: (_field$props$allowCle = field === null || field === void 0 || (_field$props = field.props) === null || _field$props === void 0 ? void 0 : _field$props.allowClear) !== null && _field$props$allowCle !== void 0 ? _field$props$allowCle : allowClear,
+          light: proFieldProps === null || proFieldProps === void 0 ? void 0 : proFieldProps.light,
+          label: label,
+          customLightMode: customLightMode,
+          labelFormatter: lightFilterLabelFormatter,
+          valuePropName: valuePropName,
+          footerRender: field === null || field === void 0 || (_field$props2 = field.props) === null || _field$props2 === void 0 ? void 0 : _field$props2.footerRender
+        }, rest.lightProps), otherProps.lightProps)),
+        children: field
+      }), props.proFormFieldKey || ((_otherProps$name = otherProps.name) === null || _otherProps$name === void 0 ? void 0 : _otherProps$name.toString()));
+    }, [label, proFieldProps === null || proFieldProps === void 0 ? void 0 : proFieldProps.light, tooltip, valuePropName, props.proFormFieldKey, otherProps, ignoreFormItem, transform, fieldProps, valueType, convertValue, bordered, field, allowClear, customLightMode, lightFilterLabelFormatter, rest.lightProps]);
+    var _useGridHelpers = (0, _helpers.useGridHelpers)(rest),
+      ColWrapper = _useGridHelpers.ColWrapper;
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(ColWrapper, {
+      children: formItem
+    });
   };
-  const DependencyWrapper = (props) => {
-    const { dependencies } = props;
-    return dependencies ? /* @__PURE__ */ import_react.default.createElement(
-      import_Dependency.default,
-      {
-        name: dependencies,
-        originDependencies: props == null ? void 0 : props.originDependencies
-      },
-      (values) => {
-        return /* @__PURE__ */ import_react.default.createElement(
-          FieldWithContext,
-          __spreadValues({
-            dependenciesValues: values,
-            dependencies
-          }, props)
-        );
+  var DependencyWrapper = function DependencyWrapper(props) {
+    var dependencies = props.dependencies;
+    return dependencies ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dependency.default, {
+      name: dependencies,
+      originDependencies: props === null || props === void 0 ? void 0 : props.originDependencies,
+      children: function children(values) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(FieldWithContext, (0, _objectSpread2.default)({
+          dependenciesValues: values,
+          dependencies: dependencies
+        }, props));
       }
-    ) : /* @__PURE__ */ import_react.default.createElement(FieldWithContext, __spreadValues({ dependencies }, props));
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(FieldWithContext, (0, _objectSpread2.default)({
+      dependencies: dependencies
+    }, props));
   };
   return DependencyWrapper;
 }
-var warpField_default = warpField;
+var _default = exports.default = warpField;