@zat-design/sisyphus-react 4.1.2-beta.2 → 4.1.2-beta.4

package/lib/ProEditTable/utils/useShouldUpdateForTable.js

@@ -14,7 +14,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var useShouldUpdateForTable = props => {
-  var _isEditableRef$curren, _requiredRef$current, _rulesRef$current, _fieldPropsRef$curren, _desensitizationRef$c, _valueTypeRef$current;
+  var _isEditableRef$curren, _requiredRef$current, _rulesRef$current, _fieldPropsRef$curren, _desensitizationRef$c, _valueTypeRef$current, _componentRef$current;
   var rowParams = props.rowParams,
     column = props.column,
     shouldUpdateDebounce = props.shouldUpdateDebounce;
@@ -26,11 +26,13 @@ var useShouldUpdateForTable = props => {
   var fieldPropsRef = (0, _react.useRef)();
   var desensitizationRef = (0, _react.useRef)();
   var valueTypeRef = (0, _react.useRef)();
+  var componentRef = (0, _react.useRef)();
   var _useState = (0, _react.useState)({}),
     _useState2 = _slicedToArray(_useState, 2),
     reRender = _useState2[1];
   var debouncedUpdateRef = (0, _react.useRef)(null);
   var pendingParamsRef = (0, _react.useRef)(null);
+  var isInitializedRef = (0, _react.useRef)(false);
 
   // 统一处理所有动态属性的更新
   var processUpdate = params => {
@@ -105,6 +107,19 @@ var useShouldUpdateForTable = props => {
     } else {
       valueTypeRef.current = column.valueType;
     }
+
+    // component 处理（注意：component 是 editRender 的别名）
+    var componentOrEditRender = column.component || column.editRender;
+    if ((0, _lodash.isFunction)(componentOrEditRender)) {
+      var newComponent = componentOrEditRender(values, reactiveParams);
+      // 对于 ReactNode 类型的返回值，使用深度比较
+      if (!(0, _lodash.isEqualWith)(componentRef.current, newComponent, _utils.customEqualForFunction)) {
+        componentRef.current = newComponent;
+        hasChange = true;
+      }
+    } else {
+      componentRef.current = componentOrEditRender;
+    }
     if (hasChange) {
       reRender({});
     }
@@ -112,7 +127,8 @@ var useShouldUpdateForTable = props => {
 
   // 创建防抖函数（统一处理所有动态属性）
   (0, _react.useEffect)(() => {
-    if (shouldUpdateDebounce > 0 && ((0, _lodash.isFunction)(column.isEditable) || (0, _lodash.isFunction)(column.required) || (0, _lodash.isFunction)(column.rules) || (0, _lodash.isFunction)(column.fieldProps) || (0, _lodash.isFunction)(column.desensitization) || (0, _lodash.isFunction)(column.valueType))) {
+    var componentOrEditRender = column.component || column.editRender;
+    if (shouldUpdateDebounce > 0 && ((0, _lodash.isFunction)(column.isEditable) || (0, _lodash.isFunction)(column.required) || (0, _lodash.isFunction)(column.rules) || (0, _lodash.isFunction)(column.fieldProps) || (0, _lodash.isFunction)(column.desensitization) || (0, _lodash.isFunction)(column.valueType) || (0, _lodash.isFunction)(componentOrEditRender))) {
       debouncedUpdateRef.current = (0, _lodash.debounce)(() => {
         if (pendingParamsRef.current) {
           processUpdate(pendingParamsRef.current);
@@ -127,13 +143,23 @@ var useShouldUpdateForTable = props => {
   }, [shouldUpdateDebounce, column]);
 
   // 统一的属性处理逻辑
-  if (shouldUpdateDebounce > 0 && debouncedUpdateRef.current) {
-    // 使用防抖延迟更新
-    pendingParamsRef.current = rowParams;
-    debouncedUpdateRef.current();
-  } else {
-    // 立即更新（shouldUpdateDebounce = 0 或无防抖函数）
-    processUpdate(rowParams);
+  // 使用 ref 存储上一次的 rowParams，避免引用变化导致的重复调用
+  var prevRowParamsRef = (0, _react.useRef)(null);
+
+  // 只有当 rowParams 内容真正变化时才处理更新
+  // 或者是第一次初始化
+  var shouldProcess = !isInitializedRef.current || !(0, _lodash.isEqualWith)(prevRowParamsRef.current, rowParams, _utils.customEqualForFunction);
+  if (shouldProcess) {
+    prevRowParamsRef.current = rowParams;
+    isInitializedRef.current = true;
+    if (shouldUpdateDebounce > 0 && debouncedUpdateRef.current) {
+      // 使用防抖延迟更新
+      pendingParamsRef.current = rowParams;
+      debouncedUpdateRef.current();
+    } else {
+      // 立即更新（shouldUpdateDebounce = 0 或无防抖函数）
+      processUpdate(rowParams);
+    }
   }
   return {
     isEditable: (_isEditableRef$curren = isEditableRef.current) !== null && _isEditableRef$curren !== void 0 ? _isEditableRef$curren : column.isEditable,
@@ -141,7 +167,8 @@ var useShouldUpdateForTable = props => {
     rules: (_rulesRef$current = rulesRef.current) !== null && _rulesRef$current !== void 0 ? _rulesRef$current : column.rules,
     fieldProps: (_fieldPropsRef$curren = fieldPropsRef.current) !== null && _fieldPropsRef$curren !== void 0 ? _fieldPropsRef$curren : column.fieldProps,
     desensitization: (_desensitizationRef$c = desensitizationRef.current) !== null && _desensitizationRef$c !== void 0 ? _desensitizationRef$c : column.desensitization,
-    valueType: (_valueTypeRef$current = valueTypeRef.current) !== null && _valueTypeRef$current !== void 0 ? _valueTypeRef$current : column.valueType
+    valueType: (_valueTypeRef$current = valueTypeRef.current) !== null && _valueTypeRef$current !== void 0 ? _valueTypeRef$current : column.valueType,
+    component: (_componentRef$current = componentRef.current) !== null && _componentRef$current !== void 0 ? _componentRef$current : column.component || column.editRender
   };
 };
 var _default = exports.default = useShouldUpdateForTable;

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

@@ -20,6 +20,8 @@ interface Props {
     formItemClassName?: string;
     formItemStyle?: React.CSSProperties;
     dependencies?: NamePath[];
+    required?: boolean;
+    rules?: any[];
 }
 /** 渲染组件 */
 declare const ComRender: React.FC<Props>;

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

@@ -96,6 +96,16 @@ var ComRender = props => {
   // 传统模式 compact 模式：需要 Form.Item 包装并应用宽度样式
   // 通过 formItemClassName 和 formItemStyle 来判断是否需要 Form.Item 包装
   if (formItemClassName && name) {
+    // 从 rest 中提取 required 和 rules，在非编辑态时移除校验
+    var formItemProps = _objectSpread({
+      name,
+      className: formItemClassName,
+      style: formItemStyle
+    }, isView ? {} : {
+      required: rest === null || rest === void 0 ? void 0 : rest.required,
+      rules: rest === null || rest === void 0 ? void 0 : rest.rules
+    });
+
     // 如果有依赖字段，使用 shouldUpdate 来实时更新错误状态
     if (dependencies && dependencies.length > 0) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form.Item, {
@@ -109,7 +119,7 @@ var ComRender = props => {
           });
           var hasChanged = currentFieldChanged || dependenciesChanged;
           // 当检测到变化时，触发字段校验以更新错误状态
-          if (hasChanged && contextProps !== null && contextProps !== void 0 && contextProps.form && name) {
+          if (hasChanged && contextProps !== null && contextProps !== void 0 && contextProps.form && name && !isView) {
             setTimeout(() => {
               contextProps.form.validateFields([name]).catch(() => {});
             }, 0);
@@ -117,10 +127,7 @@ var ComRender = props => {
           return hasChanged;
         },
         noStyle: true,
-        children: () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form.Item, {
-          name: name,
-          className: formItemClassName,
-          style: formItemStyle,
+        children: () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form.Item, _objectSpread(_objectSpread({}, formItemProps), {}, {
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_useFieldProps.FieldProvider, {
             value: _objectSpread(_objectSpread({}, contextProps), {}, {
               valueType,
@@ -129,14 +136,11 @@ var ComRender = props => {
             }),
             children: renderComponent
           })
-        })
+        }))
       });
     }
     // 没有依赖字段，直接渲染 Form.Item
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form.Item, {
-      name: name,
-      className: formItemClassName,
-      style: formItemStyle,
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form.Item, _objectSpread(_objectSpread({}, formItemProps), {}, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_useFieldProps.FieldProvider, {
         value: _objectSpread(_objectSpread({}, contextProps), {}, {
           valueType,
@@ -145,7 +149,7 @@ var ComRender = props => {
         }),
         children: renderComponent
       })
-    });
+    }));
   }
 
   // 非传统模式 compact 模式：直接渲染组件

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

@@ -127,16 +127,16 @@ var FlexibleGroupRender = props => {
     var childDisabled = typeof child.disabled === 'function' ? false : child.disabled;
     var finalDisabled = groupDisabled || childDisabled;
 
-    // 构建 formItemProps
+    // 构建 formItemProps - 在非编辑态时移除校验规则
     var formItemProps = {
       name: fullName,
       label: child.label,
-      rules: child.rules,
+      rules: isView ? undefined : child.rules,
       dependencies: processedDependencies,
       extra: child.extra,
       before: child.before,
       after: child.after,
-      required: child.required,
+      required: isView ? undefined : child.required,
       disabled: finalDisabled,
       validateFirst: child.validateFirst
     };
@@ -157,13 +157,40 @@ var FlexibleGroupRender = props => {
       formItemProps.tooltip = child.tooltip;
     }
 
+    // 在ProEditTable场景下，如果同组其他字段有值，则当前字段空值不显示 -
+    var childViewEmpty = otherProps === null || otherProps === void 0 ? void 0 : otherProps.viewEmpty;
+    if (isView && (otherProps === null || otherProps === void 0 ? void 0 : otherProps.source) === 'ProEditTable' && form && children.length > 1) {
+      // 检查同组其他字段是否有值
+      var hasOtherValues = children.some(otherChild => {
+        if (otherChild === child) return false; // 跳过当前字段
+
+        var otherChildNamePath = otherChild.namePath || contextProps.namePath;
+        var otherFullName = (() => {
+          if (otherChildNamePath && Array.isArray(otherChild.name) && otherChild.name.length > 1) {
+            return [...otherChildNamePath, ...otherChild.name];
+          }
+          if (otherChildNamePath) {
+            return [...otherChildNamePath, otherChild.name];
+          }
+          return otherChild.name;
+        })();
+        var value = form.getFieldValue(otherFullName);
+        return value !== undefined && value !== null && value !== '';
+      });
+
+      // 如果有其他字段有值，当前字段空值显示为空字符串
+      if (hasOtherValues) {
+        childViewEmpty = '';
+      }
+    }
+
     // 构建 otherProps
     var renderOtherProps = {
       label: child.label,
       name: fullName,
       disabled: finalDisabled,
       isView,
-      viewEmpty: otherProps === null || otherProps === void 0 ? void 0 : otherProps.viewEmpty,
+      viewEmpty: childViewEmpty,
       valueType: child.valueType,
       form,
       type,
@@ -277,12 +304,16 @@ var FlexibleGroupRender = props => {
       elements.push(formElement);
 
       // 添加分隔符
-      if (index < visibleChildren.length - 1 && space !== null && space !== void 0 && space.separator) {
+      // 查看模式下，如果没有配置separator，使用默认的 finalSeparator
+      var separatorToUse = isView ? (space === null || space === void 0 ? void 0 : space.separator) || finalSeparator : space === null || space === void 0 ? void 0 : space.separator;
+      if (index < visibleChildren.length - 1 && separatorToUse) {
         var shouldAddSeparator = space.separatorIndex ? Array.isArray(space.separatorIndex) ? space.separatorIndex.includes(originalIndex) : space.separatorIndex === originalIndex : true;
         if (shouldAddSeparator) {
+          // 查看模式下使用不同的className，避免显示边框
+          var separatorClassName = isView ? 'pro-group-separator-compact pro-group-separator-view' : 'pro-group-separator-compact';
           elements.push( /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            className: "pro-group-separator-compact",
-            children: space.separator
+            className: separatorClassName,
+            children: separatorToUse
           }, child.name ? `separator-${child.name}` : `separator-${originalIndex}`));
         }
       }
@@ -312,6 +343,29 @@ var FlexibleGroupRender = props => {
     return (otherProps === null || otherProps === void 0 ? void 0 : otherProps.viewEmpty) || '-';
   }
 
+  // 查看模式下，检查所有children的值是否都为空
+  if (isView && form && children.length > 0) {
+    var allValuesEmpty = children.every(child => {
+      var childNamePath = child.namePath || contextProps.namePath;
+      var fullName = (() => {
+        if (childNamePath && Array.isArray(child.name) && child.name.length > 1) {
+          return [...childNamePath, ...child.name];
+        }
+        if (childNamePath) {
+          return [...childNamePath, child.name];
+        }
+        return child.name;
+      })();
+      var value = form.getFieldValue(fullName);
+      return value === undefined || value === null || value === '';
+    });
+
+    // 如果所有值都为空，显示一个 -
+    if (allValuesEmpty) {
+      return (otherProps === null || otherProps === void 0 ? void 0 : otherProps.viewEmpty) || '-';
+    }
+  }
+
   // 渲染内容
   var renderContent = () => {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

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

@@ -4,6 +4,15 @@
   display: flex;
   width: unset !important;
 
+  &.pro-group-view {
+    .pro-group-form-item {
+      flex: 0 0 auto !important;
+   
+    }
+    .@{ant-prefix}-space-compact .pro-group-separator-compact{
+      color: #333 !important;
+    }
+  }
 
 
   &.pro-group-view {
@@ -385,6 +394,13 @@
       // margin: 0 !important;
     }
 
+    // 查看模式下，Form.Item不平分空间，而是根据内容自适应
+    &.pro-group-view {
+      .pro-group-form-item {
+        flex: 0 0 auto;
+      }
+    }
+
     // 当有自定义宽度时，只有设置了宽度的 Form.Item 不使用 flex:1
     &.pro-group-diy-width {
       // 覆盖 Space.Compact 内设置了宽度的 Form.Item
@@ -430,7 +446,7 @@
         }
 
         .@{ant-prefix}-input-number-input {
-          border-left: 1px solid #ff4d4f !important;
+          border-left: 0 !important;
         }
       }
 
@@ -467,6 +483,15 @@
     margin-left: -1px;
   }
 
+  // 查看模式下的分隔符样式 - 移除边框，使用简洁样式
+  .pro-group-separator-view {
+    border: none !important;
+    background: transparent !important;
+    padding: 0 2px !important;
+    margin-inline-start: 0 !important;
+    color: #999 !important;
+  }
+
 
   /* 1. 处理第一个子元素：左上、左下圆角 */
   > .pro-group-form-item:first-child{

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

@@ -75,16 +75,15 @@ export declare const useFormItemProps: (column: FlexibleGroupColumnType, context
     confirm?: boolean | import("antd").ModalFuncProps | import("../../../render/propsType").FunctionArgs<any, boolean | import("antd").ModalFuncProps>;
     show?: boolean | ReactiveFunction<any, boolean>;
     component?: React.ReactNode | ReactiveFunction<any, React.ReactNode>;
-    id?: string;
+    status?: "" | "success" | "warning" | "error" | "validating";
     className?: string;
     hidden?: boolean;
+    id?: string;
     style?: React.CSSProperties;
     children?: React.ReactNode | ((form: FormInstance<any>) => React.ReactNode);
     onReset?: () => void;
     prefixCls?: string;
-    status?: "" | "warning" | "error" | "success" | "validating";
     rootClassName?: string;
-    isView?: boolean;
     colon?: boolean;
     htmlFor?: string;
     labelAlign?: import("antd/es/form/interface").FormLabelAlign;
@@ -108,25 +107,26 @@ export declare const useFormItemProps: (column: FlexibleGroupColumnType, context
     hasFeedback?: boolean | {
         icons: import("antd/es/form/FormItem").FeedbackIcons;
     };
-    validateStatus?: "" | "warning" | "error" | "success" | "validating";
+    validateStatus?: "" | "success" | "warning" | "error" | "validating";
     layout?: import("antd/es/form/Form").FormItemLayout;
     wrapperCol?: import("antd").ColProps;
     help?: React.ReactNode;
     fieldId?: string;
     valueType?: import("../../../render/propsType").ProFormValueType;
-    switchValue?: [any, any];
     viewRender?: (value: any, record: any, { form, index, namePath, }: {
         [key: string]: any;
         form: FormInstance<any>;
         index?: number;
     }) => string | React.ReactElement<any, any>;
+    desensitization?: [number, number] | ReactiveFunction<any, [number, number]>;
+    isView?: boolean;
+    switchValue?: [any, any];
     viewType?: import("../../../render/propsType").ViewType;
     trim?: boolean;
     upperCase?: boolean;
     toISOString?: boolean;
     toCSTString?: boolean;
     clearNotShow?: boolean;
-    desensitization?: [number, number] | ReactiveFunction<any, [number, number]>;
     name: any;
     dependencies: any[];
     tooltip: string | {
@@ -141,7 +141,7 @@ export declare const useFormItemProps: (column: FlexibleGroupColumnType, context
  * 创建组件属性
  */
 export declare const createComponentProps: (column: FlexibleGroupColumnType, formItemProps: any) => {
-    componentProps: import("lodash").Omit<any, "format" | "valueType" | "switchValue" | "dependNames" | "toISOString" | "toCSTString" | "clearNotShow" | "precision">;
+    componentProps: import("lodash").Omit<any, "valueType" | "precision" | "format" | "switchValue" | "dependNames" | "toISOString" | "toCSTString" | "clearNotShow">;
     formItemTransform: {
         getValueProps: any;
         normalize: any;

package/lib/ProForm/components/combination/ProCascader/propsType.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { DefaultOptionType } from 'rc-select/lib/Select';
+import { DefaultOptionType } from '@rc-component/select/es/Select';
 import { Service, Options } from 'ahooks/lib/useRequest/src/types';
 export interface FieldNamesType {
     label: string;

package/lib/ProForm/propsType.d.ts

@@ -1,9 +1,9 @@
+import React, { ReactNode } from 'react';
 import { ButtonProps, ColProps, RowProps } from 'antd';
 import { FormProps, FormInstance } from 'antd/es/form/Form';
 import { NamePath } from 'antd/es/form/interface';
-import { StoreValue, Store } from 'rc-field-form/es/interface.d';
-import { ShouldUpdate } from 'rc-field-form/es/Field.d';
-import React, { ReactNode } from 'react';
+import type { StoreValue, Store } from '@rc-component/form/es/interface';
+import type { ShouldUpdate } from '@rc-component/form/es/Field';
 import type { ProFormColumnType, ViewType } from './components/render/propsType';
 import type { ProFormComponentType } from './components';
 export interface ButtonType extends ButtonProps {

package/lib/ProForm/utils/transformValue.d.ts

@@ -1,6 +1,6 @@
 import { FormInstance, FormItemProps } from 'antd';
 import { NamePath } from 'antd/es/form/interface';
-import { StoreValue, Store } from 'rc-field-form/es/interface.d';
+import type { StoreValue, Store } from '@rc-component/form/es/interface';
 import type { TransformType } from '../propsType';
 export declare const transformValue: (names: NamePath[], form: FormInstance, fieldName: NamePath, normalize?: (value: StoreValue, prevValue: StoreValue, allValues: Store) => StoreValue, getValueProps?: FormItemProps['getValueProps']) => TransformType;
 export default transformValue;

package/lib/ProForm/utils/useForm.d.ts

@@ -1,6 +1,6 @@
 import { FormInstance } from 'antd';
 import { NamePath } from 'antd/es/form/interface';
-import { ValuedNotifyInfo } from 'rc-field-form/es/interface';
+import type { ValuedNotifyInfo } from '@rc-component/form/es/interface';
 export type ModifiedFormInstanceType<T> = FormInstance<T> & {
     isModified?: boolean;
     /** 默认清空设置值的报错状态 */

package/lib/ProForm/utils/useWatch.d.ts

@@ -1,4 +1,5 @@
-import { FormInstance, NamePath } from 'rc-field-form/es/interface';
+import { FormInstance } from 'antd/es/form/Form';
+import { NamePath } from 'antd/es/form/interface';
 export declare function toArray<T>(value?: T | T[] | null): T[];
 /**
  * ProForm的useWatch hook，用于监听表单字段变化

package/lib/ProForm/utils/useWatch.js

@@ -120,7 +120,9 @@ function useWatch(dependencies, form, wait) {
       }
     }
     return paths;
-  }, [/* dependencies 故意忽略，与原实现一致 */]);
+  }, [
+    /* dependencies 故意忽略，与原实现一致 */
+  ]);
 
   // 保存防抖函数引用，避免重复创建
   var debouncedFn = (0, _react.useMemo)(() => {

package/lib/ProUpload/propsType.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { UploadFile } from 'antd/es/upload/interface';
-import { UploadRequestOption } from 'rc-upload/lib/interface';
+import type { UploadRequestOption } from '@rc-component/upload/es/interface';
 export type UploadType = 'drag' | 'button' | 'image';
 export interface UploadFileResType {
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "4.1.2-beta.2",
+  "version": "4.1.2-beta.4",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -44,6 +44,8 @@
     "lint": "npm run lint:js && npm run lint:style && npm run lint:prettier",
     "lint-staged": "lint-staged",
     "lint-staged:js": "eslint --ext .js,.jsx,.ts,.tsx --ignore-pattern '**/__tests__/**' --ignore-pattern '**/*.test.*' --ignore-pattern '**/*.spec.*'",
+    "code-standards:check": "node ./scripts/code-standards-check.mjs",
+    "git:pull:dev_4": "git pull --tags --no-rebase origin dev_4",
     "lint:fix": "eslint --fix --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src",
     "lint:js": "eslint --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src",
     "lint:prettier": "prettier --check \"**/*\" --end-of-line auto",
@@ -62,7 +64,7 @@
   "husky": {
     "hooks": {
       "commit-msg": "commitlint -E HUSKY_GIT_PARAMS",
-      "pre-commit": "npm run lint-staged"
+      "pre-commit": "npm run lint-staged && npm run code-standards:check"
     }
   },
   "lint-staged": {