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

package/es/ProForm/components/combination/Group/hooks/index.js

@@ -1,12 +1,11 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _isEqual from "lodash/isEqual";
-import _cloneDeep from "lodash/cloneDeep";
 /* eslint-disable no-lonely-if */
 import { useRef } from 'react';
-import { useDeepCompareMemo } from '../../../../utils/useDeepCompareMemo';
-import { difference } from '../../../../../ProEditTable/utils/tools';
-import { getReactiveProps, getValueTypeTrans, valueFromEventWrapper } from '../utils';
+import { cloneDeep, isEqual } from 'lodash';
+import { useDeepCompareMemo } from "../../../../utils/useDeepCompareMemo";
+import { difference } from "../../../../../ProEditTable/utils/tools";
+import { getReactiveProps, getValueTypeTrans, valueFromEventWrapper } from "../utils";
 /** 转换columns */
 export var useTransformColumns = function useTransformColumns(params) {
   var form = params.form,
@@ -37,11 +36,10 @@ export var useTransformColumns = function useTransformColumns(params) {
     var _ref = fieldProps || {},
       mode = _ref.mode,
       onChange = _ref.onChange,
-      onFieldChange = _ref.onFieldChange,
-      comDisabled = _ref.disabled,
-      onBlur = _ref.onBlur;
+      comDisabled = _ref.disabled;
     var _disabled = disabled || comDisabled;
     var columnName = names ? names[index] : [].concat(name, index);
+
     // 响应式字段改变后的回调
     var changedCallback = function changedCallback(lastDependency, current) {
       // 清值防抖  多次刷新时以最后一次为准
@@ -52,7 +50,7 @@ export var useTransformColumns = function useTransformColumns(params) {
             if (names) {
               form.resetFields([columnName]);
             }
-            if (!names && (value === null || value === void 0 ? void 0 : value.length)) {
+            if (!names && value !== null && value !== void 0 && value.length) {
               value[index] = null;
               form.setFieldValue(columnName, _toConsumableArray(value));
             }
@@ -62,6 +60,7 @@ export var useTransformColumns = function useTransformColumns(params) {
         }
       }
     };
+
     // 响应式字段
     // eslint-disable-next-line react-hooks/rules-of-hooks
     var reactiveProps = useDeepCompareMemo(function () {
@@ -78,6 +77,11 @@ export var useTransformColumns = function useTransformColumns(params) {
         desensitization: desensitization
       });
     }, changedCallback, [value, show, fieldProps, _disabled, columnName, type]);
+
+    // 从处理后的fieldProps中获取事件处理器
+    var _ref2 = reactiveProps.fieldProps || {},
+      onFieldChange = _ref2.onFieldChange,
+      onBlur = _ref2.onBlur;
     if (reactiveProps.show === false) {
       return [];
     }
@@ -95,32 +99,43 @@ export var useTransformColumns = function useTransformColumns(params) {
         args[_key] = arguments[_key];
       }
       newValue = valueFromEventWrapper(column, args);
-      if (transform === null || transform === void 0 ? void 0 : transform.normalize) {
+      if (transform !== null && transform !== void 0 && transform.normalize) {
         var _transform$normalize;
-        newValue = transform === null || transform === void 0 ? void 0 : (_transform$normalize = transform.normalize) === null || _transform$normalize === void 0 ? void 0 : _transform$normalize.call(transform, newValue);
+        newValue = transform === null || transform === void 0 || (_transform$normalize = transform.normalize) === null || _transform$normalize === void 0 ? void 0 : _transform$normalize.call(transform, newValue);
       } else if (normalize) {
         // @ts-ignore
         newValue = normalize === null || normalize === void 0 ? void 0 : normalize(newValue);
       }
-      internalChange === null || internalChange === void 0 ? void 0 : internalChange(newValue, args[1], index);
+
+      // 根据模式选择值管理方式
+      if (names) {
+        // 独立字段模式：设置单个字段值 + 触发整体校验
+        form.setFieldValue(columnName, newValue);
+        // 确保触发Group整体的校验
+        internalChange === null || internalChange === void 0 || internalChange(newValue, args[1], index);
+      } else {
+        // 数组值模式
+        internalChange === null || internalChange === void 0 || internalChange(newValue, args[1], index);
+      }
       var values = form.getFieldValue(namePath);
-      var originRow = (namePath === null || namePath === void 0 ? void 0 : namePath.length) ? _cloneDeep(values) : undefined;
-      onChange === null || onChange === void 0 ? void 0 : onChange.apply(void 0, args);
-      onFieldChange === null || onFieldChange === void 0 ? void 0 : onFieldChange(newValue, values, {
+      var originRow = namePath !== null && namePath !== void 0 && namePath.length ? cloneDeep(values) : undefined;
+      onChange === null || onChange === void 0 || onChange.apply(void 0, args);
+      onFieldChange === null || onFieldChange === void 0 || onFieldChange(newValue, values, {
         index: outerIndex,
         namePath: namePath,
         form: form,
         option: args === null || args === void 0 ? void 0 : args[1]
       });
+
       // 如果是在可编辑表格或formList内部, 储存当前行的值, 并在变更后更新到表单里
-      if ((namePath === null || namePath === void 0 ? void 0 : namePath.length) && !_isEqual(originRow, values)) {
+      if (namePath !== null && namePath !== void 0 && namePath.length && !isEqual(originRow, values)) {
         var _Object$keys, _Object$keys$map;
         form.setFieldValue(namePath, values);
         var diff = difference(originRow, values) || {};
-        var validateFieldKeys = (_Object$keys = Object.keys(diff)) === null || _Object$keys === void 0 ? void 0 : (_Object$keys$map = _Object$keys.map) === null || _Object$keys$map === void 0 ? void 0 : _Object$keys$map.call(_Object$keys, function (key) {
+        var validateFieldKeys = (_Object$keys = Object.keys(diff)) === null || _Object$keys === void 0 || (_Object$keys$map = _Object$keys.map) === null || _Object$keys$map === void 0 ? void 0 : _Object$keys$map.call(_Object$keys, function (key) {
           return [].concat(_toConsumableArray(namePath), [key]);
         });
-        if (validateFieldKeys === null || validateFieldKeys === void 0 ? void 0 : validateFieldKeys.length) {
+        if (validateFieldKeys !== null && validateFieldKeys !== void 0 && validateFieldKeys.length) {
           setTimeout(function () {
             form.validateFields([name].concat(_toConsumableArray(validateFieldKeys)));
           }, 100);
@@ -133,13 +148,14 @@ export var useTransformColumns = function useTransformColumns(params) {
       for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
         args[_key2] = arguments[_key2];
       }
-      onBlur === null || onBlur === void 0 ? void 0 : onBlur(args[0], values, {
+      onBlur === null || onBlur === void 0 || onBlur(args[0], values, {
         index: outerIndex,
         namePath: namePath,
         form: form,
         option: args === null || args === void 0 ? void 0 : args[1]
       });
     };
+
     // 内外一个为true则为true
     var getLastDisabled = function getLastDisabled() {
       if (Array.isArray(groupProps.disabled)) {

package/es/ProForm/components/combination/Group/index.d.ts

@@ -1,4 +1,10 @@
 import React from 'react';
 import type { GroupType } from './propsType';
-declare const _default: React.NamedExoticComponent<GroupType>;
-export default _default;
+/**
+ * 1. 外层过滤FormItem相关属性, 但是子元素上的 required [disabled] [show] rules [fieldProps] [component] 需要取到并
+ * 2.
+ *
+ * render内部能力 show, component, value, onChange, disabled, clearNotShow, fieldProps
+ */
+declare const Group: React.FC<GroupType>;
+export default Group;

package/es/ProForm/components/combination/Group/index.js

@@ -1,22 +1,22 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _omit from "lodash/omit";
-import _isEqual from "lodash/isEqual";
-import { jsx as _jsx } from "react/jsx-runtime";
 import { Space } from 'antd';
-import React, { memo } from 'react';
+import React from 'react';
+import { omit } from 'lodash';
 import classnames from 'classnames';
-import { insertSeparator } from './utils';
-import { useTransformColumns } from './hooks';
-import ProForm from '../../../../ProForm';
-import ComRender from './component/ComRender';
+import { insertSeparator } from "./utils";
+import { useTransformColumns } from "./hooks";
+import ProForm from "../../../../ProForm";
+import ComRender from "./component/ComRender";
+
 /**
  * 1. 外层过滤FormItem相关属性, 但是子元素上的 required [disabled] [show] rules [fieldProps] [component] 需要取到并
  * 2.
  *
  * render内部能力 show, component, value, onChange, disabled, clearNotShow, fieldProps
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 var Group = function Group(props) {
   var children = props.children,
     className = props.className,
@@ -39,13 +39,14 @@ var Group = function Group(props) {
     namePath = contextProps.namePath,
     index = contextProps.index,
     isView = contextProps.isView;
-  var _option = React.useRef([]);
+  var nextOption = React.useRef([]);
+
   // 组合onChange
   var handleChange = function handleChange(value, option, index) {
-    var _value = props.value ? _toConsumableArray(props.value) : [];
-    _value[index] = value;
-    _option.current[index] = option;
-    onChange(_value, _option.current);
+    var nextValue = props.value ? _toConsumableArray(props.value) : [];
+    nextValue[index] = value;
+    nextOption.current[index] = option;
+    onChange(nextValue, nextOption.current);
   };
   var columnsProps = useTransformColumns({
     columns: children,
@@ -61,42 +62,42 @@ var Group = function Group(props) {
     desensitizationKey: desensitizationKey
   });
   var columns = insertSeparator(columnsProps, space);
-  var _className = classnames(_defineProperty({
+  var nextClassName = classnames(_defineProperty({
     'pro-group': true,
     'pro-group-diy-width': columns.some(function (item) {
-      var _item$fieldProps, _item$fieldProps$styl;
-      return item === null || item === void 0 ? void 0 : (_item$fieldProps = item.fieldProps) === null || _item$fieldProps === void 0 ? void 0 : (_item$fieldProps$styl = _item$fieldProps.style) === null || _item$fieldProps$styl === void 0 ? void 0 : _item$fieldProps$styl.width;
+      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': columns.some(function (item) {
       return ['Radio', 'Checkbox', 'Switch'].includes(item.type);
     })
   }, "".concat(className), className));
-  return _jsx("div", {
-    className: _className,
+  return /*#__PURE__*/_jsx("div", {
+    className: nextClassName,
     id: id,
-    children: space.compact || (space === null || space === void 0 ? void 0 : space.separator) ? _jsx(Space.Compact, {
+    children: space.compact || space !== null && space !== void 0 && space.separator ? /*#__PURE__*/_jsx(Space.Compact, {
       children: columns.map(function (column, index) {
         column.otherProps = otherProps;
         // 自定义间隔移除对应参数
-        if (column === null || column === void 0 ? void 0 : column.separator) {
+        if (column !== null && column !== void 0 && column.separator) {
           delete column.separator;
           delete column.otherProps;
         }
-        return _jsx(ComRender, _objectSpread({
+        return /*#__PURE__*/_jsx(ComRender, _objectSpread({
           contextProps: contextProps,
           isView: isParentView || isView
         }, column), column.name || index);
       })
-    }) : _jsx(Space, _objectSpread(_objectSpread({
+    }) : /*#__PURE__*/_jsx(Space, _objectSpread(_objectSpread({
       align: "start"
-    }, _omit(space, ['separator', 'compact'])), {}, {
+    }, omit(space, ['separator', 'compact'])), {}, {
       children: columns.map(function (column, index) {
         column.otherProps = otherProps;
-        if (column === null || column === void 0 ? void 0 : column.separator) {
+        if (column !== null && column !== void 0 && column.separator) {
           delete column.separator;
           delete column.otherProps;
         }
-        return _jsx(ComRender, _objectSpread({
+        return /*#__PURE__*/_jsx(ComRender, _objectSpread({
           contextProps: contextProps,
           isView: isParentView || isView
         }, column), column.name || index);
@@ -104,10 +105,4 @@ var Group = function Group(props) {
     }))
   });
 };
-export default /*#__PURE__*/memo(Group, function (prevProps, nextProps) {
-  // 基本props比较 只比较关键的
-  if (!_isEqual(prevProps === null || prevProps === void 0 ? void 0 : prevProps.value, nextProps === null || nextProps === void 0 ? void 0 : nextProps.value) || (prevProps === null || prevProps === void 0 ? void 0 : prevProps.disabled) !== (nextProps === null || nextProps === void 0 ? void 0 : nextProps.disabled) || !_isEqual(prevProps === null || prevProps === void 0 ? void 0 : prevProps.children, nextProps === null || nextProps === void 0 ? void 0 : nextProps.children)) {
-    return false;
-  }
-  return true;
-});
+export default Group;

package/es/ProForm/components/combination/Group/utils.js

@@ -1,17 +1,19 @@
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
-import _isFunction from "lodash/isFunction";
-import { jsx as _jsx } from "react/jsx-runtime";
+/* eslint-disable no-lonely-if */
+
+import { isFunction } from 'lodash';
 import { validate } from '@zat-design/utils';
 import { Button } from 'antd';
-import valueTypeMap from '../../../utils/valueType';
+import valueTypeMap from "../../../utils/valueType";
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * 插入间隔符
  * @param columns 表单配置数组
  * @returns
  */
 export var insertSeparator = function insertSeparator(columns, space) {
-  if (!(space === null || space === void 0 ? void 0 : space.separator)) {
+  if (!(space !== null && space !== void 0 && space.separator)) {
     return columns;
   }
   var separatorIndexs = function () {
@@ -19,6 +21,7 @@ export var insertSeparator = function insertSeparator(columns, space) {
     if (validate.isEmpty(space === null || space === void 0 ? void 0 : space.separatorIndex)) {
       return reuslt;
     }
+
     // 如果 index 是数字，将其转换为数组
     if (typeof (space === null || space === void 0 ? void 0 : space.separatorIndex) === 'number') {
       reuslt.push(space.separatorIndex);
@@ -31,12 +34,12 @@ export var insertSeparator = function insertSeparator(columns, space) {
   return columns.reduce(function (result, current, index, array) {
     // 将当前元素添加到结果数组中
     result.push(current);
-    if (separatorIndexs === null || separatorIndexs === void 0 ? void 0 : separatorIndexs.length) {
+    if (separatorIndexs !== null && separatorIndexs !== void 0 && separatorIndexs.length) {
       separatorIndexs.forEach(function (separatorIndex) {
         if (index === separatorIndex) {
           result.push({
             separator: true,
-            component: _jsx(Button, {
+            component: /*#__PURE__*/_jsx(Button, {
               className: "group-separator",
               children: space.separator
             }),
@@ -51,7 +54,7 @@ export var insertSeparator = function insertSeparator(columns, space) {
       if (index < array.length - 1) {
         result.push({
           separator: true,
-          component: _jsx(Button, {
+          component: /*#__PURE__*/_jsx(Button, {
             className: "group-separator",
             children: space.separator
           }),
@@ -64,6 +67,7 @@ export var insertSeparator = function insertSeparator(columns, space) {
     return result;
   }, []);
 };
+
 /** 带出event的组件默认取值方法 */
 export function defaultGetValueFromEvent(valuePropName) {
   var event = arguments.length <= 1 ? undefined : arguments[1];
@@ -72,6 +76,7 @@ export function defaultGetValueFromEvent(valuePropName) {
   }
   return event;
 }
+
 /** 转换names */
 export var transformNamesString = function transformNamesString(arr) {
   var result = arr.map(function (subArr) {
@@ -82,6 +87,7 @@ export var transformNamesString = function transformNamesString(arr) {
   });
   return result;
 };
+
 /**
  * Input TextArea 小写自动转大写
  * @param type 组件类型
@@ -92,14 +98,14 @@ export var isUpperCase = function isUpperCase(type, upperCase) {
   var result = {};
   if (['Input', 'TextArea'].includes(type) && upperCase) {
     result.getValueFromEvent = function (event) {
-      var _event$target, _event$target$value;
+      var _event$target;
       if (Array.isArray(event)) {
         return event.map(function (value) {
           var newValue = value === null || value === void 0 ? void 0 : value.replace(/[^a-zA-Z]/g, '');
           return (newValue === null || newValue === void 0 ? void 0 : newValue.toUpperCase()) || '';
         });
       }
-      var newValue = (_event$target = event.target) === null || _event$target === void 0 ? void 0 : (_event$target$value = _event$target.value) === null || _event$target$value === void 0 ? void 0 : _event$target$value.replace(/[^a-zA-Z]/g, '');
+      var newValue = (_event$target = event.target) === null || _event$target === void 0 || (_event$target = _event$target.value) === null || _event$target === void 0 ? void 0 : _event$target.replace(/[^a-zA-Z]/g, '');
       return newValue.toUpperCase() || '';
     };
   }
@@ -116,27 +122,27 @@ export var getReactiveProps = function getReactiveProps(params) {
     fieldProps = params.fieldProps,
     desensitization = params.desensitization;
   var values = namePath ? form.getFieldValue(namePath) : form.getFieldsValue();
-  var _disabled = _isFunction(disabled) ? disabled(values, {
+  var _disabled = isFunction(disabled) ? disabled(values, {
     form: form,
     index: index,
     namePath: namePath
   }) : disabled;
-  var _show = _isFunction(show) ? show(values, {
+  var _show = isFunction(show) ? show(values, {
     form: form,
     index: index,
     namePath: namePath
   }) : show;
-  var _component = _isFunction(component) ? component(values, {
+  var _component = isFunction(component) ? component(values, {
     form: form,
     index: index,
     namePath: namePath
   }) : component;
-  var _fieldProps = _isFunction(fieldProps) ? fieldProps(values, {
+  var _fieldProps = isFunction(fieldProps) ? fieldProps(values, {
     form: form,
     index: index,
     namePath: namePath
   }) : fieldProps;
-  var _desensitization = _isFunction(desensitization) ? desensitization(values, {
+  var _desensitization = isFunction(desensitization) ? desensitization(values, {
     form: form,
     index: index,
     namePath: namePath
@@ -163,6 +169,7 @@ var getUpperCase = function getUpperCase(value) {
   var _value = value === null || value === void 0 ? void 0 : value.replace(/[^a-zA-Z]/g, '');
   return _value.toUpperCase() || '';
 };
+
 /** 执行所有中间件 返回处理后的值 */
 export var getValueMiddleware = function getValueMiddleware(value) {
   var callbacks = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
@@ -170,6 +177,7 @@ export var getValueMiddleware = function getValueMiddleware(value) {
     return cb === null || cb === void 0 ? void 0 : cb(preValue);
   }, value);
 };
+
 /** 获取中间件处理后的value */
 export var valueFromEventWrapper = function valueFromEventWrapper(column, args) {
   var getValueFromEvent = column.getValueFromEvent,