@gravity-ui/dynamic-forms 3.4.1 → 3.6.0

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

@@ -14,12 +14,6 @@
   align-items: baseline;
   overflow: hidden;
 }
-.df-view-row__title {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  color: var(--g-color-text-secondary);
-}
 .df-view-row__dots {
   min-width: 40px;
   flex-grow: 1;

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

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ViewRow = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
 const kit_1 = require("../../../../kit");
 const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('view-row');
@@ -12,7 +13,7 @@ const ViewRow = ({ value, spec, children, }) => {
     }
     return (react_1.default.createElement("div", { className: b() },
         react_1.default.createElement("div", { className: b('left') },
-            react_1.default.createElement("div", { className: b('title'), title: spec.viewSpec.layoutTitle }, spec.viewSpec.layoutTitle),
+            react_1.default.createElement(uikit_1.Text, { whiteSpace: "nowrap", color: "secondary", ellipsis: true }, spec.viewSpec.layoutTitle),
             react_1.default.createElement("div", { className: b('dots') })),
         react_1.default.createElement("div", { className: b('right') }, children),
         react_1.default.createElement(kit_1.CopyButton, { spec: spec, value: value })));

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/components/Views/NumberWithScaleView/NumberWithScaleView.js

@@ -12,9 +12,7 @@ const NumberWithScaleViewBase = ({ spec, value }) => {
     const { scale } = spec.viewSpec.sizeParams;
     return (react_1.default.createElement("div", { className: b() },
         react_1.default.createElement(uikit_1.Popover, { placement: ['bottom', 'top'], content: initialValue, className: b('tooltip-container'), contentClassName: b('tooltip'), disabled: initialValue.length < 26 }, initialValue),
-        react_1.default.createElement("span", { className: b('size') },
-            " ",
-            scale[initialType].title)));
+        react_1.default.createElement(uikit_1.Text, { className: b('size') }, scale[initialType].title)));
 };
 const NumberWithScaleView = (props) => (0, utils_1.isCorrectSizeParams)(props.spec) && props.value ? react_1.default.createElement(NumberWithScaleViewBase, Object.assign({}, props)) : null;
 exports.NumberWithScaleView = NumberWithScaleView;

package/build/cjs/lib/kit/components/Views/TextAreaView/TextAreaView.css

@@ -4,14 +4,6 @@
 .df-text-area-view_active {
   cursor: pointer;
 }
-.df-text-area-view__text-view {
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.df-text-area-view__text-view_open {
-  white-space: pre-wrap;
-  overflow-wrap: break-word;
-}
 .df-text-area-view__chevron {
   margin: 3px;
 }

package/build/cjs/lib/kit/components/Views/TextAreaView/TextAreaView.js

@@ -14,7 +14,7 @@ const TextAreaView = ({ value = '' }) => {
         setIsOpen(!isOpen);
     }, [isOpen]);
     return (react_1.default.createElement("div", { className: b({ active: isValueLong }), onClick: isValueLong ? handleClick : undefined },
-        react_1.default.createElement("div", { className: b('text-view', { open: isOpen }) }, value),
+        react_1.default.createElement(uikit_1.Text, { ellipsis: true, whiteSpace: isOpen ? 'break-spaces' : undefined }, value),
         isValueLong ? (react_1.default.createElement("div", null,
             react_1.default.createElement(uikit_1.Icon, { data: icons_1.ChevronDown, className: b('chevron', { open: isOpen }), size: 16 }))) : null));
 };

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;
             }
@@ -275,11 +276,9 @@ export const updateStore = ({ store, setStore, spec: _spec, name, parentOnChange
             parentOnChange,
             parentOnUnmount,
         })), { state: store.state });
-        if (updateState) {
-            nextStore = methodOnChange(nextStore, Object.assign({ valOrSetter: (value) => valueMutatorUpdated ? valueMutator.value : value }, (errorMutatorUpdated
-                ? { errorMutator: errorMutator.value }
-                : {})));
-        }
+        nextStore = methodOnChange(nextStore, Object.assign({ valOrSetter: (value) => valueMutatorUpdated ? valueMutator.value : value }, (errorMutatorUpdated
+            ? { errorMutator: errorMutator.value }
+            : {})));
         setStore(nextStore);
     }
     else if (updateNonCritical) {

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);
 }
@@ -47,15 +59,6 @@
   justify-content: center;
   order: -1;
 }
-.df-accordeon-card__header-content-title {
-  font-weight: 700;
-}
-.df-accordeon-card__header-content-title_size_s {
-  font-size: 13px;
-}
-.df-accordeon-card__header-content-title_size_m {
-  font-size: 16px;
-}
 .df-accordeon-card__header-content-description {
   margin-top: 12px;
   color: var(--g-color-text-complementary);
@@ -73,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

@@ -1,11 +1,11 @@
 import React from 'react';
 import { ChevronDown } from '@gravity-ui/icons';
-import { Button, Icon } from '@gravity-ui/uikit';
+import { Button, Icon, Text } from '@gravity-ui/uikit';
 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);
@@ -28,19 +28,26 @@ export const AccordeonCard = ({ className, name, header, description, open: prop
             accordeonRef.current.classList.add('df-accordeon-card_empty');
         }
     });
+    const currentHeaderVariant = React.useMemo(() => {
+        if (!_.isString(header)) {
+            return 'body-1';
+        }
+        if (titleSize === 'm') {
+            return 'subheader-2';
+        }
+        return 'subheader-1';
+    }, [titleSize]);
     return (React.createElement("div", { ref: accordeonRef, className: b({ empty: Boolean(emptyBody) }, className) },
         React.createElement("div", { className: b('header', {
                 open: open && !emptyBody,
                 'without-action': ignoreHeaderToggle || alwaysOpen,
             }), onClick: !ignoreHeaderToggle && !alwaysOpen ? handleToggle : undefined },
             React.createElement("div", { className: b('header-content') },
-                React.createElement("span", { className: _.isString(header)
-                        ? b('header-content-title', { size: titleSize })
-                        : undefined }, header),
+                React.createElement(Text, { variant: currentHeaderVariant }, header),
                 description ? (React.createElement("span", { className: b('header-content-description'), dangerouslySetInnerHTML: { __html: description } })) : null),
             !emptyBody && !alwaysOpen ? (React.createElement("div", { className: b('header-toggle-btn'), onClick: preventEvent },
                 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/Card/Card.css

@@ -48,12 +48,6 @@
   margin-left: 10px;
 }
 .df-card__title {
-  font-size: var(--g-text-subheader-2-font-size);
-  font-weight: var(--g-text-subheader-font-weight);
-  line-height: var(--g-text-subheader-2-line-height);
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
   max-width: 533px;
 }
 .df-card__note {

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { HelpPopover } from '@gravity-ui/components';
 import { ChevronDown } from '@gravity-ui/icons';
-import { Button, Card as CardBase, Icon, Popover } from '@gravity-ui/uikit';
+import { Button, Card as CardBase, Icon, Popover, Text } from '@gravity-ui/uikit';
 import _ from 'lodash';
 import { COMMON_POPOVER_PLACEMENT, COMMON_TITLE_MAX_WIDTH } from '../../constants/common';
 import { block } from '../../utils';
@@ -35,7 +35,7 @@ export const Card = ({ name, title: propsTitle, description, actions, open: prop
         if (_.isString(propsTitle)) {
             return (React.createElement(React.Fragment, null,
                 React.createElement(Popover, { content: propsTitle, disabled: titlePopoverDisabled, placement: COMMON_POPOVER_PLACEMENT },
-                    React.createElement("div", { ref: titleRef, className: b('title') }, propsTitle)),
+                    React.createElement(Text, { className: b('title'), ellipsis: true, ref: titleRef, variant: "subheader-2" }, propsTitle)),
                 description ? (React.createElement("div", { className: b('note') },
                     React.createElement(HelpPopover, { htmlContent: description, placement: COMMON_POPOVER_PLACEMENT }))) : null));
         }

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/FileInput/FileInput.css

@@ -8,8 +8,4 @@
   display: block;
   margin: auto 10px;
   max-width: 160px;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
-  color: var(--g-color-text-secondary);
 }

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

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Xmark } from '@gravity-ui/icons';
-import { Button, Icon, Label } from '@gravity-ui/uikit';
+import { Button, Icon, Label, Text } from '@gravity-ui/uikit';
 import i18n from '../../../../kit/i18n';
 import { block } from '../../../utils';
 import { readFile } from './utils';
@@ -40,7 +40,7 @@ export const FileInput = ({ name, input, spec }) => {
     return (React.createElement("div", { className: b() },
         React.createElement(Button, { disabled: spec.viewSpec.disabled, onClick: handleClick, qa: `${name}-file-upload` }, i18n('button-upload_file')),
         React.createElement("input", { type: "file", ref: inputRef, autoComplete: "off", disabled: spec.viewSpec.disabled, onChange: handleInputChange, className: b('input'), tabIndex: -1, accept: (_b = spec.viewSpec.fileInput) === null || _b === void 0 ? void 0 : _b.accept }),
-        React.createElement("span", { className: b('file-name') }, fileNameContent),
+        React.createElement(Text, { className: b('file-name'), ellipsis: true, color: "secondary" }, fileNameContent),
         value ? (React.createElement(Button, { view: "flat", onClick: handleReset, disabled: spec.viewSpec.disabled, qa: `${name}-file-remove` },
             React.createElement(Icon, { data: Xmark, size: 16 }))) : null));
 };

package/build/esm/lib/kit/components/Inputs/MonacoInput/MonacoHeader.css

@@ -5,9 +5,4 @@
   padding: 15px;
   align-items: center;
   background-color: var(--g-color-base-float-hover);
-}
-.df-monaco-header__language {
-  margin-top: 2px;
-  margin-left: 10px;
-  font-size: 16px;
 }

package/build/esm/lib/kit/components/Inputs/MonacoInput/MonacoHeader.js

@@ -1,10 +1,10 @@
 import React from 'react';
 import { File } from '@gravity-ui/icons';
-import { Icon } from '@gravity-ui/uikit';
+import { Icon, Text } from '@gravity-ui/uikit';
 import { block } from '../../../utils';
 import './MonacoHeader.css';
 const b = block('monaco-header');
 export const MonacoHeader = ({ language, editButton }) => (React.createElement("div", { className: b() },
     React.createElement("div", null,
         React.createElement(Icon, { data: File, size: 18 }),
-        React.createElement("span", { className: b('language') }, language)), editButton !== null && editButton !== void 0 ? editButton : null));
+        React.createElement(Text, { variant: "body-3" }, language)), editButton !== null && editButton !== void 0 ? editButton : null));

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>;