@gravity-ui/dynamic-forms 5.23.1 → 5.25.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/kit/i18n/en.json +34 -0
- package/build/cjs/lib/kit/i18n/ru.json +34 -0
- package/build/cjs/lib/unstable/core/SchemaRendererNode/SchemaRendererNode.js +25 -19
- package/build/cjs/lib/unstable/core/SchemaRendererNode/utils.d.ts +3 -0
- package/build/cjs/lib/unstable/core/SchemaRendererNode/utils.js +25 -1
- package/build/cjs/lib/unstable/core/types/components.d.ts +3 -13
- package/build/cjs/lib/unstable/core/types/schema.d.ts +14 -7
- package/build/cjs/lib/unstable/core/types/validation.d.ts +1 -1
- package/build/cjs/lib/unstable/core/useSchemaRenderer/types/state.d.ts +3 -0
- package/build/cjs/lib/unstable/core/useSchemaRenderer/useSchemaRenderer.js +1 -1
- package/build/cjs/lib/unstable/core/utils/definers.d.ts +27 -13
- package/build/cjs/lib/unstable/kit/components/HTMLContent/HTMLContent.d.ts +2 -1
- package/build/cjs/lib/unstable/kit/components/HTMLContent/HTMLContent.js +12 -2
- package/build/cjs/lib/unstable/kit/components/LayoutContainer/LayoutContainer.css +3 -0
- package/build/cjs/lib/unstable/kit/components/LayoutContainer/LayoutContainer.d.ts +1 -0
- package/build/cjs/lib/unstable/kit/components/LayoutContainer/LayoutContainer.js +2 -2
- package/build/cjs/lib/unstable/kit/constants/index.d.ts +1 -0
- package/build/cjs/lib/unstable/kit/constants/index.js +3 -1
- package/build/cjs/lib/unstable/kit/constants/messages.d.ts +2 -0
- package/build/cjs/lib/unstable/kit/constants/messages.js +89 -0
- package/build/cjs/lib/unstable/kit/entities/Alert/Alert.css +16 -0
- package/build/cjs/lib/unstable/kit/entities/Alert/Alert.js +26 -7
- package/build/cjs/lib/unstable/kit/entities/ArrayEntity/ArrayEntity.d.ts +0 -1
- package/build/cjs/lib/unstable/kit/entities/ArrayEntity/ArrayEntity.js +4 -2
- package/build/cjs/lib/unstable/kit/entities/ArrayTable/ArrayTable.d.ts +0 -1
- package/build/cjs/lib/unstable/kit/entities/ArrayTable/ArrayTable.js +7 -5
- package/build/cjs/lib/unstable/kit/entities/FewOfNested/FewOfNested.css +3 -0
- package/build/cjs/lib/unstable/kit/entities/Label/Label.js +4 -4
- package/build/cjs/lib/unstable/kit/entities/Monaco/Monaco.js +3 -1
- package/build/cjs/lib/unstable/kit/entities/ObjectEntity/ObjectEntity.d.ts +0 -1
- package/build/cjs/lib/unstable/kit/entities/ObjectInline/ObjectInline.d.ts +0 -1
- package/build/cjs/lib/unstable/kit/entities/OneOfNested/OneOfNested.css +3 -0
- package/build/cjs/lib/unstable/kit/entities/TextContent/TextContent.js +4 -4
- package/build/cjs/lib/unstable/kit/form-entities/CheckboxGroupInput/CheckboxGroupInput.d.ts +0 -1
- package/build/cjs/lib/unstable/kit/form-entities/CheckboxGroupInput/CheckboxGroupInput.js +3 -1
- package/build/cjs/lib/unstable/kit/form-entities/CheckboxInput/CheckboxInput.js +3 -1
- package/build/cjs/lib/unstable/kit/form-entities/ColorPickerInput/ColorPickerInput.js +3 -1
- package/build/cjs/lib/unstable/kit/form-entities/DateInput/DateInput.js +3 -2
- package/build/cjs/lib/unstable/kit/form-entities/FileInput/FileInput.js +3 -1
- package/build/cjs/lib/unstable/kit/form-entities/MultiSelectInput/MultiSelectInput.js +4 -2
- package/build/cjs/lib/unstable/kit/form-entities/NumberInput/NumberInput.js +3 -2
- package/build/cjs/lib/unstable/kit/form-entities/NumberWithScaleInput/NumberWithScaleInput.js +3 -2
- package/build/cjs/lib/unstable/kit/form-entities/PasswordInput/PasswordInput.js +3 -2
- package/build/cjs/lib/unstable/kit/form-entities/RadioGroupInput/RadioGroupInput.js +3 -1
- package/build/cjs/lib/unstable/kit/form-entities/RangeSliderInput/RangeSliderInput.js +9 -8
- package/build/cjs/lib/unstable/kit/form-entities/SegmentedRadioGroupInput/SegmentedRadioGroupInput.css +4 -0
- package/build/cjs/lib/unstable/kit/form-entities/SegmentedRadioGroupInput/SegmentedRadioGroupInput.d.ts +1 -1
- package/build/cjs/lib/unstable/kit/form-entities/SegmentedRadioGroupInput/SegmentedRadioGroupInput.js +30 -3
- package/build/cjs/lib/unstable/kit/form-entities/SelectInput/SelectInput.d.ts +1 -2
- package/build/cjs/lib/unstable/kit/form-entities/SelectInput/SelectInput.js +4 -2
- package/build/cjs/lib/unstable/kit/form-entities/SliderInput/SliderInput.js +3 -1
- package/build/cjs/lib/unstable/kit/form-entities/StringInput/StringInput.js +3 -2
- package/build/cjs/lib/unstable/kit/form-entities/StringNumberWithScaleInput/StringNumberWithScaleInput.js +4 -3
- package/build/cjs/lib/unstable/kit/form-entities/SwitchInput/SwitchInput.js +3 -1
- package/build/cjs/lib/unstable/kit/form-entities/TextAreaInput/TextAreaInput.js +3 -2
- package/build/cjs/lib/unstable/kit/form-layouts/FormColumn/FormColumn.js +8 -6
- package/build/cjs/lib/unstable/kit/form-layouts/FormRow/FormRow.css +3 -0
- package/build/cjs/lib/unstable/kit/form-layouts/FormRow/FormRow.js +8 -6
- package/build/cjs/lib/unstable/kit/index.d.ts +1 -0
- package/build/cjs/lib/unstable/kit/index.js +1 -0
- package/build/cjs/lib/unstable/kit/layouts/Accordeon/Accordeon.js +33 -29
- package/build/cjs/lib/unstable/kit/layouts/Card/Card.js +8 -6
- package/build/cjs/lib/unstable/kit/layouts/Section/Section.js +8 -6
- package/build/cjs/lib/unstable/kit/layouts/Transparent/Transparent.js +5 -3
- package/build/cjs/lib/unstable/kit/overview-layouts/OverviewColumn/OverviewColumn.js +7 -5
- package/build/cjs/lib/unstable/kit/overview-layouts/OverviewRow/OverviewRow.js +7 -5
- package/build/cjs/lib/unstable/kit/utils/index.d.ts +1 -1
- package/build/cjs/lib/unstable/kit/utils/index.js +1 -7
- package/build/cjs/lib/unstable/kit/utils/transformer.d.ts +10 -17
- package/build/cjs/lib/unstable/kit/utils/transformer.js +543 -2773
- package/build/esm/lib/kit/i18n/en.json +34 -0
- package/build/esm/lib/kit/i18n/ru.json +34 -0
- package/build/esm/lib/unstable/core/SchemaRendererNode/SchemaRendererNode.js +26 -20
- package/build/esm/lib/unstable/core/SchemaRendererNode/utils.d.ts +3 -0
- package/build/esm/lib/unstable/core/SchemaRendererNode/utils.js +22 -0
- package/build/esm/lib/unstable/core/types/components.d.ts +3 -13
- package/build/esm/lib/unstable/core/types/schema.d.ts +14 -7
- package/build/esm/lib/unstable/core/types/validation.d.ts +1 -1
- package/build/esm/lib/unstable/core/useSchemaRenderer/types/state.d.ts +3 -0
- package/build/esm/lib/unstable/core/useSchemaRenderer/useSchemaRenderer.js +1 -1
- package/build/esm/lib/unstable/core/utils/definers.d.ts +27 -13
- package/build/esm/lib/unstable/kit/components/HTMLContent/HTMLContent.d.ts +2 -1
- package/build/esm/lib/unstable/kit/components/HTMLContent/HTMLContent.js +12 -2
- package/build/esm/lib/unstable/kit/components/LayoutContainer/LayoutContainer.css +3 -0
- package/build/esm/lib/unstable/kit/components/LayoutContainer/LayoutContainer.d.ts +1 -0
- package/build/esm/lib/unstable/kit/components/LayoutContainer/LayoutContainer.js +2 -2
- package/build/esm/lib/unstable/kit/constants/index.d.ts +1 -0
- package/build/esm/lib/unstable/kit/constants/index.js +1 -0
- package/build/esm/lib/unstable/kit/constants/messages.d.ts +2 -0
- package/build/esm/lib/unstable/kit/constants/messages.js +85 -0
- package/build/esm/lib/unstable/kit/entities/Alert/Alert.css +16 -0
- package/build/esm/lib/unstable/kit/entities/Alert/Alert.d.ts +1 -0
- package/build/esm/lib/unstable/kit/entities/Alert/Alert.js +29 -9
- package/build/esm/lib/unstable/kit/entities/ArrayEntity/ArrayEntity.d.ts +0 -1
- package/build/esm/lib/unstable/kit/entities/ArrayEntity/ArrayEntity.js +4 -2
- package/build/esm/lib/unstable/kit/entities/ArrayTable/ArrayTable.d.ts +0 -1
- package/build/esm/lib/unstable/kit/entities/ArrayTable/ArrayTable.js +7 -5
- package/build/esm/lib/unstable/kit/entities/FewOfNested/FewOfNested.css +3 -0
- package/build/esm/lib/unstable/kit/entities/Label/Label.js +5 -5
- package/build/esm/lib/unstable/kit/entities/Monaco/Monaco.js +3 -1
- package/build/esm/lib/unstable/kit/entities/ObjectEntity/ObjectEntity.d.ts +0 -1
- package/build/esm/lib/unstable/kit/entities/ObjectInline/ObjectInline.d.ts +0 -1
- package/build/esm/lib/unstable/kit/entities/OneOfNested/OneOfNested.css +3 -0
- package/build/esm/lib/unstable/kit/entities/TextContent/TextContent.js +5 -5
- package/build/esm/lib/unstable/kit/form-entities/CheckboxGroupInput/CheckboxGroupInput.d.ts +0 -1
- package/build/esm/lib/unstable/kit/form-entities/CheckboxGroupInput/CheckboxGroupInput.js +3 -1
- package/build/esm/lib/unstable/kit/form-entities/CheckboxInput/CheckboxInput.js +3 -1
- package/build/esm/lib/unstable/kit/form-entities/ColorPickerInput/ColorPickerInput.js +3 -1
- package/build/esm/lib/unstable/kit/form-entities/DateInput/DateInput.js +3 -2
- package/build/esm/lib/unstable/kit/form-entities/FileInput/FileInput.js +3 -1
- package/build/esm/lib/unstable/kit/form-entities/MultiSelectInput/MultiSelectInput.js +4 -2
- package/build/esm/lib/unstable/kit/form-entities/NumberInput/NumberInput.js +3 -2
- package/build/esm/lib/unstable/kit/form-entities/NumberWithScaleInput/NumberWithScaleInput.js +3 -2
- package/build/esm/lib/unstable/kit/form-entities/PasswordInput/PasswordInput.js +3 -2
- package/build/esm/lib/unstable/kit/form-entities/RadioGroupInput/RadioGroupInput.js +3 -1
- package/build/esm/lib/unstable/kit/form-entities/RangeSliderInput/RangeSliderInput.js +9 -8
- package/build/esm/lib/unstable/kit/form-entities/SegmentedRadioGroupInput/SegmentedRadioGroupInput.css +4 -0
- package/build/esm/lib/unstable/kit/form-entities/SegmentedRadioGroupInput/SegmentedRadioGroupInput.d.ts +1 -1
- package/build/esm/lib/unstable/kit/form-entities/SegmentedRadioGroupInput/SegmentedRadioGroupInput.js +30 -3
- package/build/esm/lib/unstable/kit/form-entities/SelectInput/SelectInput.d.ts +1 -2
- package/build/esm/lib/unstable/kit/form-entities/SelectInput/SelectInput.js +4 -2
- package/build/esm/lib/unstable/kit/form-entities/SliderInput/SliderInput.js +3 -1
- package/build/esm/lib/unstable/kit/form-entities/StringInput/StringInput.js +3 -2
- package/build/esm/lib/unstable/kit/form-entities/StringNumberWithScaleInput/StringNumberWithScaleInput.js +4 -3
- package/build/esm/lib/unstable/kit/form-entities/SwitchInput/SwitchInput.js +3 -1
- package/build/esm/lib/unstable/kit/form-entities/TextAreaInput/TextAreaInput.js +3 -2
- package/build/esm/lib/unstable/kit/form-layouts/FormColumn/FormColumn.js +8 -6
- package/build/esm/lib/unstable/kit/form-layouts/FormRow/FormRow.css +3 -0
- package/build/esm/lib/unstable/kit/form-layouts/FormRow/FormRow.js +8 -6
- package/build/esm/lib/unstable/kit/index.d.ts +1 -0
- package/build/esm/lib/unstable/kit/index.js +1 -0
- package/build/esm/lib/unstable/kit/layouts/Accordeon/Accordeon.js +33 -29
- package/build/esm/lib/unstable/kit/layouts/Card/Card.js +8 -6
- package/build/esm/lib/unstable/kit/layouts/Section/Section.js +8 -6
- package/build/esm/lib/unstable/kit/layouts/Transparent/Transparent.js +5 -3
- package/build/esm/lib/unstable/kit/overview-layouts/OverviewColumn/OverviewColumn.js +7 -5
- package/build/esm/lib/unstable/kit/overview-layouts/OverviewRow/OverviewRow.js +7 -5
- package/build/esm/lib/unstable/kit/utils/index.d.ts +1 -1
- package/build/esm/lib/unstable/kit/utils/index.js +1 -1
- package/build/esm/lib/unstable/kit/utils/transformer.d.ts +10 -17
- package/build/esm/lib/unstable/kit/utils/transformer.js +544 -2773
- package/package.json +1 -1
|
@@ -6,22 +6,41 @@ const react_1 = tslib_1.__importDefault(require("react"));
|
|
|
6
6
|
const icons = tslib_1.__importStar(require("@gravity-ui/icons"));
|
|
7
7
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
8
8
|
const components_1 = require("../../components");
|
|
9
|
-
const
|
|
10
|
-
|
|
9
|
+
const utils_1 = require("../../utils");
|
|
10
|
+
const b = (0, utils_1.block)('alert');
|
|
11
|
+
const Alert = ({ headName, props, schema }) => {
|
|
12
|
+
var _a;
|
|
13
|
+
const { iconName, iconProps, message, title: titleProp } = props, entityRestProps = tslib_1.__rest(props, ["iconName", "iconProps", "message", "title"]);
|
|
14
|
+
const { open = true } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
15
|
+
const [expanded, setExpanded] = react_1.default.useState(open);
|
|
11
16
|
const icon = react_1.default.useMemo(() => iconName && icons[iconName] ? (react_1.default.createElement(uikit_1.Icon, Object.assign({ data: icons[iconName] }, iconProps))) : undefined, [iconName, iconProps]);
|
|
17
|
+
const title = react_1.default.useMemo(() => {
|
|
18
|
+
if (titleProp && typeof titleProp !== 'string') {
|
|
19
|
+
return titleProp;
|
|
20
|
+
}
|
|
21
|
+
const title = typeof titleProp === 'string' ? titleProp : schema.title;
|
|
22
|
+
if (title) {
|
|
23
|
+
return (react_1.default.createElement(uikit_1.Flex, { className: b('title'), alignItems: "center", gap: "2", onClick: () => setExpanded(!expanded) },
|
|
24
|
+
react_1.default.createElement(components_1.HTMLContent, { content: title, headName: headName, variant: "subheader-2" }),
|
|
25
|
+
react_1.default.createElement(uikit_1.Icon, { data: expanded ? icons.ChevronUp : icons.ChevronDown, size: 16 })));
|
|
26
|
+
}
|
|
27
|
+
return null;
|
|
28
|
+
}, [headName, schema.title, titleProp, expanded]);
|
|
12
29
|
const msg = react_1.default.useMemo(() => {
|
|
13
30
|
if (message) {
|
|
14
31
|
if (typeof message === 'string') {
|
|
15
|
-
return react_1.default.createElement("
|
|
32
|
+
return (react_1.default.createElement("div", { className: b('message', { expanded }) },
|
|
33
|
+
react_1.default.createElement(components_1.HTMLContent, { content: message, headName: headName })));
|
|
16
34
|
}
|
|
17
35
|
return message;
|
|
18
36
|
}
|
|
19
37
|
if (schema.description) {
|
|
20
|
-
return react_1.default.createElement("
|
|
38
|
+
return (react_1.default.createElement("div", { className: b('message', { expanded }) },
|
|
39
|
+
react_1.default.createElement(components_1.HTMLContent, { content: schema.description, headName: headName })));
|
|
21
40
|
}
|
|
22
41
|
return undefined;
|
|
23
|
-
}, [message, schema.description]);
|
|
24
|
-
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "fit", fill: "populated" },
|
|
25
|
-
react_1.default.createElement(uikit_1.Alert, Object.assign({ icon: icon, message: msg }, entityRestProps))));
|
|
42
|
+
}, [expanded, headName, message, schema.description]);
|
|
43
|
+
return (react_1.default.createElement(components_1.EntityContainer, { className: b({ expanded }), stretch: "fit", fill: "populated" },
|
|
44
|
+
react_1.default.createElement(uikit_1.Alert, Object.assign({ icon: icon, message: msg, title: title }, entityRestProps))));
|
|
26
45
|
};
|
|
27
46
|
exports.Alert = Alert;
|
|
@@ -10,7 +10,9 @@ const components_1 = require("../../components");
|
|
|
10
10
|
const utils_1 = require("../../utils");
|
|
11
11
|
const b = (0, utils_1.block)('array-entity');
|
|
12
12
|
const ArrayEntity = ({ headName, input, mode, props, schema, schemaPath, }) => {
|
|
13
|
+
var _a;
|
|
13
14
|
const { name, onBlur, onChange, onFocus, value } = input;
|
|
15
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
14
16
|
const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
|
|
15
17
|
const addButton = react_1.default.useMemo(() => {
|
|
16
18
|
const itemsSchema = schema.items;
|
|
@@ -22,12 +24,12 @@ const ArrayEntity = ({ headName, input, mode, props, schema, schemaPath, }) => {
|
|
|
22
24
|
onChange([...(value || []), itemsSchema === null || itemsSchema === void 0 ? void 0 : itemsSchema.default]);
|
|
23
25
|
onBlur();
|
|
24
26
|
};
|
|
25
|
-
return (react_1.default.createElement(uikit_1.Button, { className: b('add-button'), onClick: onClick, disabled:
|
|
27
|
+
return (react_1.default.createElement(uikit_1.Button, { className: b('add-button'), onClick: onClick, disabled: disabled || schema.readOnly, qa: `${name}-add-button` },
|
|
26
28
|
react_1.default.createElement(uikit_1.Icon, { data: icons_1.Plus, size: 14 }),
|
|
27
29
|
props.addButtonText || null));
|
|
28
30
|
}, [
|
|
29
31
|
props.addButtonText,
|
|
30
|
-
|
|
32
|
+
disabled,
|
|
31
33
|
name,
|
|
32
34
|
onBlur,
|
|
33
35
|
onChange,
|
|
@@ -10,7 +10,9 @@ const components_1 = require("../../components");
|
|
|
10
10
|
const utils_1 = require("../../utils");
|
|
11
11
|
const b = (0, utils_1.block)('array-table');
|
|
12
12
|
const ArrayTable = ({ headName, input, mode, props, schema, schemaPath, }) => {
|
|
13
|
+
var _a;
|
|
13
14
|
const { name, onBlur, onChange, onFocus, value } = input;
|
|
15
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
14
16
|
const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
|
|
15
17
|
const addButton = react_1.default.useMemo(() => {
|
|
16
18
|
const itemsSchema = schema.items;
|
|
@@ -22,12 +24,12 @@ const ArrayTable = ({ headName, input, mode, props, schema, schemaPath, }) => {
|
|
|
22
24
|
onChange([...(value || []), itemsSchema === null || itemsSchema === void 0 ? void 0 : itemsSchema.default]);
|
|
23
25
|
onBlur();
|
|
24
26
|
};
|
|
25
|
-
return (react_1.default.createElement(uikit_1.Button, { className: b('add-button'), onClick: onClick, disabled:
|
|
27
|
+
return (react_1.default.createElement(uikit_1.Button, { className: b('add-button'), onClick: onClick, disabled: disabled || schema.readOnly, qa: `${name}-add-button` },
|
|
26
28
|
react_1.default.createElement(uikit_1.Icon, { data: icons_1.Plus, size: 14 }),
|
|
27
29
|
props.addButtonText || null));
|
|
28
30
|
}, [
|
|
29
31
|
props.addButtonText,
|
|
30
|
-
|
|
32
|
+
disabled,
|
|
31
33
|
name,
|
|
32
34
|
onBlur,
|
|
33
35
|
onChange,
|
|
@@ -58,7 +60,7 @@ const ArrayTable = ({ headName, input, mode, props, schema, schemaPath, }) => {
|
|
|
58
60
|
}, [props.order, schema.items]);
|
|
59
61
|
const { head, rows } = react_1.default.useMemo(() => {
|
|
60
62
|
let tupleItems = false;
|
|
61
|
-
let rowsCount = value === null || value === void 0 ? void 0 : value.length;
|
|
63
|
+
let rowsCount = (value === null || value === void 0 ? void 0 : value.length) || 0;
|
|
62
64
|
let withRemoveButton = true;
|
|
63
65
|
const getItemName = (index, property) => `${name}[${index}]${property === undefined ? '' : `.${property}`}`;
|
|
64
66
|
const getItemSchemaPath = (index, property) => `${schemaPath}/items${tupleItems ? `/${index}` : ''}${property === undefined ? '' : `/properties/${property}`}`;
|
|
@@ -79,7 +81,7 @@ const ArrayTable = ({ headName, input, mode, props, schema, schemaPath, }) => {
|
|
|
79
81
|
react_1.default.createElement("div", { className: b('column-title') }, (_a = column.schema.title) === null || _a === void 0 ? void 0 : _a.split(' ').map((word, wIndex, array) => (react_1.default.createElement("div", { className: b('column-title-word'), key: word },
|
|
80
82
|
react_1.default.createElement(uikit_1.Text, { variant: "subheader-1" }, word),
|
|
81
83
|
wIndex + 1 === array.length && column.schema.description ? (react_1.default.createElement(uikit_1.HelpMark, null,
|
|
82
|
-
react_1.default.createElement(components_1.HTMLContent, {
|
|
84
|
+
react_1.default.createElement(components_1.HTMLContent, { content: column.schema.description, headName: headName }))) : null))))));
|
|
83
85
|
})));
|
|
84
86
|
const rows = new Array(rowsCount).fill(null).map((_, rIndex) => (react_1.default.createElement("div", { className: b('row', { 'with-remove-button': withRemoveButton }), style: { '--columns-count': columns.length }, key: rIndex },
|
|
85
87
|
react_1.default.createElement("div", { className: b('cell') },
|
|
@@ -95,7 +97,7 @@ const ArrayTable = ({ headName, input, mode, props, schema, schemaPath, }) => {
|
|
|
95
97
|
}
|
|
96
98
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "by-child", gap: 2, fill: "by-child" },
|
|
97
99
|
react_1.default.createElement("div", null,
|
|
98
|
-
head,
|
|
100
|
+
rows.length ? head : null,
|
|
99
101
|
rows),
|
|
100
102
|
addButton));
|
|
101
103
|
};
|
|
@@ -7,7 +7,7 @@ const icons = tslib_1.__importStar(require("@gravity-ui/icons"));
|
|
|
7
7
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
8
8
|
const core_1 = require("../../../core");
|
|
9
9
|
const components_1 = require("../../components");
|
|
10
|
-
const Label = ({ input, mode, props, schema }) => {
|
|
10
|
+
const Label = ({ headName, input, mode, props, schema, }) => {
|
|
11
11
|
const { value } = input;
|
|
12
12
|
const { iconName, iconProps, title } = props, restEntityProps = tslib_1.__rest(props, ["iconName", "iconProps", "title"]);
|
|
13
13
|
const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
|
|
@@ -15,15 +15,15 @@ const Label = ({ input, mode, props, schema }) => {
|
|
|
15
15
|
const content = react_1.default.useMemo(() => {
|
|
16
16
|
if (title) {
|
|
17
17
|
if (typeof title === 'string') {
|
|
18
|
-
return react_1.default.createElement(
|
|
18
|
+
return react_1.default.createElement(components_1.HTMLContent, { content: title, headName: headName });
|
|
19
19
|
}
|
|
20
20
|
return title;
|
|
21
21
|
}
|
|
22
22
|
if (schema.description) {
|
|
23
|
-
return react_1.default.createElement(
|
|
23
|
+
return react_1.default.createElement(components_1.HTMLContent, { content: schema.description, headName: headName });
|
|
24
24
|
}
|
|
25
25
|
return undefined;
|
|
26
|
-
}, [title, schema.description]);
|
|
26
|
+
}, [headName, title, schema.description]);
|
|
27
27
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "fit", fill: "populated" },
|
|
28
28
|
react_1.default.createElement(uikit_1.Label, Object.assign({ size: overviewFlag ? 'xs' : 'm', value: value, icon: icon }, restEntityProps), content)));
|
|
29
29
|
};
|
|
@@ -9,7 +9,9 @@ const components_1 = require("../../components");
|
|
|
9
9
|
const utils_1 = require("../../utils");
|
|
10
10
|
const b = (0, utils_1.block)('monaco');
|
|
11
11
|
const Monaco = ({ headName, input, meta, mode, props, schema, }) => {
|
|
12
|
+
var _a;
|
|
12
13
|
const { name, onBlur, onChange, onFocus, value } = input;
|
|
14
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
13
15
|
const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
|
|
14
16
|
const { language = 'plaintext', options: optionsProps, withDialog = true, ignoreMonacoErrors = false, width = '100%', height = 350 } = props, restEntityProps = tslib_1.__rest(props, ["language", "options", "withDialog", "ignoreMonacoErrors", "width", "height"]);
|
|
15
17
|
const srState = (0, core_1.useSchemaRendererState)({
|
|
@@ -22,7 +24,7 @@ const Monaco = ({ headName, input, meta, mode, props, schema, }) => {
|
|
|
22
24
|
const innerErrorRef = react_1.default.useRef(null);
|
|
23
25
|
const [dialogOpen, setDialogOpen] = react_1.default.useState(false);
|
|
24
26
|
const toggleDialogOpen = react_1.default.useCallback(() => setDialogOpen((f) => !f), []);
|
|
25
|
-
const options = react_1.default.useMemo(() => (Object.assign({ fontSize: 12, readOnly: overviewFlag || schema.readOnly, formatOnPaste: true, formatOnType: true, contextmenu: false, minimap: { enabled: false }, autoClosingBrackets: 'languageDefined', automaticLayout: true }, optionsProps)), [optionsProps, overviewFlag, schema.readOnly]);
|
|
27
|
+
const options = react_1.default.useMemo(() => (Object.assign({ fontSize: 12, readOnly: overviewFlag || disabled || schema.readOnly, formatOnPaste: true, formatOnType: true, contextmenu: false, minimap: { enabled: false }, autoClosingBrackets: 'languageDefined', automaticLayout: true }, optionsProps)), [disabled, optionsProps, overviewFlag, schema.readOnly]);
|
|
26
28
|
const onUpdate = react_1.default.useCallback((value) => {
|
|
27
29
|
onFocus();
|
|
28
30
|
onChange(value);
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { type JsonSchemaObject, type NodeEntity } from '../../../core';
|
|
2
2
|
export interface ObjectInlineProps {
|
|
3
3
|
delimiter?: string | Record<string, string>;
|
|
4
|
-
disabled?: boolean;
|
|
5
4
|
order?: string[];
|
|
6
5
|
}
|
|
7
6
|
export declare const ObjectInline: NodeEntity<JsonSchemaObject, ObjectInlineProps>;
|
|
@@ -9,22 +9,22 @@ const core_1 = require("../../../core");
|
|
|
9
9
|
const components_1 = require("../../components");
|
|
10
10
|
const utils_1 = require("../../utils");
|
|
11
11
|
const b = (0, utils_1.block)('text-content');
|
|
12
|
-
const TextContent = ({ input, mode, props, schema, }) => {
|
|
12
|
+
const TextContent = ({ headName, input, mode, props, schema, }) => {
|
|
13
13
|
const { className, iconName, iconProps, title: titleProp } = props, restEntityProps = tslib_1.__rest(props, ["className", "iconName", "iconProps", "title"]);
|
|
14
14
|
const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
|
|
15
15
|
const icon = react_1.default.useMemo(() => iconName && icons[iconName] ? (react_1.default.createElement(uikit_1.Icon, Object.assign({ data: icons[iconName] }, iconProps))) : undefined, [iconName, iconProps]);
|
|
16
16
|
const content = react_1.default.useMemo(() => {
|
|
17
17
|
if (titleProp) {
|
|
18
18
|
if (typeof titleProp === 'string') {
|
|
19
|
-
return react_1.default.createElement(
|
|
19
|
+
return react_1.default.createElement(components_1.HTMLContent, { content: titleProp, headName: headName });
|
|
20
20
|
}
|
|
21
21
|
return titleProp;
|
|
22
22
|
}
|
|
23
23
|
if (schema.description) {
|
|
24
|
-
return react_1.default.createElement(
|
|
24
|
+
return react_1.default.createElement(components_1.HTMLContent, { content: schema.description, headName: headName });
|
|
25
25
|
}
|
|
26
26
|
return undefined;
|
|
27
|
-
}, [titleProp, schema.description]);
|
|
27
|
+
}, [headName, titleProp, schema.description]);
|
|
28
28
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "fit", fill: "populated" },
|
|
29
29
|
react_1.default.createElement(uikit_1.Label, Object.assign({ size: overviewFlag ? 'xs' : 'm', value: input.value, icon: icon, className: b(null, className) }, restEntityProps, { theme: "clear" }), content)));
|
|
30
30
|
};
|
|
@@ -3,6 +3,5 @@ export interface CheckboxGroupInputProps {
|
|
|
3
3
|
enumDescriptions?: Record<string, string>;
|
|
4
4
|
optionsDisabled?: Record<string, boolean>;
|
|
5
5
|
direction?: 'row' | 'column';
|
|
6
|
-
disabled?: boolean;
|
|
7
6
|
}
|
|
8
7
|
export declare const CheckboxGroupInput: NodeEntity<JsonSchemaArray, CheckboxGroupInputProps>;
|
|
@@ -8,8 +8,10 @@ const components_1 = require("../../components");
|
|
|
8
8
|
const utils_1 = require("../../utils");
|
|
9
9
|
const b = (0, utils_1.block)('checkbox-group-input');
|
|
10
10
|
const CheckboxGroupInput = ({ input, props, meta, schema, }) => {
|
|
11
|
+
var _a;
|
|
11
12
|
const { name, onBlur, onChange, onFocus, value: inputValue } = input;
|
|
12
|
-
const { enumDescriptions, direction = 'row',
|
|
13
|
+
const { enumDescriptions, direction = 'row', optionsDisabled } = props;
|
|
14
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
13
15
|
const value = react_1.default.useMemo(() => (Array.isArray(inputValue) ? inputValue : []), [inputValue]);
|
|
14
16
|
const options = react_1.default.useMemo(() => {
|
|
15
17
|
var _a, _b;
|
|
@@ -8,13 +8,15 @@ const components_1 = require("../../components");
|
|
|
8
8
|
const utils_1 = require("../../utils");
|
|
9
9
|
const b = (0, utils_1.block)('checkbox-input');
|
|
10
10
|
const CheckboxInput = ({ input, props, meta, schema, }) => {
|
|
11
|
+
var _a;
|
|
11
12
|
const { name, onBlur, onChange, onFocus, value } = input;
|
|
13
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
12
14
|
const onUpdate = react_1.default.useCallback((value) => {
|
|
13
15
|
onFocus();
|
|
14
16
|
onChange(value);
|
|
15
17
|
onBlur();
|
|
16
18
|
}, [onBlur, onChange, onFocus]);
|
|
17
19
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "fit", className: b({ error: (0, utils_1.getBooleanValidationState)(meta) }) },
|
|
18
|
-
react_1.default.createElement(uikit_1.Checkbox, Object.assign({ disabled: schema.readOnly }, props, { checked: value !== null && value !== void 0 ? value : false, onFocus: onFocus, onBlur: onBlur, onUpdate: onUpdate, qa: name }))));
|
|
20
|
+
react_1.default.createElement(uikit_1.Checkbox, Object.assign({ disabled: disabled || schema.readOnly }, props, { checked: value !== null && value !== void 0 ? value : false, onFocus: onFocus, onBlur: onBlur, onUpdate: onUpdate, qa: name }))));
|
|
19
21
|
};
|
|
20
22
|
exports.CheckboxInput = CheckboxInput;
|
|
@@ -8,8 +8,10 @@ const components_1 = require("../../components");
|
|
|
8
8
|
const utils_1 = require("../../utils");
|
|
9
9
|
const b = (0, utils_1.block)('color-picker-input');
|
|
10
10
|
const ColorPickerInput = ({ input, props, meta, schema, }) => {
|
|
11
|
+
var _a;
|
|
11
12
|
const { name, onBlur, onChange, onFocus, value } = input;
|
|
12
13
|
const { onOpenChange: onOpenChangeProps } = props, restEntityProps = tslib_1.__rest(props, ["onOpenChange"]);
|
|
14
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
13
15
|
const onOpenChange = react_1.default.useCallback((open) => {
|
|
14
16
|
onOpenChangeProps === null || onOpenChangeProps === void 0 ? void 0 : onOpenChangeProps(open);
|
|
15
17
|
if (open) {
|
|
@@ -20,6 +22,6 @@ const ColorPickerInput = ({ input, props, meta, schema, }) => {
|
|
|
20
22
|
}
|
|
21
23
|
}, [onBlur, onFocus, onOpenChangeProps]);
|
|
22
24
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "max", className: b({ error: (0, utils_1.getBooleanValidationState)(meta) }) },
|
|
23
|
-
react_1.default.createElement(unstable_1.unstable_ColorPicker, Object.assign({ disabled: schema.readOnly }, restEntityProps, { value: value !== null && value !== void 0 ? value : '', onUpdate: onChange, onOpenChange: onOpenChange, "data-qa": name }))));
|
|
25
|
+
react_1.default.createElement(unstable_1.unstable_ColorPicker, Object.assign({ disabled: disabled || schema.readOnly }, restEntityProps, { value: value !== null && value !== void 0 ? value : '', onUpdate: onChange, onOpenChange: onOpenChange, "data-qa": name }))));
|
|
24
26
|
};
|
|
25
27
|
exports.ColorPickerInput = ColorPickerInput;
|
|
@@ -10,9 +10,10 @@ const constants_1 = require("../../constants");
|
|
|
10
10
|
const utils_1 = require("../../utils");
|
|
11
11
|
const b = (0, utils_1.block)('date-input');
|
|
12
12
|
const DateInput = ({ input, meta, props, schema, }) => {
|
|
13
|
-
var _a;
|
|
13
|
+
var _a, _b;
|
|
14
14
|
const { name, onBlur, onChange, onFocus, value: inputValue } = input;
|
|
15
15
|
const { format = constants_1.DEFAULT_DATE_FORMAT, outputFormat, timeZone: timeZoneProp } = props, restEntityProps = tslib_1.__rest(props, ["format", "outputFormat", "timeZone"]);
|
|
16
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
16
17
|
const timeZone = timeZoneProp && (0, date_utils_1.isValidTimeZone)(timeZoneProp) ? timeZoneProp : undefined;
|
|
17
18
|
const onUpdate = react_1.default.useCallback((date) => {
|
|
18
19
|
if (!date) {
|
|
@@ -42,6 +43,6 @@ const DateInput = ({ input, meta, props, schema, }) => {
|
|
|
42
43
|
}, [outputFormat, onChange]);
|
|
43
44
|
const value = react_1.default.useMemo(() => (0, utils_1.parseDate)(inputValue, outputFormat, timeZone), [inputValue, outputFormat, timeZone]);
|
|
44
45
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "max", className: b({ error: (0, utils_1.getBooleanValidationState)(meta) }) },
|
|
45
|
-
react_1.default.createElement(date_components_1.DatePicker, Object.assign({ format: format, popupPlacement: "bottom-start", placeholder: `${((
|
|
46
|
+
react_1.default.createElement(date_components_1.DatePicker, Object.assign({ format: format, popupPlacement: "bottom-start", placeholder: `${((_b = schema.examples) === null || _b === void 0 ? void 0 : _b[0]) || ''}`, disabled: disabled || schema.readOnly, hasClear: true }, restEntityProps, { value: value, onFocus: onFocus, onBlur: onBlur, onUpdate: onUpdate, timeZone: timeZone, errorMessage: undefined, validationState: undefined, "data-qa": name }))));
|
|
46
47
|
};
|
|
47
48
|
exports.DateInput = DateInput;
|
|
@@ -9,8 +9,10 @@ const unstable_1 = require("@gravity-ui/uikit/unstable");
|
|
|
9
9
|
const components_1 = require("../../components");
|
|
10
10
|
const utils_1 = require("../../utils");
|
|
11
11
|
const FileInput = ({ input, meta, props, schema, }) => {
|
|
12
|
+
var _a;
|
|
12
13
|
const { onBlur, onChange, onFocus } = input;
|
|
13
14
|
const { readAsMethod = 'readAsBinaryString' } = props, restEntityProps = tslib_1.__rest(props, ["readAsMethod"]);
|
|
15
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
14
16
|
const counterRef = react_1.default.useRef(0);
|
|
15
17
|
const [file, setFile] = react_1.default.useState(null);
|
|
16
18
|
const actions = react_1.default.useMemo(() => [
|
|
@@ -48,6 +50,6 @@ const FileInput = ({ input, meta, props, schema, }) => {
|
|
|
48
50
|
react_1.default.createElement(uikit_1.FilePreview, { file: file, actions: actions })));
|
|
49
51
|
}
|
|
50
52
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "max" },
|
|
51
|
-
react_1.default.createElement(unstable_1.unstable_FileDropZone, Object.assign({ disabled: schema.readOnly, accept: [] }, restEntityProps, { onUpdate: onUpdate, errorMessage: undefined, validationState: (0, utils_1.getValidationState)(meta), multiple: false }))));
|
|
53
|
+
react_1.default.createElement(unstable_1.unstable_FileDropZone, Object.assign({ disabled: disabled || schema.readOnly, accept: [] }, restEntityProps, { onUpdate: onUpdate, errorMessage: undefined, validationState: (0, utils_1.getValidationState)(meta), multiple: false }))));
|
|
52
54
|
};
|
|
53
55
|
exports.FileInput = FileInput;
|
|
@@ -6,11 +6,13 @@ const react_1 = tslib_1.__importDefault(require("react"));
|
|
|
6
6
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
7
7
|
const isString_1 = tslib_1.__importDefault(require("lodash/isString"));
|
|
8
8
|
const components_1 = require("../../components");
|
|
9
|
+
const constants_1 = require("../../constants");
|
|
9
10
|
const utils_1 = require("../../utils");
|
|
10
11
|
const MultiSelectInput = ({ input, meta, props, schema, }) => {
|
|
11
|
-
var _a, _b;
|
|
12
|
+
var _a, _b, _c;
|
|
12
13
|
const { name, onBlur, onChange, onFocus, value: inputValue } = input;
|
|
13
14
|
const { enumDescriptions, optionsMeta } = props, restEntityProps = tslib_1.__rest(props, ["enumDescriptions", "optionsMeta"]);
|
|
15
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
14
16
|
const value = react_1.default.useMemo(() => (Array.isArray(inputValue) && inputValue.every(isString_1.default) ? inputValue : undefined), [inputValue]);
|
|
15
17
|
const enumValues = schema.items && 'enum' in schema.items ? schema.items.enum : undefined;
|
|
16
18
|
const options = react_1.default.useMemo(() => {
|
|
@@ -33,6 +35,6 @@ const MultiSelectInput = ({ input, meta, props, schema, }) => {
|
|
|
33
35
|
const renderOption = react_1.default.useCallback((option) => (react_1.default.createElement(react_1.default.Fragment, { key: option.value }, option.content || option.text || option.value)), []);
|
|
34
36
|
const getOptionHeight = react_1.default.useCallback((option) => { var _a; return (((_a = option.data) === null || _a === void 0 ? void 0 : _a.optionMeta) ? 44 : 28); }, []);
|
|
35
37
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "max" },
|
|
36
|
-
react_1.default.createElement(uikit_1.Select, Object.assign({ width: "max", options: options, filterable: ((enumValues === null || enumValues === void 0 ? void 0 : enumValues.length) || 0) > 9, renderOption: renderOption, getOptionHeight: getOptionHeight, placeholder: `${((
|
|
38
|
+
react_1.default.createElement(uikit_1.Select, Object.assign({ width: "max", options: options, filterable: ((enumValues === null || enumValues === void 0 ? void 0 : enumValues.length) || 0) > 9, renderOption: renderOption, getOptionHeight: getOptionHeight, placeholder: `${((_c = (_b = schema.examples) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c[0]) || constants_1.DASH}`, disabled: disabled || schema.readOnly }, restEntityProps, { value: value, onFocus: onFocus, onBlur: onBlur, onUpdate: onChange, errorMessage: undefined, validationState: (0, utils_1.getValidationState)(meta), multiple: true, qa: name }))));
|
|
37
39
|
};
|
|
38
40
|
exports.MultiSelectInput = MultiSelectInput;
|
|
@@ -8,9 +8,10 @@ const components_1 = require("../../components");
|
|
|
8
8
|
const utils_1 = require("../../utils");
|
|
9
9
|
const b = (0, utils_1.block)('number-input');
|
|
10
10
|
const NumberInput = ({ input, meta, props, schema, }) => {
|
|
11
|
-
var _a;
|
|
11
|
+
var _a, _b;
|
|
12
12
|
const { name, onBlur, onChange, onFocus, value } = input;
|
|
13
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
13
14
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "max", className: b({ error: (0, utils_1.getBooleanValidationState)(meta) }) },
|
|
14
|
-
react_1.default.createElement(uikit_1.NumberInput, Object.assign({ min: schema.minimum, max: schema.maximum, step: schema.multipleOf || 1, placeholder: `${((
|
|
15
|
+
react_1.default.createElement(uikit_1.NumberInput, Object.assign({ min: schema.minimum, max: schema.maximum, step: schema.multipleOf || 1, placeholder: `${((_b = schema.examples) === null || _b === void 0 ? void 0 : _b[0]) || ''}`, disabled: disabled || schema.readOnly, allowDecimal: true, hasClear: true }, props, { value: value === undefined ? null : value, defaultValue: schema.default, onBlur: onBlur, onFocus: onFocus, onUpdate: onChange, errorMessage: undefined, validationState: (0, utils_1.getValidationState)(meta), qa: name }))));
|
|
15
16
|
};
|
|
16
17
|
exports.NumberInput = NumberInput;
|
package/build/cjs/lib/unstable/kit/form-entities/NumberWithScaleInput/NumberWithScaleInput.js
CHANGED
|
@@ -9,9 +9,10 @@ const components_1 = require("../../components");
|
|
|
9
9
|
const utils_1 = require("../../utils");
|
|
10
10
|
const b = (0, utils_1.block)('number-with-scale-input');
|
|
11
11
|
const NumberWithScaleInput = ({ input, meta, props, schema, }) => {
|
|
12
|
-
var _a;
|
|
12
|
+
var _a, _b;
|
|
13
13
|
const { name, onBlur, onChange, onFocus, value: inputValue } = input;
|
|
14
14
|
const { defaultType, viewType, scale, max, min, step } = props, restEntityProps = tslib_1.__rest(props, ["defaultType", "viewType", "scale", "max", "min", "step"]);
|
|
15
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
15
16
|
const scaleKit = react_1.default.useMemo(() => {
|
|
16
17
|
if (scale) {
|
|
17
18
|
const preparedScale = {};
|
|
@@ -69,7 +70,7 @@ const NumberWithScaleInput = ({ input, meta, props, schema, }) => {
|
|
|
69
70
|
}, [max, min, step, inputValue, onChange, scaleKit === null || scaleKit === void 0 ? void 0 : scaleKit.scale, scaleValue, schema]);
|
|
70
71
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "max", className: b({ error: (0, utils_1.getBooleanValidationState)(meta) }), direction: "row", gap: 2 },
|
|
71
72
|
react_1.default.createElement("div", { className: b('input') },
|
|
72
|
-
react_1.default.createElement(uikit_1.NumberInput, Object.assign({ placeholder: `${((
|
|
73
|
+
react_1.default.createElement(uikit_1.NumberInput, Object.assign({ placeholder: `${((_b = schema.examples) === null || _b === void 0 ? void 0 : _b[0]) || ''}`, disabled: disabled || schema.readOnly, allowDecimal: true, hasClear: true }, restEntityProps, preparedInputProps, { onBlur: onBlur, onFocus: onFocus, errorMessage: undefined, validationState: (0, utils_1.getValidationState)(meta), qa: name }))),
|
|
73
74
|
scaleOptions.length ? (react_1.default.createElement("div", { style: { width: scaleKit === null || scaleKit === void 0 ? void 0 : scaleKit.minScaleLength } },
|
|
74
75
|
react_1.default.createElement(uikit_1.Select, { width: "max", options: scaleOptions, value: scaleValue, onUpdate: setScaleValue, multiple: false }))) : null));
|
|
75
76
|
};
|
|
@@ -8,9 +8,10 @@ const components_1 = require("../../components");
|
|
|
8
8
|
const utils_1 = require("../../utils");
|
|
9
9
|
const b = (0, utils_1.block)('password-input');
|
|
10
10
|
const PasswordInput = ({ input, meta, props, schema, }) => {
|
|
11
|
-
var _a;
|
|
11
|
+
var _a, _b;
|
|
12
12
|
const { name, onBlur, onChange, onFocus, value } = input;
|
|
13
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
13
14
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "max", className: b({ error: (0, utils_1.getBooleanValidationState)(meta) }) },
|
|
14
|
-
react_1.default.createElement(uikit_1.PasswordInput, Object.assign({ autoComplete: "new-password", placeholder: (
|
|
15
|
+
react_1.default.createElement(uikit_1.PasswordInput, Object.assign({ autoComplete: "new-password", placeholder: (_b = schema.examples) === null || _b === void 0 ? void 0 : _b[0], disabled: disabled || schema.readOnly, hasClear: true }, props, { value: value !== null && value !== void 0 ? value : '', onFocus: onFocus, onBlur: onBlur, onUpdate: onChange, errorMessage: undefined, validationState: (0, utils_1.getValidationState)(meta), qa: name }))));
|
|
15
16
|
};
|
|
16
17
|
exports.PasswordInput = PasswordInput;
|
|
@@ -8,8 +8,10 @@ const components_1 = require("../../components");
|
|
|
8
8
|
const utils_1 = require("../../utils");
|
|
9
9
|
const b = (0, utils_1.block)('radio-group-input');
|
|
10
10
|
const RadioGroupInput = ({ input, meta, props, schema, }) => {
|
|
11
|
+
var _a;
|
|
11
12
|
const { name, onBlur, onChange, onFocus, value } = input;
|
|
12
13
|
const { enumDescriptions, optionsDisabled, direction = 'horizontal' } = props, restEntityProps = tslib_1.__rest(props, ["enumDescriptions", "optionsDisabled", "direction"]);
|
|
14
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
13
15
|
const options = react_1.default.useMemo(() => {
|
|
14
16
|
var _a;
|
|
15
17
|
return (_a = schema.enum) === null || _a === void 0 ? void 0 : _a.map((value) => ({
|
|
@@ -19,6 +21,6 @@ const RadioGroupInput = ({ input, meta, props, schema, }) => {
|
|
|
19
21
|
}));
|
|
20
22
|
}, [enumDescriptions, optionsDisabled, schema.enum]);
|
|
21
23
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "fit", className: b({ error: (0, utils_1.getBooleanValidationState)(meta), direction }), justifyContent: "center" },
|
|
22
|
-
react_1.default.createElement(uikit_1.RadioGroup, Object.assign({ options: options, disabled: schema.readOnly }, restEntityProps, { value: value, onFocus: onFocus, onBlur: onBlur, onUpdate: onChange, direction: direction, qa: name }))));
|
|
24
|
+
react_1.default.createElement(uikit_1.RadioGroup, Object.assign({ options: options, disabled: disabled || schema.readOnly }, restEntityProps, { value: value, onFocus: onFocus, onBlur: onBlur, onUpdate: onChange, direction: direction, qa: name }))));
|
|
23
25
|
};
|
|
24
26
|
exports.RadioGroupInput = RadioGroupInput;
|
|
@@ -7,22 +7,23 @@ const uikit_1 = require("@gravity-ui/uikit");
|
|
|
7
7
|
const components_1 = require("../../components");
|
|
8
8
|
const utils_1 = require("../../utils");
|
|
9
9
|
const RangeSliderInput = ({ input, meta, props, schema, }) => {
|
|
10
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
10
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
11
11
|
const { name, onBlur, onChange, onFocus, value: inputValue } = input;
|
|
12
12
|
const { propertyKeys } = props, restEntityProps = tslib_1.__rest(props, ["propertyKeys"]);
|
|
13
|
+
const { disabled } = ((_a = schema.nodeParameters) === null || _a === void 0 ? void 0 : _a.flags) || {};
|
|
13
14
|
const [fromKey, toKey] = propertyKeys || ['from', 'to'];
|
|
14
|
-
const min = ((
|
|
15
|
-
? (
|
|
15
|
+
const min = ((_b = schema.properties) === null || _b === void 0 ? void 0 : _b[fromKey]) && 'minimum' in schema.properties[fromKey]
|
|
16
|
+
? (_d = (_c = schema.properties) === null || _c === void 0 ? void 0 : _c[fromKey]) === null || _d === void 0 ? void 0 : _d.minimum
|
|
16
17
|
: undefined;
|
|
17
|
-
const max = ((
|
|
18
|
-
? (
|
|
18
|
+
const max = ((_e = schema.properties) === null || _e === void 0 ? void 0 : _e[toKey]) && 'maximum' in schema.properties[toKey]
|
|
19
|
+
? (_g = (_f = schema.properties) === null || _f === void 0 ? void 0 : _f[toKey]) === null || _g === void 0 ? void 0 : _g.maximum
|
|
19
20
|
: undefined;
|
|
20
21
|
const value = isNaN(Number(inputValue === null || inputValue === void 0 ? void 0 : inputValue[fromKey])) || isNaN(Number(inputValue === null || inputValue === void 0 ? void 0 : inputValue[toKey]))
|
|
21
22
|
? undefined
|
|
22
23
|
: [Number(inputValue === null || inputValue === void 0 ? void 0 : inputValue[fromKey]), Number(inputValue === null || inputValue === void 0 ? void 0 : inputValue[toKey])];
|
|
23
|
-
const defaultValue = isNaN(Number((
|
|
24
|
+
const defaultValue = isNaN(Number((_h = schema.default) === null || _h === void 0 ? void 0 : _h[fromKey])) || isNaN(Number((_j = schema.default) === null || _j === void 0 ? void 0 : _j[toKey]))
|
|
24
25
|
? undefined
|
|
25
|
-
: [Number((
|
|
26
|
+
: [Number((_k = schema.default) === null || _k === void 0 ? void 0 : _k[fromKey]), Number((_l = schema.default) === null || _l === void 0 ? void 0 : _l[toKey])];
|
|
26
27
|
const onUpdate = react_1.default.useCallback((next) => {
|
|
27
28
|
if (!Array.isArray(next)) {
|
|
28
29
|
return;
|
|
@@ -30,6 +31,6 @@ const RangeSliderInput = ({ input, meta, props, schema, }) => {
|
|
|
30
31
|
onChange({ [fromKey]: next[0], [toKey]: next[1] });
|
|
31
32
|
}, [fromKey, toKey, onChange]);
|
|
32
33
|
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "max" },
|
|
33
|
-
react_1.default.createElement(uikit_1.Slider, Object.assign({ min: min, max: max, step: 1, marks: 2, disabled: schema.readOnly, tooltipDisplay: "on" }, restEntityProps, { defaultValue: defaultValue, value: value, onFocus: onFocus, onBlur: onBlur, onUpdate: onUpdate, errorMessage: undefined, validationState: (0, utils_1.getValidationState)(meta), qa: name }))));
|
|
34
|
+
react_1.default.createElement(uikit_1.Slider, Object.assign({ min: min, max: max, step: 1, marks: 2, disabled: disabled || schema.readOnly, tooltipDisplay: "on" }, restEntityProps, { defaultValue: defaultValue, value: value, onFocus: onFocus, onBlur: onBlur, onUpdate: onUpdate, errorMessage: undefined, validationState: (0, utils_1.getValidationState)(meta), qa: name }))));
|
|
34
35
|
};
|
|
35
36
|
exports.RangeSliderInput = RangeSliderInput;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type SegmentedRadioGroupProps } from '@gravity-ui/uikit';
|
|
2
2
|
import type { JsonSchemaString, NodeEntity } from '../../../core';
|
|
3
|
-
export interface SegmentedRadioGroupInputProps extends Omit<SegmentedRadioGroupProps, 'value' | 'onFocus' | 'onBlur' | 'onChange' | 'onUpdate' | 'qa'> {
|
|
3
|
+
export interface SegmentedRadioGroupInputProps extends Omit<SegmentedRadioGroupProps, 'children' | 'defaultValue' | 'value' | 'onFocus' | 'onBlur' | 'onChange' | 'onUpdate' | 'qa'> {
|
|
4
4
|
enumDescriptions?: Record<string, string>;
|
|
5
5
|
optionsDisabled?: Record<string, boolean>;
|
|
6
6
|
}
|
|
@@ -6,10 +6,16 @@ const react_1 = tslib_1.__importDefault(require("react"));
|
|
|
6
6
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
7
7
|
const components_1 = require("../../components");
|
|
8
8
|
const utils_1 = require("../../utils");
|
|
9
|
+
const SelectInput_1 = require("../SelectInput");
|
|
9
10
|
const b = (0, utils_1.block)('segmented-radio-group-input');
|
|
10
|
-
const SegmentedRadioGroupInput = (
|
|
11
|
+
const SegmentedRadioGroupInput = (_a) => {
|
|
12
|
+
var _b;
|
|
13
|
+
var { input, meta, props, schema } = _a, restProps = tslib_1.__rest(_a, ["input", "meta", "props", "schema"]);
|
|
11
14
|
const { name, onBlur, onChange, onFocus, value } = input;
|
|
12
15
|
const { enumDescriptions, optionsDisabled } = props, restEntityProps = tslib_1.__rest(props, ["enumDescriptions", "optionsDisabled"]);
|
|
16
|
+
const { disabled } = ((_b = schema.nodeParameters) === null || _b === void 0 ? void 0 : _b.flags) || {};
|
|
17
|
+
const ref = react_1.default.useRef(null);
|
|
18
|
+
const [overflowed, setOverflowed] = react_1.default.useState(false);
|
|
13
19
|
const options = react_1.default.useMemo(() => {
|
|
14
20
|
var _a;
|
|
15
21
|
return (_a = schema.enum) === null || _a === void 0 ? void 0 : _a.map((value) => ({
|
|
@@ -23,7 +29,28 @@ const SegmentedRadioGroupInput = ({ input, meta, props, schema }) => {
|
|
|
23
29
|
onChange(value);
|
|
24
30
|
onBlur();
|
|
25
31
|
}, [onBlur, onChange, onFocus]);
|
|
26
|
-
|
|
27
|
-
|
|
32
|
+
react_1.default.useLayoutEffect(() => {
|
|
33
|
+
const root = ref.current;
|
|
34
|
+
if (!root) {
|
|
35
|
+
return;
|
|
36
|
+
}
|
|
37
|
+
const measure = () => {
|
|
38
|
+
const texts = root.querySelectorAll('.g-segmented-radio-group__option-text');
|
|
39
|
+
setOverflowed(Array.from(texts).some((node) => {
|
|
40
|
+
if (node.offsetWidth === 0 && node.scrollWidth === 0) {
|
|
41
|
+
return false;
|
|
42
|
+
}
|
|
43
|
+
return node.scrollWidth > node.clientWidth;
|
|
44
|
+
}));
|
|
45
|
+
};
|
|
46
|
+
measure();
|
|
47
|
+
const observer = new ResizeObserver(measure);
|
|
48
|
+
observer.observe(root);
|
|
49
|
+
return () => observer.disconnect();
|
|
50
|
+
}, [options]);
|
|
51
|
+
return (react_1.default.createElement(components_1.EntityContainer, { stretch: "max" },
|
|
52
|
+
overflowed ? (react_1.default.createElement(SelectInput_1.SelectInput, Object.assign({ input: input, meta: meta, props: props, schema: schema }, restProps))) : null,
|
|
53
|
+
react_1.default.createElement(components_1.EntityContainer, { stretch: "max", className: b({ error: (0, utils_1.getBooleanValidationState)(meta), overflowed }) },
|
|
54
|
+
react_1.default.createElement(uikit_1.SegmentedRadioGroup, Object.assign({ ref: ref, width: "max", disabled: disabled || schema.readOnly, options: options }, restEntityProps, { value: value, onFocus: onFocus, onBlur: onBlur, onUpdate: onUpdate, qa: name })))));
|
|
28
55
|
};
|
|
29
56
|
exports.SegmentedRadioGroupInput = SegmentedRadioGroupInput;
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { type SelectProps } from '@gravity-ui/uikit';
|
|
2
2
|
import type { JsonSchemaString, NodeEntity } from '../../../core';
|
|
3
|
-
export interface SelectInputProps extends Omit<SelectProps, 'value' | 'onFocus' | 'onBlur' | 'onChange' | 'onUpdate' | 'multiple' | 'errorMessage' | 'validationState' | 'qa'> {
|
|
3
|
+
export interface SelectInputProps extends Omit<SelectProps, 'defaultValue' | 'value' | 'onFocus' | 'onBlur' | 'onChange' | 'onUpdate' | 'multiple' | 'errorMessage' | 'validationState' | 'qa'> {
|
|
4
4
|
enumDescriptions?: Record<string, string>;
|
|
5
5
|
optionsMeta?: Record<string, string>;
|
|
6
|
-
options?: SelectProps['options'];
|
|
7
6
|
}
|
|
8
7
|
export declare const SelectInput: NodeEntity<JsonSchemaString, SelectInputProps>;
|