@gravity-ui/dynamic-forms 3.7.0 → 4.0.1

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, InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> {
+export interface ArraySpec<LinkType = any, InputComponentProps extends Record<string, any> | undefined = undefined, LayoutComponentProps extends Record<string, any> | undefined = undefined> {
     defaultValue?: ArrayValue;
     type: SpecTypes.Array;
     required?: boolean;
@@ -37,7 +37,7 @@ export interface ArraySpec<LinkType = any, InputComponentProps extends Record<st
         layoutProps?: LayoutComponentProps;
     };
 }
-export interface BooleanSpec<LinkType = any, InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> {
+export interface BooleanSpec<LinkType = any, InputComponentProps extends Record<string, any> | undefined = undefined, LayoutComponentProps extends Record<string, any> | undefined = undefined> {
     defaultValue?: boolean;
     type: SpecTypes.Boolean;
     required?: boolean;
@@ -55,7 +55,7 @@ export interface BooleanSpec<LinkType = any, InputComponentProps extends Record<
         layoutProps?: LayoutComponentProps;
     };
 }
-export interface NumberSpec<LinkType = any, InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> {
+export interface NumberSpec<LinkType = any, InputComponentProps extends Record<string, any> | undefined = undefined, LayoutComponentProps extends Record<string, any> | undefined = undefined> {
     defaultValue?: number;
     type: SpecTypes.Number;
     required?: boolean;
@@ -78,7 +78,7 @@ export interface NumberSpec<LinkType = any, InputComponentProps extends Record<s
         layoutProps?: LayoutComponentProps;
     };
 }
-export interface ObjectSpec<LinkType = any, InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> {
+export interface ObjectSpec<LinkType = any, InputComponentProps extends Record<string, any> | undefined = undefined, LayoutComponentProps extends Record<string, any> | undefined = undefined> {
     defaultValue?: ObjectValue;
     type: SpecTypes.Object;
     required?: boolean;
@@ -103,7 +103,7 @@ export interface ObjectSpec<LinkType = any, InputComponentProps extends Record<s
         layoutProps?: LayoutComponentProps;
     };
 }
-export interface StringSpec<LinkType = any, InputComponentProps extends Record<string, any> = {}, LayoutComponentProps extends Record<string, any> = {}> {
+export interface StringSpec<LinkType = any, InputComponentProps extends Record<string, any> | undefined = undefined, LayoutComponentProps extends Record<string, any> | undefined = undefined> {
     defaultValue?: string;
     type: SpecTypes.String;
     required?: boolean;
@@ -158,4 +158,4 @@ export interface StringSpec<LinkType = any, InputComponentProps extends Record<s
         generateRandomValueButton?: boolean;
     };
 }
-export type Spec = ArraySpec | BooleanSpec | NumberSpec | ObjectSpec | StringSpec;
+export type Spec<LinkType = any, InputComponentProps extends Record<string, any> | undefined = undefined, LayoutComponentProps extends Record<string, any> | undefined = undefined> = ArraySpec<LinkType, InputComponentProps, LayoutComponentProps> | BooleanSpec<LinkType, InputComponentProps, LayoutComponentProps> | NumberSpec<LinkType, InputComponentProps, LayoutComponentProps> | ObjectSpec<LinkType, InputComponentProps, LayoutComponentProps> | StringSpec<LinkType, InputComponentProps, LayoutComponentProps>;

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ChevronDown } from '@gravity-ui/icons';
 import { Button, Icon, Text } from '@gravity-ui/uikit';
-import _ from 'lodash';
+import isString from 'lodash/isString';
 import { block } from '../../utils';
 import './AccordeonCard.css';
 const b = block('accordeon-card');
@@ -29,7 +29,7 @@ export const AccordeonCard = ({ className, name, header, description, open: prop
         }
     });
     const currentHeaderVariant = React.useMemo(() => {
-        if (!_.isString(header)) {
+        if (!isString(header)) {
             return 'body-1';
         }
         if (titleSize === 'm') {

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

@@ -48,15 +48,16 @@
   margin-left: 10px;
 }
 .df-card__title {
+  display: flex;
   max-width: 533px;
 }
 .df-card__note {
   margin-left: 5px;
 }
-.df-card__note .yc-help-popover {
+.df-card__note .gc-help-popover {
   display: flex;
 }
-.df-card__note .yc-help-popover > span {
+.df-card__note .gc-help-popover > span {
   display: flex;
 }
 .df-card__toggler-icon_open {

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

@@ -2,7 +2,7 @@ import React from 'react';
 import { HelpPopover } from '@gravity-ui/components';
 import { ChevronDown } from '@gravity-ui/icons';
 import { Button, Card as CardBase, Icon, Popover, Text } from '@gravity-ui/uikit';
-import _ from 'lodash';
+import isString from 'lodash/isString';
 import { COMMON_POPOVER_PLACEMENT, COMMON_TITLE_MAX_WIDTH } from '../../constants/common';
 import { block } from '../../utils';
 import './Card.css';
@@ -32,7 +32,7 @@ export const Card = ({ name, title: propsTitle, description, actions, open: prop
     const preventEvent = React.useCallback((e) => e.stopPropagation(), []);
     const titlePopoverDisabled = (((_a = titleRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 0) <= COMMON_TITLE_MAX_WIDTH;
     const title = React.useMemo(() => {
-        if (_.isString(propsTitle)) {
+        if (isString(propsTitle)) {
             return (React.createElement(React.Fragment, null,
                 React.createElement(Popover, { content: propsTitle, disabled: titlePopoverDisabled, placement: COMMON_POPOVER_PLACEMENT },
                     React.createElement(Text, { className: b('title'), ellipsis: true, ref: titleRef, variant: "subheader-2" }, propsTitle)),

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

@@ -10,7 +10,7 @@ const b = block('copy-button');
  */
 export const CopyButton = ({ spec, value }) => {
     if ((isStringSpec(spec) || isNumberSpec(spec)) && spec.viewSpec.copy) {
-        return React.createElement(ClipboardButton, { className: b(), text: `${value}`, size: 14 });
+        return React.createElement(ClipboardButton, { className: b(), text: `${value}`, size: "s" });
     }
     return null;
 };

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

@@ -16,7 +16,10 @@
 .df-error-wrapper_error .g-text-area__content:hover:not(.df-error-wrapper-ignore),
 .df-error-wrapper_error .yc-text-input_view_normal:not(.df-error-wrapper-ignore) .yc-text-input__control,
 .df-error-wrapper_error .yc-text-input_view_normal:not(.df-error-wrapper-ignore) .yc-text-input__content,
-.df-error-wrapper_error .yc-checkbox__indicator:not(.df-error-wrapper-ignore)::before {
+.df-error-wrapper_error .g-text-input_view_normal:not(.df-error-wrapper-ignore) .g-text-input__control,
+.df-error-wrapper_error .g-text-input_view_normal:not(.df-error-wrapper-ignore) .g-text-input__content,
+.df-error-wrapper_error .yc-checkbox__indicator:not(.df-error-wrapper-ignore)::before,
+.df-error-wrapper_error .g-checkbox__indicator:not(.df-error-wrapper-ignore)::before {
   border-color: var(--g-color-text-danger);
 }
 .df-error-wrapper__error-text {

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

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Button } from '@gravity-ui/uikit';
-import _ from 'lodash';
+import isFunction from 'lodash/isFunction';
 import { useGenerateRandomValue } from '../../../core/components/Form/hooks';
 import i18n from '../../i18n';
 import { block } from '../../utils';
@@ -8,7 +8,7 @@ import './GenerateRandomValueButton.css';
 const b = block('generate-random-value-button');
 export const GenerateRandomValueButton = ({ spec, onChange, }) => {
     const generateRandomValue = useGenerateRandomValue();
-    if (_.isFunction(generateRandomValue) && spec.viewSpec.generateRandomValueButton) {
+    if (isFunction(generateRandomValue) && spec.viewSpec.generateRandomValueButton) {
         return (React.createElement(Button, { onClick: () => onChange(generateRandomValue(spec)), className: b() }, i18n('button-generate')));
     }
     return null;

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Plus } from '@gravity-ui/icons';
 import { Button, Icon, Label } from '@gravity-ui/uikit';
-import _ from 'lodash';
+import set from 'lodash/set';
 import { Controller, OBJECT_ARRAY_CNT, OBJECT_ARRAY_FLAG, isBooleanSpec, isCorrectSpec, isNumberSpec, isStringSpec, transformArrIn, } from '../../../../core';
 import { block } from '../../../utils';
 import './ArrayBase.css';
@@ -25,7 +25,7 @@ export const ArrayBase = ({ spec, name, arrayInput, input }) => {
                 : `${idx + 1}` });
         return itemSpec;
     }, [spec.items, itemSpecCorrect]);
-    const parentOnChange = React.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => _.set(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
+    const parentOnChange = React.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => set(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
     const AddButton = React.useCallback(() => {
         let onClick = () => arrayInput.onItemAdd(undefined);
         let qa = `${name}-add-item`;

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import _ from 'lodash';
+import set from 'lodash/set';
 import { Card } from '../../';
 import { Controller, isArrayItem, } from '../../../../core';
 import { useErrorChecker, useOneOf } from '../../../hooks';
@@ -23,7 +23,7 @@ export const CardOneOf = (props) => {
         return;
     }, [name, input.onDrop]);
     const parentOnChange = React.useCallback((childName, childValue, childErrors) => {
-        const value = _.set({}, childName.split(`${input.name}.`).join(''), childValue);
+        const value = set({}, childName.split(`${input.name}.`).join(''), childValue);
         input.onChange(value, childErrors);
     }, [input.onChange, input.name]);
     useErrorChecker({ name, meta, open, setOpen });

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

@@ -1,9 +1,9 @@
-.df-monaco-input-dialog .yc-dialog-footer {
+.df-monaco-input-dialog .g-dialog-footer {
   padding: 10px 32px 32px;
 }
 .df-monaco-input-dialog__container {
   border: 1px solid var(--g-color-line-generic);
 }
-.df-monaco-input-dialog__dialog-header .yc-dialog-header__caption {
+.df-monaco-input-dialog__dialog-header .g-dialog-header__caption {
   min-height: 24px;
 }

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

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Select } from '@gravity-ui/uikit';
-import _ from 'lodash';
+import isObjectLike from 'lodash/isObjectLike';
+import set from 'lodash/set';
 import { Controller, } from '../../../../core';
 import { block } from '../../../utils';
 import { GroupIndent } from '../../GroupIndent';
@@ -19,9 +20,9 @@ export const MultiOneOf = (props) => {
         }
     }, [onFocus, onBlur]);
     const parentOnChange = React.useCallback((childName, childValue, childErrors) => {
-        onChange((currentValue) => _.set(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors);
+        onChange((currentValue) => set(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors);
     }, [name, onChange]);
-    const specProperties = React.useMemo(() => (_.isObjectLike(spec.properties) ? spec.properties : {}), [spec.properties]);
+    const specProperties = React.useMemo(() => (isObjectLike(spec.properties) ? spec.properties : {}), [spec.properties]);
     const options = React.useMemo(() => (spec.viewSpec.order || Object.keys(specProperties)).map((value) => {
         var _a, _b;
         const title = ((_a = spec.description) === null || _a === void 0 ? void 0 : _a[value]) ||

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

@@ -2,7 +2,8 @@ import { __rest } from "tslib";
 import React from 'react';
 import { Plus } from '@gravity-ui/icons';
 import { Button, Icon } from '@gravity-ui/uikit';
-import _ from 'lodash';
+import isObjectLike from 'lodash/isObjectLike';
+import set from 'lodash/set';
 import { Controller, transformArrIn, } from '../../../../core';
 import { block, filterPropertiesForObjectInline } from '../../../utils';
 import './ObjectBase.css';
@@ -15,10 +16,10 @@ export const ObjectBase = (_a) => {
             React.createElement(Icon, { data: Plus, size: 14 }),
             spec.viewSpec.layoutTitle || null));
     }, [spec.defaultValue, spec.viewSpec.layoutTitle, restProps.input.onChange]);
-    const parentOnChange = React.useCallback((childName, childValue, childErrors) => restProps.input.onChange((currentValue) => _.set(Object.assign({}, currentValue), childName.split(`${restProps.input.name}.`).join(''), childValue), childErrors), [restProps.input.onChange, restProps.input.name]);
+    const parentOnChange = React.useCallback((childName, childValue, childErrors) => restProps.input.onChange((currentValue) => set(Object.assign({}, currentValue), childName.split(`${restProps.input.name}.`).join(''), childValue), childErrors), [restProps.input.onChange, restProps.input.name]);
     const content = React.useMemo(() => {
         if (!spec.properties ||
-            !_.isObjectLike(spec.properties) ||
+            !isObjectLike(spec.properties) ||
             !Object.keys(spec.properties || {}).length) {
             return null;
         }

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

@@ -1,15 +1,16 @@
 import React from 'react';
-import _ from 'lodash';
+import cloneDeep from 'lodash/cloneDeep';
+import set from 'lodash/set';
 import { Controller } from '../../../../core';
 const OBJECT_VALUE_PROPERTY_NAME = 'value';
 export const ObjectValueInput = (props) => {
     var _a;
     const { spec, input, name, Layout } = props;
-    const parentOnChange = React.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => _.set(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
+    const parentOnChange = React.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => set(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
     const childSpec = React.useMemo(() => {
         var _a;
         if ((_a = spec.properties) === null || _a === void 0 ? void 0 : _a[OBJECT_VALUE_PROPERTY_NAME]) {
-            const childSpec = _.cloneDeep(spec.properties[OBJECT_VALUE_PROPERTY_NAME]);
+            const childSpec = cloneDeep(spec.properties[OBJECT_VALUE_PROPERTY_NAME]);
             childSpec.viewSpec.layout = 'transparent';
             return childSpec;
         }

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import _ from 'lodash';
+import set from 'lodash/set';
 import { GroupIndent } from '../../';
 import { Controller, } from '../../../../core';
 import { useOneOf } from '../../../hooks';
@@ -10,7 +10,7 @@ const OneOfComponent = (props) => {
     var _a;
     const { oneOfValue, specProperties, toggler } = useOneOf({ props });
     const parentOnChange = React.useCallback((childName, childValue, childErrors) => {
-        const value = _.set({}, childName.split(`${props.input.name}.`).join(''), childValue);
+        const value = set({}, childName.split(`${props.input.name}.`).join(''), childValue);
         props.input.onChange(value, childErrors);
     }, [props.input.onChange, props.input.name]);
     return (React.createElement("div", { className: b({

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

@@ -1,5 +1,6 @@
 import React from 'react';
-import _ from 'lodash';
+import cloneDeep from 'lodash/cloneDeep';
+import set from 'lodash/set';
 import { Controller } from '../../../../core';
 const SECRET_PROPERTY_NAME = 'raw';
 export const Secret = (props) => {
@@ -8,13 +9,13 @@ export const Secret = (props) => {
     const childSpec = React.useMemo(() => {
         var _a, _b;
         if ((_a = spec.properties) === null || _a === void 0 ? void 0 : _a[SECRET_PROPERTY_NAME]) {
-            const childSpec = _.cloneDeep((_b = spec.properties) === null || _b === void 0 ? void 0 : _b[SECRET_PROPERTY_NAME]);
+            const childSpec = cloneDeep((_b = spec.properties) === null || _b === void 0 ? void 0 : _b[SECRET_PROPERTY_NAME]);
             childSpec.viewSpec.layout = 'transparent';
             return childSpec;
         }
         return undefined;
     }, [spec.properties]);
-    const parentOnChange = React.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => _.set(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
+    const parentOnChange = React.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => set(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
     if (!childSpec) {
         return null;
     }

package/build/esm/lib/kit/components/Inputs/TableArrayInput/TableArrayInput.css

@@ -1,10 +1,10 @@
 .df-table-array__table {
   margin-bottom: 10px;
 }
-.df-table-array__table .yc-table__cell {
+.df-table-array__table .g-table__cell {
   border-bottom: 0px transparent;
 }
-.df-table-array__row .yc-table__cell {
+.df-table-array__row .g-table__cell {
   border-bottom: 0px transparent;
   border-top: 1px solid var(--g-color-line-generic);
 }
@@ -12,7 +12,9 @@
   display: none;
 }
 .df-table-array__cell .yc-text-input,
+.df-table-array__cell .g-text-input,
 .df-table-array__cell .yc-select-control,
+.df-table-array__cell .g-select-control,
 .df-table-array__cell .yc-select,
 .df-table-array__cell .g-select {
   max-width: 150px;
@@ -22,10 +24,14 @@
   padding-left: 3px;
 }
 .df-table-array__cell_arr .yc-text-input,
+.df-table-array__cell_arr .g-text-input,
 .df-table-array__cell_arr .yc-select-control:not(.df-multi-select),
+.df-table-array__cell_arr .g-select-control:not(.df-multi-select),
 .df-table-array__cell_arr .yc-select:not(.df-multi-select),
 .df-table-array__cell_arr .g-select:not(.df-multi-select), .df-table-array__cell_obj .yc-text-input,
+.df-table-array__cell_obj .g-text-input,
 .df-table-array__cell_obj .yc-select-control:not(.df-multi-select),
+.df-table-array__cell_obj .g-select-control:not(.df-multi-select),
 .df-table-array__cell_obj .yc-select:not(.df-multi-select),
 .df-table-array__cell_obj .g-select:not(.df-multi-select) {
   max-width: unset;

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

@@ -1,7 +1,8 @@
 import React from 'react';
 import { Plus, TrashBin } from '@gravity-ui/icons';
 import { Button, Icon, Table } from '@gravity-ui/uikit';
-import _ from 'lodash';
+import noop from 'lodash/noop';
+import set from 'lodash/set';
 import { Controller, OBJECT_ARRAY_CNT, OBJECT_ARRAY_FLAG, isArraySpec, isBooleanSpec, isObjectSpec, transformArrIn, } from '../../../../core';
 import { useSearchContext } from '../../../../core/components/Form/hooks';
 import { block } from '../../../utils';
@@ -22,7 +23,7 @@ export const TableArrayInput = ({ spec, name, arrayInput, input }) => {
     const onItemRemove = React.useCallback((key) => {
         arrayInput.onItemRemove(key);
     }, [arrayInput.onItemRemove]);
-    const parentOnChange = React.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => _.set(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
+    const parentOnChange = React.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => set(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
     const columns = React.useMemo(() => {
         const { items, viewSpec: { table }, } = spec;
         if (!(table === null || table === void 0 ? void 0 : table.length) || !isObjectSpec(items)) {
@@ -56,7 +57,7 @@ export const TableArrayInput = ({ spec, name, arrayInput, input }) => {
                         arr: isArraySpec(preparedEntitySpec),
                         obj: isObjectSpec(preparedEntitySpec),
                     }), key: `${name}.<${key}>.${property}` },
-                    React.createElement(Controller, { value: (_c = (_b = input.value) === null || _b === void 0 ? void 0 : _b[`<${key}>`]) === null || _c === void 0 ? void 0 : _c[property], spec: preparedEntitySpec, name: `${name}.<${key}>.${property}`, parentOnChange: parentOnChange, parentOnUnmount: _.noop })));
+                    React.createElement(Controller, { value: (_c = (_b = input.value) === null || _b === void 0 ? void 0 : _b[`<${key}>`]) === null || _c === void 0 ? void 0 : _c[property], spec: preparedEntitySpec, name: `${name}.<${key}>.${property}`, parentOnChange: parentOnChange, parentOnUnmount: noop })));
             },
         }));
         return [idxColumn, ...columns, removeColumn];

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

@@ -1,9 +1,9 @@
 import React from 'react';
 import { PasswordInput } from '@gravity-ui/components';
 import { TextInput } from '@gravity-ui/uikit';
-import _ from 'lodash';
+import isNil from 'lodash/isNil';
 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 });
+    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/TextContent/TextContent.css

@@ -1,8 +1,8 @@
-.df-text-content.yc-label {
+.df-text-content.g-label {
   height: auto;
   width: auto;
 }
-.df-text-content .yc-label__text {
+.df-text-content .g-label__text {
   text-align: initial;
   white-space: initial;
 }

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

@@ -1,7 +1,7 @@
 import { __rest } from "tslib";
 import React from 'react';
 import { Label, Text } from '@gravity-ui/uikit';
-import _ from 'lodash';
+import cloneDeep from 'lodash/cloneDeep';
 import { block } from '../../../utils';
 import { LazyLoader } from '../../LazyLoader';
 import { loadIcon } from './utils';
@@ -29,7 +29,7 @@ export const TextContent = (_a) => {
                 React.createElement(Text, { color: "secondary" }, input.value))) : null));
     }
     if (Layout) {
-        const _spec = _.cloneDeep(spec);
+        const _spec = cloneDeep(spec);
         if (!(textContentParams === null || textContentParams === void 0 ? void 0 : textContentParams.text)) {
             _spec.viewSpec.layoutDescription = undefined;
         }

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

@@ -1,16 +1,17 @@
 import React from 'react';
-import _ from 'lodash';
+import cloneDeep from 'lodash/cloneDeep';
+import set from 'lodash/set';
 import { Controller, isStringSpec, } from '../../../../core';
 const TEXT_LINK_PROPERTY_NAME = 'text';
 export const TextLink = (props) => {
     var _a;
     const { spec, input, name, Layout } = props;
-    const parentOnChange = React.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => _.set(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
+    const parentOnChange = React.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => set(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
     const childSpec = React.useMemo(() => {
         var _a;
         if (((_a = spec.properties) === null || _a === void 0 ? void 0 : _a[TEXT_LINK_PROPERTY_NAME]) &&
             isStringSpec(spec.properties[TEXT_LINK_PROPERTY_NAME])) {
-            const childSpec = _.cloneDeep(spec.properties[TEXT_LINK_PROPERTY_NAME]);
+            const childSpec = cloneDeep(spec.properties[TEXT_LINK_PROPERTY_NAME]);
             childSpec.viewSpec.layout = 'transparent';
             return childSpec;
         }

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<undefined, undefined> | ObjectLayoutProps<undefined, undefined>>({ name, spec, input, meta, children, }: T) => JSX.Element;

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

@@ -1,3 +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;
+export declare const AccordeonCardForm: <T extends ArrayLayoutProps<undefined, undefined> | ObjectLayoutProps<undefined, undefined>>({ name, spec, input, children, meta, }: T) => JSX.Element;

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

@@ -1,2 +1,2 @@
 import { FieldValue, LayoutProps, Spec } from '../../../core';
-export declare const CardAccordeon: <T extends FieldValue, S extends Spec>({ name, spec, input, meta, children, }: LayoutProps<T, S>) => JSX.Element;
+export declare const CardAccordeon: <T extends FieldValue, S extends Spec<any, undefined, undefined>>({ name, spec, input, meta, children, }: LayoutProps<T, undefined, undefined, S>) => JSX.Element;

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

@@ -1,2 +1,2 @@
 import { FieldValue, LayoutProps, Spec } from '../../../core';
-export declare const CardSection: <T extends FieldValue, S extends Spec>({ name, spec, input, meta, children, }: LayoutProps<T, S>) => JSX.Element;
+export declare const CardSection: <T extends FieldValue, S extends Spec<any, undefined, undefined>>({ name, spec, input, meta, children, }: LayoutProps<T, undefined, undefined, S>) => JSX.Element;

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

@@ -41,10 +41,10 @@
   position: absolute;
   margin-top: 1px;
 }
-.df-row__note-inner .yc-help-popover {
+.df-row__note-inner .g-help-popover {
   display: flex;
 }
-.df-row__note-inner .yc-help-popover > span {
+.df-row__note-inner .g-help-popover > span {
   display: flex;
 }
 .df-row__right {

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

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

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

@@ -28,5 +28,5 @@ const RowBase = ({ name, spec, input, meta, verboseDescription, children, }) =>
                     React.createElement(Icon, { data: TrashBin, size: 16 }))) : null),
             verboseDescription && spec.viewSpec.layoutDescription ? (React.createElement("div", { className: b('description'), dangerouslySetInnerHTML: { __html: spec.viewSpec.layoutDescription } })) : null)));
 };
-export const Row = (props) => (React.createElement(RowBase, Object.assign({}, props)));
-export const RowVerbose = (props) => (React.createElement(RowBase, Object.assign({ verboseDescription: true }, props)));
+export const Row = (props) => React.createElement(RowBase, Object.assign({}, props));
+export const RowVerbose = (props) => React.createElement(RowBase, Object.assign({ verboseDescription: true }, props));

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

@@ -28,10 +28,10 @@
 .df-section__note {
   margin-left: 5px;
 }
-.df-section__note .yc-help-popover {
+.df-section__note .g-help-popover {
   display: flex;
 }
-.df-section__note .yc-help-popover > span {
+.df-section__note .g-help-popover > span {
   display: flex;
 }
 .df-section__description {

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

@@ -6,10 +6,10 @@ interface SectionProps {
     ignoreDescription?: boolean;
     descriptionAsSubtitle?: boolean;
 }
-export declare const Section: <D extends FieldValue, T extends FormValue, S extends Spec>(props: (LayoutProps<D, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
-export declare const Section2: <D extends FieldValue, T extends FormValue, S extends Spec>(props: (LayoutProps<D, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
-export declare const SectionWithSubtitle: <D extends FieldValue, T extends FormValue, S extends Spec>(props: (LayoutProps<D, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
-export declare const SectionWithSubtitle2: <D extends FieldValue, T extends FormValue, S extends Spec>(props: (LayoutProps<D, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
-export declare const Group: <D extends FieldValue, T extends FormValue, S extends Spec>(props: (LayoutProps<D, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
-export declare const Group2: <D extends FieldValue, T extends FormValue, S extends Spec>(props: (LayoutProps<D, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
+export declare const Section: <D extends FieldValue, T extends FormValue, S extends Spec<any, undefined, undefined>>(props: (LayoutProps<D, undefined, undefined, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
+export declare const Section2: <D extends FieldValue, T extends FormValue, S extends Spec<any, undefined, undefined>>(props: (LayoutProps<D, undefined, undefined, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
+export declare const SectionWithSubtitle: <D extends FieldValue, T extends FormValue, S extends Spec<any, undefined, undefined>>(props: (LayoutProps<D, undefined, undefined, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
+export declare const SectionWithSubtitle2: <D extends FieldValue, T extends FormValue, S extends Spec<any, undefined, undefined>>(props: (LayoutProps<D, undefined, undefined, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
+export declare const Group: <D extends FieldValue, T extends FormValue, S extends Spec<any, undefined, undefined>>(props: (LayoutProps<D, undefined, undefined, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
+export declare const Group2: <D extends FieldValue, T extends FormValue, S extends Spec<any, undefined, undefined>>(props: (LayoutProps<D, undefined, undefined, S> | ViewLayoutProps<T, S>) & Pick<SectionProps, "ignoreDescription">) => JSX.Element;
 export {};

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

@@ -1,2 +1,2 @@
 import { FieldValue, LayoutProps, Spec } from '../../../../core';
-export declare const TableCell: <T extends FieldValue, S extends Spec>({ name, meta, children, }: LayoutProps<T, S>) => JSX.Element;
+export declare const TableCell: <T extends FieldValue, S extends Spec<any, undefined, undefined>>({ name, meta, children, }: LayoutProps<T, undefined, undefined, S>) => JSX.Element;

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

@@ -1,3 +1,3 @@
 import { FieldValue, LayoutProps, Spec } from '../../../../core';
 import './Transparent.css';
-export declare const Transparent: <T extends FieldValue, S extends Spec>({ name, spec, input, meta, children, }: LayoutProps<T, S>) => JSX.Element;
+export declare const Transparent: <T extends FieldValue, S extends Spec<any, undefined, undefined>>({ name, spec, input, meta, children, }: LayoutProps<T, undefined, undefined, S>) => JSX.Element;

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

@@ -1,11 +1,11 @@
 import React from 'react';
-import _ from 'lodash';
+import isUndefined from 'lodash/isUndefined';
 export const LazyLoader = ({ component, initialFallback = React.createElement(React.Fragment, null), }) => {
     const fallback = React.useRef(() => initialFallback);
     const Component = component;
     const updateFallback = async () => {
         const result = await component._result;
-        if (!_.isUndefined(result)) {
+        if (!isUndefined(result)) {
             fallback.current = result.default;
         }
     };

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

@@ -6,4 +6,7 @@
 }
 .df-long-value_long:hover {
   color: var(--g-color-text-secondary);
+}
+.df-long-value__container {
+  display: flex;
 }

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

@@ -39,6 +39,6 @@ export const LongValue = ({ value, className }) => {
             }
         }
     });
-    return (React.createElement("div", { ref: ref, onClick: long ? handleClick : undefined },
+    return (React.createElement("div", { className: b('container'), ref: ref, onClick: long ? handleClick : undefined },
         React.createElement(Text, Object.assign({ className: b({ long }, className), ellipsis: true }, currentTextProperies), value)));
 };

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

@@ -20,10 +20,10 @@
 .df-simple-vertical-accordeon__tooltip {
   margin: 0px 5px;
 }
-.df-simple-vertical-accordeon__tooltip .yc-help-popover {
+.df-simple-vertical-accordeon__tooltip .g-help-popover {
   display: flex;
 }
-.df-simple-vertical-accordeon__tooltip .yc-help-popover > span {
+.df-simple-vertical-accordeon__tooltip .g-help-popover > span {
   display: flex;
 }
 .df-simple-vertical-accordeon__chevron {

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

@@ -1,9 +1,9 @@
 import React from 'react';
-import _ from 'lodash';
+import isBoolean from 'lodash/isBoolean';
 import { isNotEmptyValue } from '../../../utils';
 import { SimpleVerticalAccordeon } from '../../SimpleVerticalAccordeon';
 export const ViewAccordeon = ({ name, value, spec, children, }) => {
-    const [open, setOpen] = React.useState(_.isBoolean(spec.viewSpec.layoutOpen) ? spec.viewSpec.layoutOpen : true);
+    const [open, setOpen] = React.useState(isBoolean(spec.viewSpec.layoutOpen) ? spec.viewSpec.layoutOpen : true);
     if (!isNotEmptyValue(value, spec)) {
         return null;
     }

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

@@ -1,9 +1,9 @@
 import React from 'react';
-import _ from 'lodash';
+import isBoolean from 'lodash/isBoolean';
 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);
+    const [open, setOpen] = React.useState(isBoolean(spec.viewSpec.layoutOpen) ? spec.viewSpec.layoutOpen : true);
     if (!isNotEmptyValue(value, spec)) {
         return null;
     }