@zat-design/sisyphus-react 4.4.2 → 4.4.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/README.md +1 -42
  2. package/dist/index.esm.css +1 -1
  3. package/dist/less.esm.css +1 -1
  4. package/es/FormsProvider/index.d.ts +1 -1
  5. package/es/ProEditTable/components/RenderField/ListChangedWrapper.d.ts +1 -14
  6. package/es/ProEditTable/components/RenderField/ListChangedWrapper.js +27 -102
  7. package/es/ProEditTable/components/RenderField/index.js +269 -364
  8. package/es/ProEditTable/components/RenderField/propsType.d.ts +30 -0
  9. package/es/ProEditTable/components/RenderField/propsType.js +1 -0
  10. package/es/ProEditTable/components/RenderField/tools.d.ts +22 -0
  11. package/es/ProEditTable/components/RenderField/tools.js +203 -0
  12. package/es/ProEditTable/utils/config.js +5 -2
  13. package/es/ProEditTable/utils/index.js +11 -6
  14. package/es/ProEditTable/utils/tools.js +3 -2
  15. package/es/ProEnum/index.js +1 -1
  16. package/es/ProForm/components/FormFooter/propsType.d.ts +1 -1
  17. package/es/ProForm/components/base/DatePicker/index.js +3 -2
  18. package/es/ProForm/components/combination/Group/component/ComRender.js +1 -1
  19. package/es/ProForm/components/combination/Group/component/FlexibleGroup.js +4 -11
  20. package/es/ProForm/components/combination/Group/hooks/index.js +1 -2
  21. package/es/ProForm/components/combination/Group/utils/index.d.ts +16 -16
  22. package/es/ProForm/components/render/Render.js +149 -180
  23. package/es/ProForm/components/render/RenderFields.js +13 -38
  24. package/es/ProForm/components/render/propsType.d.ts +1 -18
  25. package/es/ProForm/components/render/propsType.js +0 -26
  26. package/es/ProForm/hooks/useControlled.d.ts +1 -0
  27. package/es/ProForm/hooks/useControlled.js +14 -0
  28. package/es/ProForm/hooks/useForm.d.ts +8 -0
  29. package/es/ProForm/{utils → hooks}/useForm.js +1 -1
  30. package/es/ProForm/{utils → hooks}/useRules.js +2 -2
  31. package/es/ProForm/{utils → hooks}/useShouldUpdate.d.ts +5 -1
  32. package/es/ProForm/{utils → hooks}/useShouldUpdate.js +30 -77
  33. package/es/ProForm/{utils → hooks}/useWatch.js +1 -1
  34. package/es/ProForm/index.js +5 -4
  35. package/es/ProForm/propsType.d.ts +13 -1
  36. package/es/ProForm/utils/buildFormItemProps.d.ts +25 -0
  37. package/es/ProForm/utils/buildFormItemProps.js +90 -0
  38. package/es/ProForm/utils/index.d.ts +2 -6
  39. package/es/ProForm/utils/index.js +3 -30
  40. package/es/ProForm/utils/reactiveValues.d.ts +34 -0
  41. package/es/ProForm/utils/reactiveValues.js +45 -0
  42. package/es/ProSelect/index.js +8 -7
  43. package/es/ProTree/components/ProTreeSelect/index.js +3 -2
  44. package/es/ProTree/utils.d.ts +9 -0
  45. package/es/ProTree/utils.js +31 -0
  46. package/es/ProTreeModal/components/Trigger.js +13 -12
  47. package/es/ProTreeModal/style/index.less +12 -1
  48. package/package.json +1 -2
  49. package/es/ProForm/utils/useForm.d.ts +0 -22
  50. /package/es/ProForm/{utils → hooks}/useDeepCompareMemo.d.ts +0 -0
  51. /package/es/ProForm/{utils → hooks}/useDeepCompareMemo.js +0 -0
  52. /package/es/ProForm/{utils → hooks}/useFieldProps.d.ts +0 -0
  53. /package/es/ProForm/{utils → hooks}/useFieldProps.js +0 -0
  54. /package/es/ProForm/{utils → hooks}/useRules.d.ts +0 -0
  55. /package/es/ProForm/{utils → hooks}/useWatch.d.ts +0 -0
@@ -0,0 +1,34 @@
1
+ /// <reference types="react" />
2
+ /** 列级响应式配置(可能为静态值或 ReactiveFunction) */
3
+ export interface ReactiveProps {
4
+ show?: any;
5
+ disabled?: any;
6
+ required?: any;
7
+ rules?: any;
8
+ fieldProps?: any;
9
+ desensitization?: any;
10
+ }
11
+ /** 解析后的列级响应式值 */
12
+ export interface ReactiveValues {
13
+ show: any;
14
+ disabled: any;
15
+ required: any;
16
+ rules: any;
17
+ fieldProps: any;
18
+ desensitization: any;
19
+ }
20
+ /** 持有解析值的 ref 集合 */
21
+ export interface ReactiveRefs {
22
+ showRef: React.MutableRefObject<any>;
23
+ disabledRef: React.MutableRefObject<any>;
24
+ requiredRef: React.MutableRefObject<any>;
25
+ rulesRef: React.MutableRefObject<any>;
26
+ fieldPropsRef: React.MutableRefObject<any>;
27
+ desensitizationRef: React.MutableRefObject<any>;
28
+ }
29
+ /** 按当前表单值解析 show/disabled/required/rules/fieldProps/desensitization(纯函数,无副作用) */
30
+ export declare const resolveReactiveValues: (reactiveProps: ReactiveProps, currentValues: any, ctx: any) => ReactiveValues;
31
+ /** 比较解析值与上一次 ref 值是否有变化(纯函数,无副作用) */
32
+ export declare const hasReactiveDiff: (refs: ReactiveRefs, next: ReactiveValues) => boolean;
33
+ /** 将解析值写回 ref 集合 */
34
+ export declare const commitReactiveValues: (refs: ReactiveRefs, next: ReactiveValues) => void;
@@ -0,0 +1,45 @@
1
+ import _isEqualWith from "lodash/isEqualWith";
2
+ import _isFunction from "lodash/isFunction";
3
+ import { customEqualForFunction } from "../../utils";
4
+
5
+ /** 列级响应式配置(可能为静态值或 ReactiveFunction) */
6
+
7
+ /** 解析后的列级响应式值 */
8
+
9
+ /** 持有解析值的 ref 集合 */
10
+
11
+ /** 按当前表单值解析 show/disabled/required/rules/fieldProps/desensitization(纯函数,无副作用) */
12
+ export const resolveReactiveValues = (reactiveProps, currentValues, ctx) => {
13
+ const {
14
+ show,
15
+ disabled,
16
+ required,
17
+ rules,
18
+ fieldProps,
19
+ desensitization
20
+ } = reactiveProps;
21
+ return {
22
+ show: _isFunction(show) ? Boolean(show(currentValues, ctx)) : show,
23
+ disabled: _isFunction(disabled) ? disabled(currentValues, ctx) : disabled,
24
+ required: _isFunction(required) ? required(currentValues, ctx) : required,
25
+ rules: _isFunction(rules) ? rules(currentValues, ctx) : rules,
26
+ fieldProps: _isFunction(fieldProps) ? fieldProps(currentValues, ctx) : fieldProps,
27
+ desensitization: _isFunction(desensitization) ? desensitization(currentValues, ctx) : desensitization
28
+ };
29
+ };
30
+
31
+ /** 比较解析值与上一次 ref 值是否有变化(纯函数,无副作用) */
32
+ export const hasReactiveDiff = (refs, next) => {
33
+ return next.show !== refs.showRef.current || !_isEqualWith(refs.disabledRef.current, next.disabled, customEqualForFunction) || next.required !== refs.requiredRef.current || !_isEqualWith(refs.rulesRef.current, next.rules, customEqualForFunction) || !_isEqualWith(refs.fieldPropsRef.current, next.fieldProps, customEqualForFunction) || !_isEqualWith(refs.desensitizationRef.current, next.desensitization) || Boolean(next.fieldProps?.transformResponse) // 防止fieldProps变更时,transformResponse根据fieldProps新值无法触发更新
34
+ ;
35
+ };
36
+
37
+ /** 将解析值写回 ref 集合 */
38
+ export const commitReactiveValues = (refs, next) => {
39
+ refs.showRef.current = next.show;
40
+ refs.disabledRef.current = next.disabled;
41
+ refs.requiredRef.current = next.required;
42
+ refs.rulesRef.current = next.rules;
43
+ refs.fieldPropsRef.current = next.fieldProps;
44
+ refs.desensitizationRef.current = next.desensitization;
45
+ };
@@ -254,6 +254,7 @@ export const ProSelect = (props, ref) => {
254
254
  const defaultConfig = {
255
255
  enabled: true,
256
256
  filterOption: _isFunction(_onSearch) ? false : defaultFilterOption,
257
+ optionFilterProp: 'label',
257
258
  onSearch: searchValue => {
258
259
  _onSearch?.(searchValue, {
259
260
  ...fetchFunctionRef.current
@@ -276,6 +277,7 @@ export const ProSelect = (props, ref) => {
276
277
  ...customShowSearch,
277
278
  enabled: true,
278
279
  filterOption: customShowSearch.filterOption ?? defaultConfig.filterOption,
280
+ optionFilterProp: customShowSearch.optionFilterProp ?? defaultConfig.optionFilterProp,
279
281
  onSearch: customShowSearch.onSearch ?? defaultConfig.onSearch
280
282
  };
281
283
  }
@@ -466,10 +468,6 @@ export const ProSelect = (props, ref) => {
466
468
  }
467
469
  return buildOptionItem(item, index);
468
470
  }) : [];
469
- const selectSearchProps = {
470
- filterOption: mergedShowSearch.filterOption,
471
- onSearch: mergedShowSearch.onSearch
472
- };
473
471
  return /*#__PURE__*/_jsx("div", {
474
472
  style: props.style,
475
473
  className: "pro-select",
@@ -478,14 +476,17 @@ export const ProSelect = (props, ref) => {
478
476
  allowClear: true,
479
477
  loading: fetchFunction?.loading,
480
478
  onChange: handleChange,
481
- showSearch: mergedShowSearch.enabled,
482
- ...selectSearchProps,
479
+ showSearch: mergedShowSearch.enabled ? {
480
+ filterOption: mergedShowSearch.filterOption,
481
+ optionFilterProp: mergedShowSearch.optionFilterProp,
482
+ onSearch: mergedShowSearch.onSearch
483
+ } : false,
483
484
  getPopupContainer: trigger => {
484
485
  return scrollFollowParent ? trigger.parentElement : document.body;
485
486
  },
486
487
  ..._omit({
487
488
  ...selectProps
488
- }, ['isView', 'showCodeName', 'form', 'name', 'style', 'onFieldChange', 'getChangeValue', 'viewportReady', 'showSearch']),
489
+ }, ['isView', 'showCodeName', 'form', 'name', 'style', 'onFieldChange', 'getChangeValue', 'viewportReady', 'showSearch', 'filterOption', 'optionFilterProp', 'searchValue']),
489
490
  // 如果是多选模式且用户没有自定义maxTagPlaceholder,使用我们的hover版本
490
491
  maxTagPlaceholder: selectProps.mode === 'multiple' && !selectProps.maxTagPlaceholder ? maxTagPlaceholder : selectProps.maxTagPlaceholder,
491
492
  optionRender: selectOptionRender,
@@ -10,7 +10,7 @@ import locale from "../../../locale";
10
10
  import { useProConfig } from "../../../ProConfigProvider";
11
11
  import Container from "../../../ProForm/components/Container";
12
12
  import AdaptiveTooltip from "../AdaptiveTooltip";
13
- import { getFlatTreeData } from "../../utils";
13
+ import { getFlatTreeData, restoreCodeNameLabel } from "../../utils";
14
14
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
15
15
  const {
16
16
  SHOW_PARENT
@@ -629,7 +629,8 @@ export const ProTreeSelect = (props, ref) => {
629
629
  if (props?.labelInValue) {
630
630
  result = getLabelByValue(_selectList, newVal);
631
631
  }
632
- const options = findTreeNode(_selectList, extra?.triggerValue);
632
+ // showCodeName 仅影响展示,回调返回的 option 需还原原始 label
633
+ const options = restoreCodeNameLabel(findTreeNode(_selectList, extra?.triggerValue), showCodeName);
633
634
  onChange && onChange(result, options, extra);
634
635
  // 重置搜索
635
636
  showSearch && searchTreeEvent('');
@@ -35,6 +35,15 @@ export declare function filterCheckedNodes(data: any, checkedKeys: any, searchSt
35
35
  * @returns
36
36
  */
37
37
  export declare function getChildrenKeys(node: ProTreeDataType, childrenKeys: string[], fieldNames: ProTreeFieldNamesType, type: 'treeClose' | 'treeCheck'): void;
38
+ /**
39
+ * 还原 showCodeName 合并到 label 上的 `${value}-` 前缀
40
+ * showCodeName 仅影响展示,回调返回的 option 应保持原始 label
41
+ * 注意:此处 option 已是标准格式(label, value)
42
+ * @param option 单个或数组形式的选项(标准格式)
43
+ * @param showCodeName 是否开启了 code-name 展示
44
+ * @returns 还原 label 后的新对象/数组(不可变)
45
+ */
46
+ export declare function restoreCodeNameLabel<T extends Record<string, any>>(option: T | T[], showCodeName?: boolean): T | T[];
38
47
  /**
39
48
  * 如果默认全开展那么返回所有key,否则返回空[]
40
49
  * @param isExpand 是否全展开
@@ -160,6 +160,37 @@ export function getChildrenKeys(node, childrenKeys, fieldNames, type) {
160
160
  }
161
161
  }
162
162
 
163
+ /**
164
+ * 还原 showCodeName 合并到 label 上的 `${value}-` 前缀
165
+ * showCodeName 仅影响展示,回调返回的 option 应保持原始 label
166
+ * 注意:此处 option 已是标准格式(label, value)
167
+ * @param option 单个或数组形式的选项(标准格式)
168
+ * @param showCodeName 是否开启了 code-name 展示
169
+ * @returns 还原 label 后的新对象/数组(不可变)
170
+ */
171
+ export function restoreCodeNameLabel(option, showCodeName) {
172
+ if (!showCodeName || !option) {
173
+ return option;
174
+ }
175
+ const restore = node => {
176
+ const {
177
+ label,
178
+ value
179
+ } = node;
180
+ if (typeof label === 'string') {
181
+ const prefix = `${value}-`;
182
+ if (label.startsWith(prefix)) {
183
+ return {
184
+ ...node,
185
+ label: label.slice(prefix.length)
186
+ };
187
+ }
188
+ }
189
+ return node;
190
+ };
191
+ return Array.isArray(option) ? option.map(restore) : restore(option);
192
+ }
193
+
163
194
  /**
164
195
  * 如果默认全开展那么返回所有key,否则返回空[]
165
196
  * @param isExpand 是否全展开
@@ -59,15 +59,16 @@ function Trigger(props) {
59
59
  'trigger-no-hover': afterDisabled
60
60
  });
61
61
  if (isView) {
62
+ const hasValue = checkedValues.length > 0;
62
63
  return /*#__PURE__*/_jsxs("div", {
63
64
  className: "pro-tree-modal-isView",
64
65
  children: [/*#__PURE__*/_jsx("div", {
65
- children: checkedValues.length === 0 ? '-' : state.mode === 'all' ? formatMessage(locale?.ProTreeModal.checkAll1, {
66
+ children: !hasValue ? '-' : state.mode === 'all' ? formatMessage(locale?.ProTreeModal.checkAll1, {
66
67
  all: label
67
68
  }) : formatMessage(locale?.ProTreeModal?.checkNumber, {
68
69
  num: checkedValues.length
69
70
  })
70
- }), /*#__PURE__*/_jsx("div", {
71
+ }), hasValue && /*#__PURE__*/_jsx("div", {
71
72
  className: addonAfterClassName,
72
73
  children: /*#__PURE__*/_jsx(ReactSVG, {
73
74
  className: viewIconClassName,
@@ -94,7 +95,7 @@ function Trigger(props) {
94
95
  style: {
95
96
  ...triggerStyle
96
97
  },
97
- children: [/*#__PURE__*/_jsxs(Select, {
98
+ children: [/*#__PURE__*/_jsx(Select, {
98
99
  style: {
99
100
  width: 'auto'
100
101
  },
@@ -103,15 +104,15 @@ function Trigger(props) {
103
104
  defaultValue: "appoint",
104
105
  value: state.mode,
105
106
  onChange: onAppointChange,
106
- children: [/*#__PURE__*/_jsx(Select.Option, {
107
- value: "all",
108
- disabled: allDisabled,
109
- children: locale?.ProTreeModal.specifyMode[0]
110
- }), /*#__PURE__*/_jsx(Select.Option, {
111
- value: "appoint",
112
- disabled: specifyDisabled,
113
- children: locale?.ProTreeModal.specifyMode[1]
114
- })]
107
+ options: [{
108
+ value: 'all',
109
+ label: locale?.ProTreeModal.specifyMode[0],
110
+ disabled: !!allDisabled
111
+ }, {
112
+ value: 'appoint',
113
+ label: locale?.ProTreeModal.specifyMode[1],
114
+ disabled: !!specifyDisabled
115
+ }]
115
116
  }), props.children]
116
117
  });
117
118
  }
@@ -67,7 +67,8 @@
67
67
  }
68
68
 
69
69
  .@{ant-prefix}-input-disabled {
70
- border-radius: 0 !important;
70
+ border-top-right-radius: 0 !important;
71
+ border-bottom-right-radius: 0 !important;
71
72
  }
72
73
 
73
74
  .@{ant-prefix}-input-group-wrapper:hover {
@@ -266,6 +267,16 @@
266
267
  .pro-tree-modal-view-svg {
267
268
  margin-left: var(--zaui-space-size-sm, 8px);
268
269
  }
270
+
271
+ .pro-enum-input-addonAfter {
272
+ padding: 0;
273
+ background: transparent;
274
+ border: none;
275
+
276
+ &:hover {
277
+ box-shadow: none !important;
278
+ }
279
+ }
269
280
  }
270
281
 
271
282
  &-tree-content {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zat-design/sisyphus-react",
3
- "version": "4.4.2",
3
+ "version": "4.4.3",
4
4
  "license": "MIT",
5
5
  "files": [
6
6
  "es",
@@ -163,7 +163,6 @@
163
163
  "husky": "^9.0.0",
164
164
  "jest-canvas-mock": "^2.5.2",
165
165
  "lint-staged": "^10.0.0",
166
- "mini-css-extract-plugin": "^2.9.4",
167
166
  "minimatch": "^9.0.5",
168
167
  "mockjs": "^1.0.0",
169
168
  "patch-package": "^8.0.1",
@@ -1,22 +0,0 @@
1
- import { FormInstance } from 'antd';
2
- import { NamePath } from 'antd/es/form/interface';
3
- import type { ValuedNotifyInfo } from '@rc-component/form/es/interface';
4
- export type ModifiedFormInstanceType<T> = FormInstance<T> & {
5
- isModified?: boolean;
6
- /** 默认清空设置值的报错状态 */
7
- setFieldValue: (name: NamePath, value: any, info?: ValuedNotifyInfo) => void;
8
- formKey?: string;
9
- _init?: boolean;
10
- __INTERNAL_CONFIG__?: {
11
- fields?: any[];
12
- stopOnFirstError?: boolean;
13
- [key: string]: any;
14
- };
15
- };
16
- export interface FormInstanceOption {
17
- scrollToError?: boolean;
18
- optimize?: boolean;
19
- formKey?: string;
20
- source?: string;
21
- }
22
- export declare const useForm: <T>(originForm?: ModifiedFormInstanceType<T> | FormInstanceOption, options?: FormInstanceOption) => [ModifiedFormInstanceType<T>];
File without changes
File without changes
File without changes
File without changes