@zat-design/sisyphus-react 4.0.0-beta.9 → 4.0.1

package/lib/ProForm/components/combination/FormList/index.js

@@ -1,12 +1,9 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _react = _interopRequireWildcard(require("react"));
 var _antd = require("antd");
 var _core = require("@dnd-kit/core");
@@ -21,6 +18,14 @@ var _Empty = _interopRequireDefault(require("./components/Empty"));
 var _ProForm = _interopRequireDefault(require("../../../../ProForm"));
 var _ProConfigProvider = require("../../../../ProConfigProvider");
 var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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 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 FormList = (props, ref) => {
   var columns = props.columns,
     min = props.min,
@@ -38,7 +43,7 @@ var FormList = (props, ref) => {
     hideStartEndActionProps = props.hideStartEndActionProps,
     titlePosition = props.titlePosition,
     className = props.className;
-  var _fields = fields.map(item => (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
+  var _fields = fields.map(item => _objectSpread(_objectSpread({}, item), {}, {
     key: String(item.key)
   }));
   var _ref = _ProForm.default.useFieldProps() || {},
@@ -52,18 +57,51 @@ var FormList = (props, ref) => {
   var errors = meta.errors;
   var _namePath = namePath ? [...namePath.slice(0, -1), ...(0, _utils.toArray)(name)] : (0, _utils.toArray)(name);
   var orgValues = (0, _lodash.get)(diffConfig === null || diffConfig === void 0 ? void 0 : diffConfig.originalValues, name);
-  var _diffConfig = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, diffConfig), {}, {
+  var _diffConfig = _objectSpread(_objectSpread({}, diffConfig), {}, {
     originalValues: diffConfig !== null && diffConfig !== void 0 && diffConfig.originalValues && isDiffAll ? orgValues || [] : orgValues
   });
   var processColumns = (0, _react.useCallback)((fieldName, namePath) => {
     return columns.map(item => {
+      // 如果是灵活模式的 Group，需要给 children 添加参数
+      if (!(0, _utils2.isLegacyMode)(item) && (item === null || item === void 0 ? void 0 : item.type) === 'Group') {
+        var fieldProps = item === null || item === void 0 ? void 0 : item.fieldProps;
+        var children = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.children;
+        if (children) {
+          var childrenArray = Array.isArray(children) ? children : [children];
+          // 给每个 child 添加 index、name、namePath、listName 参数
+          var processedChildren = childrenArray.map(child => {
+            var childName = child === null || child === void 0 ? void 0 : child.name;
+            return _objectSpread(_objectSpread({}, child), {}, {
+              index: fieldName,
+              name: [fieldName, ...(0, _utils.toArray)(childName)],
+              namePath,
+              listName: childName ? [...namePath, ...(0, _utils.toArray)(childName)] : undefined,
+              source: 'FormList'
+            });
+          });
+
+          // 创建新的 fieldProps，包含处理后的 children
+          var newFieldProps = _objectSpread(_objectSpread({}, fieldProps), {}, {
+            children: Array.isArray(children) ? processedChildren : processedChildren[0]
+          });
+
+          // 创建新的 column，使用新的 fieldProps
+          var _column = _objectSpread(_objectSpread({}, item), {}, {
+            fieldProps: newFieldProps,
+            index: fieldName,
+            label: mode === 'less' ? undefined : item.label
+          });
+          return _column;
+        }
+      }
+
       // names的name处理
       var _name = Array.isArray(item === null || item === void 0 ? void 0 : item.names) ? [fieldName, (0, _utils2.namesPathTransform)({
         names: item === null || item === void 0 ? void 0 : item.names,
         prefixNamePath: namePath,
         type: item.type
       })] : [fieldName, ...(0, _utils.toArray)(item.name)];
-      var column = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
+      var column = _objectSpread(_objectSpread({}, item), {}, {
         name: _name,
         names: item !== null && item !== void 0 && item.names ? item.names.map(nameItem => {
           // 传给Group的names会被渲染成真实FormItem 不能传完整name
@@ -71,12 +109,12 @@ var FormList = (props, ref) => {
         }) : item.names,
         index: fieldName,
         namePath,
-        listName: [...namePath, item.name],
+        listName: item.name ? [...namePath, ...(0, _utils.toArray)(item.name)] : undefined,
         label: mode === 'less' ? undefined : item.label
       });
       return column;
     });
-  }, [columns]);
+  }, [columns, mode]);
   (0, _react.useImperativeHandle)(ref, () => {
     return {
       operation
@@ -103,7 +141,7 @@ var FormList = (props, ref) => {
         children: [_fields.map((field, index) => {
           var namePath = [..._namePath, field.name];
           var _columns = processColumns(index, namePath);
-          return mode === 'block' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_BlockFields.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
+          return mode === 'block' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_BlockFields.default, _objectSpread(_objectSpread({}, props), {}, {
             columns: _columns,
             disabled: disabled,
             isView: isView,
@@ -117,7 +155,7 @@ var FormList = (props, ref) => {
             diffConfig: _diffConfig,
             hideStartEndActionProps: hideStartEndActionProps,
             titlePosition: titlePosition
-          }), field.key) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_LineFields.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({
+          }), field.key) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_LineFields.default, _objectSpread(_objectSpread({
             className: _fields.length === index + 1 ? 'pro-form-list-last' : ''
           }, props), {}, {
             mode: mode,

package/lib/ProForm/components/combination/FormList/style/index.less

@@ -130,7 +130,7 @@
 
 // 左侧标题布局样式
 .pro-form-list-mode-block.pro-form-list-title-left {
-  .@{ant-prefix}-collapse-header-text{
+  .@{ant-prefix}-collapse-title{
     display: none;
   }
   .pro-form-list-left-title-wrapper {

package/lib/ProForm/components/combination/FormList/utils.d.ts

@@ -1,3 +1,9 @@
+/**
+ * 判断 Group 组件是否为传统模式（LegacyMode）
+ * @param item column 配置项
+ * @returns true 表示传统模式，false 表示灵活模式
+ */
+export declare const isLegacyMode: (item: any) => boolean;
 /**
  * namesPath生产 [['list', 0, 'min'], ['list', 0, 'max']] => list_0_min-list_0_max
  * @param names  name的集合

package/lib/ProForm/components/combination/FormList/utils.js

@@ -1,18 +1,36 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.namesPathTransform = exports.memoWith = void 0;
+exports.namesPathTransform = exports.memoWith = exports.isLegacyMode = void 0;
 var _lodash = require("lodash");
 var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * 判断 Group 组件是否为传统模式（LegacyMode）
+ * @param item column 配置项
+ * @returns true 表示传统模式，false 表示灵活模式
+ */
+var isLegacyMode = item => {
+  var _item$otherProps;
+  if ((item === null || item === void 0 ? void 0 : item.type) !== 'Group') {
+    return true; // 非 Group 类型，不需要特殊处理，返回 true 表示按原样处理
+  }
+  // names 可能在 item.names 或 item.otherProps.names 中（参考 Group/index.tsx 的实现）
+  var names = (item === null || item === void 0 ? void 0 : item.names) || (item === null || item === void 0 || (_item$otherProps = item.otherProps) === null || _item$otherProps === void 0 ? void 0 : _item$otherProps.names);
+  // 传统模式：有 names 属性且为非空数组
+  // 灵活模式：无 names 属性或 names 为空
+  return Array.isArray(names) && names.length > 0;
+};
+
 /**
  * namesPath生产 [['list', 0, 'min'], ['list', 0, 'max']] => list_0_min-list_0_max
  * @param names  name的集合
  * @param prefixNamePath formList的name前缀
  * @returns list_0_min-list_0_max
  */
+exports.isLegacyMode = isLegacyMode;
 var namesPathTransform = _ref => {
   var names = _ref.names,
     prefixNamePath = _ref.prefixNamePath,

package/lib/ProForm/components/combination/Group/component/AddonWrapper/index.js

@@ -1,6 +1,5 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -8,6 +7,7 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 require("./index.less");
 var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 var AddonWrapper = props => {
   var before = props.before,
     after = props.after,

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

@@ -17,6 +17,9 @@ interface Props {
     isView?: boolean;
     getValueProps?: (value: any) => Record<string, unknown>;
     viewRender?: (props: any) => any;
+    formItemClassName?: string;
+    formItemStyle?: React.CSSProperties;
+    dependencies?: NamePath[];
 }
 /** 渲染组件 */
 declare const ComRender: React.FC<Props>;

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;