@gravity-ui/dynamic-forms 4.14.3 → 4.15.0

package/build/cjs/lib/kit/components/Layouts/Column/Column.css

@@ -0,0 +1,62 @@
+.df-column {
+  margin-bottom: 15px;
+}
+.df-column:last-child {
+  margin-bottom: 0;
+}
+.df-column__first-row {
+  min-height: 28px;
+  display: flex;
+  margin-bottom: auto;
+  flex-direction: column;
+  flex-shrink: 0;
+}
+.df-column__first-row-inner {
+  display: inline;
+  margin-top: auto;
+  margin-bottom: auto;
+}
+.df-column__first-row::after {
+  content: "";
+  width: 100%;
+  flex-shrink: 1;
+}
+.df-column__title {
+  word-break: break-word;
+  margin-right: 3px;
+}
+.df-column__title_required::after {
+  content: "*";
+  color: var(--g-color-text-danger);
+}
+.df-column__note {
+  position: relative;
+}
+.df-column__note-inner {
+  position: absolute;
+  margin-top: 1px;
+}
+.df-column__note-inner .g-help-popover {
+  display: flex;
+}
+.df-column__note-inner .g-help-popover > span {
+  display: flex;
+}
+.df-column__second-row {
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+}
+.df-column__second-row-inner {
+  display: flex;
+  justify-content: space-around;
+}
+.df-column__remove-button {
+  margin-left: 5px;
+}
+.df-column__required-mark {
+  color: var(--g-color-text-danger);
+}
+.df-column__error-wrapper {
+  min-width: 100%;
+}

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

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Column = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const components_1 = require("@gravity-ui/components");
+const icons_1 = require("@gravity-ui/icons");
+const uikit_1 = require("@gravity-ui/uikit");
+const core_1 = require("../../../../core");
+const components_2 = require("../../../components");
+const utils_1 = require("../../../utils");
+const b = (0, utils_1.block)('column');
+const ColumnBase = ({ name, spec, input, meta, children, }) => {
+    const arrayItem = react_1.default.useMemo(() => (0, core_1.isArrayItem)(name), [name]);
+    const generateButton = react_1.default.useMemo(() => (0, core_1.withGenerateButton)(spec), [spec]);
+    return (react_1.default.createElement("div", { className: b() },
+        react_1.default.createElement("div", { className: b('first-row') },
+            react_1.default.createElement("div", { className: b('first-row-inner') },
+                react_1.default.createElement(uikit_1.Text, { className: b('title', { required: spec.required }) }, spec.viewSpec.layoutTitle),
+                spec.viewSpec.layoutDescription ? (react_1.default.createElement("span", { className: b('note') },
+                    react_1.default.createElement(uikit_1.Text, { className: b('note-inner') },
+                        react_1.default.createElement(components_1.HelpPopover, { htmlContent: spec.viewSpec.layoutDescription, placement: ['bottom', 'top'] })))) : null)),
+        react_1.default.createElement("div", { className: b('second-row') },
+            react_1.default.createElement("div", { className: b('second-row-inner') },
+                react_1.default.createElement(components_2.ErrorWrapper, { name: name, meta: meta, withoutChildErrorStyles: 
+                    // TODO: remove condition spec.viewSpec.type !== 'select'
+                    ((0, core_1.isArraySpec)(spec) && spec.viewSpec.type !== 'select') ||
+                        (0, core_1.isObjectSpec)(spec), className: b('error-wrapper') }, children),
+                generateButton ? (react_1.default.createElement(components_2.GenerateRandomValueButton, { spec: spec, onChange: input.onChange })) : null,
+                arrayItem ? (react_1.default.createElement(uikit_1.Button, { view: "flat-secondary", className: b('remove-button'), onClick: input.onDrop, qa: `${name}-remove-item` },
+                    react_1.default.createElement(uikit_1.Icon, { data: icons_1.TrashBin, size: 16 }))) : null))));
+};
+const Column = (props) => react_1.default.createElement(ColumnBase, Object.assign({}, props));
+exports.Column = Column;

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

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

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

@@ -6,6 +6,7 @@ tslib_1.__exportStar(require("./AccordeonCard"), exports);
 tslib_1.__exportStar(require("./CardAccordeon"), exports);
 tslib_1.__exportStar(require("./CardSection"), exports);
 tslib_1.__exportStar(require("./Row"), exports);
+tslib_1.__exportStar(require("./Column"), exports);
 tslib_1.__exportStar(require("./Section"), exports);
 tslib_1.__exportStar(require("./TableCell"), exports);
 tslib_1.__exportStar(require("./Transparent"), exports);

package/build/cjs/lib/kit/components/ViewLayouts/ViewColumn/ViewColumn.css

@@ -0,0 +1,22 @@
+.df-view-column {
+  margin-bottom: 20px;
+}
+.df-view-column:last-child {
+  margin-bottom: 0;
+}
+.df-view-column__first-row {
+  display: flex;
+  align-items: baseline;
+}
+.df-view-column__note {
+  margin-inline-start: var(--g-spacing-half);
+}
+.df-view-column__second-row > .df-view-transparent {
+  margin-bottom: 6px;
+}
+.df-view-column__second-row > .df-view-transparent:last-child {
+  margin-bottom: 0;
+}
+.df-view-column:hover > .df-copy-button {
+  display: block;
+}

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

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViewColumn = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const components_1 = require("@gravity-ui/components");
+const core_1 = require("../../../../core");
+const kit_1 = require("../../../../kit");
+const utils_1 = require("../../../utils");
+const b = (0, utils_1.block)('view-column');
+const ViewColumn = ({ value, spec, children, }) => {
+    const { showLayoutDescription } = (0, core_1.useDynamicFormsCtx)();
+    if (!(0, utils_1.isNotEmptyValue)(value, spec)) {
+        return null;
+    }
+    return (react_1.default.createElement("div", { className: b() },
+        react_1.default.createElement("div", { className: b('first-row') },
+            react_1.default.createElement(uikit_1.Text, { color: "secondary", ellipsis: true }, spec.viewSpec.layoutTitle),
+            showLayoutDescription && spec.viewSpec.layoutDescription ? (react_1.default.createElement(components_1.HelpPopover, { className: b('note'), htmlContent: spec.viewSpec.layoutDescription, placement: ['bottom', 'top'] })) : null),
+        react_1.default.createElement("div", { className: b('second-row') }, children),
+        react_1.default.createElement(kit_1.CopyButton, { spec: spec, value: value })));
+};
+exports.ViewColumn = ViewColumn;

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

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

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

@@ -6,6 +6,7 @@ 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("./ViewColumn"), exports);
 tslib_1.__exportStar(require("./ViewSection"), exports);
 tslib_1.__exportStar(require("./ViewTableCell"), exports);
 tslib_1.__exportStar(require("./ViewTransparent"), exports);

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

@@ -14,6 +14,7 @@ exports.dynamicConfig = {
         layouts: {
             row: components_1.Row,
             row_verbose: components_1.RowVerbose,
+            column: components_1.Column,
             accordeon: components_1.Accordeon,
             section: components_1.Section,
             section2: components_1.Section2,
@@ -37,6 +38,7 @@ exports.dynamicConfig = {
         layouts: {
             row: components_1.Row,
             row_verbose: components_1.RowVerbose,
+            column: components_1.Column,
             table_item: components_1.TableCell,
             transparent: components_1.Transparent,
         },
@@ -51,6 +53,7 @@ exports.dynamicConfig = {
         layouts: {
             row: components_1.Row,
             row_verbose: components_1.RowVerbose,
+            column: components_1.Column,
             table_item: components_1.TableCell,
             transparent: components_1.Transparent,
         },
@@ -75,6 +78,7 @@ exports.dynamicConfig = {
         layouts: {
             row: components_1.Row,
             row_verbose: components_1.RowVerbose,
+            column: components_1.Column,
             accordeon: components_1.Accordeon,
             section: components_1.Section,
             section2: components_1.Section2,
@@ -104,6 +108,7 @@ exports.dynamicConfig = {
         layouts: {
             row: components_1.Row,
             row_verbose: components_1.RowVerbose,
+            column: components_1.Column,
             table_item: components_1.TableCell,
             transparent: components_1.Transparent,
             section: components_1.Section,
@@ -129,6 +134,7 @@ exports.dynamicViewConfig = {
         layouts: {
             row: components_1.ViewRow,
             row_verbose: components_1.ViewRow,
+            column: components_1.ViewColumn,
             accordeon: components_1.ViewAccordeon,
             section: components_1.ViewSection,
             section2: components_1.ViewSection2,
@@ -149,6 +155,7 @@ exports.dynamicViewConfig = {
         layouts: {
             row: components_1.ViewRow,
             row_verbose: components_1.ViewRow,
+            column: components_1.ViewColumn,
             table_item: components_1.ViewTableCell,
             transparent: components_1.ViewTransparent,
         },
@@ -160,6 +167,7 @@ exports.dynamicViewConfig = {
         layouts: {
             row: components_1.ViewRow,
             row_verbose: components_1.ViewRow,
+            column: components_1.ViewColumn,
             table_item: components_1.ViewTableCell,
             transparent: components_1.ViewTransparent,
         },
@@ -181,6 +189,7 @@ exports.dynamicViewConfig = {
         layouts: {
             row: components_1.ViewRow,
             row_verbose: components_1.ViewRow,
+            column: components_1.ViewColumn,
             accordeon: components_1.ViewAccordeon,
             section: components_1.ViewSection,
             section2: components_1.ViewSection2,
@@ -207,6 +216,7 @@ exports.dynamicViewConfig = {
         layouts: {
             row: components_1.ViewRow,
             row_verbose: components_1.ViewRow,
+            column: components_1.ViewColumn,
             table_item: components_1.ViewTableCell,
             transparent: components_1.ViewTransparent,
             section: components_1.ViewSection,

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

@@ -28,5 +28,6 @@ export interface FieldRenderProps<Value extends FieldValue> {
         valid: boolean;
         visited: boolean;
         submitFailed: boolean;
+        childErrors: Record<string, ValidateError>;
     };
 }

package/build/esm/lib/kit/components/Layouts/Column/Column.css

@@ -0,0 +1,62 @@
+.df-column {
+  margin-bottom: 15px;
+}
+.df-column:last-child {
+  margin-bottom: 0;
+}
+.df-column__first-row {
+  min-height: 28px;
+  display: flex;
+  margin-bottom: auto;
+  flex-direction: column;
+  flex-shrink: 0;
+}
+.df-column__first-row-inner {
+  display: inline;
+  margin-top: auto;
+  margin-bottom: auto;
+}
+.df-column__first-row::after {
+  content: "";
+  width: 100%;
+  flex-shrink: 1;
+}
+.df-column__title {
+  word-break: break-word;
+  margin-right: 3px;
+}
+.df-column__title_required::after {
+  content: "*";
+  color: var(--g-color-text-danger);
+}
+.df-column__note {
+  position: relative;
+}
+.df-column__note-inner {
+  position: absolute;
+  margin-top: 1px;
+}
+.df-column__note-inner .g-help-popover {
+  display: flex;
+}
+.df-column__note-inner .g-help-popover > span {
+  display: flex;
+}
+.df-column__second-row {
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+}
+.df-column__second-row-inner {
+  display: flex;
+  justify-content: space-around;
+}
+.df-column__remove-button {
+  margin-left: 5px;
+}
+.df-column__required-mark {
+  color: var(--g-color-text-danger);
+}
+.df-column__error-wrapper {
+  min-width: 100%;
+}

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

@@ -0,0 +1,3 @@
+import { FieldValue, LayoutProps, Spec } from '../../../../core';
+import './Column.css';
+export declare const Column: <T extends FieldValue, S extends Spec<any, undefined, undefined>>(props: LayoutProps<T, undefined, undefined, S>) => JSX.Element;

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

@@ -0,0 +1,30 @@
+import React from 'react';
+import { HelpPopover } from '@gravity-ui/components';
+import { TrashBin } from '@gravity-ui/icons';
+import { Button, Icon, Text } from '@gravity-ui/uikit';
+import { isArrayItem, isArraySpec, isObjectSpec, withGenerateButton, } from '../../../../core';
+import { ErrorWrapper, GenerateRandomValueButton } from '../../../components';
+import { block } from '../../../utils';
+import './Column.css';
+const b = block('column');
+const ColumnBase = ({ name, spec, input, meta, children, }) => {
+    const arrayItem = React.useMemo(() => isArrayItem(name), [name]);
+    const generateButton = React.useMemo(() => withGenerateButton(spec), [spec]);
+    return (React.createElement("div", { className: b() },
+        React.createElement("div", { className: b('first-row') },
+            React.createElement("div", { className: b('first-row-inner') },
+                React.createElement(Text, { className: b('title', { required: spec.required }) }, spec.viewSpec.layoutTitle),
+                spec.viewSpec.layoutDescription ? (React.createElement("span", { className: b('note') },
+                    React.createElement(Text, { className: b('note-inner') },
+                        React.createElement(HelpPopover, { htmlContent: spec.viewSpec.layoutDescription, placement: ['bottom', 'top'] })))) : null)),
+        React.createElement("div", { className: b('second-row') },
+            React.createElement("div", { className: b('second-row-inner') },
+                React.createElement(ErrorWrapper, { name: name, meta: meta, withoutChildErrorStyles: 
+                    // TODO: remove condition spec.viewSpec.type !== 'select'
+                    (isArraySpec(spec) && spec.viewSpec.type !== 'select') ||
+                        isObjectSpec(spec), className: b('error-wrapper') }, children),
+                generateButton ? (React.createElement(GenerateRandomValueButton, { spec: spec, onChange: input.onChange })) : null,
+                arrayItem ? (React.createElement(Button, { view: "flat-secondary", className: b('remove-button'), onClick: input.onDrop, qa: `${name}-remove-item` },
+                    React.createElement(Icon, { data: TrashBin, size: 16 }))) : null))));
+};
+export const Column = (props) => React.createElement(ColumnBase, Object.assign({}, props));

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

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

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

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

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

@@ -3,6 +3,7 @@ export * from './AccordeonCard';
 export * from './CardAccordeon';
 export * from './CardSection';
 export * from './Row';
+export * from './Column';
 export * from './Section';
 export * from './TableCell';
 export * from './Transparent';

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

@@ -3,6 +3,7 @@ export * from './AccordeonCard';
 export * from './CardAccordeon';
 export * from './CardSection';
 export * from './Row';
+export * from './Column';
 export * from './Section';
 export * from './TableCell';
 export * from './Transparent';

package/build/esm/lib/kit/components/ViewLayouts/ViewColumn/ViewColumn.css

@@ -0,0 +1,22 @@
+.df-view-column {
+  margin-bottom: 20px;
+}
+.df-view-column:last-child {
+  margin-bottom: 0;
+}
+.df-view-column__first-row {
+  display: flex;
+  align-items: baseline;
+}
+.df-view-column__note {
+  margin-inline-start: var(--g-spacing-half);
+}
+.df-view-column__second-row > .df-view-transparent {
+  margin-bottom: 6px;
+}
+.df-view-column__second-row > .df-view-transparent:last-child {
+  margin-bottom: 0;
+}
+.df-view-column:hover > .df-copy-button {
+  display: block;
+}

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

@@ -0,0 +1,3 @@
+import { FormValue, Spec, ViewLayoutProps } from '../../../../core';
+import './ViewColumn.css';
+export declare const ViewColumn: <T extends FormValue, S extends Spec<any, undefined, undefined>>({ value, spec, children, }: ViewLayoutProps<T, S>) => JSX.Element | null;

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

@@ -0,0 +1,20 @@
+import React from 'react';
+import { Text } from '@gravity-ui/uikit';
+import { HelpPopover } from '@gravity-ui/components';
+import { useDynamicFormsCtx } from '../../../../core';
+import { CopyButton } from '../../../../kit';
+import { block, isNotEmptyValue } from '../../../utils';
+import './ViewColumn.css';
+const b = block('view-column');
+export const ViewColumn = ({ value, spec, children, }) => {
+    const { showLayoutDescription } = useDynamicFormsCtx();
+    if (!isNotEmptyValue(value, spec)) {
+        return null;
+    }
+    return (React.createElement("div", { className: b() },
+        React.createElement("div", { className: b('first-row') },
+            React.createElement(Text, { color: "secondary", ellipsis: true }, spec.viewSpec.layoutTitle),
+            showLayoutDescription && spec.viewSpec.layoutDescription ? (React.createElement(HelpPopover, { className: b('note'), htmlContent: spec.viewSpec.layoutDescription, placement: ['bottom', 'top'] })) : null),
+        React.createElement("div", { className: b('second-row') }, children),
+        React.createElement(CopyButton, { spec: spec, value: value })));
+};

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

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

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

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

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

@@ -3,6 +3,7 @@ export * from './ViewCardAccordeon';
 export * from './ViewAccordeonCard';
 export * from './ViewCardSection';
 export * from './ViewRow';
+export * from './ViewColumn';
 export * from './ViewSection';
 export * from './ViewTableCell';
 export * from './ViewTransparent';

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

@@ -3,6 +3,7 @@ export * from './ViewCardAccordeon';
 export * from './ViewAccordeonCard';
 export * from './ViewCardSection';
 export * from './ViewRow';
+export * from './ViewColumn';
 export * from './ViewSection';
 export * from './ViewTableCell';
 export * from './ViewTransparent';

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

@@ -1,4 +1,4 @@
-import { Accordeon, AccordeonCardForm, ArrayBase, ArrayBaseView, BaseView, CardAccordeon, CardOneOf, CardOneOfView, CardSection, Checkbox, CheckboxGroup, CheckboxGroupView, DateInput, DateView, 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, TextContentView, TextLink, TextLinkView, TimeRangeSelector, TimeRangeSelectorView, Transparent, ViewAccordeon, ViewAccordeonCard, ViewCardAccordeon, ViewCardSection, ViewGroup, ViewGroup2, ViewRow, ViewSection, ViewSection2, ViewTableCell, ViewTransparent, } from '../components';
+import { Accordeon, AccordeonCardForm, ArrayBase, ArrayBaseView, BaseView, CardAccordeon, CardOneOf, CardOneOfView, CardSection, Checkbox, CheckboxGroup, CheckboxGroupView, Column, DateInput, DateView, 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, TextContentView, TextLink, TextLinkView, TimeRangeSelector, TimeRangeSelectorView, Transparent, ViewAccordeon, ViewAccordeonCard, ViewCardAccordeon, ViewCardSection, ViewColumn, ViewGroup, ViewGroup2, ViewRow, ViewSection, ViewSection2, ViewTableCell, ViewTransparent, } from '../components';
 import { getArrayValidator, getBooleanValidator, getNumberValidator, getObjectValidator, getStringValidator, } from '../validators';
 export const dynamicConfig = {
     array: {
@@ -11,6 +11,7 @@ export const dynamicConfig = {
         layouts: {
             row: Row,
             row_verbose: RowVerbose,
+            column: Column,
             accordeon: Accordeon,
             section: Section,
             section2: Section2,
@@ -34,6 +35,7 @@ export const dynamicConfig = {
         layouts: {
             row: Row,
             row_verbose: RowVerbose,
+            column: Column,
             table_item: TableCell,
             transparent: Transparent,
         },
@@ -48,6 +50,7 @@ export const dynamicConfig = {
         layouts: {
             row: Row,
             row_verbose: RowVerbose,
+            column: Column,
             table_item: TableCell,
             transparent: Transparent,
         },
@@ -72,6 +75,7 @@ export const dynamicConfig = {
         layouts: {
             row: Row,
             row_verbose: RowVerbose,
+            column: Column,
             accordeon: Accordeon,
             section: Section,
             section2: Section2,
@@ -101,6 +105,7 @@ export const dynamicConfig = {
         layouts: {
             row: Row,
             row_verbose: RowVerbose,
+            column: Column,
             table_item: TableCell,
             transparent: Transparent,
             section: Section,
@@ -126,6 +131,7 @@ export const dynamicViewConfig = {
         layouts: {
             row: ViewRow,
             row_verbose: ViewRow,
+            column: ViewColumn,
             accordeon: ViewAccordeon,
             section: ViewSection,
             section2: ViewSection2,
@@ -146,6 +152,7 @@ export const dynamicViewConfig = {
         layouts: {
             row: ViewRow,
             row_verbose: ViewRow,
+            column: ViewColumn,
             table_item: ViewTableCell,
             transparent: ViewTransparent,
         },
@@ -157,6 +164,7 @@ export const dynamicViewConfig = {
         layouts: {
             row: ViewRow,
             row_verbose: ViewRow,
+            column: ViewColumn,
             table_item: ViewTableCell,
             transparent: ViewTransparent,
         },
@@ -178,6 +186,7 @@ export const dynamicViewConfig = {
         layouts: {
             row: ViewRow,
             row_verbose: ViewRow,
+            column: ViewColumn,
             accordeon: ViewAccordeon,
             section: ViewSection,
             section2: ViewSection2,
@@ -204,6 +213,7 @@ export const dynamicViewConfig = {
         layouts: {
             row: ViewRow,
             row_verbose: ViewRow,
+            column: ViewColumn,
             table_item: ViewTableCell,
             transparent: ViewTransparent,
             section: ViewSection,

package/package.json

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