@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.
@@ -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
- if (defaultValue !== undefined) {
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
- setTogglerValues(value.filter(isString_1.default));
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
- setTogglerValue((booleanToKey === null || booleanToKey === void 0 ? void 0 : booleanToKey[nextValue]) || nextValue);
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
- if (defaultValue !== undefined) {
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
- setTogglerValues(value.filter(isString));
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
- setTogglerValue((booleanToKey === null || booleanToKey === void 0 ? void 0 : booleanToKey[nextValue]) || nextValue);
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) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/dynamic-forms",
3
- "version": "5.25.0",
3
+ "version": "5.26.0",
4
4
  "description": "",
5
5
  "license": "MIT",
6
6
  "main": "build/cjs/index.js",