@zat-design/sisyphus-react 3.4.10-beta.6 → 3.4.10-beta.8

package/dist/index.esm.css

@@ -2437,6 +2437,10 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
 }
 .pro-group {
   width: unset !important;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
 }
 .pro-group.pro-group-diy-width .ant-space .ant-space-item,
 .pro-group.pro-group-width-auto .ant-space .ant-space-item {

package/dist/less.esm.css

@@ -2437,6 +2437,10 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
 }
 .pro-group {
   width: unset !important;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
 }
 .pro-group.pro-group-diy-width .ant-space .ant-space-item,
 .pro-group.pro-group-width-auto .ant-space .ant-space-item {

package/es/ProEditTable/components/DndWrapper/index.d.ts

@@ -2,7 +2,7 @@ import React, { FC } from 'react';
 interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {
     'data-row-key': string;
     disabled?: boolean;
-    isShowCheckBox?: boolean;
+    isHideCheckBox?: boolean;
 }
 export declare const Row: FC<RowProps>;
 declare const DndWrapper: ({ draggable, value, onChange, disabled, children }: {

package/es/ProEditTable/components/DndWrapper/index.js

@@ -1,6 +1,6 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["disabled", "isShowCheckBox", "children"];
+var _excluded = ["disabled", "isHideCheckBox", "children"];
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { DndContext } from '@dnd-kit/core';
@@ -9,7 +9,7 @@ import { CSS } from '@dnd-kit/utilities';
 import ProIcon from '../../../ProIcon';
 export var Row = function Row(props) {
   var disabled = props.disabled,
-    isShowCheckBox = props.isShowCheckBox,
+    isHideCheckBox = props.isHideCheckBox,
     children = props.children,
     restProps = _objectWithoutProperties(props, _excluded);
   var data = useSortable({
@@ -43,7 +43,7 @@ export var Row = function Row(props) {
           renderIndex = _ref.renderIndex;
         return /*#__PURE__*/React.cloneElement(child, {
           children: _jsxs("span", {
-            className: "drag-wrapper".concat(isShowCheckBox ? '' : ' no-check'),
+            className: "drag-wrapper".concat(isHideCheckBox ? ' no-check' : ''),
             children: [_jsx(ProIcon, _objectSpread({
               className: "drag-icon",
               style: {
@@ -52,7 +52,7 @@ export var Row = function Row(props) {
               },
               type: "drag",
               size: 20
-            }, listeners)), isShowCheckBox ? render === null || render === void 0 ? void 0 : render(null, record, renderIndex) : null]
+            }, listeners)), isHideCheckBox ? null : render === null || render === void 0 ? void 0 : render(null, record, renderIndex)]
           })
         });
       }

package/es/ProEditTable/index.js

@@ -188,8 +188,8 @@ var ProEditTable = function ProEditTable(_ref, ref) {
       return (addBtnConfig === null || addBtnConfig === void 0 ? void 0 : addBtnConfig.show) === false;
     }
   }, [toolbarProps]);
-  // 是否展示勾选框
-  var isShowCheckBox = !isForbiddenBtn('mulDelete');
+  // 是否隐藏勾选框
+  var isHideCheckBox = isForbiddenBtn('mulDelete');
   // 复选框
   var _rowSelection = _objectSpread({
     fixed: true,
@@ -209,7 +209,7 @@ var ProEditTable = function ProEditTable(_ref, ref) {
       }
       return {};
     },
-    hideSelectAll: !isShowCheckBox
+    hideSelectAll: isHideCheckBox
   }, rowSelection);
   // 分页变更
   var handlePageChange = useCallback(function (current, pageSize) {
@@ -246,7 +246,7 @@ var ProEditTable = function ProEditTable(_ref, ref) {
    * @returns rowSelection
    */
   var renderRowSelection = function renderRowSelection() {
-    if (disabled || isView) {
+    if (disabled || isView || isHideCheckBox) {
       return null;
     }
     return _rowSelection;
@@ -330,7 +330,7 @@ var ProEditTable = function ProEditTable(_ref, ref) {
           onRow: function onRow() {
             return {
               disabled: disabled || virtualKey && !!editingKeys.length,
-              isShowCheckBox: isShowCheckBox,
+              isHideCheckBox: isHideCheckBox,
               onClick: function onClick() {}
             };
           }

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

@@ -7,7 +7,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { omit } from 'lodash';
 import classnames from 'classnames';
-import { insertSeparator, transformColumns } from './utils';
+import { insertSeparator, useTransformColumns } from './utils';
 import ProForm from '../../../../ProForm';
 import ComRender from './component/ComRender';
 /**
@@ -41,7 +41,7 @@ var Group = function Group(props) {
     _option.current[index] = option;
     onChange(_value, _option.current);
   };
-  var columnsProps = transformColumns({
+  var columnsProps = useTransformColumns({
     columns: children,
     name: name,
     names: names,

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

@@ -20,7 +20,7 @@
 
 .pro-group {
   width: unset !important;
-  
+  display: flex;
 
   &.pro-group-diy-width, &.pro-group-width-auto {
     .@{ant-prefix}-space .@{ant-prefix}-space-item {

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

@@ -59,5 +59,5 @@ interface ColumnsTransformerParams {
     groupProps: GroupProps;
 }
 /** 转换columns */
-export declare const transformColumns: (params: ColumnsTransformerParams) => any[];
+export declare const useTransformColumns: (params: ColumnsTransformerParams) => any[];
 export {};

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

@@ -4,6 +4,7 @@ import _typeof from "@babel/runtime/helpers/esm/typeof";
 import "antd/es/button/style";
 import _Button from "antd/es/button";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { useRef } from 'react';
 import { isFunction } from 'lodash';
 import valueTypeMap from '../../../utils/valueType';
 import { useDeepCompareMemo } from '../../../utils/useDeepCompareMemo';
@@ -153,7 +154,7 @@ var valueFromEventWrapper = function valueFromEventWrapper(column, args) {
   return getValueMiddleware(newValue, list);
 };
 /** 转换columns */
-export var transformColumns = function transformColumns(params) {
+export var useTransformColumns = function useTransformColumns(params) {
   var form = params.form,
     columns = params.columns,
     name = params.name,
@@ -163,6 +164,7 @@ export var transformColumns = function transformColumns(params) {
     value = params.value,
     internalChange = params.onChange,
     groupProps = params.groupProps;
+  var timerRef = useRef([]);
   return columns === null || columns === void 0 ? void 0 : columns.flatMap(function (column, index) {
     var type = column.type,
       valueType = column.valueType,
@@ -172,7 +174,8 @@ export var transformColumns = function transformColumns(params) {
       normalize = column.normalize,
       disabled = column.disabled,
       show = column.show,
-      component = column.component;
+      component = column.component,
+      clearNotShow = column.clearNotShow;
     var _ref = fieldProps || {},
       mode = _ref.mode,
       onChange = _ref.onChange,
@@ -180,7 +183,22 @@ export var transformColumns = function transformColumns(params) {
       comDisabled = _ref.disabled;
     var _disabled = disabled || comDisabled;
     var columnName = names ? names[index] : [].concat(name, index);
+    // 响应式字段改变后的回调
+    var changedCallback = function changedCallback(lastDependency, current) {
+      // 清值防抖  多次刷新时以最后一次为准
+      if (clearNotShow !== false && names) {
+        if ((current === null || current === void 0 ? void 0 : current.show) === false) {
+          clearInterval(timerRef.current[index]);
+          timerRef.current[index] = setTimeout(function () {
+            form.resetFields([columnName]);
+          }, 200);
+        } else {
+          clearInterval(timerRef.current[index]);
+        }
+      }
+    };
     // 响应式字段
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     var reactiveProps = useDeepCompareMemo(function () {
       return getReactiveProps({
         form: form,
@@ -193,7 +211,7 @@ export var transformColumns = function transformColumns(params) {
         fieldProps: fieldProps,
         name: columnName
       });
-    }, [value, show, fieldProps, _disabled, columnName, type]);
+    }, changedCallback, [value, show, fieldProps, _disabled, columnName, type]);
     if (reactiveProps.show === false) {
       return [];
     }

package/es/ProForm/utils/useDeepCompareMemo.d.ts

@@ -1,2 +1,2 @@
 /** 深度比较依赖变化memo */
-export declare const useDeepCompareMemo: (fun: () => any, depList: any[]) => any;
+export declare const useDeepCompareMemo: (fun: () => any, changedCb: (last: any, current: any) => void, depList: any[]) => any;

package/es/ProForm/utils/useDeepCompareMemo.js

@@ -2,11 +2,12 @@ import { useRef } from 'react';
 import { isEqualWith } from 'lodash';
 import { customEqualForFun } from '.';
 /** 深度比较依赖变化memo */
-export var useDeepCompareMemo = function useDeepCompareMemo(fun, depList) {
+export var useDeepCompareMemo = function useDeepCompareMemo(fun, changedCb, depList) {
   var lastDependency = useRef(); // 上一次的依赖
   var lastRes = useRef(); // 上一次的结果
   if (!isEqualWith(depList, lastDependency.current, customEqualForFun)) {
     var res = fun();
+    changedCb === null || changedCb === void 0 ? void 0 : changedCb(lastRes.current, res);
     lastRes.current = res;
   }
   lastDependency.current = depList;

package/es/ProTree/components/ProTreeSelect/index.js

@@ -424,7 +424,7 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
   var nodeChangeEvent = function nodeChangeEvent(e) {
     var el = e.target;
     var classStr = el.className;
-    if (classStr && !treeCheckable) {
+    if (classStr && !treeCheckable && typeof classStr === 'string') {
       var _classStr$split = classStr.split(' '),
         _classStr$split2 = _slicedToArray(_classStr$split, 1),
         valStr = _classStr$split2[0];
@@ -474,7 +474,7 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
     onChange: handleChange,
     dropdownStyle: _objectSpread({
       maxHeight: 320,
-      overflow: 'auto',
+      paddingTop: '0px',
       maxWidth: '580px'
     }, dropdownStyle),
     listHeight: listHeight || 320,

package/lib/ProEditTable/components/DndWrapper/index.d.ts

@@ -2,7 +2,7 @@ import React, { FC } from 'react';
 interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {
     'data-row-key': string;
     disabled?: boolean;
-    isShowCheckBox?: boolean;
+    isHideCheckBox?: boolean;
 }
 export declare const Row: FC<RowProps>;
 declare const DndWrapper: ({ draggable, value, onChange, disabled, children }: {

package/lib/ProEditTable/components/DndWrapper/index.js

@@ -13,10 +13,10 @@ var _core = require("@dnd-kit/core");
 var _sortable = require("@dnd-kit/sortable");
 var _utilities = require("@dnd-kit/utilities");
 var _ProIcon = _interopRequireDefault(require("../../../ProIcon"));
-var _excluded = ["disabled", "isShowCheckBox", "children"];
+var _excluded = ["disabled", "isHideCheckBox", "children"];
 var Row = exports.Row = function Row(props) {
   var disabled = props.disabled,
-    isShowCheckBox = props.isShowCheckBox,
+    isHideCheckBox = props.isHideCheckBox,
     children = props.children,
     restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
   var data = (0, _sortable.useSortable)({
@@ -50,7 +50,7 @@ var Row = exports.Row = function Row(props) {
           renderIndex = _ref.renderIndex;
         return /*#__PURE__*/_react.default.cloneElement(child, {
           children: (0, _jsxRuntime.jsxs)("span", {
-            className: "drag-wrapper".concat(isShowCheckBox ? '' : ' no-check'),
+            className: "drag-wrapper".concat(isHideCheckBox ? ' no-check' : ''),
             children: [(0, _jsxRuntime.jsx)(_ProIcon.default, (0, _objectSpread2.default)({
               className: "drag-icon",
               style: {
@@ -59,7 +59,7 @@ var Row = exports.Row = function Row(props) {
               },
               type: "drag",
               size: 20
-            }, listeners)), isShowCheckBox ? render === null || render === void 0 ? void 0 : render(null, record, renderIndex) : null]
+            }, listeners)), isHideCheckBox ? null : render === null || render === void 0 ? void 0 : render(null, record, renderIndex)]
           })
         });
       }

package/lib/ProEditTable/index.js

@@ -191,8 +191,8 @@ var ProEditTable = function ProEditTable(_ref, ref) {
       return (addBtnConfig === null || addBtnConfig === void 0 ? void 0 : addBtnConfig.show) === false;
     }
   }, [toolbarProps]);
-  // 是否展示勾选框
-  var isShowCheckBox = !isForbiddenBtn('mulDelete');
+  // 是否隐藏勾选框
+  var isHideCheckBox = isForbiddenBtn('mulDelete');
   // 复选框
   var _rowSelection = (0, _objectSpread2.default)({
     fixed: true,
@@ -212,7 +212,7 @@ var ProEditTable = function ProEditTable(_ref, ref) {
       }
       return {};
     },
-    hideSelectAll: !isShowCheckBox
+    hideSelectAll: isHideCheckBox
   }, rowSelection);
   // 分页变更
   var handlePageChange = (0, _react.useCallback)(function (current, pageSize) {
@@ -249,7 +249,7 @@ var ProEditTable = function ProEditTable(_ref, ref) {
    * @returns rowSelection
    */
   var renderRowSelection = function renderRowSelection() {
-    if (disabled || isView) {
+    if (disabled || isView || isHideCheckBox) {
       return null;
     }
     return _rowSelection;
@@ -333,7 +333,7 @@ var ProEditTable = function ProEditTable(_ref, ref) {
           onRow: function onRow() {
             return {
               disabled: disabled || virtualKey && !!editingKeys.length,
-              isShowCheckBox: isShowCheckBox,
+              isHideCheckBox: isHideCheckBox,
               onClick: function onClick() {}
             };
           }

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

@@ -47,7 +47,7 @@ var Group = function Group(props) {
     _option.current[index] = option;
     onChange(_value, _option.current);
   };
-  var columnsProps = (0, _utils.transformColumns)({
+  var columnsProps = (0, _utils.useTransformColumns)({
     columns: children,
     name: name,
     names: names,

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

@@ -20,7 +20,7 @@
 
 .pro-group {
   width: unset !important;
-  
+  display: flex;
 
   &.pro-group-diy-width, &.pro-group-width-auto {
     .@{ant-prefix}-space .@{ant-prefix}-space-item {

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

@@ -59,5 +59,5 @@ interface ColumnsTransformerParams {
     groupProps: GroupProps;
 }
 /** 转换columns */
-export declare const transformColumns: (params: ColumnsTransformerParams) => any[];
+export declare const useTransformColumns: (params: ColumnsTransformerParams) => any[];
 export {};

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

@@ -5,11 +5,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.defaultGetValueFromEvent = defaultGetValueFromEvent;
-exports.transformNamesString = exports.transformColumns = exports.isUpperCase = exports.insertSeparator = exports.getValueTypeTrans = exports.getValueMiddleware = exports.getReactiveProps = void 0;
+exports.useTransformColumns = exports.transformNamesString = exports.isUpperCase = exports.insertSeparator = exports.getValueTypeTrans = exports.getValueMiddleware = exports.getReactiveProps = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _jsxRuntime = require("react/jsx-runtime");
+var _react = require("react");
 var _lodash = require("lodash");
 var _antd = require("antd");
 var _valueType = _interopRequireDefault(require("../../../utils/valueType"));
@@ -160,7 +161,7 @@ var valueFromEventWrapper = function valueFromEventWrapper(column, args) {
   return getValueMiddleware(newValue, list);
 };
 /** 转换columns */
-var transformColumns = exports.transformColumns = function transformColumns(params) {
+var useTransformColumns = exports.useTransformColumns = function useTransformColumns(params) {
   var form = params.form,
     columns = params.columns,
     name = params.name,
@@ -170,6 +171,7 @@ var transformColumns = exports.transformColumns = function transformColumns(para
     value = params.value,
     internalChange = params.onChange,
     groupProps = params.groupProps;
+  var timerRef = (0, _react.useRef)([]);
   return columns === null || columns === void 0 ? void 0 : columns.flatMap(function (column, index) {
     var type = column.type,
       valueType = column.valueType,
@@ -179,7 +181,8 @@ var transformColumns = exports.transformColumns = function transformColumns(para
       normalize = column.normalize,
       disabled = column.disabled,
       show = column.show,
-      component = column.component;
+      component = column.component,
+      clearNotShow = column.clearNotShow;
     var _ref = fieldProps || {},
       mode = _ref.mode,
       onChange = _ref.onChange,
@@ -187,7 +190,22 @@ var transformColumns = exports.transformColumns = function transformColumns(para
       comDisabled = _ref.disabled;
     var _disabled = disabled || comDisabled;
     var columnName = names ? names[index] : [].concat(name, index);
+    // 响应式字段改变后的回调
+    var changedCallback = function changedCallback(lastDependency, current) {
+      // 清值防抖  多次刷新时以最后一次为准
+      if (clearNotShow !== false && names) {
+        if ((current === null || current === void 0 ? void 0 : current.show) === false) {
+          clearInterval(timerRef.current[index]);
+          timerRef.current[index] = setTimeout(function () {
+            form.resetFields([columnName]);
+          }, 200);
+        } else {
+          clearInterval(timerRef.current[index]);
+        }
+      }
+    };
     // 响应式字段
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     var reactiveProps = (0, _useDeepCompareMemo.useDeepCompareMemo)(function () {
       return getReactiveProps({
         form: form,
@@ -200,7 +218,7 @@ var transformColumns = exports.transformColumns = function transformColumns(para
         fieldProps: fieldProps,
         name: columnName
       });
-    }, [value, show, fieldProps, _disabled, columnName, type]);
+    }, changedCallback, [value, show, fieldProps, _disabled, columnName, type]);
     if (reactiveProps.show === false) {
       return [];
     }

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

@@ -1,2 +1,2 @@
 /** 深度比较依赖变化memo */
-export declare const useDeepCompareMemo: (fun: () => any, depList: any[]) => any;
+export declare const useDeepCompareMemo: (fun: () => any, changedCb: (last: any, current: any) => void, depList: any[]) => any;

package/lib/ProForm/utils/useDeepCompareMemo.js

@@ -8,11 +8,12 @@ var _react = require("react");
 var _lodash = require("lodash");
 var _ = require(".");
 /** 深度比较依赖变化memo */
-var useDeepCompareMemo = exports.useDeepCompareMemo = function useDeepCompareMemo(fun, depList) {
+var useDeepCompareMemo = exports.useDeepCompareMemo = function useDeepCompareMemo(fun, changedCb, depList) {
   var lastDependency = (0, _react.useRef)(); // 上一次的依赖
   var lastRes = (0, _react.useRef)(); // 上一次的结果
   if (!(0, _lodash.isEqualWith)(depList, lastDependency.current, _.customEqualForFun)) {
     var res = fun();
+    changedCb === null || changedCb === void 0 ? void 0 : changedCb(lastRes.current, res);
     lastRes.current = res;
   }
   lastDependency.current = depList;

package/lib/ProTree/components/ProTreeSelect/index.js

@@ -426,7 +426,7 @@ var ProTreeSelect = exports.ProTreeSelect = function ProTreeSelect(props, ref) {
   var nodeChangeEvent = function nodeChangeEvent(e) {
     var el = e.target;
     var classStr = el.className;
-    if (classStr && !treeCheckable) {
+    if (classStr && !treeCheckable && typeof classStr === 'string') {
       var _classStr$split = classStr.split(' '),
         _classStr$split2 = (0, _slicedToArray2.default)(_classStr$split, 1),
         valStr = _classStr$split2[0];
@@ -476,7 +476,7 @@ var ProTreeSelect = exports.ProTreeSelect = function ProTreeSelect(props, ref) {
     onChange: handleChange,
     dropdownStyle: (0, _objectSpread2.default)({
       maxHeight: 320,
-      overflow: 'auto',
+      paddingTop: '0px',
       maxWidth: '580px'
     }, dropdownStyle),
     listHeight: listHeight || 320,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "3.4.10-beta.6",
+  "version": "3.4.10-beta.8",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",