@rainbow-oh/yee-c 0.9.0 → 0.9.1
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.
- package/dist/cjs/Form/demo/async-validate.js +2 -2
- package/dist/cjs/Form/demo/validate.js +2 -2
- package/dist/cjs/Form/form-store.js +19 -6
- package/dist/cjs/Form/index.d.ts +1 -1
- package/dist/cjs/Form/interface.d.ts +9 -2
- package/dist/cjs/Form/utils/path.js +1 -1
- package/dist/cjs/TreeSelect/tree-select.js +14 -4
- package/dist/cjs/style/themes.css +1 -1
- package/dist/cjs/style/variables.css +1 -1
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/esm/Form/demo/async-validate.js +2 -2
- package/dist/esm/Form/demo/validate.js +2 -2
- package/dist/esm/Form/form-store.js +33 -10
- package/dist/esm/Form/hooks/useForm.js +0 -175
- package/dist/esm/Form/index.d.ts +1 -1
- package/dist/esm/Form/interface.d.ts +9 -2
- package/dist/esm/Form/utils/path.js +2 -1
- package/dist/esm/TreeSelect/tree-select.js +20 -6
- package/dist/esm/style/themes.css +1 -1
- package/dist/esm/style/variables.css +1 -1
- package/dist/esm/version.d.ts +1 -1
- package/dist/esm/version.js +1 -1
- package/dist/umd/yee-c.min.js +1 -1
- package/package.json +1 -1
- package/src/Form/demo/async-validate.tsx +3 -2
- package/src/Form/demo/validate.tsx +3 -2
- package/src/Form/form-store.test.ts +156 -0
- package/src/Form/form-store.ts +28 -9
- package/src/Form/hooks/useForm.ts +0 -175
- package/src/Form/index.en-US.md +92 -92
- package/src/Form/index.ts +1 -0
- package/src/Form/index.zh-CN.md +55 -55
- package/src/Form/interface.ts +9 -2
- package/src/Form/utils/path.ts +2 -1
- package/src/TreeSelect/tree-select.tsx +21 -4
- package/src/version.ts +1 -1
|
@@ -65,8 +65,8 @@ var async_validate_default = () => {
|
|
|
65
65
|
const onFinish = (values) => {
|
|
66
66
|
console.log("Received values:", values);
|
|
67
67
|
};
|
|
68
|
-
const onFinishFailed = (
|
|
69
|
-
console.log("Failed:",
|
|
68
|
+
const onFinishFailed = (errors) => {
|
|
69
|
+
console.log("Failed:", errors);
|
|
70
70
|
};
|
|
71
71
|
return /* @__PURE__ */ import_react.default.createElement(import_yee_c.Form, { form, onFinish, onFinishFailed }, /* @__PURE__ */ import_react.default.createElement(import_yee_c.Grid, null, /* @__PURE__ */ import_react.default.createElement(
|
|
72
72
|
import_yee_c.Form.Field,
|
|
@@ -39,8 +39,8 @@ var validate_default = () => {
|
|
|
39
39
|
const onFinish = (values) => {
|
|
40
40
|
console.log("Received values:", values);
|
|
41
41
|
};
|
|
42
|
-
const onFinishFailed = (
|
|
43
|
-
console.log("Failed:",
|
|
42
|
+
const onFinishFailed = (errors) => {
|
|
43
|
+
console.log("Failed:", errors);
|
|
44
44
|
};
|
|
45
45
|
return /* @__PURE__ */ import_react.default.createElement(import_yee_c.Form, { form, onFinish, onFinishFailed }, /* @__PURE__ */ import_react.default.createElement(import_yee_c.Grid, null, /* @__PURE__ */ import_react.default.createElement(
|
|
46
46
|
import_yee_c.Form.Field,
|
|
@@ -201,7 +201,7 @@ var FormStore = class {
|
|
|
201
201
|
this.setFieldsValue = (newStore, trigger = "onChange") => {
|
|
202
202
|
var _a, _b, _c, _d;
|
|
203
203
|
if (trigger === "reset" || trigger === "clear") {
|
|
204
|
-
this.store = newStore;
|
|
204
|
+
this.store = trigger === "reset" ? newStore : __spreadValues(__spreadValues({}, this.store), newStore);
|
|
205
205
|
if (trigger === "reset") {
|
|
206
206
|
(_b = (_a = this.callbacks) == null ? void 0 : _a.onReset) == null ? void 0 : _b.call(_a);
|
|
207
207
|
} else {
|
|
@@ -269,13 +269,26 @@ var FormStore = class {
|
|
|
269
269
|
this.refreshField();
|
|
270
270
|
};
|
|
271
271
|
this.clearFields = (name) => {
|
|
272
|
+
var _a, _b;
|
|
272
273
|
const names = name || Object.keys(this.store);
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
274
|
+
let clearStore = __spreadValues({}, this.store);
|
|
275
|
+
names.forEach((n) => {
|
|
276
|
+
const parsedPath = (0, import_path.parsePath)(n);
|
|
277
|
+
if (parsedPath.length > 1) {
|
|
278
|
+
clearStore = (0, import_path.setValueByPath)(clearStore, parsedPath, void 0);
|
|
279
|
+
} else {
|
|
280
|
+
clearStore[n] = void 0;
|
|
281
|
+
}
|
|
282
|
+
});
|
|
283
|
+
this.deleteRelatedEntries(this.validateMessages, name);
|
|
277
284
|
this.clearFieldStatuses(name);
|
|
278
|
-
this.
|
|
285
|
+
this.store = clearStore;
|
|
286
|
+
(_b = (_a = this.callbacks) == null ? void 0 : _a.onClear) == null ? void 0 : _b.call(_a);
|
|
287
|
+
this.getRelatedFieldNames(names).forEach((fieldName) => {
|
|
288
|
+
var _a2;
|
|
289
|
+
(_a2 = this.fieldMap.get(fieldName)) == null ? void 0 : _a2.onStoreChange();
|
|
290
|
+
});
|
|
291
|
+
this.notifyWatchers(names);
|
|
279
292
|
};
|
|
280
293
|
this.validateField = (name, trigger) => __async(this, null, function* () {
|
|
281
294
|
var _a;
|
package/dist/cjs/Form/index.d.ts
CHANGED
|
@@ -16,5 +16,5 @@ type FormInterface = typeof InternalForm & {
|
|
|
16
16
|
List: typeof List;
|
|
17
17
|
};
|
|
18
18
|
declare const Form: FormInterface;
|
|
19
|
-
export type { FieldGroupProps, FieldStatus, FieldStatusData, FormInstance, FormListProps, FormProps, } from './interface';
|
|
19
|
+
export type { FieldGroupProps, FieldStatus, FieldStatusData, FormInstance, FormListProps, FormProps, ValidateMessage, } from './interface';
|
|
20
20
|
export default Form;
|
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
import type { TooltipProps } from '../Tooltip';
|
|
3
3
|
import type { DataAttributeProps } from '../utils/types';
|
|
4
4
|
export type StoreValue = any;
|
|
5
|
+
/**
|
|
6
|
+
* Form values keyed by field name. Nested-path fields (e.g.
|
|
7
|
+
* name="user.name") hold their values in nested objects:
|
|
8
|
+
* `{ user: { name: 'tom' } }`
|
|
9
|
+
*/
|
|
5
10
|
export type Store = Record<string, StoreValue>;
|
|
6
11
|
export type Name = string;
|
|
7
12
|
export type NamePath = string | string[] | number | (string | number)[];
|
|
@@ -37,7 +42,9 @@ export interface FormProps<Values = any> extends DataAttributeProps {
|
|
|
37
42
|
*/
|
|
38
43
|
disabled?: boolean;
|
|
39
44
|
/**
|
|
40
|
-
* Initial values
|
|
45
|
+
* Initial values, keyed by field name. Nested-path fields (e.g.
|
|
46
|
+
* name="user.name") take their values from nested objects:
|
|
47
|
+
* `{ user: { name: 'tom' } }`
|
|
41
48
|
*/
|
|
42
49
|
initialValues?: Store;
|
|
43
50
|
/**
|
|
@@ -81,7 +88,7 @@ export interface Callbacks<Values = any> {
|
|
|
81
88
|
/**
|
|
82
89
|
* Triggered on failed form submit
|
|
83
90
|
* */
|
|
84
|
-
onFinishFailed?: (
|
|
91
|
+
onFinishFailed?: (errors: ValidateMessage[]) => void;
|
|
85
92
|
/**
|
|
86
93
|
* Triggered on form reset
|
|
87
94
|
* */
|
|
@@ -71,7 +71,7 @@ function setValueByPath(store, path, value) {
|
|
|
71
71
|
let current = newStore;
|
|
72
72
|
for (let i = 0; i < path.length - 1; i++) {
|
|
73
73
|
const key = String(path[i]);
|
|
74
|
-
if (
|
|
74
|
+
if (current[key] == null) {
|
|
75
75
|
current[key] = typeof path[i + 1] === "number" ? [] : {};
|
|
76
76
|
}
|
|
77
77
|
current = current[key];
|
|
@@ -138,6 +138,16 @@ var TreeSelect = (baseprops) => {
|
|
|
138
138
|
),
|
|
139
139
|
[dataSource, mergedFieldNames]
|
|
140
140
|
);
|
|
141
|
+
const keyItemMap = (0, import_react.useMemo)(() => {
|
|
142
|
+
const map = /* @__PURE__ */ new Map();
|
|
143
|
+
itemMap.forEach((item) => {
|
|
144
|
+
const k = String(item.key);
|
|
145
|
+
if (!map.has(k)) {
|
|
146
|
+
map.set(k, item);
|
|
147
|
+
}
|
|
148
|
+
});
|
|
149
|
+
return map;
|
|
150
|
+
}, [itemMap]);
|
|
141
151
|
const filteredDataSource = (0, import_react.useMemo)(() => {
|
|
142
152
|
const sourceArray = Array.isArray(dataSource) ? dataSource : [dataSource];
|
|
143
153
|
if (!searchValue) {
|
|
@@ -170,7 +180,7 @@ var TreeSelect = (baseprops) => {
|
|
|
170
180
|
}, [searchValue, dataSource, mergedFieldNames, onFilter]);
|
|
171
181
|
const selectedOptions = (0, import_react.useMemo)(() => {
|
|
172
182
|
return mergedValue.map((key) => {
|
|
173
|
-
const item =
|
|
183
|
+
const item = keyItemMap.get(String(key));
|
|
174
184
|
if (!item)
|
|
175
185
|
return null;
|
|
176
186
|
const label = typeof optionLabelProp === "function" ? optionLabelProp(item.original) : String(item[optionLabelProp] || item.label);
|
|
@@ -179,7 +189,7 @@ var TreeSelect = (baseprops) => {
|
|
|
179
189
|
label
|
|
180
190
|
}, item.original);
|
|
181
191
|
}).filter(Boolean);
|
|
182
|
-
}, [mergedValue,
|
|
192
|
+
}, [mergedValue, keyItemMap, optionLabelProp]);
|
|
183
193
|
const getNodes = (keys) => {
|
|
184
194
|
var _a2;
|
|
185
195
|
if (keys === "" || keys === null) {
|
|
@@ -191,10 +201,10 @@ var TreeSelect = (baseprops) => {
|
|
|
191
201
|
}
|
|
192
202
|
return keys.map((key) => {
|
|
193
203
|
var _a3;
|
|
194
|
-
return (_a3 =
|
|
204
|
+
return (_a3 = keyItemMap.get(String(key))) == null ? void 0 : _a3.original;
|
|
195
205
|
}).filter((node) => node !== void 0);
|
|
196
206
|
}
|
|
197
|
-
return (_a2 =
|
|
207
|
+
return (_a2 = keyItemMap.get(String(keys))) == null ? void 0 : _a2.original;
|
|
198
208
|
};
|
|
199
209
|
const handleSelect = (selectedKeys) => {
|
|
200
210
|
let keys;
|
package/dist/cjs/version.d.ts
CHANGED
package/dist/cjs/version.js
CHANGED
|
@@ -27,8 +27,8 @@ export default (function () {
|
|
|
27
27
|
var onFinish = function onFinish(values) {
|
|
28
28
|
console.log('Received values:', values);
|
|
29
29
|
};
|
|
30
|
-
var onFinishFailed = function onFinishFailed(
|
|
31
|
-
console.log('Failed:',
|
|
30
|
+
var onFinishFailed = function onFinishFailed(errors) {
|
|
31
|
+
console.log('Failed:', errors);
|
|
32
32
|
};
|
|
33
33
|
return /*#__PURE__*/React.createElement(Form, {
|
|
34
34
|
form: form,
|
|
@@ -13,8 +13,8 @@ export default (function () {
|
|
|
13
13
|
var onFinish = function onFinish(values) {
|
|
14
14
|
console.log('Received values:', values);
|
|
15
15
|
};
|
|
16
|
-
var onFinishFailed = function onFinishFailed(
|
|
17
|
-
console.log('Failed:',
|
|
16
|
+
var onFinishFailed = function onFinishFailed(errors) {
|
|
17
|
+
console.log('Failed:', errors);
|
|
18
18
|
};
|
|
19
19
|
return /*#__PURE__*/React.createElement(Form, {
|
|
20
20
|
form: form,
|
|
@@ -172,7 +172,10 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
172
172
|
_defineProperty(this, "setFieldsValue", function (newStore) {
|
|
173
173
|
var trigger = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'onChange';
|
|
174
174
|
if (trigger === 'reset' || trigger === 'clear') {
|
|
175
|
-
|
|
175
|
+
// 'reset' replaces the whole store; 'clear' merges the given keys
|
|
176
|
+
// (typically undefined) over the store so a partial clear never
|
|
177
|
+
// wipes values of unrelated fields.
|
|
178
|
+
_this.store = trigger === 'reset' ? newStore : _objectSpread(_objectSpread({}, _this.store), newStore);
|
|
176
179
|
if (trigger === 'reset') {
|
|
177
180
|
var _this$callbacks, _this$callbacks$onRes;
|
|
178
181
|
(_this$callbacks = _this.callbacks) === null || _this$callbacks === void 0 || (_this$callbacks$onRes = _this$callbacks.onReset) === null || _this$callbacks$onRes === void 0 || _this$callbacks$onRes.call(_this$callbacks);
|
|
@@ -259,13 +262,33 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
259
262
|
_this.refreshField();
|
|
260
263
|
});
|
|
261
264
|
_defineProperty(this, "clearFields", function (name) {
|
|
265
|
+
var _this$callbacks5, _this$callbacks5$onCl;
|
|
262
266
|
var names = name || Object.keys(_this.store);
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
},
|
|
267
|
+
|
|
268
|
+
// Merge undefined over the current store (nested paths included) —
|
|
269
|
+
// unrelated fields keep their values.
|
|
270
|
+
var clearStore = _objectSpread({}, _this.store);
|
|
271
|
+
names.forEach(function (n) {
|
|
272
|
+
var parsedPath = parsePath(n);
|
|
273
|
+
if (parsedPath.length > 1) {
|
|
274
|
+
clearStore = setValueByPath(clearStore, parsedPath, undefined);
|
|
275
|
+
} else {
|
|
276
|
+
clearStore[n] = undefined;
|
|
277
|
+
}
|
|
278
|
+
});
|
|
279
|
+
_this.deleteRelatedEntries(_this.validateMessages, name);
|
|
267
280
|
_this.clearFieldStatuses(name);
|
|
268
|
-
_this.
|
|
281
|
+
_this.store = clearStore;
|
|
282
|
+
(_this$callbacks5 = _this.callbacks) === null || _this$callbacks5 === void 0 || (_this$callbacks5$onCl = _this$callbacks5.onClear) === null || _this$callbacks5$onCl === void 0 || _this$callbacks5$onCl.call(_this$callbacks5);
|
|
283
|
+
|
|
284
|
+
// clearStore carries the whole store (nested paths must materialize
|
|
285
|
+
// it), so derive the refresh scope from `names` — only cleared
|
|
286
|
+
// fields re-render, not the entire form.
|
|
287
|
+
_this.getRelatedFieldNames(names).forEach(function (fieldName) {
|
|
288
|
+
var _this$fieldMap$get2;
|
|
289
|
+
(_this$fieldMap$get2 = _this.fieldMap.get(fieldName)) === null || _this$fieldMap$get2 === void 0 || _this$fieldMap$get2.onStoreChange();
|
|
290
|
+
});
|
|
291
|
+
_this.notifyWatchers(names);
|
|
269
292
|
});
|
|
270
293
|
_defineProperty(this, "validateField", /*#__PURE__*/function () {
|
|
271
294
|
var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(name, trigger) {
|
|
@@ -411,8 +434,8 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
411
434
|
var changedKeys = Object.keys(newStore);
|
|
412
435
|
var fieldNames = relatedFieldNames !== null && relatedFieldNames !== void 0 ? relatedFieldNames : _this.getRelatedFieldNames(changedKeys);
|
|
413
436
|
fieldNames.forEach(function (fieldName) {
|
|
414
|
-
var _this$fieldMap$
|
|
415
|
-
(_this$fieldMap$
|
|
437
|
+
var _this$fieldMap$get3;
|
|
438
|
+
(_this$fieldMap$get3 = _this.fieldMap.get(fieldName)) === null || _this$fieldMap$get3 === void 0 || _this$fieldMap$get3.onStoreChange();
|
|
416
439
|
});
|
|
417
440
|
_this.notifyWatchers(changedKeys);
|
|
418
441
|
} else {
|
|
@@ -641,11 +664,11 @@ export var FormStore = /*#__PURE__*/function () {
|
|
|
641
664
|
};
|
|
642
665
|
});
|
|
643
666
|
_defineProperty(this, "submit", /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
|
|
644
|
-
var _this$
|
|
667
|
+
var _this$callbacks6, onFinish, onFinishFailed, fieldErrors, groupErrors, statusErrors, allErrors;
|
|
645
668
|
return _regeneratorRuntime().wrap(function _callee4$(_context4) {
|
|
646
669
|
while (1) switch (_context4.prev = _context4.next) {
|
|
647
670
|
case 0:
|
|
648
|
-
_this$
|
|
671
|
+
_this$callbacks6 = _this.callbacks, onFinish = _this$callbacks6.onFinish, onFinishFailed = _this$callbacks6.onFinishFailed;
|
|
649
672
|
_context4.next = 3;
|
|
650
673
|
return _this.validateFields();
|
|
651
674
|
case 3:
|
|
@@ -1,178 +1,3 @@
|
|
|
1
|
-
// import { useRef } from 'react';
|
|
2
|
-
// import type {
|
|
3
|
-
// Callbacks,
|
|
4
|
-
// FieldEntity,
|
|
5
|
-
// FormInstance,
|
|
6
|
-
// NamePath,
|
|
7
|
-
// Store,
|
|
8
|
-
// validateMessage,
|
|
9
|
-
// } from './interface';
|
|
10
|
-
// import validate from './utils/validate';
|
|
11
|
-
|
|
12
|
-
// class FormStore {
|
|
13
|
-
// private store: Store = {};
|
|
14
|
-
// private callbacks: Callbacks = {};
|
|
15
|
-
// private fieldEntities: FieldEntity[] = [];
|
|
16
|
-
// private validateMessages: validateMessage[] = [];
|
|
17
|
-
// private initialized = false;
|
|
18
|
-
// // 初始化form实例
|
|
19
|
-
// initialize = ({
|
|
20
|
-
// initialValues,
|
|
21
|
-
// callbacks,
|
|
22
|
-
// }: {
|
|
23
|
-
// initialValues?: Store;
|
|
24
|
-
// callbacks?: Callbacks;
|
|
25
|
-
// }) => {
|
|
26
|
-
// if (!this.initialized) {
|
|
27
|
-
// this.initialized = true;
|
|
28
|
-
|
|
29
|
-
// if (initialValues) {
|
|
30
|
-
// this.store = initialValues;
|
|
31
|
-
// } else {
|
|
32
|
-
// this.store = {};
|
|
33
|
-
// }
|
|
34
|
-
|
|
35
|
-
// if (callbacks) {
|
|
36
|
-
// this.setCallbacks(callbacks);
|
|
37
|
-
// }
|
|
38
|
-
// }
|
|
39
|
-
// };
|
|
40
|
-
|
|
41
|
-
// getFieldsValue = () => {
|
|
42
|
-
// return { ...this.store };
|
|
43
|
-
// };
|
|
44
|
-
|
|
45
|
-
// getFieldValue = (name: NamePath) => {
|
|
46
|
-
// return this.store[name];
|
|
47
|
-
// };
|
|
48
|
-
|
|
49
|
-
// getFieldValidate = (name: NamePath) => {
|
|
50
|
-
// return this.validateMessages?.find((item) => item.name === name);
|
|
51
|
-
// };
|
|
52
|
-
|
|
53
|
-
// resetFields = (name?: NamePath[]) => {
|
|
54
|
-
// if (name) {
|
|
55
|
-
// name.forEach((n) => {
|
|
56
|
-
// this.setFieldsValue({ [n]: undefined });
|
|
57
|
-
// });
|
|
58
|
-
// } else {
|
|
59
|
-
// Object.keys(this.store).forEach((key) => {
|
|
60
|
-
// this.setFieldsValue({ [key]: undefined });
|
|
61
|
-
// });
|
|
62
|
-
// }
|
|
63
|
-
// };
|
|
64
|
-
|
|
65
|
-
// validateFields = () => {
|
|
66
|
-
// const err: validateMessage[] = [];
|
|
67
|
-
// this.fieldEntities.forEach((entity) => {
|
|
68
|
-
// const { name, rules, required } = entity.props;
|
|
69
|
-
// const value: NamePath = name && this.getFieldValue(name);
|
|
70
|
-
|
|
71
|
-
// const mergedRules = rules || [];
|
|
72
|
-
|
|
73
|
-
// if (required) {
|
|
74
|
-
// mergedRules.push({
|
|
75
|
-
// required: true,
|
|
76
|
-
// message: 'This is required field.',
|
|
77
|
-
// });
|
|
78
|
-
// }
|
|
79
|
-
|
|
80
|
-
// mergedRules.forEach((rule) => {
|
|
81
|
-
// const mark = validate(rule, value);
|
|
82
|
-
// if (name && !mark) {
|
|
83
|
-
// err.push({
|
|
84
|
-
// name: name,
|
|
85
|
-
// status: 'error',
|
|
86
|
-
// value,
|
|
87
|
-
// ...rule
|
|
88
|
-
// });
|
|
89
|
-
// }
|
|
90
|
-
// });
|
|
91
|
-
// });
|
|
92
|
-
// return err;
|
|
93
|
-
// };
|
|
94
|
-
|
|
95
|
-
// setFieldsValue = (newStore: Store, isChange?: boolean) => {
|
|
96
|
-
// // const { onValuesChange } = this.callbacks;
|
|
97
|
-
// this.store = {
|
|
98
|
-
// ...this.store,
|
|
99
|
-
// ...newStore,
|
|
100
|
-
// };
|
|
101
|
-
// // onValuesChange?.(newStore, this.store);
|
|
102
|
-
// this.refreshField(newStore, isChange);
|
|
103
|
-
// };
|
|
104
|
-
|
|
105
|
-
// refreshField = (newStore?: Store, isChange?: boolean) => {
|
|
106
|
-
// if (newStore) {
|
|
107
|
-
// this.fieldEntities.forEach((entity) => {
|
|
108
|
-
// Object.keys(newStore).forEach((k) => {
|
|
109
|
-
// if (k === entity.props.name) {
|
|
110
|
-
// if (isChange) {
|
|
111
|
-
// this.validateMessages = this.validateFields();
|
|
112
|
-
// }
|
|
113
|
-
// entity.onStoreChange();
|
|
114
|
-
// }
|
|
115
|
-
// });
|
|
116
|
-
// });
|
|
117
|
-
// } else {
|
|
118
|
-
// this.fieldEntities.forEach((entity) => {
|
|
119
|
-
// if (entity.props.rules || entity.props.required) {
|
|
120
|
-
// entity?.onStoreChange();
|
|
121
|
-
// }
|
|
122
|
-
// });
|
|
123
|
-
// }
|
|
124
|
-
// };
|
|
125
|
-
|
|
126
|
-
// setCallbacks = (callbacks: Callbacks) => {
|
|
127
|
-
// this.callbacks = { ...this.callbacks, ...callbacks };
|
|
128
|
-
// };
|
|
129
|
-
|
|
130
|
-
// getCallbacks = () => {
|
|
131
|
-
// return this.callbacks;
|
|
132
|
-
// };
|
|
133
|
-
|
|
134
|
-
// // 订阅与取消订阅
|
|
135
|
-
// registerFieldEntities = (entity: FieldEntity) => {
|
|
136
|
-
// this.fieldEntities.push(entity);
|
|
137
|
-
// if (entity.props.name) {
|
|
138
|
-
// this.store = { ...this.store, [entity.props.name]: undefined };
|
|
139
|
-
// }
|
|
140
|
-
// return () => {
|
|
141
|
-
// this.fieldEntities = this.fieldEntities.filter((item) => item !== entity);
|
|
142
|
-
// const { name } = entity.props;
|
|
143
|
-
// if (name) {
|
|
144
|
-
// delete this.store[name];
|
|
145
|
-
// }
|
|
146
|
-
// };
|
|
147
|
-
// };
|
|
148
|
-
|
|
149
|
-
// submit = () => {
|
|
150
|
-
// const { onFinish, onFinishFailed } = this.callbacks;
|
|
151
|
-
// this.validateMessages = this.validateFields();
|
|
152
|
-
// if (this.validateMessages.length === 0) {
|
|
153
|
-
// onFinish?.(this.getFieldsValue());
|
|
154
|
-
// } else {
|
|
155
|
-
// onFinishFailed?.(this.validateMessages);
|
|
156
|
-
// }
|
|
157
|
-
// this.refreshField();
|
|
158
|
-
// };
|
|
159
|
-
|
|
160
|
-
// getForm(): FormInstance {
|
|
161
|
-
// return {
|
|
162
|
-
// getFieldValidate: this.getFieldValidate,
|
|
163
|
-
// getFieldsValue: this.getFieldsValue,
|
|
164
|
-
// getFieldValue: this.getFieldValue,
|
|
165
|
-
// setFieldsValue: this.setFieldsValue,
|
|
166
|
-
// resetFields: this.resetFields,
|
|
167
|
-
// submit: this.submit,
|
|
168
|
-
// setCallbacks: this.setCallbacks,
|
|
169
|
-
// getCallbacks: this.getCallbacks,
|
|
170
|
-
// registerFieldEntities: this.registerFieldEntities,
|
|
171
|
-
// initialize: this.initialize,
|
|
172
|
-
// };
|
|
173
|
-
// }
|
|
174
|
-
// }
|
|
175
|
-
|
|
176
1
|
import { useRef } from 'react';
|
|
177
2
|
import { useLocale } from "../../locale";
|
|
178
3
|
import { FormStore } from "../form-store";
|
package/dist/esm/Form/index.d.ts
CHANGED
|
@@ -16,5 +16,5 @@ type FormInterface = typeof InternalForm & {
|
|
|
16
16
|
List: typeof List;
|
|
17
17
|
};
|
|
18
18
|
declare const Form: FormInterface;
|
|
19
|
-
export type { FieldGroupProps, FieldStatus, FieldStatusData, FormInstance, FormListProps, FormProps, } from './interface';
|
|
19
|
+
export type { FieldGroupProps, FieldStatus, FieldStatusData, FormInstance, FormListProps, FormProps, ValidateMessage, } from './interface';
|
|
20
20
|
export default Form;
|
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
import type { TooltipProps } from '../Tooltip';
|
|
3
3
|
import type { DataAttributeProps } from '../utils/types';
|
|
4
4
|
export type StoreValue = any;
|
|
5
|
+
/**
|
|
6
|
+
* Form values keyed by field name. Nested-path fields (e.g.
|
|
7
|
+
* name="user.name") hold their values in nested objects:
|
|
8
|
+
* `{ user: { name: 'tom' } }`
|
|
9
|
+
*/
|
|
5
10
|
export type Store = Record<string, StoreValue>;
|
|
6
11
|
export type Name = string;
|
|
7
12
|
export type NamePath = string | string[] | number | (string | number)[];
|
|
@@ -37,7 +42,9 @@ export interface FormProps<Values = any> extends DataAttributeProps {
|
|
|
37
42
|
*/
|
|
38
43
|
disabled?: boolean;
|
|
39
44
|
/**
|
|
40
|
-
* Initial values
|
|
45
|
+
* Initial values, keyed by field name. Nested-path fields (e.g.
|
|
46
|
+
* name="user.name") take their values from nested objects:
|
|
47
|
+
* `{ user: { name: 'tom' } }`
|
|
41
48
|
*/
|
|
42
49
|
initialValues?: Store;
|
|
43
50
|
/**
|
|
@@ -81,7 +88,7 @@ export interface Callbacks<Values = any> {
|
|
|
81
88
|
/**
|
|
82
89
|
* Triggered on failed form submit
|
|
83
90
|
* */
|
|
84
|
-
onFinishFailed?: (
|
|
91
|
+
onFinishFailed?: (errors: ValidateMessage[]) => void;
|
|
85
92
|
/**
|
|
86
93
|
* Triggered on form reset
|
|
87
94
|
* */
|
|
@@ -73,7 +73,8 @@ export function setValueByPath(store, path, value) {
|
|
|
73
73
|
var current = newStore;
|
|
74
74
|
for (var i = 0; i < path.length - 1; i++) {
|
|
75
75
|
var key = String(path[i]);
|
|
76
|
-
|
|
76
|
+
// eslint-disable-next-line eqeqeq
|
|
77
|
+
if (current[key] == null) {
|
|
77
78
|
// 根据下一个键的类型创建容器
|
|
78
79
|
current[key] = typeof path[i + 1] === 'number' ? [] : {};
|
|
79
80
|
}
|
|
@@ -93,6 +93,20 @@ var TreeSelect = function TreeSelect(baseprops) {
|
|
|
93
93
|
_useMemo2 = _slicedToArray(_useMemo, 2),
|
|
94
94
|
itemMap = _useMemo2[1];
|
|
95
95
|
|
|
96
|
+
// itemMap 以 uid(Tree 内部的路径键)为键,仅根节点 uid === key。
|
|
97
|
+
// 选中项展示 / getNodes 需要按外部 value(raw key)查找,否则嵌套节点
|
|
98
|
+
// 查不到会走 Selector 的孤儿值回退,直接显示 value 本身
|
|
99
|
+
var keyItemMap = useMemo(function () {
|
|
100
|
+
var map = new Map();
|
|
101
|
+
itemMap.forEach(function (item) {
|
|
102
|
+
var k = String(item.key);
|
|
103
|
+
if (!map.has(k)) {
|
|
104
|
+
map.set(k, item);
|
|
105
|
+
}
|
|
106
|
+
});
|
|
107
|
+
return map;
|
|
108
|
+
}, [itemMap]);
|
|
109
|
+
|
|
96
110
|
// Filter data source for searching
|
|
97
111
|
var filteredDataSource = useMemo(function () {
|
|
98
112
|
var sourceArray = Array.isArray(dataSource) ? dataSource : [dataSource];
|
|
@@ -128,7 +142,7 @@ var TreeSelect = function TreeSelect(baseprops) {
|
|
|
128
142
|
// Convert selected keys to options format for Selector display
|
|
129
143
|
var selectedOptions = useMemo(function () {
|
|
130
144
|
return mergedValue.map(function (key) {
|
|
131
|
-
var item =
|
|
145
|
+
var item = keyItemMap.get(String(key));
|
|
132
146
|
if (!item) return null;
|
|
133
147
|
var label = typeof optionLabelProp === 'function' ? optionLabelProp(item.original) : String(item[optionLabelProp] || item.label);
|
|
134
148
|
return _objectSpread({
|
|
@@ -136,9 +150,9 @@ var TreeSelect = function TreeSelect(baseprops) {
|
|
|
136
150
|
label: label
|
|
137
151
|
}, item.original);
|
|
138
152
|
}).filter(Boolean);
|
|
139
|
-
}, [mergedValue,
|
|
153
|
+
}, [mergedValue, keyItemMap, optionLabelProp]);
|
|
140
154
|
var getNodes = function getNodes(keys) {
|
|
141
|
-
var
|
|
155
|
+
var _keyItemMap$get2;
|
|
142
156
|
if (keys === '' || keys === null) {
|
|
143
157
|
return undefined;
|
|
144
158
|
}
|
|
@@ -147,13 +161,13 @@ var TreeSelect = function TreeSelect(baseprops) {
|
|
|
147
161
|
return [];
|
|
148
162
|
}
|
|
149
163
|
return keys.map(function (key) {
|
|
150
|
-
var
|
|
151
|
-
return (
|
|
164
|
+
var _keyItemMap$get;
|
|
165
|
+
return (_keyItemMap$get = keyItemMap.get(String(key))) === null || _keyItemMap$get === void 0 ? void 0 : _keyItemMap$get.original;
|
|
152
166
|
}).filter(function (node) {
|
|
153
167
|
return node !== undefined;
|
|
154
168
|
});
|
|
155
169
|
}
|
|
156
|
-
return (
|
|
170
|
+
return (_keyItemMap$get2 = keyItemMap.get(String(keys))) === null || _keyItemMap$get2 === void 0 ? void 0 : _keyItemMap$get2.original;
|
|
157
171
|
};
|
|
158
172
|
var handleSelect = function handleSelect(selectedKeys) {
|
|
159
173
|
var keys;
|
package/dist/esm/version.d.ts
CHANGED
package/dist/esm/version.js
CHANGED