@zat-design/sisyphus-react 4.0.0-beta.8 → 4.0.0

package/lib/ProForm/components/combination/Group/component/ComRender.js

@@ -1,21 +1,28 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _react = _interopRequireDefault(require("react"));
+var _antd = require("antd");
 var _lodash = require("lodash");
 var _ConfirmWrapper = _interopRequireDefault(require("../../../../components/render/ConfirmWrapper"));
 var _useFieldProps = require("../../../../utils/useFieldProps");
 var componentMap = _interopRequireWildcard(require("../../../../../index"));
 var _AddonWrapper = _interopRequireDefault(require("./AddonWrapper"));
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["type", "confirm", "component", "fieldProps", "contextProps", "before", "after", "getValueProps", "valuePropName", "valueType", "isView", "viewRender"];
+var _excluded = ["type", "confirm", "component", "fieldProps", "contextProps", "before", "after", "getValueProps", "valuePropName", "valueType", "isView", "viewRender", "formItemClassName", "formItemStyle", "dependencies", "name"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 // 这里的key与组件内参数一致, 决定使用哪个包裹组件
 var wrapperMap = {
   confirm: _ConfirmWrapper.default,
@@ -30,7 +37,7 @@ var getComRender = (component, props, componentProps) => {
   wrappers.forEach(item => {
     if (item in props) {
       var Wrapper = wrapperMap[item];
-      renderComponent = /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, componentProps), {}, {
+      renderComponent = /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, _objectSpread(_objectSpread({}, componentProps), {}, {
         [item]: props[item],
         children: renderComponent
       }));
@@ -55,13 +62,17 @@ var ComRender = props => {
     valueType = props.valueType,
     isView = props.isView,
     viewRender = props.viewRender,
-    rest = (0, _objectWithoutProperties2.default)(props, _excluded);
+    formItemClassName = props.formItemClassName,
+    formItemStyle = props.formItemStyle,
+    dependencies = props.dependencies,
+    name = props.name,
+    rest = _objectWithoutProperties(props, _excluded);
   var TypeComponent = componentMap[type];
   var mergedGetValueProps = getValueProps || (val => ({
     [valuePropName]: val
   }));
   var nextProps = mergedGetValueProps(fieldProps.value);
-  var componentProps = (0, _lodash.omit)((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, fieldProps), rest), nextProps), ['onFieldChange']);
+  var componentProps = (0, _lodash.omit)(_objectSpread(_objectSpread(_objectSpread({}, fieldProps), rest), nextProps), ['onFieldChange']);
   var isSeparator = (props === null || props === void 0 || (_props$component = props.component) === null || _props$component === void 0 || (_props$component = _props$component.props) === null || _props$component === void 0 ? void 0 : _props$component.className) === 'group-separator';
   if (isSeparator && isView) {
     var _props$component2;
@@ -71,7 +82,7 @@ var ComRender = props => {
   }
   if (viewRender && isView) {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_useFieldProps.FieldProvider, {
-      value: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, contextProps), {}, {
+      value: _objectSpread(_objectSpread({}, contextProps), {}, {
         valueType,
         type,
         isView
@@ -79,10 +90,67 @@ var ComRender = props => {
       children: viewRender(componentProps)
     });
   }
-  var Component = component ? ( /*#__PURE__*/_react.default.cloneElement(component, (0, _objectSpread2.default)({}, componentProps))) : /*#__PURE__*/(0, _jsxRuntime.jsx)(TypeComponent, (0, _objectSpread2.default)({}, componentProps));
+  var Component = component ? ( /*#__PURE__*/_react.default.cloneElement(component, _objectSpread({}, componentProps))) : /*#__PURE__*/(0, _jsxRuntime.jsx)(TypeComponent, _objectSpread({}, componentProps));
   var renderComponent = getComRender(Component, props, componentProps);
+
+  // 传统模式 compact 模式：需要 Form.Item 包装并应用宽度样式
+  // 通过 formItemClassName 和 formItemStyle 来判断是否需要 Form.Item 包装
+  if (formItemClassName && name) {
+    // 如果有依赖字段，使用 shouldUpdate 来实时更新错误状态
+    if (dependencies && dependencies.length > 0) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form.Item, {
+        shouldUpdate: (prevValues, currentValues) => {
+          // 检查当前字段和依赖字段是否有变化
+          var currentFieldChanged = (prevValues === null || prevValues === void 0 ? void 0 : prevValues[name]) !== (currentValues === null || currentValues === void 0 ? void 0 : currentValues[name]);
+          var dependenciesChanged = dependencies.some(dep => {
+            var prevValue = prevValues === null || prevValues === void 0 ? void 0 : prevValues[dep];
+            var currentValue = currentValues === null || currentValues === void 0 ? void 0 : currentValues[dep];
+            return prevValue !== currentValue;
+          });
+          var hasChanged = currentFieldChanged || dependenciesChanged;
+          // 当检测到变化时，触发字段校验以更新错误状态
+          if (hasChanged && contextProps !== null && contextProps !== void 0 && contextProps.form && name) {
+            setTimeout(() => {
+              contextProps.form.validateFields([name]).catch(() => {});
+            }, 0);
+          }
+          return hasChanged;
+        },
+        noStyle: true,
+        children: () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form.Item, {
+          name: name,
+          className: formItemClassName,
+          style: formItemStyle,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_useFieldProps.FieldProvider, {
+            value: _objectSpread(_objectSpread({}, contextProps), {}, {
+              valueType,
+              type,
+              isView
+            }),
+            children: renderComponent
+          })
+        })
+      });
+    }
+    // 没有依赖字段，直接渲染 Form.Item
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form.Item, {
+      name: name,
+      className: formItemClassName,
+      style: formItemStyle,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_useFieldProps.FieldProvider, {
+        value: _objectSpread(_objectSpread({}, contextProps), {}, {
+          valueType,
+          type,
+          isView
+        }),
+        children: renderComponent
+      })
+    });
+  }
+
+  // 非传统模式 compact 模式：直接渲染组件
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_useFieldProps.FieldProvider, {
-    value: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, contextProps), {}, {
+    value: _objectSpread(_objectSpread({}, contextProps), {}, {
       valueType,
       type,
       isView

package/lib/ProForm/components/combination/Group/component/FlexibleGroup.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { GroupType, FlexibleGroupColumnType } from '../propsType';
+interface FlexibleGroupProps extends Omit<GroupType, 'children'> {
+    children: FlexibleGroupColumnType[];
+}
+/**
+ * FlexibleGroup主组件
+ */
+declare const FlexibleGroup: React.FC<FlexibleGroupProps>;
+export default FlexibleGroup;

package/lib/ProForm/components/combination/Group/component/FlexibleGroup.js

@@ -0,0 +1,360 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _antd = require("antd");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _lodash = require("lodash");
+var _useFieldProps = require("../../../../utils/useFieldProps");
+var _ProForm = _interopRequireDefault(require("../../../../../ProForm"));
+var _Render = _interopRequireDefault(require("../../../render/Render"));
+var componentMap = _interopRequireWildcard(require("../../../../../index"));
+var utils = _interopRequireWildcard(require("../utils"));
+var _hooks = require("../hooks");
+var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["width"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/**
+ * 错误提示组件
+ */
+var ErrorTip = () => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+  className: "pro-group-error-tip",
+  children: "Group\u914D\u7F6E\u9519\u8BEF\uFF0C\u8BF7\u68C0\u67E5\u63A7\u5236\u53F0\u8B66\u544A\u4FE1\u606F"
+});
+
+/**
+ * FlexibleGroup渲染组件
+ */
+var FlexibleGroupRender = props => {
+  var _fieldProps, _ref;
+  var propsChildren = props.children,
+    _props$space = props.space,
+    space = _props$space === void 0 ? {
+      size: 12
+    } : _props$space,
+    className = props.className,
+    isParentView = props.isView,
+    separator = props.separator,
+    split = props.split,
+    groupDisabled = props.disabled,
+    otherProps = props.otherProps,
+    id = props.id;
+
+  // children可能在props.children或props.fieldProps.children中
+  var children = propsChildren || ((_fieldProps = props.fieldProps) === null || _fieldProps === void 0 ? void 0 : _fieldProps.children) || [];
+
+  // 向后兼容处理：优先使用 separator，如果没有则使用 split，最后使用默认值
+  var finalSeparator = (_ref = separator !== null && separator !== void 0 ? separator : split) !== null && _ref !== void 0 ? _ref : '/';
+  var contextProps = _ProForm.default.useFieldProps() || {};
+  var form = contextProps.form,
+    contextIsView = contextProps.isView;
+  var isView = isParentView || contextIsView || (otherProps === null || otherProps === void 0 ? void 0 : otherProps.isView);
+
+  // 使用 hook 处理 ProEditTable 场景下的字段重置逻辑
+  (0, _hooks.useResetProEditTable)({
+    children,
+    form,
+    namePath: contextProps.namePath,
+    source: otherProps === null || otherProps === void 0 ? void 0 : otherProps.source
+  });
+  var renderFormItem = (child, index) => {
+    var _child$fieldProps, _child$fieldProps2;
+    // 计算样式（宽度处理）
+    var childWidth = (_child$fieldProps = child.fieldProps) === null || _child$fieldProps === void 0 || (_child$fieldProps = _child$fieldProps.style) === null || _child$fieldProps === void 0 ? void 0 : _child$fieldProps.width;
+    var formItemStyle = childWidth ? {
+      width: childWidth
+    } : undefined;
+    var formItemClassName = childWidth ? 'pro-group-form-item pro-group-form-item-has-width' : 'pro-group-form-item';
+
+    // 如果子组件有自定义宽度，从 fieldProps.style 中移除 width，让组件保持默认宽度
+    // 宽度只应用到 Form.Item，不透传到组件本身
+    var adjustedFieldProps = childWidth && (_child$fieldProps2 = child.fieldProps) !== null && _child$fieldProps2 !== void 0 && _child$fieldProps2.style ? _objectSpread(_objectSpread({}, child.fieldProps), {}, {
+      style: (() => {
+        var _child$fieldProps$sty = child.fieldProps.style,
+          width = _child$fieldProps$sty.width,
+          restStyle = _objectWithoutProperties(_child$fieldProps$sty, _excluded);
+        return restStyle;
+      })()
+    }) : child.fieldProps;
+
+    // 检查 child 是否来自 FormList 的处理（已有处理过的参数）
+    var isFromFormList = (child === null || child === void 0 ? void 0 : child.source) === 'FormList';
+    var childNamePath = child.namePath || contextProps.namePath;
+    var childIndex = child.index;
+    var childListName = child.listName;
+
+    // 需要判断childNamePath来源是FormList还是ProEditTable
+    var fullName = (() => {
+      if (isFromFormList) {
+        return child.name;
+      }
+      if (childNamePath && Array.isArray(child.name) && child.name.length > 1) {
+        return [...childNamePath, ...child.name];
+      }
+      if (childNamePath) {
+        return [...childNamePath, child.name];
+      }
+      return child.name;
+    })();
+
+    // 处理依赖关系 - 支持相对路径和绝对路径
+    var safeDependencies = Array.isArray(child.dependencies) ? child.dependencies : [];
+    var processedDependencies = safeDependencies.map(dep => {
+      if (typeof dep === 'string') {
+        // 相对路径：同Group内的其他字段
+        return childNamePath ? [...childNamePath, dep] : dep;
+      }
+      return dep; // 绝对路径保持不变
+    });
+
+    // 获取组件类型
+    var type = child.type || 'Input';
+    var TargetComponent = componentMap[type];
+
+    // 处理 disabled（可能是函数）
+    var childDisabled = typeof child.disabled === 'function' ? false : child.disabled;
+    var finalDisabled = groupDisabled || childDisabled;
+
+    // 构建 formItemProps
+    var formItemProps = {
+      name: fullName,
+      label: child.label,
+      rules: child.rules,
+      dependencies: processedDependencies,
+      extra: child.extra,
+      before: child.before,
+      after: child.after,
+      required: child.required,
+      disabled: finalDisabled,
+      validateFirst: child.validateFirst
+    };
+
+    // 如果 child 来自 FormList 的处理，传递 index、namePath、listName
+    if (childIndex !== undefined) {
+      formItemProps.index = childIndex;
+    }
+    if (childNamePath) {
+      formItemProps.namePath = childNamePath;
+    }
+    if (childListName) {
+      formItemProps.listName = childListName;
+    }
+
+    // 处理 tooltip（类型兼容）
+    if (child.tooltip) {
+      formItemProps.tooltip = child.tooltip;
+    }
+
+    // 构建 otherProps
+    var renderOtherProps = {
+      label: child.label,
+      name: fullName,
+      disabled: finalDisabled,
+      isView,
+      viewEmpty: otherProps === null || otherProps === void 0 ? void 0 : otherProps.viewEmpty,
+      valueType: child.valueType,
+      form,
+      type,
+      colProps: {
+        span: 24
+      },
+      // 灵活模式不需要 Col，但需要传递 colProps
+      namePath: childNamePath || contextProps.namePath,
+      formDisabled: otherProps === null || otherProps === void 0 ? void 0 : otherProps.formDisabled,
+      globalControl: otherProps === null || otherProps === void 0 ? void 0 : otherProps.globalControl,
+      // 灵活模式样式属性
+      flexibleGroupProps: {
+        className: formItemClassName,
+        style: formItemStyle
+      }
+    };
+
+    // 如果 child 来自 FormList 的处理，传递 listName
+    if (childListName) {
+      renderOtherProps.listName = childListName;
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_useFieldProps.FieldProvider, {
+      value: renderOtherProps,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Render.default, {
+        show: child.show,
+        form: form,
+        disabled: child.disabled,
+        formDisabled: otherProps === null || otherProps === void 0 ? void 0 : otherProps.formDisabled,
+        type: type,
+        originComponent: child.component,
+        component: TargetComponent,
+        formItemProps: formItemProps,
+        confirm: child.confirm,
+        colProps: {
+          span: 24
+        },
+        componentProps: adjustedFieldProps || {},
+        otherProps: renderOtherProps,
+        fieldProps: child.fieldProps,
+        isSelect: false // 由 Render 内部计算
+        ,
+        diffConfig: otherProps === null || otherProps === void 0 ? void 0 : otherProps.diffConfig,
+        requiredOnView: otherProps === null || otherProps === void 0 ? void 0 : otherProps.requiredOnView,
+        globalControl: otherProps === null || otherProps === void 0 ? void 0 : otherProps.globalControl,
+        viewRender: child.viewRender,
+        shouldUpdateDebounce: otherProps === null || otherProps === void 0 ? void 0 : otherProps.shouldUpdateDebounce
+      })
+    }, child.name || `item-${index}`);
+  };
+
+  // 非compact模式：正常的表单项渲染
+  var renderChildren = () => {
+    var elements = [];
+    var visibleChildren = [];
+
+    // 先过滤出可见的子项
+    children.forEach(child => {
+      var childNamePath = child.namePath || contextProps.namePath;
+      var childIndex = child.index;
+      if ((0, _hooks.checkShouldShow)(child, form, childNamePath, childIndex)) {
+        visibleChildren.push(child);
+      }
+    });
+
+    // 只渲染可见的子项
+    visibleChildren.forEach((child, index) => {
+      // 找到原始索引，用于获取正确的 child 对象和分隔符索引计算
+      var originalIndex = children.findIndex(c => c === child);
+
+      // 渲染表单项
+      var formElement = renderFormItem(child, originalIndex);
+      elements.push(formElement);
+
+      // 添加分隔符（除最后一个元素外）
+      if (index < visibleChildren.length - 1 && space !== null && space !== void 0 && space.separator) {
+        // 检查是否在指定位置添加分隔符
+        var shouldAddSeparator = space.separatorIndex ? Array.isArray(space.separatorIndex) ? space.separatorIndex.includes(originalIndex) : space.separatorIndex === originalIndex : true; // 默认每个元素后都加分隔符
+
+        if (shouldAddSeparator) {
+          elements.push( /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "pro-group-separator-space",
+            children: space.separator
+          }, child.name ? `separator-${child.name}` : `separator-${originalIndex}`));
+        }
+      }
+    });
+    return elements;
+  };
+
+  // compact模式专用：为每个字段创建可见的Form.Item，并使用CSS实现compact视觉效果
+  var renderCompactFormItems = () => {
+    var elements = [];
+    var visibleChildren = [];
+
+    // 先过滤出可见的子项
+    children.forEach(child => {
+      var childNamePath = child.namePath || contextProps.namePath;
+      var childIndex = child.index;
+      if ((0, _hooks.checkShouldShow)(child, form, childNamePath, childIndex)) {
+        visibleChildren.push(child);
+      }
+    });
+
+    // 只渲染可见的子项
+    visibleChildren.forEach((child, index) => {
+      // 找到原始索引，用于获取正确的 child 对象和分隔符索引计算
+      var originalIndex = children.findIndex(c => c === child);
+
+      // 为每个字段创建独立的Form.Item，确保表单校验正常工作
+      var formElement = renderFormItem(child, originalIndex);
+      elements.push(formElement);
+
+      // 添加分隔符
+      if (index < visibleChildren.length - 1 && space !== null && space !== void 0 && space.separator) {
+        var shouldAddSeparator = space.separatorIndex ? Array.isArray(space.separatorIndex) ? space.separatorIndex.includes(originalIndex) : space.separatorIndex === originalIndex : true;
+        if (shouldAddSeparator) {
+          elements.push( /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "pro-group-separator-compact",
+            children: space.separator
+          }, child.name ? `separator-${child.name}` : `separator-${originalIndex}`));
+        }
+      }
+    });
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "ant-space ant-space-horizontal ant-space-compact pro-group-compact-container",
+      children: elements
+    });
+  };
+  var nextClassName = (0, _classnames.default)({
+    'pro-group': true,
+    'pro-group-flexible': true,
+    'pro-group-diy-width': children.some(item => {
+      var _item$fieldProps;
+      return item === null || item === void 0 || (_item$fieldProps = item.fieldProps) === null || _item$fieldProps === void 0 || (_item$fieldProps = _item$fieldProps.style) === null || _item$fieldProps === void 0 ? void 0 : _item$fieldProps.width;
+    }),
+    'pro-group-width-auto': children.some(item => ['Radio', 'Checkbox', 'Switch'].includes(item.type)),
+    'pro-group-view': isView,
+    [`${className}`]: className
+  });
+
+  // 检查是否有子项包含 show 函数，如果有则需要响应式更新
+  var hasShowFunction = children.some(child => (0, _lodash.isFunction)(child.show));
+
+  // 查看模式下空值处理
+  if (isView && (0, _lodash.isEmpty)(children)) {
+    return (otherProps === null || otherProps === void 0 ? void 0 : otherProps.viewEmpty) || '-';
+  }
+
+  // 渲染内容
+  var renderContent = () => {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: nextClassName,
+      id: id,
+      children: space.compact ?
+      // compact模式：使用Form.Item确保表单校验正常工作
+      renderCompactFormItems() : /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Space, {
+        align: "start",
+        size: space.size || 12,
+        separator: isView ? finalSeparator : null,
+        children: renderChildren()
+      })
+    });
+  };
+
+  // 如果有 show 函数，使用 Form.Item 的 shouldUpdate 来监听表单值变化
+  if (hasShowFunction && form) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form.Item, {
+      shouldUpdate: () => true,
+      noStyle: true,
+      children: renderContent
+    });
+  }
+  return renderContent();
+};
+
+/**
+ * FlexibleGroup主组件
+ */
+var FlexibleGroup = props => {
+  var _fieldProps2;
+  var propsChildren = props.children;
+
+  // children可能在props.children或props.fieldProps.children中
+  var children = propsChildren || ((_fieldProps2 = props.fieldProps) === null || _fieldProps2 === void 0 ? void 0 : _fieldProps2.children) || [];
+
+  // 配置验证
+  if (!utils.validateChildren(children)) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorTip, {});
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(FlexibleGroupRender, _objectSpread(_objectSpread({}, props), {}, {
+    children: children
+  }));
+};
+var _default = exports.default = FlexibleGroup;

package/lib/ProForm/components/combination/Group/hooks/index.d.ts

@@ -1,6 +1,6 @@
 import { InternalNamePath, NamePath } from 'antd/lib/form/interface';
 import { FormInstance } from 'antd';
-import type { GroupColumnType, GroupType } from '../propsType';
+import type { GroupColumnType, GroupType, FlexibleGroupColumnType } from '../propsType';
 export type EventArgs = any[];
 interface ColumnsTransformerParams {
     columns: GroupColumnType[];
@@ -16,4 +16,19 @@ interface ColumnsTransformerParams {
 }
 /** 转换columns */
 export declare const useTransformColumns: (params: ColumnsTransformerParams) => any[];
+/**
+ * 检查子项是否应该显示（纯函数，不执行副作用）
+ */
+export declare const checkShouldShow: (child: FlexibleGroupColumnType, form: FormInstance, namePath?: NamePath, index?: number) => boolean;
+interface UseResetProEditTableParams {
+    children: FlexibleGroupColumnType[];
+    form: FormInstance;
+    namePath?: NamePath;
+    source?: 'FormList' | 'ProEditTable';
+}
+/**
+ * ProEditTable 场景下，当字段的 show 从 true 变为 false 时，自动重置字段值
+ * 使用 useEffect 在副作用中执行重置，避免在渲染过程中调用 setState
+ */
+export declare const useResetProEditTable: (params: UseResetProEditTableParams) => void;
 export {};