@gravity-ui/dynamic-forms 4.0.0 → 4.1.0

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

@@ -6,7 +6,7 @@ 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 lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isString_1 = tslib_1.__importDefault(require("lodash/isString"));
 const common_1 = require("../../constants/common");
 const utils_1 = require("../../utils");
 const b = (0, utils_1.block)('card');
@@ -35,7 +35,7 @@ const Card = ({ name, title: propsTitle, description, actions, open: propsOpen,
     const preventEvent = react_1.default.useCallback((e) => e.stopPropagation(), []);
     const titlePopoverDisabled = (((_a = titleRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 0) <= common_1.COMMON_TITLE_MAX_WIDTH;
     const title = react_1.default.useMemo(() => {
-        if (lodash_1.default.isString(propsTitle)) {
+        if ((0, isString_1.default)(propsTitle)) {
             return (react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(uikit_1.Popover, { content: propsTitle, disabled: titlePopoverDisabled, placement: common_1.COMMON_POPOVER_PLACEMENT },
                     react_1.default.createElement(uikit_1.Text, { className: b('title'), ellipsis: true, ref: titleRef, variant: "subheader-2" }, propsTitle)),

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

@@ -4,14 +4,14 @@ exports.GenerateRandomValueButton = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isFunction_1 = tslib_1.__importDefault(require("lodash/isFunction"));
 const hooks_1 = require("../../../core/components/Form/hooks");
 const i18n_1 = tslib_1.__importDefault(require("../../i18n"));
 const utils_1 = require("../../utils");
 const b = (0, utils_1.block)('generate-random-value-button');
 const GenerateRandomValueButton = ({ spec, onChange, }) => {
     const generateRandomValue = (0, hooks_1.useGenerateRandomValue)();
-    if (lodash_1.default.isFunction(generateRandomValue) && spec.viewSpec.generateRandomValueButton) {
+    if ((0, isFunction_1.default)(generateRandomValue) && spec.viewSpec.generateRandomValueButton) {
         return (react_1.default.createElement(uikit_1.Button, { onClick: () => onChange(generateRandomValue(spec)), className: b() }, (0, i18n_1.default)('button-generate')));
     }
     return null;

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

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const set_1 = tslib_1.__importDefault(require("lodash/set"));
 const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('array-base');
@@ -28,7 +28,7 @@ const ArrayBase = ({ spec, name, arrayInput, input }) => {
                 : `${idx + 1}` });
         return itemSpec;
     }, [spec.items, itemSpecCorrect]);
-    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => lodash_1.default.set(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
+    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => (0, set_1.default)(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
     const AddButton = react_1.default.useCallback(() => {
         let onClick = () => arrayInput.onItemAdd(undefined);
         let qa = `${name}-add-item`;

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

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.CardOneOf = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const set_1 = tslib_1.__importDefault(require("lodash/set"));
 const __1 = require("../../");
 const core_1 = require("../../../../core");
 const hooks_1 = require("../../../hooks");
@@ -27,7 +27,7 @@ const CardOneOf = (props) => {
         return;
     }, [name, input.onDrop]);
     const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => {
-        const value = lodash_1.default.set({}, childName.split(`${input.name}.`).join(''), childValue);
+        const value = (0, set_1.default)({}, childName.split(`${input.name}.`).join(''), childValue);
         input.onChange(value, childErrors);
     }, [input.onChange, input.name]);
     (0, hooks_1.useErrorChecker)({ name, meta, open, setOpen });

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

@@ -4,7 +4,8 @@ exports.MultiOneOfFlat = exports.MultiOneOf = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isObjectLike_1 = tslib_1.__importDefault(require("lodash/isObjectLike"));
+const set_1 = tslib_1.__importDefault(require("lodash/set"));
 const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
 const GroupIndent_1 = require("../../GroupIndent");
@@ -22,9 +23,9 @@ const MultiOneOf = (props) => {
         }
     }, [onFocus, onBlur]);
     const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => {
-        onChange((currentValue) => lodash_1.default.set(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors);
+        onChange((currentValue) => (0, set_1.default)(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors);
     }, [name, onChange]);
-    const specProperties = react_1.default.useMemo(() => (lodash_1.default.isObjectLike(spec.properties) ? spec.properties : {}), [spec.properties]);
+    const specProperties = react_1.default.useMemo(() => ((0, isObjectLike_1.default)(spec.properties) ? spec.properties : {}), [spec.properties]);
     const options = react_1.default.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/cjs/lib/kit/components/Inputs/ObjectBase/ObjectBase.css

@@ -8,4 +8,10 @@
 }
 .df-object-base__content_inline > .df-use-search:last-child {
   margin-right: 0;
+}
+.df-object-base__delimiter {
+  display: flex;
+  margin-right: 8px;
+  align-items: center;
+  white-space: nowrap;
 }

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

@@ -5,7 +5,8 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isObjectLike_1 = tslib_1.__importDefault(require("lodash/isObjectLike"));
+const set_1 = tslib_1.__importDefault(require("lodash/set"));
 const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('object-base');
@@ -17,10 +18,10 @@ const ObjectBase = (_a) => {
             react_1.default.createElement(uikit_1.Icon, { data: icons_1.Plus, size: 14 }),
             spec.viewSpec.layoutTitle || null));
     }, [spec.defaultValue, spec.viewSpec.layoutTitle, restProps.input.onChange]);
-    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => restProps.input.onChange((currentValue) => lodash_1.default.set(Object.assign({}, currentValue), childName.split(`${restProps.input.name}.`).join(''), childValue), childErrors), [restProps.input.onChange, restProps.input.name]);
+    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => restProps.input.onChange((currentValue) => (0, set_1.default)(Object.assign({}, currentValue), childName.split(`${restProps.input.name}.`).join(''), childValue), childErrors), [restProps.input.onChange, restProps.input.name]);
     const content = react_1.default.useMemo(() => {
         if (!spec.properties ||
-            !lodash_1.default.isObjectLike(spec.properties) ||
+            !(0, isObjectLike_1.default)(spec.properties) ||
             !Object.keys(spec.properties || {}).length) {
             return null;
         }
@@ -30,12 +31,17 @@ const ObjectBase = (_a) => {
         const specProperties = inline
             ? (0, utils_1.filterPropertiesForObjectInline)(spec.properties)
             : spec.properties;
-        return (react_1.default.createElement("div", { className: b('content', { inline }) }, (spec.viewSpec.order || Object.keys(specProperties)).map((property) => {
+        const delimiter = spec.viewSpec.delimiter;
+        const orderProperties = spec.viewSpec.order || Object.keys(specProperties);
+        return (react_1.default.createElement("div", { className: b('content', { inline }) }, orderProperties.map((property) => {
             var _a;
-            return specProperties[property] ? (react_1.default.createElement(core_1.Controller, { value: (_a = restProps.input.value) === null || _a === void 0 ? void 0 : _a[property], spec: specProperties[property], name: `${name ? name + '.' : ''}${property}`, parentOnChange: parentOnChange, parentOnUnmount: restProps.input.parentOnUnmount, key: `${name ? name + '.' : ''}${property}` })) : null;
+            return specProperties[property] ? (react_1.default.createElement(react_1.default.Fragment, { key: `${name ? name + '.' : ''}${property}` },
+                react_1.default.createElement(core_1.Controller, { value: (_a = restProps.input.value) === null || _a === void 0 ? void 0 : _a[property], spec: specProperties[property], name: `${name ? name + '.' : ''}${property}`, parentOnChange: parentOnChange, parentOnUnmount: restProps.input.parentOnUnmount }),
+                delimiter && delimiter[property] ? (react_1.default.createElement(uikit_1.Text, { className: b('delimiter') }, delimiter[property])) : null)) : null;
         })));
     }, [
         spec.properties,
+        spec.viewSpec.delimiter,
         spec.viewSpec.order,
         restProps.input.value,
         restProps.input.parentOnUnmount,

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

@@ -3,17 +3,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ObjectValueInput = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const cloneDeep_1 = tslib_1.__importDefault(require("lodash/cloneDeep"));
+const set_1 = tslib_1.__importDefault(require("lodash/set"));
 const core_1 = require("../../../../core");
-const OBJECT_VALUE_PROPERTY_NAME = 'value';
+const common_1 = require("../../../constants/common");
 const ObjectValueInput = (props) => {
     var _a;
     const { spec, input, name, Layout } = props;
-    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => lodash_1.default.set(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
+    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => (0, set_1.default)(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
     const childSpec = react_1.default.useMemo(() => {
         var _a;
-        if ((_a = spec.properties) === null || _a === void 0 ? void 0 : _a[OBJECT_VALUE_PROPERTY_NAME]) {
-            const childSpec = lodash_1.default.cloneDeep(spec.properties[OBJECT_VALUE_PROPERTY_NAME]);
+        if ((_a = spec.properties) === null || _a === void 0 ? void 0 : _a[common_1.OBJECT_VALUE_PROPERTY_NAME]) {
+            const childSpec = (0, cloneDeep_1.default)(spec.properties[common_1.OBJECT_VALUE_PROPERTY_NAME]);
             childSpec.viewSpec.layout = 'transparent';
             return childSpec;
         }
@@ -22,7 +23,7 @@ const ObjectValueInput = (props) => {
     if (!childSpec) {
         return null;
     }
-    const content = (react_1.default.createElement(core_1.Controller, { value: (_a = input.value) === null || _a === void 0 ? void 0 : _a[OBJECT_VALUE_PROPERTY_NAME], spec: childSpec, name: `${name}.${OBJECT_VALUE_PROPERTY_NAME}`, key: `${name}.${OBJECT_VALUE_PROPERTY_NAME}`, parentOnChange: parentOnChange, parentOnUnmount: input.parentOnUnmount }));
+    const content = (react_1.default.createElement(core_1.Controller, { value: (_a = input.value) === null || _a === void 0 ? void 0 : _a[common_1.OBJECT_VALUE_PROPERTY_NAME], spec: childSpec, name: `${name}.${common_1.OBJECT_VALUE_PROPERTY_NAME}`, key: `${name}.${common_1.OBJECT_VALUE_PROPERTY_NAME}`, parentOnChange: parentOnChange, parentOnUnmount: input.parentOnUnmount }));
     if (Layout) {
         return react_1.default.createElement(Layout, Object.assign({}, props), content);
     }

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

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.OneOfFlat = exports.OneOf = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const set_1 = tslib_1.__importDefault(require("lodash/set"));
 const __1 = require("../../");
 const core_1 = require("../../../../core");
 const hooks_1 = require("../../../hooks");
@@ -13,7 +13,7 @@ const OneOfComponent = (props) => {
     var _a;
     const { oneOfValue, specProperties, toggler } = (0, hooks_1.useOneOf)({ props });
     const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => {
-        const value = lodash_1.default.set({}, childName.split(`${props.input.name}.`).join(''), childValue);
+        const value = (0, set_1.default)({}, childName.split(`${props.input.name}.`).join(''), childValue);
         props.input.onChange(value, childErrors);
     }, [props.input.onChange, props.input.name]);
     return (react_1.default.createElement("div", { className: b({

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

@@ -3,7 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Secret = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const cloneDeep_1 = tslib_1.__importDefault(require("lodash/cloneDeep"));
+const set_1 = tslib_1.__importDefault(require("lodash/set"));
 const core_1 = require("../../../../core");
 const SECRET_PROPERTY_NAME = 'raw';
 const Secret = (props) => {
@@ -12,13 +13,13 @@ const Secret = (props) => {
     const childSpec = react_1.default.useMemo(() => {
         var _a, _b;
         if ((_a = spec.properties) === null || _a === void 0 ? void 0 : _a[SECRET_PROPERTY_NAME]) {
-            const childSpec = lodash_1.default.cloneDeep((_b = spec.properties) === null || _b === void 0 ? void 0 : _b[SECRET_PROPERTY_NAME]);
+            const childSpec = (0, cloneDeep_1.default)((_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_1.default.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => lodash_1.default.set(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
+    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => (0, set_1.default)(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
     if (!childSpec) {
         return null;
     }

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

@@ -5,7 +5,8 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const noop_1 = tslib_1.__importDefault(require("lodash/noop"));
+const set_1 = tslib_1.__importDefault(require("lodash/set"));
 const core_1 = require("../../../../core");
 const hooks_1 = require("../../../../core/components/Form/hooks");
 const utils_1 = require("../../../utils");
@@ -25,7 +26,7 @@ const TableArrayInput = ({ spec, name, arrayInput, input }) => {
     const onItemRemove = react_1.default.useCallback((key) => {
         arrayInput.onItemRemove(key);
     }, [arrayInput.onItemRemove]);
-    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => lodash_1.default.set(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
+    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => (0, set_1.default)(Object.assign({}, currentValue), childName.split(`${input.name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
     const columns = react_1.default.useMemo(() => {
         const { items, viewSpec: { table }, } = spec;
         if (!(table === null || table === void 0 ? void 0 : table.length) || !(0, core_1.isObjectSpec)(items)) {
@@ -59,7 +60,7 @@ const TableArrayInput = ({ spec, name, arrayInput, input }) => {
                         arr: (0, core_1.isArraySpec)(preparedEntitySpec),
                         obj: (0, core_1.isObjectSpec)(preparedEntitySpec),
                     }), key: `${name}.<${key}>.${property}` },
-                    react_1.default.createElement(core_1.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: lodash_1.default.noop })));
+                    react_1.default.createElement(core_1.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_1.default })));
             },
         }));
         return [idxColumn, ...columns, removeColumn];

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

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

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

@@ -4,7 +4,7 @@ exports.TextContent = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const cloneDeep_1 = tslib_1.__importDefault(require("lodash/cloneDeep"));
 const utils_1 = require("../../../utils");
 const LazyLoader_1 = require("../../LazyLoader");
 const utils_2 = require("./utils");
@@ -31,7 +31,7 @@ const TextContent = (_a) => {
                 react_1.default.createElement(uikit_1.Text, { color: "secondary" }, input.value))) : null));
     }
     if (Layout) {
-        const _spec = lodash_1.default.cloneDeep(spec);
+        const _spec = (0, cloneDeep_1.default)(spec);
         if (!(textContentParams === null || textContentParams === void 0 ? void 0 : textContentParams.text)) {
             _spec.viewSpec.layoutDescription = undefined;
         }

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

@@ -3,18 +3,19 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextLink = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const cloneDeep_1 = tslib_1.__importDefault(require("lodash/cloneDeep"));
+const set_1 = tslib_1.__importDefault(require("lodash/set"));
 const core_1 = require("../../../../core");
 const TEXT_LINK_PROPERTY_NAME = 'text';
 const TextLink = (props) => {
     var _a;
     const { spec, input, name, Layout } = props;
-    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => lodash_1.default.set(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
+    const parentOnChange = react_1.default.useCallback((childName, childValue, childErrors) => input.onChange((currentValue) => (0, set_1.default)(Object.assign({}, currentValue), childName.split(`${name}.`).join(''), childValue), childErrors), [input.onChange, input.name]);
     const childSpec = react_1.default.useMemo(() => {
         var _a;
         if (((_a = spec.properties) === null || _a === void 0 ? void 0 : _a[TEXT_LINK_PROPERTY_NAME]) &&
             (0, core_1.isStringSpec)(spec.properties[TEXT_LINK_PROPERTY_NAME])) {
-            const childSpec = lodash_1.default.cloneDeep(spec.properties[TEXT_LINK_PROPERTY_NAME]);
+            const childSpec = (0, cloneDeep_1.default)(spec.properties[TEXT_LINK_PROPERTY_NAME]);
             childSpec.viewSpec.layout = 'transparent';
             return childSpec;
         }

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

@@ -3,13 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.LazyLoader = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isUndefined_1 = tslib_1.__importDefault(require("lodash/isUndefined"));
 const LazyLoader = ({ component, initialFallback = react_1.default.createElement(react_1.default.Fragment, null), }) => {
     const fallback = react_1.default.useRef(() => initialFallback);
     const Component = component;
     const updateFallback = async () => {
         const result = await component._result;
-        if (!lodash_1.default.isUndefined(result)) {
+        if (!(0, isUndefined_1.default)(result)) {
             fallback.current = result.default;
         }
     };

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

@@ -3,11 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ViewAccordeon = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isBoolean_1 = tslib_1.__importDefault(require("lodash/isBoolean"));
 const utils_1 = require("../../../utils");
 const SimpleVerticalAccordeon_1 = require("../../SimpleVerticalAccordeon");
 const ViewAccordeon = ({ name, value, spec, children, }) => {
-    const [open, setOpen] = react_1.default.useState(lodash_1.default.isBoolean(spec.viewSpec.layoutOpen) ? spec.viewSpec.layoutOpen : true);
+    const [open, setOpen] = react_1.default.useState((0, isBoolean_1.default)(spec.viewSpec.layoutOpen) ? spec.viewSpec.layoutOpen : true);
     if (!(0, utils_1.isNotEmptyValue)(value, spec)) {
         return null;
     }

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

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

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

@@ -3,11 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ViewCardAccordeon = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isBoolean_1 = tslib_1.__importDefault(require("lodash/isBoolean"));
 const __1 = require("../");
 const utils_1 = require("../../utils");
 const ViewCardAccordeon = ({ name, value, spec, children, }) => {
-    const [open, setOpen] = react_1.default.useState(lodash_1.default.isBoolean(spec.viewSpec.layoutOpen) ? spec.viewSpec.layoutOpen : true);
+    const [open, setOpen] = react_1.default.useState((0, isBoolean_1.default)(spec.viewSpec.layoutOpen) ? spec.viewSpec.layoutOpen : true);
     const onToggle = react_1.default.useCallback(() => setOpen((f) => !f), [setOpen]);
     if (!(0, utils_1.isNotEmptyValue)(value, spec)) {
         return null;

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

@@ -4,7 +4,7 @@ exports.ArrayBaseView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const map_1 = tslib_1.__importDefault(require("lodash/map"));
 const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('array-base-view');
@@ -20,7 +20,7 @@ const ArrayBaseView = ({ spec, name, value = [] }) => {
                 : `${idx + 1}` });
         return itemSpec;
     }, [spec.items, itemSpecCorrect]);
-    const items = react_1.default.useMemo(() => lodash_1.default.map(value, (__, idx) => {
+    const items = react_1.default.useMemo(() => (0, map_1.default)(value, (__, idx) => {
         const itemSpec = getItemSpec(idx);
         if (!itemSpec) {
             return null;

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

@@ -3,11 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.BaseView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isString_1 = tslib_1.__importDefault(require("lodash/isString"));
 const components_1 = require("../../../components");
 const BaseView = ({ value, spec, linkValue, }) => {
     var _a;
-    if (lodash_1.default.isString(value) && linkValue) {
+    if ((0, isString_1.default)(value) && linkValue) {
         return react_1.default.createElement(react_1.default.Fragment, null, linkValue);
     }
     return (react_1.default.createElement(components_1.LongValue, { value: ((_a = spec === null || spec === void 0 ? void 0 : spec.description) === null || _a === void 0 ? void 0 : _a[String(value)]) || String(value) }));

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

@@ -3,14 +3,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.CardOneOfView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isObjectLike_1 = tslib_1.__importDefault(require("lodash/isObjectLike"));
 const __1 = require("../");
 const core_1 = require("../../../core");
 const CardOneOfView = (props) => {
     const { value = {}, spec, name } = props;
     const [open, setOpen] = react_1.default.useState(true);
     const onToggle = react_1.default.useCallback(() => setOpen((f) => !f), [setOpen]);
-    const specProperties = react_1.default.useMemo(() => (lodash_1.default.isObjectLike(spec.properties) ? spec.properties : {}), [spec.properties]);
+    const specProperties = react_1.default.useMemo(() => ((0, isObjectLike_1.default)(spec.properties) ? spec.properties : {}), [spec.properties]);
     const valueKey = react_1.default.useMemo(() => Object.keys(value)[0], [value]);
     const valueName = react_1.default.useMemo(() => {
         var _a, _b;

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

@@ -4,14 +4,14 @@ exports.MultiOneOfFlatView = exports.MultiOneOfView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isObjectLike_1 = tslib_1.__importDefault(require("lodash/isObjectLike"));
 const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
 const GroupIndent_1 = require("../../GroupIndent");
 const b = (0, utils_1.block)('multi-oneof-view');
 const MultiOneOfView = (props) => {
     const { name, value, Layout, spec, withoutIndent } = props;
-    const specProperties = react_1.default.useMemo(() => (lodash_1.default.isObjectLike(spec.properties) ? spec.properties : {}), [spec.properties]);
+    const specProperties = react_1.default.useMemo(() => ((0, isObjectLike_1.default)(spec.properties) ? spec.properties : {}), [spec.properties]);
     const values = react_1.default.useMemo(() => Object.keys(value || []), [value]);
     const items = react_1.default.useMemo(() => values.map((value) => {
         var _a, _b;

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

@@ -8,4 +8,10 @@
 }
 .df-object-base-view__content_inline > div:last-child {
   margin-right: 0;
+}
+.df-object-base-view__delimiter {
+  display: flex;
+  margin-right: 8px;
+  align-items: center;
+  white-space: nowrap;
 }

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

@@ -3,20 +3,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ObjectInlineView = exports.ObjectBaseView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isObjectLike_1 = tslib_1.__importDefault(require("lodash/isObjectLike"));
+const uikit_1 = require("@gravity-ui/uikit");
 const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('object-base-view');
 const ObjectBaseView = (_a) => {
     var { inline, spec, name, Layout } = _a, restProps = tslib_1.__rest(_a, ["inline", "spec", "name", "Layout"]);
-    if (!spec.properties || !lodash_1.default.isObjectLike(spec.properties)) {
-        return null;
-    }
-    const specProperties = inline
-        ? (0, utils_1.filterPropertiesForObjectInline)(spec.properties)
-        : spec.properties;
-    const content = (react_1.default.createElement("div", { className: b('content', { inline }) }, (spec.viewSpec.order || Object.keys(specProperties)).map((property) => specProperties[property] ? (react_1.default.createElement(core_1.ViewController, { spec: specProperties[property], name: `${name ? name + '.' : ''}${property}`, key: `${name ? name + '.' : ''}${property}` })) : null)));
-    if (!Layout) {
+    const content = react_1.default.useMemo(() => {
+        if (!spec.properties || !(0, isObjectLike_1.default)(spec.properties)) {
+            return null;
+        }
+        const specProperties = inline
+            ? (0, utils_1.filterPropertiesForObjectInline)(spec.properties)
+            : spec.properties;
+        const delimiter = spec.viewSpec.delimiter;
+        const orderProperties = spec.viewSpec.order || Object.keys(specProperties);
+        return (react_1.default.createElement("div", { className: b('content', { inline }) }, orderProperties.map((property) => specProperties[property] ? (react_1.default.createElement(react_1.default.Fragment, { key: `${name ? name + '.' : ''}${property}` },
+            react_1.default.createElement(core_1.ViewController, { spec: specProperties[property], name: `${name ? name + '.' : ''}${property}` }),
+            delimiter && delimiter[property] ? (react_1.default.createElement(uikit_1.Text, { className: b('delimiter') }, delimiter[property])) : null)) : null)));
+    }, [inline, name, spec.properties, spec.viewSpec.delimiter, spec.viewSpec.order]);
+    if (!Layout || !content) {
         return content;
     }
     return (react_1.default.createElement(Layout, Object.assign({ spec: spec, name: name }, restProps), content));

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

@@ -3,15 +3,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ObjectValueInputView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const cloneDeep_1 = tslib_1.__importDefault(require("lodash/cloneDeep"));
 const core_1 = require("../../../../core");
-const OBJECT_VALUE_PROPERTY_NAME = 'value';
+const common_1 = require("../../../constants/common");
 const ObjectValueInputView = (_a) => {
     var { spec, name, Layout } = _a, restProps = tslib_1.__rest(_a, ["spec", "name", "Layout"]);
     const childSpec = react_1.default.useMemo(() => {
         var _a;
-        if ((_a = spec.properties) === null || _a === void 0 ? void 0 : _a[OBJECT_VALUE_PROPERTY_NAME]) {
-            const childSpec = lodash_1.default.cloneDeep(spec.properties[OBJECT_VALUE_PROPERTY_NAME]);
+        if ((_a = spec.properties) === null || _a === void 0 ? void 0 : _a[common_1.OBJECT_VALUE_PROPERTY_NAME]) {
+            const childSpec = (0, cloneDeep_1.default)(spec.properties[common_1.OBJECT_VALUE_PROPERTY_NAME]);
             childSpec.viewSpec.layout = '';
             return childSpec;
         }
@@ -20,7 +20,7 @@ const ObjectValueInputView = (_a) => {
     if (!childSpec) {
         return null;
     }
-    const content = (react_1.default.createElement(core_1.ViewController, { spec: childSpec, name: `${name ? name + '.' : ''}${OBJECT_VALUE_PROPERTY_NAME}` }));
+    const content = (react_1.default.createElement(core_1.ViewController, { spec: childSpec, name: `${name ? name + '.' : ''}${common_1.OBJECT_VALUE_PROPERTY_NAME}` }));
     if (Layout) {
         return (react_1.default.createElement(Layout, Object.assign({ spec: spec, name: name }, restProps), content));
     }

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

@@ -3,21 +3,32 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.OneOfFlatView = exports.OneOfView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const isObjectLike_1 = tslib_1.__importDefault(require("lodash/isObjectLike"));
 const __1 = require("../../");
 const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('oneof-view');
 const OneOfViewComponent = (props) => {
+    var _a, _b;
     const { value = {}, spec, Layout, name } = props;
-    const specProperties = react_1.default.useMemo(() => (lodash_1.default.isObjectLike(spec.properties) ? spec.properties : {}), [spec.properties]);
+    const specProperties = react_1.default.useMemo(() => ((0, isObjectLike_1.default)(spec.properties) ? spec.properties : {}), [spec.properties]);
+    const specBooleanMap = react_1.default.useMemo(() => { var _a; return (_a = spec.viewSpec.oneOfParams) === null || _a === void 0 ? void 0 : _a.booleanMap; }, [(_a = spec.viewSpec.oneOfParams) === null || _a === void 0 ? void 0 : _a.booleanMap]);
     const valueKey = react_1.default.useMemo(() => Object.keys(value)[0], [value]);
     const valueName = react_1.default.useMemo(() => {
-        var _a, _b;
-        return (((_a = spec.description) === null || _a === void 0 ? void 0 : _a[valueKey]) ||
-            ((_b = specProperties[valueKey]) === null || _b === void 0 ? void 0 : _b.viewSpec.layoutTitle) ||
+        var _a, _b, _c;
+        if (((_a = spec.viewSpec.oneOfParams) === null || _a === void 0 ? void 0 : _a.toggler) === 'checkbox' && specBooleanMap) {
+            return (0, utils_1.objectKeys)(specBooleanMap).find((key) => specBooleanMap[key] === valueKey);
+        }
+        return (((_b = spec.description) === null || _b === void 0 ? void 0 : _b[valueKey]) ||
+            ((_c = specProperties[valueKey]) === null || _c === void 0 ? void 0 : _c.viewSpec.layoutTitle) ||
             valueKey);
-    }, [valueKey, spec.description, specProperties]);
+    }, [
+        valueKey,
+        spec.description,
+        specProperties,
+        (_b = spec.viewSpec.oneOfParams) === null || _b === void 0 ? void 0 : _b.toggler,
+        specBooleanMap,
+    ]);
     const wrappedValue = react_1.default.useMemo(() => {
         if (Layout) {
             return (react_1.default.createElement(Layout, Object.assign({}, props, { value: valueName }),

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

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextLinkView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const cloneDeep_1 = tslib_1.__importDefault(require("lodash/cloneDeep"));
 const core_1 = require("../../../../core");
 const TEXT_LINK_PROPERTY_NAME = 'text';
 const TextLinkView = (_a) => {
@@ -12,7 +12,7 @@ const TextLinkView = (_a) => {
         var _a;
         if (((_a = spec.properties) === null || _a === void 0 ? void 0 : _a[TEXT_LINK_PROPERTY_NAME]) &&
             (0, core_1.isStringSpec)(spec.properties[TEXT_LINK_PROPERTY_NAME])) {
-            const childSpec = lodash_1.default.cloneDeep(spec.properties[TEXT_LINK_PROPERTY_NAME]);
+            const childSpec = (0, cloneDeep_1.default)(spec.properties[TEXT_LINK_PROPERTY_NAME]);
             childSpec.viewSpec.layout = '';
             childSpec.viewSpec.link = value === null || value === void 0 ? void 0 : value.link;
             return childSpec;

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

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.COMMON_TITLE_MAX_WIDTH = exports.COMMON_POPOVER_PLACEMENT = void 0;
+exports.OBJECT_VALUE_PROPERTY_NAME = exports.COMMON_TITLE_MAX_WIDTH = exports.COMMON_POPOVER_PLACEMENT = void 0;
 exports.COMMON_POPOVER_PLACEMENT = ['bottom', 'top'];
 exports.COMMON_TITLE_MAX_WIDTH = 533;
+exports.OBJECT_VALUE_PROPERTY_NAME = 'value';