@gravity-ui/dynamic-forms 5.25.0 → 5.26.0
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/build/cjs/lib/unstable/core/SchemaRendererNode/SchemaRendererNode.js +1 -3
- package/build/cjs/lib/unstable/core/useSchemaRenderer/useSchemaRenderer.js +5 -1
- package/build/cjs/lib/unstable/core/useSchemaRenderer/utils/get-validate.js +1 -1
- package/build/cjs/lib/unstable/kit/components/EntityError/EntityError.js +1 -1
- package/build/cjs/lib/unstable/kit/entities/Alert/Alert.js +3 -3
- package/build/cjs/lib/unstable/kit/entities/FewOfNested/FewOfNested.js +6 -1
- package/build/cjs/lib/unstable/kit/entities/OneOfNested/OneOfNested.js +3 -1
- package/build/esm/lib/unstable/core/SchemaRendererNode/SchemaRendererNode.js +1 -3
- package/build/esm/lib/unstable/core/useSchemaRenderer/useSchemaRenderer.js +5 -1
- package/build/esm/lib/unstable/core/useSchemaRenderer/utils/get-validate.js +1 -1
- package/build/esm/lib/unstable/kit/components/EntityError/EntityError.js +1 -1
- package/build/esm/lib/unstable/kit/entities/Alert/Alert.js +3 -3
- package/build/esm/lib/unstable/kit/entities/FewOfNested/FewOfNested.js +6 -1
- package/build/esm/lib/unstable/kit/entities/OneOfNested/OneOfNested.js +3 -1
- package/package.json +1 -1
|
@@ -85,9 +85,7 @@ const SchemaRendererNodeComponent = ({ headName, modeOverride, name, schemaOverr
|
|
|
85
85
|
silent: true,
|
|
86
86
|
validateFields: [(0, utils_1.getServiceFieldName)(useSchemaRenderer_1.SCHEMA_RENDERER_SERVICE_FIELD, headName)],
|
|
87
87
|
});
|
|
88
|
-
|
|
89
|
-
(0, utils_2.scheduleFlush)(form);
|
|
90
|
-
}
|
|
88
|
+
(0, utils_2.scheduleFlush)(form);
|
|
91
89
|
unsubscribeRef.current = () => {
|
|
92
90
|
unsubscribe();
|
|
93
91
|
(0, utils_2.scheduleFlush)(form);
|
|
@@ -19,7 +19,7 @@ const useSchemaRenderer = ({ config, connectValidate = true, errorMessages, json
|
|
|
19
19
|
const dispatchEvent = react_1.default.useMemo(() => (0, utils_2.getDispatch)(form, headName), [form, headName]);
|
|
20
20
|
const runValidate = react_1.default.useMemo(() => (0, utils_2.getRunValidate)(form, headName, validateOnBlur), [form, headName, validateOnBlur]);
|
|
21
21
|
const validate = react_1.default.useMemo(() => (0, utils_2.getValidate)(form, headName), [form, headName]);
|
|
22
|
-
react_1.default.useMemo(() => {
|
|
22
|
+
const unsubscribeField = react_1.default.useMemo(() => {
|
|
23
23
|
var _a;
|
|
24
24
|
(_a = unsubscribeRef.current) === null || _a === void 0 ? void 0 : _a.call(unsubscribeRef);
|
|
25
25
|
const prevParams = prevParamsRef.current;
|
|
@@ -84,6 +84,7 @@ const useSchemaRenderer = ({ config, connectValidate = true, errorMessages, json
|
|
|
84
84
|
validateOnBlur,
|
|
85
85
|
};
|
|
86
86
|
stateRef.current = initialState;
|
|
87
|
+
return unsubscribeRef.current;
|
|
87
88
|
}, [
|
|
88
89
|
config,
|
|
89
90
|
connectValidate,
|
|
@@ -101,6 +102,9 @@ const useSchemaRenderer = ({ config, connectValidate = true, errorMessages, json
|
|
|
101
102
|
validateOnBlur,
|
|
102
103
|
userContext,
|
|
103
104
|
]);
|
|
105
|
+
react_1.default.useEffect(() => {
|
|
106
|
+
runValidate();
|
|
107
|
+
}, [unsubscribeField]);
|
|
104
108
|
react_1.default.useEffect(() => {
|
|
105
109
|
return () => {
|
|
106
110
|
var _a;
|
|
@@ -70,9 +70,9 @@ const getValidate = (form, headName) => {
|
|
|
70
70
|
Object.keys(Object.assign(Object.assign({}, srState.errors), allErrors)).forEach((key) => {
|
|
71
71
|
if (srState.errors[key] !== allErrors[key]) {
|
|
72
72
|
newErrors[key] = allErrors[key];
|
|
73
|
+
srState.errors[key] = allErrors[key];
|
|
73
74
|
}
|
|
74
75
|
});
|
|
75
|
-
srState.errors = allErrors;
|
|
76
76
|
srState.waiters = Object.assign(Object.assign({}, srState.waiters), waiters);
|
|
77
77
|
if (Object.values(newErrors).length) {
|
|
78
78
|
srState.dispatchEvent([
|
|
@@ -8,7 +8,7 @@ const utils_1 = require("../../utils");
|
|
|
8
8
|
const b = (0, utils_1.block)('entity-error');
|
|
9
9
|
const EntityError = ({ errorMessage, validationState }) => {
|
|
10
10
|
if (validationState === 'invalid' && errorMessage) {
|
|
11
|
-
return (react_1.default.createElement(uikit_1.Text, { className: b(), color: "danger" }, errorMessage));
|
|
11
|
+
return (react_1.default.createElement(uikit_1.Text, { className: b(), color: "danger", "data-sr-error": "true" }, errorMessage));
|
|
12
12
|
}
|
|
13
13
|
return null;
|
|
14
14
|
};
|
|
@@ -29,17 +29,17 @@ const Alert = ({ headName, props, schema }) => {
|
|
|
29
29
|
const msg = react_1.default.useMemo(() => {
|
|
30
30
|
if (message) {
|
|
31
31
|
if (typeof message === 'string') {
|
|
32
|
-
return (react_1.default.createElement("div", { className: b('message', { expanded }) },
|
|
32
|
+
return (react_1.default.createElement("div", { className: b('message', { expanded: expanded || !title }) },
|
|
33
33
|
react_1.default.createElement(components_1.HTMLContent, { content: message, headName: headName })));
|
|
34
34
|
}
|
|
35
35
|
return message;
|
|
36
36
|
}
|
|
37
37
|
if (schema.description) {
|
|
38
|
-
return (react_1.default.createElement("div", { className: b('message', { expanded }) },
|
|
38
|
+
return (react_1.default.createElement("div", { className: b('message', { expanded: expanded || !title }) },
|
|
39
39
|
react_1.default.createElement(components_1.HTMLContent, { content: schema.description, headName: headName })));
|
|
40
40
|
}
|
|
41
41
|
return undefined;
|
|
42
|
-
}, [expanded, headName, message, schema.description]);
|
|
42
|
+
}, [expanded, headName, message, schema.description, title]);
|
|
43
43
|
return (react_1.default.createElement(components_1.EntityContainer, { className: b({ expanded }), stretch: "fit", fill: "populated" },
|
|
44
44
|
react_1.default.createElement(uikit_1.Alert, Object.assign({ icon: icon, message: msg, title: title }, entityRestProps))));
|
|
45
45
|
};
|
|
@@ -31,7 +31,12 @@ const FewOfNested = ({ Layout, headName, input, layoutProps, meta, mode, props,
|
|
|
31
31
|
const { Entity, Layout, entityProps, independent, layoutProps } = renderKit[mode];
|
|
32
32
|
const togglerInput = Object.assign(Object.assign({}, input), { name: togglerArrayRemoveButton ? name : `${name}._____toggler`, value: togglerValues, onChange: (value) => {
|
|
33
33
|
if (Array.isArray(value)) {
|
|
34
|
-
|
|
34
|
+
const nextTogglerValues = value.filter(isString_1.default);
|
|
35
|
+
setTogglerValues(nextTogglerValues);
|
|
36
|
+
input.onChange(nextTogglerValues.reduce((acc, togglerValue) => {
|
|
37
|
+
var _a;
|
|
38
|
+
return (Object.assign(Object.assign({}, acc), { [togglerValue]: (_a = input.value) === null || _a === void 0 ? void 0 : _a[togglerValue] }));
|
|
39
|
+
}, {}));
|
|
35
40
|
}
|
|
36
41
|
} });
|
|
37
42
|
const togglerMeta = Object.assign(Object.assign({}, meta), { error: undefined });
|
|
@@ -27,7 +27,9 @@ const OneOfNested = ({ Layout, headName, input, layoutProps, meta, mode, props,
|
|
|
27
27
|
? booleanToKey.true === togglerValue
|
|
28
28
|
: togglerValue, onChange: (value) => {
|
|
29
29
|
const nextValue = `${value}`;
|
|
30
|
-
|
|
30
|
+
const nextTogglerValue = (booleanToKey === null || booleanToKey === void 0 ? void 0 : booleanToKey[nextValue]) || nextValue;
|
|
31
|
+
setTogglerValue(nextTogglerValue);
|
|
32
|
+
input.onChange({ [nextTogglerValue]: undefined });
|
|
31
33
|
} });
|
|
32
34
|
const togglerMeta = Object.assign(Object.assign({}, meta), { error: undefined });
|
|
33
35
|
if (Entity) {
|
|
@@ -81,9 +81,7 @@ const SchemaRendererNodeComponent = ({ headName, modeOverride, name, schemaOverr
|
|
|
81
81
|
silent: true,
|
|
82
82
|
validateFields: [getServiceFieldName(SCHEMA_RENDERER_SERVICE_FIELD, headName)],
|
|
83
83
|
});
|
|
84
|
-
|
|
85
|
-
scheduleFlush(form);
|
|
86
|
-
}
|
|
84
|
+
scheduleFlush(form);
|
|
87
85
|
unsubscribeRef.current = () => {
|
|
88
86
|
unsubscribe();
|
|
89
87
|
scheduleFlush(form);
|
|
@@ -15,7 +15,7 @@ export const useSchemaRenderer = ({ config, connectValidate = true, errorMessage
|
|
|
15
15
|
const dispatchEvent = React.useMemo(() => getDispatch(form, headName), [form, headName]);
|
|
16
16
|
const runValidate = React.useMemo(() => getRunValidate(form, headName, validateOnBlur), [form, headName, validateOnBlur]);
|
|
17
17
|
const validate = React.useMemo(() => getValidate(form, headName), [form, headName]);
|
|
18
|
-
React.useMemo(() => {
|
|
18
|
+
const unsubscribeField = React.useMemo(() => {
|
|
19
19
|
var _a;
|
|
20
20
|
(_a = unsubscribeRef.current) === null || _a === void 0 ? void 0 : _a.call(unsubscribeRef);
|
|
21
21
|
const prevParams = prevParamsRef.current;
|
|
@@ -80,6 +80,7 @@ export const useSchemaRenderer = ({ config, connectValidate = true, errorMessage
|
|
|
80
80
|
validateOnBlur,
|
|
81
81
|
};
|
|
82
82
|
stateRef.current = initialState;
|
|
83
|
+
return unsubscribeRef.current;
|
|
83
84
|
}, [
|
|
84
85
|
config,
|
|
85
86
|
connectValidate,
|
|
@@ -97,6 +98,9 @@ export const useSchemaRenderer = ({ config, connectValidate = true, errorMessage
|
|
|
97
98
|
validateOnBlur,
|
|
98
99
|
userContext,
|
|
99
100
|
]);
|
|
101
|
+
React.useEffect(() => {
|
|
102
|
+
runValidate();
|
|
103
|
+
}, [unsubscribeField]);
|
|
100
104
|
React.useEffect(() => {
|
|
101
105
|
return () => {
|
|
102
106
|
var _a;
|
|
@@ -66,9 +66,9 @@ export const getValidate = (form, headName) => {
|
|
|
66
66
|
Object.keys(Object.assign(Object.assign({}, srState.errors), allErrors)).forEach((key) => {
|
|
67
67
|
if (srState.errors[key] !== allErrors[key]) {
|
|
68
68
|
newErrors[key] = allErrors[key];
|
|
69
|
+
srState.errors[key] = allErrors[key];
|
|
69
70
|
}
|
|
70
71
|
});
|
|
71
|
-
srState.errors = allErrors;
|
|
72
72
|
srState.waiters = Object.assign(Object.assign({}, srState.waiters), waiters);
|
|
73
73
|
if (Object.values(newErrors).length) {
|
|
74
74
|
srState.dispatchEvent([
|
|
@@ -5,7 +5,7 @@ import './EntityError.css';
|
|
|
5
5
|
const b = block('entity-error');
|
|
6
6
|
export const EntityError = ({ errorMessage, validationState }) => {
|
|
7
7
|
if (validationState === 'invalid' && errorMessage) {
|
|
8
|
-
return (React.createElement(Text, { className: b(), color: "danger" }, errorMessage));
|
|
8
|
+
return (React.createElement(Text, { className: b(), color: "danger", "data-sr-error": "true" }, errorMessage));
|
|
9
9
|
}
|
|
10
10
|
return null;
|
|
11
11
|
};
|
|
@@ -27,17 +27,17 @@ export const Alert = ({ headName, props, schema }) => {
|
|
|
27
27
|
const msg = React.useMemo(() => {
|
|
28
28
|
if (message) {
|
|
29
29
|
if (typeof message === 'string') {
|
|
30
|
-
return (React.createElement("div", { className: b('message', { expanded }) },
|
|
30
|
+
return (React.createElement("div", { className: b('message', { expanded: expanded || !title }) },
|
|
31
31
|
React.createElement(HTMLContent, { content: message, headName: headName })));
|
|
32
32
|
}
|
|
33
33
|
return message;
|
|
34
34
|
}
|
|
35
35
|
if (schema.description) {
|
|
36
|
-
return (React.createElement("div", { className: b('message', { expanded }) },
|
|
36
|
+
return (React.createElement("div", { className: b('message', { expanded: expanded || !title }) },
|
|
37
37
|
React.createElement(HTMLContent, { content: schema.description, headName: headName })));
|
|
38
38
|
}
|
|
39
39
|
return undefined;
|
|
40
|
-
}, [expanded, headName, message, schema.description]);
|
|
40
|
+
}, [expanded, headName, message, schema.description, title]);
|
|
41
41
|
return (React.createElement(EntityContainer, { className: b({ expanded }), stretch: "fit", fill: "populated" },
|
|
42
42
|
React.createElement(UIKitAlert, Object.assign({ icon: icon, message: msg, title: title }, entityRestProps))));
|
|
43
43
|
};
|
|
@@ -28,7 +28,12 @@ export const FewOfNested = ({ Layout, headName, input, layoutProps, meta, mode,
|
|
|
28
28
|
const { Entity, Layout, entityProps, independent, layoutProps } = renderKit[mode];
|
|
29
29
|
const togglerInput = Object.assign(Object.assign({}, input), { name: togglerArrayRemoveButton ? name : `${name}._____toggler`, value: togglerValues, onChange: (value) => {
|
|
30
30
|
if (Array.isArray(value)) {
|
|
31
|
-
|
|
31
|
+
const nextTogglerValues = value.filter(isString);
|
|
32
|
+
setTogglerValues(nextTogglerValues);
|
|
33
|
+
input.onChange(nextTogglerValues.reduce((acc, togglerValue) => {
|
|
34
|
+
var _a;
|
|
35
|
+
return (Object.assign(Object.assign({}, acc), { [togglerValue]: (_a = input.value) === null || _a === void 0 ? void 0 : _a[togglerValue] }));
|
|
36
|
+
}, {}));
|
|
32
37
|
}
|
|
33
38
|
} });
|
|
34
39
|
const togglerMeta = Object.assign(Object.assign({}, meta), { error: undefined });
|
|
@@ -24,7 +24,9 @@ export const OneOfNested = ({ Layout, headName, input, layoutProps, meta, mode,
|
|
|
24
24
|
? booleanToKey.true === togglerValue
|
|
25
25
|
: togglerValue, onChange: (value) => {
|
|
26
26
|
const nextValue = `${value}`;
|
|
27
|
-
|
|
27
|
+
const nextTogglerValue = (booleanToKey === null || booleanToKey === void 0 ? void 0 : booleanToKey[nextValue]) || nextValue;
|
|
28
|
+
setTogglerValue(nextTogglerValue);
|
|
29
|
+
input.onChange({ [nextTogglerValue]: undefined });
|
|
28
30
|
} });
|
|
29
31
|
const togglerMeta = Object.assign(Object.assign({}, meta), { error: undefined });
|
|
30
32
|
if (Entity) {
|