@gravity-ui/dynamic-forms 3.5.0 → 3.6.0

package/build/cjs/lib/core/components/Form/Controller/utils.js

@@ -60,14 +60,15 @@ const getRender = ({ name, spec, inputEntity, Layout, }) => {
     const render = (props) => {
         if (inputEntity && (0, helpers_1.isCorrectSpec)(spec) && lodash_1.default.isString(name)) {
             if (!spec.viewSpec.hidden) {
+                const { layoutProps, inputProps } = spec.viewSpec;
                 if (inputEntity.independent) {
                     const InputComponent = inputEntity.Component;
-                    return react_1.default.createElement(InputComponent, Object.assign({ spec: spec, name: name, Layout: Layout }, props));
+                    return (react_1.default.createElement(InputComponent, Object.assign({ spec: spec, name: name, Layout: Layout, inputProps: inputProps, layoutProps: layoutProps }, props)));
                 }
                 const InputComponent = inputEntity.Component;
-                const input = react_1.default.createElement(InputComponent, Object.assign({ spec: spec, name: name }, props));
+                const input = (react_1.default.createElement(InputComponent, Object.assign({ spec: spec, name: name, inputProps: inputProps }, props)));
                 if (Layout) {
-                    return (react_1.default.createElement(Layout, Object.assign({ spec: spec, name: name }, props), input));
+                    return (react_1.default.createElement(Layout, Object.assign({ spec: spec, name: name, layoutProps: layoutProps }, props), input));
                 }
                 return input;
             }

package/build/cjs/lib/kit/components/AccordeonCard/AccordeonCard.css

@@ -3,12 +3,24 @@
   flex-direction: column;
   justify-content: space-between;
   box-sizing: border-box;
-  max-width: 750px;
   box-shadow: 0 1px 5px var(--g-color-sfx-shadow);
   border-radius: 5px;
   color: var(--g-color-text-primary);
   background-color: var(--g-color-base-float);
 }
+.df-accordeon-card .df-row {
+  width: 100%;
+  max-width: unset;
+}
+.df-accordeon-card .df-row .df-select,
+.df-accordeon-card .df-row .df-multi-select,
+.df-accordeon-card .df-row .df-transparent_array-item {
+  max-width: unset;
+}
+.df-accordeon-card .df-monaco-input,
+.df-accordeon-card .df-monaco-base-view {
+  width: 100%;
+}
 .df-accordeon-card:hover {
   box-shadow: 0 3px 10px var(--g-color-sfx-shadow);
 }
@@ -64,7 +76,6 @@
 }
 .df-accordeon-card__body {
   display: none;
-  margin-top: -10px 0 8px;
   padding: 16px;
 }
 .df-accordeon-card__body_open {

package/build/cjs/lib/kit/components/AccordeonCard/AccordeonCard.js

@@ -8,7 +8,7 @@ const uikit_1 = require("@gravity-ui/uikit");
 const lodash_1 = tslib_1.__importDefault(require("lodash"));
 const utils_1 = require("../../utils");
 const b = (0, utils_1.block)('accordeon-card');
-const AccordeonCard = ({ className, name, header, description, open: propsOpen, onToggle, headerActionsTemplate, ignoreHeaderToggle, titleSize = 'm', alwaysOpen, children, }) => {
+const AccordeonCard = ({ className, name, header, description, open: propsOpen, onToggle, headerActionsTemplate, ignoreHeaderToggle, titleSize = 'm', alwaysOpen, children, classNameBody, }) => {
     const accordeonRef = react_1.default.useRef(null);
     const bodyRef = react_1.default.useRef(null);
     const [open, setOpen] = react_1.default.useState(alwaysOpen || propsOpen || false);
@@ -52,6 +52,6 @@ const AccordeonCard = ({ className, name, header, description, open: propsOpen,
                 headerActionsTemplate ? (react_1.default.createElement("div", { className: b('interal-actions') }, headerActionsTemplate)) : null,
                 react_1.default.createElement(uikit_1.Button, { view: "flat", onClick: handleToggle, qa: `${name}-accordeon-toggler` },
                     react_1.default.createElement(uikit_1.Icon, { className: b('toggle-icon', { open }), data: icons_1.ChevronDown, size: 16 })))) : null),
-        react_1.default.createElement("div", { ref: bodyRef, className: b('body', { open: open && !emptyBody }) }, children)));
+        react_1.default.createElement("div", { ref: bodyRef, className: b('body', { open: open && !emptyBody }, classNameBody) }, children)));
 };
 exports.AccordeonCard = AccordeonCard;

package/build/cjs/lib/kit/components/Inputs/CardOneOf/CardOneOf.js

@@ -8,7 +8,7 @@ const __1 = require("../../");
 const core_1 = require("../../../../core");
 const hooks_1 = require("../../../hooks");
 const Layouts_1 = require("../../Layouts");
-const RemoveButton_1 = require("../../Layouts/Accordeon/RemoveButton");
+const RemoveButton_1 = require("../../RemoveButton");
 const CardOneOf = (props) => {
     var _a;
     const { input, meta, spec, name } = props;

package/build/cjs/lib/kit/components/Inputs/MultiSelect/MultiSelect.js

@@ -7,25 +7,34 @@ const uikit_1 = require("@gravity-ui/uikit");
 const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('multi-select');
-const MultiSelect = ({ name, input, spec }) => {
+const MultiSelect = ({ name, input, spec, inputProps }) => {
     var _a, _b, _c, _d;
     const { value, onBlur, onChange, onFocus } = input;
     const filterable = react_1.default.useMemo(() => { var _a; return (((_a = spec.enum) === null || _a === void 0 ? void 0 : _a.length) || 0) > 9; }, [(_a = spec.enum) === null || _a === void 0 ? void 0 : _a.length]);
+    const { withCustomOptions, options: externalOptions } = inputProps || {};
     const options = react_1.default.useMemo(() => {
         var _a;
-        return (_a = spec.enum) === null || _a === void 0 ? void 0 : _a.map((id) => {
-            var _a, _b, _c, _d, _e;
-            return ({
-                id,
-                value: id,
-                text: ((_a = spec.description) === null || _a === void 0 ? void 0 : _a[id]) || id,
-                content: ((_c = (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta) === null || _c === void 0 ? void 0 : _c[id]) ? (react_1.default.createElement("div", { key: id },
-                    react_1.default.createElement(uikit_1.Text, null, ((_d = spec.description) === null || _d === void 0 ? void 0 : _d[id]) || id),
-                    react_1.default.createElement(uikit_1.Text, { color: "secondary", className: b('meta-text') }, spec.viewSpec.selectParams.meta[id]))) : (((_e = spec.description) === null || _e === void 0 ? void 0 : _e[id]) || id),
-                key: id,
+        return withCustomOptions
+            ? externalOptions || []
+            : (_a = spec.enum) === null || _a === void 0 ? void 0 : _a.map((id) => {
+                var _a, _b, _c, _d, _e;
+                return ({
+                    id,
+                    value: id,
+                    text: ((_a = spec.description) === null || _a === void 0 ? void 0 : _a[id]) || id,
+                    content: ((_c = (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta) === null || _c === void 0 ? void 0 : _c[id]) ? (react_1.default.createElement("div", { key: id },
+                        react_1.default.createElement(uikit_1.Text, null, ((_d = spec.description) === null || _d === void 0 ? void 0 : _d[id]) || id),
+                        react_1.default.createElement(uikit_1.Text, { color: "secondary", className: b('meta-text') }, spec.viewSpec.selectParams.meta[id]))) : (((_e = spec.description) === null || _e === void 0 ? void 0 : _e[id]) || id),
+                    key: id,
+                });
             });
-        });
-    }, [spec.enum, spec.description, (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta]);
+    }, [
+        spec.enum,
+        spec.description,
+        (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta,
+        externalOptions,
+        withCustomOptions,
+    ]);
     const renderOption = react_1.default.useCallback((option) => {
         return react_1.default.createElement(react_1.default.Fragment, { key: option.value }, option.content || option.value);
     }, []);
@@ -46,6 +55,6 @@ const MultiSelect = ({ name, input, spec }) => {
     }, [onFocus, onBlur]);
     const _value = react_1.default.useMemo(() => (0, core_1.transformArrOut)(value), [value]);
     const handleChange = react_1.default.useCallback((value) => onChange((0, core_1.transformArrIn)(value)), [onChange]);
-    return (react_1.default.createElement(uikit_1.Select, { width: "max", className: b(), value: _value, options: options, onUpdate: handleChange, onOpenChange: handleToggle, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, filterable: filterable, filterPlaceholder: (_d = spec.viewSpec.selectParams) === null || _d === void 0 ? void 0 : _d.filterPlaceholder, renderOption: renderOption, getOptionHeight: getOptionHeight, multiple: true, qa: name }));
+    return (react_1.default.createElement(uikit_1.Select, Object.assign({ width: "max", className: b(), filterable: filterable, renderOption: renderOption, getOptionHeight: getOptionHeight }, inputProps, { value: _value, options: options, onUpdate: handleChange, onOpenChange: handleToggle, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, filterPlaceholder: (_d = spec.viewSpec.selectParams) === null || _d === void 0 ? void 0 : _d.filterPlaceholder, multiple: true, qa: name })));
 };
 exports.MultiSelect = MultiSelect;

package/build/cjs/lib/kit/components/Inputs/Select/Select.js

@@ -6,25 +6,34 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('select');
-const Select = ({ name, input, spec }) => {
+const Select = ({ name, input, spec, inputProps }) => {
     var _a, _b, _c, _d;
     const { value, onBlur, onChange, onFocus } = input;
     const filterable = react_1.default.useMemo(() => { var _a; return (((_a = spec.enum) === null || _a === void 0 ? void 0 : _a.length) || 0) > 9; }, [(_a = spec.enum) === null || _a === void 0 ? void 0 : _a.length]);
+    const { withCustomOptions, options: externalOptions } = inputProps || {};
     const options = react_1.default.useMemo(() => {
         var _a;
-        return (_a = spec.enum) === null || _a === void 0 ? void 0 : _a.map((id) => {
-            var _a, _b, _c, _d, _e;
-            return ({
-                id,
-                value: id,
-                text: ((_a = spec.description) === null || _a === void 0 ? void 0 : _a[id]) || id,
-                content: ((_c = (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta) === null || _c === void 0 ? void 0 : _c[id]) ? (react_1.default.createElement("div", { key: id },
-                    react_1.default.createElement(uikit_1.Text, null, ((_d = spec.description) === null || _d === void 0 ? void 0 : _d[id]) || id),
-                    react_1.default.createElement(uikit_1.Text, { color: "secondary", className: b('meta-text') }, spec.viewSpec.selectParams.meta[id]))) : (((_e = spec.description) === null || _e === void 0 ? void 0 : _e[id]) || id),
-                key: id,
+        return withCustomOptions
+            ? externalOptions || []
+            : (_a = spec.enum) === null || _a === void 0 ? void 0 : _a.map((id) => {
+                var _a, _b, _c, _d, _e;
+                return ({
+                    id,
+                    value: id,
+                    text: ((_a = spec.description) === null || _a === void 0 ? void 0 : _a[id]) || id,
+                    content: ((_c = (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta) === null || _c === void 0 ? void 0 : _c[id]) ? (react_1.default.createElement("div", { key: id },
+                        react_1.default.createElement(uikit_1.Text, null, ((_d = spec.description) === null || _d === void 0 ? void 0 : _d[id]) || id),
+                        react_1.default.createElement(uikit_1.Text, { color: "secondary", className: b('meta-text') }, spec.viewSpec.selectParams.meta[id]))) : (((_e = spec.description) === null || _e === void 0 ? void 0 : _e[id]) || id),
+                    key: id,
+                });
             });
-        });
-    }, [spec.enum, spec.description, (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta]);
+    }, [
+        spec.enum,
+        spec.description,
+        (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta,
+        externalOptions,
+        withCustomOptions,
+    ]);
     const renderOption = react_1.default.useCallback((option) => {
         return react_1.default.createElement(react_1.default.Fragment, { key: option.value }, option.content || option.value);
     }, []);
@@ -44,6 +53,6 @@ const Select = ({ name, input, spec }) => {
             onBlur();
         }
     }, [onFocus, onBlur]);
-    return (react_1.default.createElement(uikit_1.Select, { className: b(), width: "max", value: [value], options: options, onUpdate: handleChange, onOpenChange: handleToggle, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, filterable: filterable, filterPlaceholder: (_d = spec.viewSpec.selectParams) === null || _d === void 0 ? void 0 : _d.filterPlaceholder, getOptionHeight: getOptionHeight, renderOption: renderOption, qa: name }));
+    return (react_1.default.createElement(uikit_1.Select, Object.assign({ className: b(), width: "max", filterable: filterable, getOptionHeight: getOptionHeight, renderOption: renderOption }, inputProps, { value: [value], options: options, onUpdate: handleChange, onOpenChange: handleToggle, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, filterPlaceholder: (_d = spec.viewSpec.selectParams) === null || _d === void 0 ? void 0 : _d.filterPlaceholder, qa: name })));
 };
 exports.Select = Select;

package/build/cjs/lib/kit/components/Inputs/Text/Text.js

@@ -6,17 +6,8 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const components_1 = require("@gravity-ui/components");
 const uikit_1 = require("@gravity-ui/uikit");
 const lodash_1 = tslib_1.__importDefault(require("lodash"));
-const Text = ({ name, input: { value, onBlur, onChange, onFocus }, spec, }) => {
-    const props = {
-        value: lodash_1.default.isNil(value) ? '' : `${value}`,
-        hasClear: true,
-        onBlur: onBlur,
-        onFocus: onFocus,
-        onUpdate: onChange,
-        disabled: spec.viewSpec.disabled,
-        placeholder: spec.viewSpec.placeholder,
-        qa: name,
-    };
+const Text = ({ name, input: { value, onBlur, onChange, onFocus }, spec, inputProps, }) => {
+    const props = Object.assign(Object.assign({ hasClear: true }, inputProps), { value: lodash_1.default.isNil(value) ? '' : `${value}`, onBlur: onBlur, onFocus: onFocus, onUpdate: onChange, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, qa: name });
     if (spec.viewSpec.type === 'password') {
         return (react_1.default.createElement(components_1.PasswordInput, Object.assign({}, props, { autoComplete: "new-password", showCopyButton: true, showRevealButton: true })));
     }

package/build/cjs/lib/kit/components/Inputs/TextArea/TextArea.js

@@ -4,8 +4,8 @@ exports.TextArea = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
-const TextArea = ({ name, input, spec }) => {
+const TextArea = ({ name, input, spec, inputProps }) => {
     const { value, onBlur, onChange, onFocus } = input;
-    return (react_1.default.createElement(uikit_1.TextArea, { value: value || '', onBlur: onBlur, onFocus: onFocus, onUpdate: onChange, maxRows: 20, minRows: 8, hasClear: true, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, qa: name }));
+    return (react_1.default.createElement(uikit_1.TextArea, Object.assign({ maxRows: 20, minRows: 8, hasClear: true }, inputProps, { value: value || '', onBlur: onBlur, onFocus: onFocus, onUpdate: onChange, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, qa: name })));
 };
 exports.TextArea = TextArea;

package/build/cjs/lib/kit/components/Layouts/Accordeon/Accordeon.js

@@ -5,8 +5,8 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const components_1 = require("../../../components");
 const hooks_1 = require("../../../hooks");
+const RemoveButton_1 = require("../../RemoveButton");
 const SimpleVerticalAccordeon_1 = require("../../SimpleVerticalAccordeon");
-const RemoveButton_1 = require("./RemoveButton");
 const Accordeon = ({ name, spec, input, meta, children, }) => {
     var _a;
     const [open, setOpen] = react_1.default.useState(Boolean((_a = spec.viewSpec) === null || _a === void 0 ? void 0 : _a.layoutOpen));

package/build/cjs/lib/kit/components/Layouts/AccordeonCard/AccordeonCardForm.css

@@ -0,0 +1,3 @@
+.df-accordeon-card-form__accordeon-card-body {
+  padding-right: 32px;
+}

package/build/cjs/lib/kit/components/Layouts/AccordeonCard/AccordeonCardForm.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AccordeonCardForm = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const hooks_1 = require("../../../hooks");
+const utils_1 = require("../../../utils");
+const AccordeonCard_1 = require("../../AccordeonCard");
+const ErrorWrapper_1 = require("../../ErrorWrapper");
+const RemoveButton_1 = require("../../RemoveButton");
+const b = (0, utils_1.block)('accordeon-card-form');
+const AccordeonCardForm = ({ name, spec, input, children, meta, }) => {
+    var _a;
+    const [open, setOpen] = react_1.default.useState(Boolean((_a = spec.viewSpec) === null || _a === void 0 ? void 0 : _a.layoutOpen));
+    const onDrop = react_1.default.useCallback(() => {
+        setOpen(false);
+        input.onDrop();
+    }, [input.onDrop, setOpen]);
+    const removeButton = react_1.default.useMemo(() => {
+        if (spec.required || !input.value) {
+            return null;
+        }
+        return react_1.default.createElement(RemoveButton_1.RemoveButton, { name: name, onDrop: onDrop });
+    }, [spec.required, input.value, onDrop, name]);
+    (0, hooks_1.useErrorChecker)({ name, meta, open, setOpen });
+    return (react_1.default.createElement(AccordeonCard_1.AccordeonCard, { classNameBody: b('accordeon-card-body'), name: name, header: spec.viewSpec.layoutTitle || '', description: spec.viewSpec.layoutDescription || '', open: open, onToggle: setOpen, headerActionsTemplate: removeButton },
+        react_1.default.createElement(ErrorWrapper_1.ErrorWrapper, { name: name, meta: meta, withoutChildErrorStyles: true }, children)));
+};
+exports.AccordeonCardForm = AccordeonCardForm;

package/build/cjs/lib/kit/components/Layouts/AccordeonCard/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./AccordeonCardForm"), exports);

package/build/cjs/lib/kit/components/Layouts/CardAccordeon.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const components_1 = require("../../components");
 const hooks_1 = require("../../hooks");
-const RemoveButton_1 = require("./Accordeon/RemoveButton");
+const RemoveButton_1 = require("../RemoveButton");
 const CardAccordeon = ({ name, spec, input, meta, children, }) => {
     var _a;
     const [open, setOpen] = react_1.default.useState(Boolean((_a = spec.viewSpec) === null || _a === void 0 ? void 0 : _a.layoutOpen));

package/build/cjs/lib/kit/components/Layouts/CardSection.js

@@ -4,7 +4,7 @@ exports.CardSection = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const components_1 = require("../../components");
-const RemoveButton_1 = require("./Accordeon/RemoveButton");
+const RemoveButton_1 = require("../RemoveButton");
 const CardSection = ({ name, spec, input, meta, children, }) => {
     const removeButton = react_1.default.useMemo(() => {
         if (spec.required || !input.value) {

package/build/cjs/lib/kit/components/Layouts/index.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./Accordeon"), exports);
+tslib_1.__exportStar(require("./AccordeonCard"), exports);
 tslib_1.__exportStar(require("./CardAccordeon"), exports);
 tslib_1.__exportStar(require("./CardSection"), exports);
 tslib_1.__exportStar(require("./Row"), exports);

package/build/cjs/lib/kit/components/{Layouts/Accordeon → RemoveButton}/RemoveButton.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
-const i18n_1 = tslib_1.__importDefault(require("../../../i18n"));
+const i18n_1 = tslib_1.__importDefault(require("../../i18n"));
 const RemoveButton = ({ name, onDrop }) => {
     const items = react_1.default.useMemo(() => [{ text: (0, i18n_1.default)('label_delete'), action: onDrop, theme: 'danger' }], [onDrop]);
     const switcher = react_1.default.useMemo(() => (react_1.default.createElement(uikit_1.Button, { view: "flat", qa: `${name}-drop-item` },

package/build/cjs/lib/kit/components/RemoveButton/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./RemoveButton"), exports);

package/build/cjs/lib/kit/components/ViewLayouts/ViewAccordeonCard/ViewAccordeonCard.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViewAccordeonCard = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const utils_1 = require("../../../utils");
+const AccordeonCard_1 = require("../../AccordeonCard");
+const ViewAccordeonCard = ({ value, name, spec, children, }) => {
+    const [open, setOpen] = react_1.default.useState(lodash_1.default.isBoolean(spec.viewSpec.layoutOpen) ? spec.viewSpec.layoutOpen : true);
+    if (!(0, utils_1.isNotEmptyValue)(value, spec)) {
+        return null;
+    }
+    return (react_1.default.createElement(AccordeonCard_1.AccordeonCard, { name: name, header: spec.viewSpec.layoutTitle || '', open: open, onToggle: setOpen }, children));
+};
+exports.ViewAccordeonCard = ViewAccordeonCard;

package/build/cjs/lib/kit/components/ViewLayouts/ViewAccordeonCard/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./ViewAccordeonCard"), exports);

package/build/cjs/lib/kit/components/ViewLayouts/index.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./ViewAccordeon"), exports);
 tslib_1.__exportStar(require("./ViewCardAccordeon"), exports);
+tslib_1.__exportStar(require("./ViewAccordeonCard"), exports);
 tslib_1.__exportStar(require("./ViewCardSection"), exports);
 tslib_1.__exportStar(require("./ViewRow"), exports);
 tslib_1.__exportStar(require("./ViewSection"), exports);

package/build/cjs/lib/kit/constants/config.js

@@ -22,6 +22,7 @@ exports.dynamicConfig = {
             transparent: components_1.Transparent,
             card_accordeon: components_1.CardAccordeon,
             card_section: components_1.CardSection,
+            accordeon_card: components_1.AccordeonCardForm,
         },
         validators: {
             base: (0, validators_1.getArrayValidator)(),
@@ -79,6 +80,7 @@ exports.dynamicConfig = {
             transparent: components_1.Transparent,
             card_accordeon: components_1.CardAccordeon,
             card_section: components_1.CardSection,
+            accordeon_card: components_1.AccordeonCardForm,
         },
         validators: {
             base: (0, validators_1.getObjectValidator)(),
@@ -131,6 +133,7 @@ exports.dynamicViewConfig = {
             transparent: components_1.ViewTransparent,
             card_accordeon: components_1.ViewCardAccordeon,
             card_section: components_1.ViewCardSection,
+            accordeon_card: components_1.ViewAccordeonCard,
         },
     },
     boolean: {
@@ -179,6 +182,7 @@ exports.dynamicViewConfig = {
             transparent: components_1.ViewTransparent,
             card_accordeon: components_1.ViewCardAccordeon,
             card_section: components_1.ViewCardSection,
+            accordeon_card: components_1.ViewAccordeonCard,
         },
     },
     string: {

package/build/esm/lib/core/components/Form/Controller/utils.js

@@ -52,14 +52,15 @@ export const getRender = ({ name, spec, inputEntity, Layout, }) => {
     const render = (props) => {
         if (inputEntity && isCorrectSpec(spec) && _.isString(name)) {
             if (!spec.viewSpec.hidden) {
+                const { layoutProps, inputProps } = spec.viewSpec;
                 if (inputEntity.independent) {
                     const InputComponent = inputEntity.Component;
-                    return React.createElement(InputComponent, Object.assign({ spec: spec, name: name, Layout: Layout }, props));
+                    return (React.createElement(InputComponent, Object.assign({ spec: spec, name: name, Layout: Layout, inputProps: inputProps, layoutProps: layoutProps }, props)));
                 }
                 const InputComponent = inputEntity.Component;
-                const input = React.createElement(InputComponent, Object.assign({ spec: spec, name: name }, props));
+                const input = (React.createElement(InputComponent, Object.assign({ spec: spec, name: name, inputProps: inputProps }, props)));
                 if (Layout) {
-                    return (React.createElement(Layout, Object.assign({ spec: spec, name: name }, props), input));
+                    return (React.createElement(Layout, Object.assign({ spec: spec, name: name, layoutProps: layoutProps }, props), input));
                 }
                 return input;
             }

package/build/esm/lib/core/components/Form/hooks/useGenerateRandomValue.d.ts

@@ -1 +1 @@
-export declare const useGenerateRandomValue: () => ((spec: import("../../..").StringSpec<any>) => string) | undefined;
+export declare const useGenerateRandomValue: () => ((spec: import("../../..").StringSpec<any, {}, {}>) => string) | undefined;

package/build/esm/lib/core/components/Form/types/array.d.ts

@@ -1,11 +1,11 @@
 import { ArraySpec, ArrayValue } from '../../../types';
 import { FieldArrayValue, IndependentInputEntity, IndependentInputProps, IndependentInputType, InputEntity, InputProps, InputType, InputsMap, LayoutProps, LayoutType, LayoutsMap, TypeConfig, ValidatorsMap } from './';
-export type ArrayInputProps = InputProps<FieldArrayValue, ArraySpec>;
-export type ArrayIndependentInputProps = IndependentInputProps<FieldArrayValue, ArraySpec>;
-export type ArrayLayoutProps = LayoutProps<FieldArrayValue, ArraySpec>;
-export type ArrayInput = InputType<FieldArrayValue, ArraySpec>;
-export type ArrayIndependentInput = IndependentInputType<FieldArrayValue, ArraySpec>;
-export type ArrayLayout = LayoutType<FieldArrayValue, ArraySpec>;
+export type ArrayInputProps<InputComponentProps extends Record<string, any> = {}> = InputProps<FieldArrayValue, ArraySpec<undefined, InputComponentProps>>;
+export type ArrayIndependentInputProps<InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> = IndependentInputProps<FieldArrayValue, ArraySpec<undefined, InputComponentProps, LayoutComponentProps>>;
+export type ArrayLayoutProps<LayoutComponentProps extends Record<string, any> = {}> = LayoutProps<FieldArrayValue, ArraySpec<undefined, any, LayoutComponentProps>>;
+export type ArrayInput<InputComponentProps extends Record<string, any> = {}> = InputType<FieldArrayValue, ArraySpec<undefined, InputComponentProps>>;
+export type ArrayIndependentInput<InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> = IndependentInputType<FieldArrayValue, ArraySpec<undefined, InputComponentProps, LayoutComponentProps>>;
+export type ArrayLayout<LayoutComponentProps extends Record<string, any> = {}> = LayoutType<FieldArrayValue, ArraySpec<undefined, any, LayoutComponentProps>>;
 export type ArrayInputEntity = InputEntity<FieldArrayValue, ArraySpec>;
 export type ArrayIndependentInputEntity = IndependentInputEntity<FieldArrayValue, ArraySpec>;
 export type ArrayInputsMap = InputsMap<FieldArrayValue, ArraySpec>;

package/build/esm/lib/core/components/Form/types/boolean.d.ts

@@ -1,11 +1,11 @@
 import { BooleanSpec } from '../../../types';
 import { IndependentInputEntity, IndependentInputProps, IndependentInputType, InputEntity, InputProps, InputType, InputsMap, LayoutProps, LayoutType, LayoutsMap, TypeConfig, ValidatorsMap } from './';
-export type BooleanInputProps = InputProps<boolean, BooleanSpec>;
-export type BooleanIndependentInputProps = IndependentInputProps<boolean, BooleanSpec>;
-export type BooleanLayoutProps = LayoutProps<boolean, BooleanSpec>;
-export type BooleanInput = InputType<boolean, BooleanSpec>;
-export type BooleanIndependentInput = IndependentInputType<boolean, BooleanSpec>;
-export type BooleanLayout = LayoutType<boolean, BooleanSpec>;
+export type BooleanInputProps<InputComponentProps extends Record<string, any> = {}> = InputProps<boolean, BooleanSpec<undefined, InputComponentProps>>;
+export type BooleanIndependentInputProps<InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> = IndependentInputProps<boolean, BooleanSpec<undefined, InputComponentProps, LayoutComponentProps>>;
+export type BooleanLayoutProps<LayoutComponentProps extends Record<string, any> = {}> = LayoutProps<boolean, BooleanSpec<undefined, any, LayoutComponentProps>>;
+export type BooleanInput<InputComponentProps extends Record<string, any> = {}> = InputType<boolean, BooleanSpec<undefined, InputComponentProps>>;
+export type BooleanIndependentInput<InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> = IndependentInputType<boolean, BooleanSpec<undefined, InputComponentProps, LayoutComponentProps>>;
+export type BooleanLayout<LayoutComponentProps extends Record<string, any> = {}> = LayoutType<boolean, BooleanSpec<undefined, any, LayoutComponentProps>>;
 export type BooleanInputEntity = InputEntity<boolean, BooleanSpec>;
 export type BooleanIndependentInputEntity = IndependentInputEntity<boolean, BooleanSpec>;
 export type BooleanInputsMap = InputsMap<boolean, BooleanSpec>;

package/build/esm/lib/core/components/Form/types/input.d.ts

@@ -4,9 +4,11 @@ import { FieldRenderProps, FieldValue, LayoutType } from './';
 export type InputProps<Value extends FieldValue, SpecType extends Spec> = {
     spec: SpecType;
     name: string;
+    inputProps?: SpecType['viewSpec']['inputProps'];
 } & FieldRenderProps<Value>;
 export type IndependentInputProps<Value extends FieldValue, SpecType extends Spec> = {
     Layout: LayoutType<Value, SpecType> | undefined;
+    layoutProps?: SpecType['viewSpec']['layoutProps'];
 } & InputProps<Value, SpecType>;
 export type InputType<Value extends FieldValue, SpecType extends Spec> = (props: InputProps<Value, SpecType>) => React.ReactElement | null;
 export type IndependentInputType<Value extends FieldValue, SpecType extends Spec> = (props: IndependentInputProps<Value, SpecType>) => React.ReactElement | null;

package/build/esm/lib/core/components/Form/types/layout.d.ts

@@ -3,6 +3,7 @@ import { Spec } from '../../../types';
 import { FieldValue, InputProps } from './';
 export type LayoutProps<Value extends FieldValue, SpecType extends Spec> = {
     children: React.ReactElement;
+    layoutProps?: SpecType['viewSpec']['layoutProps'];
 } & InputProps<Value, SpecType>;
 export type LayoutType<Value extends FieldValue, SpecType extends Spec> = (props: LayoutProps<Value, SpecType>) => React.ReactElement | null;
 export type LayoutsMap<Value extends FieldValue, SpecType extends Spec> = Record<string, LayoutType<Value, SpecType> | undefined>;

package/build/esm/lib/core/components/Form/types/number.d.ts

@@ -1,11 +1,11 @@
 import { NumberSpec } from '../../../types';
 import { IndependentInputEntity, IndependentInputProps, IndependentInputType, InputEntity, InputProps, InputType, InputsMap, LayoutProps, LayoutType, LayoutsMap, TypeConfig, ValidatorsMap } from './';
-export type NumberInputProps = InputProps<number, NumberSpec>;
-export type NumberIndependentInputProps = IndependentInputProps<number, NumberSpec>;
-export type NumberLayoutProps = LayoutProps<number, NumberSpec>;
-export type NumberInput = InputType<number, NumberSpec>;
-export type NumberIndependentInput = IndependentInputType<number, NumberSpec>;
-export type NumberLayout = LayoutType<number, NumberSpec>;
+export type NumberInputProps<InputComponentProps extends Record<string, any> = {}> = InputProps<number, NumberSpec<undefined, InputComponentProps>>;
+export type NumberIndependentInputProps<InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> = IndependentInputProps<number, NumberSpec<undefined, InputComponentProps, LayoutComponentProps>>;
+export type NumberLayoutProps<LayoutComponentProps extends Record<string, any> = {}> = LayoutProps<number, NumberSpec<undefined, any, LayoutComponentProps>>;
+export type NumberInput<InputComponentProps extends Record<string, any> = {}> = InputType<number, NumberSpec<undefined, InputComponentProps>>;
+export type NumberIndependentInput<InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> = IndependentInputType<number, NumberSpec<undefined, InputComponentProps, LayoutComponentProps>>;
+export type NumberLayout<LayoutComponentProps extends Record<string, any> = {}> = LayoutType<number, NumberSpec<undefined, any, LayoutComponentProps>>;
 export type NumberInputEntity = InputEntity<number, NumberSpec>;
 export type NumberIndependentInputEntity = IndependentInputEntity<number, NumberSpec>;
 export type NumberInputsMap = InputsMap<number, NumberSpec>;

package/build/esm/lib/core/components/Form/types/object.d.ts

@@ -1,11 +1,11 @@
 import { ObjectSpec, ObjectValue } from '../../../types';
 import { FieldObjectValue, IndependentInputEntity, IndependentInputProps, IndependentInputType, InputEntity, InputProps, InputType, InputsMap, LayoutProps, LayoutType, LayoutsMap, TypeConfig, ValidatorsMap } from './';
-export type ObjectInputProps = InputProps<FieldObjectValue, ObjectSpec>;
-export type ObjectIndependentInputProps = IndependentInputProps<FieldObjectValue, ObjectSpec>;
-export type ObjectLayoutProps = LayoutProps<FieldObjectValue, ObjectSpec>;
-export type ObjectInput = InputType<FieldObjectValue, ObjectSpec>;
-export type ObjectIndependentInput = IndependentInputType<FieldObjectValue, ObjectSpec>;
-export type ObjectLayout = LayoutType<FieldObjectValue, ObjectSpec>;
+export type ObjectInputProps<InputComponentProps extends Record<string, any> = {}> = InputProps<FieldObjectValue, ObjectSpec<undefined, InputComponentProps>>;
+export type ObjectIndependentInputProps<InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> = IndependentInputProps<FieldObjectValue, ObjectSpec<undefined, InputComponentProps, LayoutComponentProps>>;
+export type ObjectLayoutProps<LayoutComponentProps extends Record<string, any> = {}> = LayoutProps<FieldObjectValue, ObjectSpec<undefined, any, LayoutComponentProps>>;
+export type ObjectInput<InputComponentProps extends Record<string, any> = {}> = InputType<FieldObjectValue, ObjectSpec<undefined, InputComponentProps>>;
+export type ObjectIndependentInput<InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> = IndependentInputType<FieldObjectValue, ObjectSpec<undefined, InputComponentProps, LayoutComponentProps>>;
+export type ObjectLayout<LayoutComponentProps extends Record<string, any> = {}> = LayoutType<FieldObjectValue, ObjectSpec<undefined, any, LayoutComponentProps>>;
 export type ObjectInputEntity = InputEntity<FieldObjectValue, ObjectSpec>;
 export type ObjectIndependentInputEntity = IndependentInputEntity<FieldObjectValue, ObjectSpec>;
 export type ObjectInputsMap = InputsMap<FieldObjectValue, ObjectSpec>;

package/build/esm/lib/core/components/Form/types/string.d.ts

@@ -1,11 +1,11 @@
 import { StringSpec } from '../../../types';
 import { IndependentInputEntity, IndependentInputProps, IndependentInputType, InputEntity, InputProps, InputType, InputsMap, LayoutProps, LayoutType, LayoutsMap, TypeConfig, ValidatorsMap } from './';
-export type StringInputProps = InputProps<string, StringSpec>;
-export type StringIndependentInputProps = IndependentInputProps<string, StringSpec>;
-export type StringLayoutProps = LayoutProps<string, StringSpec>;
-export type StringInput = InputType<string, StringSpec>;
-export type StringIndependentInput = IndependentInputType<string, StringSpec>;
-export type StringLayout = LayoutType<string, StringSpec>;
+export type StringInputProps<InputComponentProps extends Record<string, any> = {}> = InputProps<string, StringSpec<undefined, InputComponentProps>>;
+export type StringIndependentInputProps<InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> = IndependentInputProps<string, StringSpec<undefined, InputComponentProps, LayoutComponentProps>>;
+export type StringLayoutProps<LayoutComponentProps extends Record<string, any> = {}> = LayoutProps<string, StringSpec<undefined, any, LayoutComponentProps>>;
+export type StringInput<InputComponentProps extends Record<string, any> = {}> = InputType<string, StringSpec<undefined, InputComponentProps>>;
+export type StringIndependentInput<InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> = IndependentInputType<string, StringSpec<undefined, InputComponentProps, LayoutComponentProps>>;
+export type StringLayout<LayoutComponentProps extends Record<string, any> = {}> = LayoutType<string, StringSpec<undefined, any, LayoutComponentProps>>;
 export type StringInputEntity = InputEntity<string, StringSpec>;
 export type StringIndependentInputEntity = IndependentInputEntity<string, StringSpec>;
 export type StringInputsMap = InputsMap<string, StringSpec>;

package/build/esm/lib/core/helpers.d.ts

@@ -1,7 +1,7 @@
 import { ArraySpec, BooleanSpec, NumberSpec, ObjectSpec, StringSpec } from './types';
 export declare const isCorrectSpec: (candidate: any) => boolean;
-export declare const isArraySpec: (candidate: any) => candidate is ArraySpec<any>;
-export declare const isBooleanSpec: (candidate: any) => candidate is BooleanSpec<any>;
-export declare const isNumberSpec: (candidate: any) => candidate is NumberSpec<any>;
-export declare const isObjectSpec: (candidate: any) => candidate is ObjectSpec<any>;
-export declare const isStringSpec: (candidate: any) => candidate is StringSpec<any>;
+export declare const isArraySpec: (candidate: any) => candidate is ArraySpec<any, {}, {}>;
+export declare const isBooleanSpec: (candidate: any) => candidate is BooleanSpec<any, {}, {}>;
+export declare const isNumberSpec: (candidate: any) => candidate is NumberSpec<any, {}, {}>;
+export declare const isObjectSpec: (candidate: any) => candidate is ObjectSpec<any, {}, {}>;
+export declare const isStringSpec: (candidate: any) => candidate is StringSpec<any, {}, {}>;

package/build/esm/lib/core/types/specs.d.ts

@@ -2,7 +2,7 @@ import { LabelProps } from '@gravity-ui/uikit';
 import { ColorTextBaseProps } from '@gravity-ui/uikit/build/esm/components/Text/colorText/colorText';
 import { ReadAsMethod, SpecTypes } from '../constants';
 import { ArrayValue, ObjectValue } from './';
-export interface ArraySpec<LinkType = any> {
+export interface ArraySpec<LinkType = any, InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> {
     defaultValue?: ArrayValue;
     type: SpecTypes.Array;
     required?: boolean;
@@ -33,9 +33,11 @@ export interface ArraySpec<LinkType = any> {
             filterPlaceholder?: string;
             meta?: Record<string, string>;
         };
+        inputProps?: InputComponentProps;
+        layoutProps?: LayoutComponentProps;
     };
 }
-export interface BooleanSpec<LinkType = any> {
+export interface BooleanSpec<LinkType = any, InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> {
     defaultValue?: boolean;
     type: SpecTypes.Boolean;
     required?: boolean;
@@ -49,9 +51,11 @@ export interface BooleanSpec<LinkType = any> {
         layoutOpen?: boolean;
         link?: LinkType;
         hidden?: boolean;
+        inputProps?: InputComponentProps;
+        layoutProps?: LayoutComponentProps;
     };
 }
-export interface NumberSpec<LinkType = any> {
+export interface NumberSpec<LinkType = any, InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> {
     defaultValue?: number;
     type: SpecTypes.Number;
     required?: boolean;
@@ -70,9 +74,11 @@ export interface NumberSpec<LinkType = any> {
         placeholder?: string;
         copy?: boolean;
         hidden?: boolean;
+        inputProps?: InputComponentProps;
+        layoutProps?: LayoutComponentProps;
     };
 }
-export interface ObjectSpec<LinkType = any> {
+export interface ObjectSpec<LinkType = any, InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> {
     defaultValue?: ObjectValue;
     type: SpecTypes.Object;
     required?: boolean;
@@ -93,9 +99,11 @@ export interface ObjectSpec<LinkType = any> {
         };
         placeholder?: string;
         hidden?: boolean;
+        inputProps?: InputComponentProps;
+        layoutProps?: LayoutComponentProps;
     };
 }
-export interface StringSpec<LinkType = any> {
+export interface StringSpec<LinkType = any, InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> {
     defaultValue?: string;
     type: SpecTypes.String;
     required?: boolean;
@@ -145,6 +153,8 @@ export interface StringSpec<LinkType = any> {
             filterPlaceholder?: string;
             meta?: Record<string, string>;
         };
+        inputProps?: InputComponentProps;
+        layoutProps?: LayoutComponentProps;
         generateRandomValueButton?: boolean;
     };
 }

package/build/esm/lib/kit/components/AccordeonCard/AccordeonCard.css

@@ -3,12 +3,24 @@
   flex-direction: column;
   justify-content: space-between;
   box-sizing: border-box;
-  max-width: 750px;
   box-shadow: 0 1px 5px var(--g-color-sfx-shadow);
   border-radius: 5px;
   color: var(--g-color-text-primary);
   background-color: var(--g-color-base-float);
 }
+.df-accordeon-card .df-row {
+  width: 100%;
+  max-width: unset;
+}
+.df-accordeon-card .df-row .df-select,
+.df-accordeon-card .df-row .df-multi-select,
+.df-accordeon-card .df-row .df-transparent_array-item {
+  max-width: unset;
+}
+.df-accordeon-card .df-monaco-input,
+.df-accordeon-card .df-monaco-base-view {
+  width: 100%;
+}
 .df-accordeon-card:hover {
   box-shadow: 0 3px 10px var(--g-color-sfx-shadow);
 }
@@ -64,7 +76,6 @@
 }
 .df-accordeon-card__body {
   display: none;
-  margin-top: -10px 0 8px;
   padding: 16px;
 }
 .df-accordeon-card__body_open {

package/build/esm/lib/kit/components/AccordeonCard/AccordeonCard.d.ts

@@ -12,5 +12,6 @@ export interface AccordeonCardProps {
     ignoreHeaderToggle?: boolean;
     titleSize?: 's' | 'm';
     alwaysOpen?: boolean;
+    classNameBody?: string;
 }
 export declare const AccordeonCard: React.FC<AccordeonCardProps>;

package/build/esm/lib/kit/components/AccordeonCard/AccordeonCard.js

@@ -5,7 +5,7 @@ import _ from 'lodash';
 import { block } from '../../utils';
 import './AccordeonCard.css';
 const b = block('accordeon-card');
-export const AccordeonCard = ({ className, name, header, description, open: propsOpen, onToggle, headerActionsTemplate, ignoreHeaderToggle, titleSize = 'm', alwaysOpen, children, }) => {
+export const AccordeonCard = ({ className, name, header, description, open: propsOpen, onToggle, headerActionsTemplate, ignoreHeaderToggle, titleSize = 'm', alwaysOpen, children, classNameBody, }) => {
     const accordeonRef = React.useRef(null);
     const bodyRef = React.useRef(null);
     const [open, setOpen] = React.useState(alwaysOpen || propsOpen || false);
@@ -49,5 +49,5 @@ export const AccordeonCard = ({ className, name, header, description, open: prop
                 headerActionsTemplate ? (React.createElement("div", { className: b('interal-actions') }, headerActionsTemplate)) : null,
                 React.createElement(Button, { view: "flat", onClick: handleToggle, qa: `${name}-accordeon-toggler` },
                     React.createElement(Icon, { className: b('toggle-icon', { open }), data: ChevronDown, size: 16 })))) : null),
-        React.createElement("div", { ref: bodyRef, className: b('body', { open: open && !emptyBody }) }, children)));
+        React.createElement("div", { ref: bodyRef, className: b('body', { open: open && !emptyBody }, classNameBody) }, children)));
 };

package/build/esm/lib/kit/components/Inputs/CardOneOf/CardOneOf.js

@@ -4,7 +4,7 @@ import { Card } from '../../';
 import { Controller, isArrayItem, } from '../../../../core';
 import { useErrorChecker, useOneOf } from '../../../hooks';
 import { Row } from '../../Layouts';
-import { RemoveButton } from '../../Layouts/Accordeon/RemoveButton';
+import { RemoveButton } from '../../RemoveButton';
 export const CardOneOf = (props) => {
     var _a;
     const { input, meta, spec, name } = props;

package/build/esm/lib/kit/components/Inputs/MultiSelect/MultiSelect.d.ts

@@ -1,3 +1,7 @@
+import { SelectProps as SelectBaseProps } from '@gravity-ui/uikit';
 import { ArrayInput } from '../../../../core';
 import './MultiSelect.css';
-export declare const MultiSelect: ArrayInput;
+export interface MultiSelectProps extends Omit<SelectBaseProps, 'onUpdate' | 'value' | 'onOpenChange' | 'disabled' | 'placeholder' | 'filterPlaceholder' | 'multiple' | 'qa'> {
+    withCustomOptions?: boolean;
+}
+export declare const MultiSelect: ArrayInput<MultiSelectProps>;

package/build/esm/lib/kit/components/Inputs/MultiSelect/MultiSelect.js

@@ -4,25 +4,34 @@ import { transformArrIn, transformArrOut } from '../../../../core';
 import { block } from '../../../utils';
 import './MultiSelect.css';
 const b = block('multi-select');
-export const MultiSelect = ({ name, input, spec }) => {
+export const MultiSelect = ({ name, input, spec, inputProps }) => {
     var _a, _b, _c, _d;
     const { value, onBlur, onChange, onFocus } = input;
     const filterable = React.useMemo(() => { var _a; return (((_a = spec.enum) === null || _a === void 0 ? void 0 : _a.length) || 0) > 9; }, [(_a = spec.enum) === null || _a === void 0 ? void 0 : _a.length]);
+    const { withCustomOptions, options: externalOptions } = inputProps || {};
     const options = React.useMemo(() => {
         var _a;
-        return (_a = spec.enum) === null || _a === void 0 ? void 0 : _a.map((id) => {
-            var _a, _b, _c, _d, _e;
-            return ({
-                id,
-                value: id,
-                text: ((_a = spec.description) === null || _a === void 0 ? void 0 : _a[id]) || id,
-                content: ((_c = (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta) === null || _c === void 0 ? void 0 : _c[id]) ? (React.createElement("div", { key: id },
-                    React.createElement(Text, null, ((_d = spec.description) === null || _d === void 0 ? void 0 : _d[id]) || id),
-                    React.createElement(Text, { color: "secondary", className: b('meta-text') }, spec.viewSpec.selectParams.meta[id]))) : (((_e = spec.description) === null || _e === void 0 ? void 0 : _e[id]) || id),
-                key: id,
+        return withCustomOptions
+            ? externalOptions || []
+            : (_a = spec.enum) === null || _a === void 0 ? void 0 : _a.map((id) => {
+                var _a, _b, _c, _d, _e;
+                return ({
+                    id,
+                    value: id,
+                    text: ((_a = spec.description) === null || _a === void 0 ? void 0 : _a[id]) || id,
+                    content: ((_c = (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta) === null || _c === void 0 ? void 0 : _c[id]) ? (React.createElement("div", { key: id },
+                        React.createElement(Text, null, ((_d = spec.description) === null || _d === void 0 ? void 0 : _d[id]) || id),
+                        React.createElement(Text, { color: "secondary", className: b('meta-text') }, spec.viewSpec.selectParams.meta[id]))) : (((_e = spec.description) === null || _e === void 0 ? void 0 : _e[id]) || id),
+                    key: id,
+                });
             });
-        });
-    }, [spec.enum, spec.description, (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta]);
+    }, [
+        spec.enum,
+        spec.description,
+        (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta,
+        externalOptions,
+        withCustomOptions,
+    ]);
     const renderOption = React.useCallback((option) => {
         return React.createElement(React.Fragment, { key: option.value }, option.content || option.value);
     }, []);
@@ -43,5 +52,5 @@ export const MultiSelect = ({ name, input, spec }) => {
     }, [onFocus, onBlur]);
     const _value = React.useMemo(() => transformArrOut(value), [value]);
     const handleChange = React.useCallback((value) => onChange(transformArrIn(value)), [onChange]);
-    return (React.createElement(Select, { width: "max", className: b(), value: _value, options: options, onUpdate: handleChange, onOpenChange: handleToggle, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, filterable: filterable, filterPlaceholder: (_d = spec.viewSpec.selectParams) === null || _d === void 0 ? void 0 : _d.filterPlaceholder, renderOption: renderOption, getOptionHeight: getOptionHeight, multiple: true, qa: name }));
+    return (React.createElement(Select, Object.assign({ width: "max", className: b(), filterable: filterable, renderOption: renderOption, getOptionHeight: getOptionHeight }, inputProps, { value: _value, options: options, onUpdate: handleChange, onOpenChange: handleToggle, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, filterPlaceholder: (_d = spec.viewSpec.selectParams) === null || _d === void 0 ? void 0 : _d.filterPlaceholder, multiple: true, qa: name })));
 };

package/build/esm/lib/kit/components/Inputs/Select/Select.d.ts

@@ -1,3 +1,7 @@
+import { SelectProps as SelectBaseProps } from '@gravity-ui/uikit';
 import { StringInput } from '../../../../core';
 import './Select.css';
-export declare const Select: StringInput;
+export interface SelectProps extends Omit<SelectBaseProps, 'onUpdate' | 'value' | 'onOpenChange' | 'disabled' | 'placeholder' | 'filterPlaceholder' | 'multiple' | 'qa'> {
+    withCustomOptions?: boolean;
+}
+export declare const Select: StringInput<SelectProps>;

package/build/esm/lib/kit/components/Inputs/Select/Select.js

@@ -3,25 +3,34 @@ import { Select as SelectBase, Text } from '@gravity-ui/uikit';
 import { block } from '../../../utils';
 import './Select.css';
 const b = block('select');
-export const Select = ({ name, input, spec }) => {
+export const Select = ({ name, input, spec, inputProps }) => {
     var _a, _b, _c, _d;
     const { value, onBlur, onChange, onFocus } = input;
     const filterable = React.useMemo(() => { var _a; return (((_a = spec.enum) === null || _a === void 0 ? void 0 : _a.length) || 0) > 9; }, [(_a = spec.enum) === null || _a === void 0 ? void 0 : _a.length]);
+    const { withCustomOptions, options: externalOptions } = inputProps || {};
     const options = React.useMemo(() => {
         var _a;
-        return (_a = spec.enum) === null || _a === void 0 ? void 0 : _a.map((id) => {
-            var _a, _b, _c, _d, _e;
-            return ({
-                id,
-                value: id,
-                text: ((_a = spec.description) === null || _a === void 0 ? void 0 : _a[id]) || id,
-                content: ((_c = (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta) === null || _c === void 0 ? void 0 : _c[id]) ? (React.createElement("div", { key: id },
-                    React.createElement(Text, null, ((_d = spec.description) === null || _d === void 0 ? void 0 : _d[id]) || id),
-                    React.createElement(Text, { color: "secondary", className: b('meta-text') }, spec.viewSpec.selectParams.meta[id]))) : (((_e = spec.description) === null || _e === void 0 ? void 0 : _e[id]) || id),
-                key: id,
+        return withCustomOptions
+            ? externalOptions || []
+            : (_a = spec.enum) === null || _a === void 0 ? void 0 : _a.map((id) => {
+                var _a, _b, _c, _d, _e;
+                return ({
+                    id,
+                    value: id,
+                    text: ((_a = spec.description) === null || _a === void 0 ? void 0 : _a[id]) || id,
+                    content: ((_c = (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta) === null || _c === void 0 ? void 0 : _c[id]) ? (React.createElement("div", { key: id },
+                        React.createElement(Text, null, ((_d = spec.description) === null || _d === void 0 ? void 0 : _d[id]) || id),
+                        React.createElement(Text, { color: "secondary", className: b('meta-text') }, spec.viewSpec.selectParams.meta[id]))) : (((_e = spec.description) === null || _e === void 0 ? void 0 : _e[id]) || id),
+                    key: id,
+                });
             });
-        });
-    }, [spec.enum, spec.description, (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta]);
+    }, [
+        spec.enum,
+        spec.description,
+        (_b = spec.viewSpec.selectParams) === null || _b === void 0 ? void 0 : _b.meta,
+        externalOptions,
+        withCustomOptions,
+    ]);
     const renderOption = React.useCallback((option) => {
         return React.createElement(React.Fragment, { key: option.value }, option.content || option.value);
     }, []);
@@ -41,5 +50,5 @@ export const Select = ({ name, input, spec }) => {
             onBlur();
         }
     }, [onFocus, onBlur]);
-    return (React.createElement(SelectBase, { className: b(), width: "max", value: [value], options: options, onUpdate: handleChange, onOpenChange: handleToggle, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, filterable: filterable, filterPlaceholder: (_d = spec.viewSpec.selectParams) === null || _d === void 0 ? void 0 : _d.filterPlaceholder, getOptionHeight: getOptionHeight, renderOption: renderOption, qa: name }));
+    return (React.createElement(SelectBase, Object.assign({ className: b(), width: "max", filterable: filterable, getOptionHeight: getOptionHeight, renderOption: renderOption }, inputProps, { value: [value], options: options, onUpdate: handleChange, onOpenChange: handleToggle, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, filterPlaceholder: (_d = spec.viewSpec.selectParams) === null || _d === void 0 ? void 0 : _d.filterPlaceholder, qa: name })));
 };

package/build/esm/lib/kit/components/Inputs/Text/Text.d.ts

@@ -1,2 +1,5 @@
+import { TextInputProps as TextInputBaseProps } from '@gravity-ui/uikit';
 import { NumberInputProps, StringInputProps } from '../../../../core';
-export declare const Text: <T extends NumberInputProps | StringInputProps>({ name, input: { value, onBlur, onChange, onFocus }, spec, }: T) => JSX.Element;
+export interface TextProps extends Omit<TextInputBaseProps, 'value' | 'onBlur' | 'onFocus' | 'onUpdate' | 'disabled' | 'placeholder' | 'qa'> {
+}
+export declare const Text: <T extends NumberInputProps<TextProps> | StringInputProps<TextProps>>({ name, input: { value, onBlur, onChange, onFocus }, spec, inputProps, }: T) => JSX.Element;

package/build/esm/lib/kit/components/Inputs/Text/Text.js

@@ -2,17 +2,8 @@ import React from 'react';
 import { PasswordInput } from '@gravity-ui/components';
 import { TextInput } from '@gravity-ui/uikit';
 import _ from 'lodash';
-export const Text = ({ name, input: { value, onBlur, onChange, onFocus }, spec, }) => {
-    const props = {
-        value: _.isNil(value) ? '' : `${value}`,
-        hasClear: true,
-        onBlur: onBlur,
-        onFocus: onFocus,
-        onUpdate: onChange,
-        disabled: spec.viewSpec.disabled,
-        placeholder: spec.viewSpec.placeholder,
-        qa: name,
-    };
+export const Text = ({ name, input: { value, onBlur, onChange, onFocus }, spec, inputProps, }) => {
+    const props = Object.assign(Object.assign({ hasClear: true }, inputProps), { value: _.isNil(value) ? '' : `${value}`, onBlur: onBlur, onFocus: onFocus, onUpdate: onChange, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, qa: name });
     if (spec.viewSpec.type === 'password') {
         return (React.createElement(PasswordInput, Object.assign({}, props, { autoComplete: "new-password", showCopyButton: true, showRevealButton: true })));
     }

package/build/esm/lib/kit/components/Inputs/TextArea/TextArea.d.ts

@@ -1,2 +1,5 @@
+import { TextAreaProps as TextAreaBaseProps } from '@gravity-ui/uikit';
 import { StringInput } from '../../../../core';
-export declare const TextArea: StringInput;
+export interface TextAreaProps extends Omit<TextAreaBaseProps, 'value' | 'onBlur' | 'onFocus' | 'onUpdate' | 'disabled' | 'placeholder' | 'qa'> {
+}
+export declare const TextArea: StringInput<TextAreaProps>;

package/build/esm/lib/kit/components/Inputs/TextArea/TextArea.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { TextArea as TextAreaBase } from '@gravity-ui/uikit';
-export const TextArea = ({ name, input, spec }) => {
+export const TextArea = ({ name, input, spec, inputProps }) => {
     const { value, onBlur, onChange, onFocus } = input;
-    return (React.createElement(TextAreaBase, { value: value || '', onBlur: onBlur, onFocus: onFocus, onUpdate: onChange, maxRows: 20, minRows: 8, hasClear: true, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, qa: name }));
+    return (React.createElement(TextAreaBase, Object.assign({ maxRows: 20, minRows: 8, hasClear: true }, inputProps, { value: value || '', onBlur: onBlur, onFocus: onFocus, onUpdate: onChange, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, qa: name })));
 };

package/build/esm/lib/kit/components/Layouts/Accordeon/Accordeon.d.ts

@@ -1,2 +1,2 @@
 import { ArrayLayoutProps, ObjectLayoutProps } from '../../../../core';
-export declare const Accordeon: <T extends ArrayLayoutProps | ObjectLayoutProps>({ name, spec, input, meta, children, }: T) => JSX.Element;
+export declare const Accordeon: <T extends ArrayLayoutProps<{}> | ObjectLayoutProps<{}>>({ name, spec, input, meta, children, }: T) => JSX.Element;

package/build/esm/lib/kit/components/Layouts/Accordeon/Accordeon.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { ErrorWrapper } from '../../../components';
 import { useErrorChecker } from '../../../hooks';
+import { RemoveButton } from '../../RemoveButton';
 import { SimpleVerticalAccordeon } from '../../SimpleVerticalAccordeon';
-import { RemoveButton } from './RemoveButton';
 export const Accordeon = ({ name, spec, input, meta, children, }) => {
     var _a;
     const [open, setOpen] = React.useState(Boolean((_a = spec.viewSpec) === null || _a === void 0 ? void 0 : _a.layoutOpen));

package/build/esm/lib/kit/components/Layouts/AccordeonCard/AccordeonCardForm.css

@@ -0,0 +1,3 @@
+.df-accordeon-card-form__accordeon-card-body {
+  padding-right: 32px;
+}

package/build/esm/lib/kit/components/Layouts/AccordeonCard/AccordeonCardForm.d.ts

@@ -0,0 +1,3 @@
+import { ArrayLayoutProps, ObjectLayoutProps } from '../../../../core';
+import './AccordeonCardForm.css';
+export declare const AccordeonCardForm: <T extends ArrayLayoutProps<{}> | ObjectLayoutProps<{}>>({ name, spec, input, children, meta, }: T) => JSX.Element;

package/build/esm/lib/kit/components/Layouts/AccordeonCard/AccordeonCardForm.js

@@ -0,0 +1,25 @@
+import React from 'react';
+import { useErrorChecker } from '../../../hooks';
+import { block } from '../../../utils';
+import { AccordeonCard } from '../../AccordeonCard';
+import { ErrorWrapper } from '../../ErrorWrapper';
+import { RemoveButton } from '../../RemoveButton';
+import './AccordeonCardForm.css';
+const b = block('accordeon-card-form');
+export const AccordeonCardForm = ({ name, spec, input, children, meta, }) => {
+    var _a;
+    const [open, setOpen] = React.useState(Boolean((_a = spec.viewSpec) === null || _a === void 0 ? void 0 : _a.layoutOpen));
+    const onDrop = React.useCallback(() => {
+        setOpen(false);
+        input.onDrop();
+    }, [input.onDrop, setOpen]);
+    const removeButton = React.useMemo(() => {
+        if (spec.required || !input.value) {
+            return null;
+        }
+        return React.createElement(RemoveButton, { name: name, onDrop: onDrop });
+    }, [spec.required, input.value, onDrop, name]);
+    useErrorChecker({ name, meta, open, setOpen });
+    return (React.createElement(AccordeonCard, { classNameBody: b('accordeon-card-body'), name: name, header: spec.viewSpec.layoutTitle || '', description: spec.viewSpec.layoutDescription || '', open: open, onToggle: setOpen, headerActionsTemplate: removeButton },
+        React.createElement(ErrorWrapper, { name: name, meta: meta, withoutChildErrorStyles: true }, children)));
+};

package/build/esm/lib/kit/components/Layouts/AccordeonCard/index.d.ts

@@ -0,0 +1 @@
+export * from './AccordeonCardForm';

package/build/esm/lib/kit/components/Layouts/AccordeonCard/index.js

@@ -0,0 +1 @@
+export * from './AccordeonCardForm';

package/build/esm/lib/kit/components/Layouts/CardAccordeon.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Card, ErrorWrapper } from '../../components';
 import { useErrorChecker } from '../../hooks';
-import { RemoveButton } from './Accordeon/RemoveButton';
+import { RemoveButton } from '../RemoveButton';
 export const CardAccordeon = ({ name, spec, input, meta, children, }) => {
     var _a;
     const [open, setOpen] = React.useState(Boolean((_a = spec.viewSpec) === null || _a === void 0 ? void 0 : _a.layoutOpen));

package/build/esm/lib/kit/components/Layouts/CardSection.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Card, ErrorWrapper } from '../../components';
-import { RemoveButton } from './Accordeon/RemoveButton';
+import { RemoveButton } from '../RemoveButton';
 export const CardSection = ({ name, spec, input, meta, children, }) => {
     const removeButton = React.useMemo(() => {
         if (spec.required || !input.value) {

package/build/esm/lib/kit/components/Layouts/index.d.ts

@@ -1,4 +1,5 @@
 export * from './Accordeon';
+export * from './AccordeonCard';
 export * from './CardAccordeon';
 export * from './CardSection';
 export * from './Row';

package/build/esm/lib/kit/components/Layouts/index.js

@@ -1,4 +1,5 @@
 export * from './Accordeon';
+export * from './AccordeonCard';
 export * from './CardAccordeon';
 export * from './CardSection';
 export * from './Row';

package/build/esm/lib/kit/components/{Layouts/Accordeon → RemoveButton}/RemoveButton.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Ellipsis } from '@gravity-ui/icons';
 import { Button, DropdownMenu, Icon } from '@gravity-ui/uikit';
-import i18n from '../../../i18n';
+import i18n from '../../i18n';
 export const RemoveButton = ({ name, onDrop }) => {
     const items = React.useMemo(() => [{ text: i18n('label_delete'), action: onDrop, theme: 'danger' }], [onDrop]);
     const switcher = React.useMemo(() => (React.createElement(Button, { view: "flat", qa: `${name}-drop-item` },

package/build/esm/lib/kit/components/RemoveButton/index.d.ts

@@ -0,0 +1 @@
+export * from './RemoveButton';

package/build/esm/lib/kit/components/RemoveButton/index.js

@@ -0,0 +1 @@
+export * from './RemoveButton';

package/build/esm/lib/kit/components/ViewLayouts/ViewAccordeonCard/ViewAccordeonCard.d.ts

@@ -0,0 +1,2 @@
+import { ArrayViewLayoutProps, ObjectViewLayoutProps } from '../../../../core';
+export declare const ViewAccordeonCard: <T extends ArrayViewLayoutProps | ObjectViewLayoutProps>({ value, name, spec, children, }: T) => JSX.Element | null;

package/build/esm/lib/kit/components/ViewLayouts/ViewAccordeonCard/ViewAccordeonCard.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import _ from 'lodash';
+import { isNotEmptyValue } from '../../../utils';
+import { AccordeonCard } from '../../AccordeonCard';
+export const ViewAccordeonCard = ({ value, name, spec, children, }) => {
+    const [open, setOpen] = React.useState(_.isBoolean(spec.viewSpec.layoutOpen) ? spec.viewSpec.layoutOpen : true);
+    if (!isNotEmptyValue(value, spec)) {
+        return null;
+    }
+    return (React.createElement(AccordeonCard, { name: name, header: spec.viewSpec.layoutTitle || '', open: open, onToggle: setOpen }, children));
+};

package/build/esm/lib/kit/components/ViewLayouts/ViewAccordeonCard/index.d.ts

@@ -0,0 +1 @@
+export * from './ViewAccordeonCard';

package/build/esm/lib/kit/components/ViewLayouts/ViewAccordeonCard/index.js

@@ -0,0 +1 @@
+export * from './ViewAccordeonCard';

package/build/esm/lib/kit/components/ViewLayouts/index.d.ts

@@ -1,5 +1,6 @@
 export * from './ViewAccordeon';
 export * from './ViewCardAccordeon';
+export * from './ViewAccordeonCard';
 export * from './ViewCardSection';
 export * from './ViewRow';
 export * from './ViewSection';

package/build/esm/lib/kit/components/ViewLayouts/index.js

@@ -1,5 +1,6 @@
 export * from './ViewAccordeon';
 export * from './ViewCardAccordeon';
+export * from './ViewAccordeonCard';
 export * from './ViewCardSection';
 export * from './ViewRow';
 export * from './ViewSection';

package/build/esm/lib/kit/constants/config.js

@@ -1,4 +1,4 @@
-import { Accordeon, ArrayBase, ArrayBaseView, BaseView, CardAccordeon, CardOneOf, CardOneOfView, CardSection, Checkbox, FileInput, FileInputView, Group, Group2, MonacoInput, MonacoView, MultiOneOf, MultiOneOfFlat, MultiOneOfFlatView, MultiOneOfView, MultiSelect, MultiSelectView, NumberWithScale, NumberWithScaleView, ObjectBase, ObjectBaseView, ObjectInline, ObjectInlineView, ObjectValueInput, ObjectValueInputView, OneOf, OneOfFlat, OneOfFlatView, OneOfView, Row, RowVerbose, Secret, Section, Section2, Select, Switch, TableArrayInput, TableArrayView, TableCell, Text, TextArea, TextAreaView, TextContent, TextLink, TextLinkView, Transparent, ViewAccordeon, ViewCardAccordeon, ViewCardSection, ViewGroup, ViewGroup2, ViewRow, ViewSection, ViewSection2, ViewTableCell, ViewTransparent, } from '../components';
+import { Accordeon, AccordeonCardForm, ArrayBase, ArrayBaseView, BaseView, CardAccordeon, CardOneOf, CardOneOfView, CardSection, Checkbox, FileInput, FileInputView, Group, Group2, MonacoInput, MonacoView, MultiOneOf, MultiOneOfFlat, MultiOneOfFlatView, MultiOneOfView, MultiSelect, MultiSelectView, NumberWithScale, NumberWithScaleView, ObjectBase, ObjectBaseView, ObjectInline, ObjectInlineView, ObjectValueInput, ObjectValueInputView, OneOf, OneOfFlat, OneOfFlatView, OneOfView, Row, RowVerbose, Secret, Section, Section2, Select, Switch, TableArrayInput, TableArrayView, TableCell, Text, TextArea, TextAreaView, TextContent, TextLink, TextLinkView, Transparent, ViewAccordeon, ViewAccordeonCard, ViewCardAccordeon, ViewCardSection, ViewGroup, ViewGroup2, ViewRow, ViewSection, ViewSection2, ViewTableCell, ViewTransparent, } from '../components';
 import { getArrayValidator, getBooleanValidator, getNumberValidator, getObjectValidator, getStringValidator, } from '../validators';
 export const dynamicConfig = {
     array: {
@@ -19,6 +19,7 @@ export const dynamicConfig = {
             transparent: Transparent,
             card_accordeon: CardAccordeon,
             card_section: CardSection,
+            accordeon_card: AccordeonCardForm,
         },
         validators: {
             base: getArrayValidator(),
@@ -76,6 +77,7 @@ export const dynamicConfig = {
             transparent: Transparent,
             card_accordeon: CardAccordeon,
             card_section: CardSection,
+            accordeon_card: AccordeonCardForm,
         },
         validators: {
             base: getObjectValidator(),
@@ -128,6 +130,7 @@ export const dynamicViewConfig = {
             transparent: ViewTransparent,
             card_accordeon: ViewCardAccordeon,
             card_section: ViewCardSection,
+            accordeon_card: ViewAccordeonCard,
         },
     },
     boolean: {
@@ -176,6 +179,7 @@ export const dynamicViewConfig = {
             transparent: ViewTransparent,
             card_accordeon: ViewCardAccordeon,
             card_section: ViewCardSection,
+            accordeon_card: ViewAccordeonCard,
         },
     },
     string: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/dynamic-forms",
-  "version": "3.5.0",
+  "version": "3.6.0",
   "description": "",
   "license": "MIT",
   "main": "build/cjs/index.js",