@gravity-ui/dynamic-forms 5.20.0 → 5.21.0

package/build/cjs/lib/unstable/kit/entities/FewOfNested/FewOfNested.d.ts

@@ -0,0 +1,7 @@
+import { type JsonSchema, type JsonSchemaObject, type NodeEntity } from '../../../core';
+export interface FewOfNestedProps {
+    toggler: JsonSchema;
+    withIndent?: boolean;
+    togglerArrayRemoveButton?: boolean;
+}
+export declare const FewOfNested: NodeEntity<JsonSchemaObject, FewOfNestedProps>;

package/build/cjs/lib/unstable/kit/entities/FewOfNested/FewOfNested.js

@@ -0,0 +1,73 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FewOfNested = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const isString_1 = tslib_1.__importDefault(require("lodash/isString"));
+const core_1 = require("../../../core");
+const components_1 = require("../../components");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('few-of-nested');
+const FewOfNested = ({ Layout, headName, input, layoutProps, meta, mode, props, schema, schemaPath, }) => {
+    const { name, value } = input;
+    const { togglerArrayRemoveButton = false, toggler: togglerSchema = {}, withIndent = false, } = props;
+    const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
+    const srState = (0, core_1.useSchemaRendererState)({
+        headName,
+        subscriptions: [core_1.SchemaRendererEventType.Config],
+    });
+    const [togglerValues, setTogglerValues] = react_1.default.useState(() => {
+        if (value && Object.keys(value).length) {
+            return Object.keys(value);
+        }
+        if (!overviewFlag && schema.properties && Object.keys(schema.properties).length) {
+            return [Object.keys(schema.properties)[0]];
+        }
+        return [];
+    });
+    const toggler = react_1.default.useMemo(() => {
+        let result = null;
+        const renderKit = (0, core_1.getRenderKit)({ config: srState === null || srState === void 0 ? void 0 : srState.config, schema: togglerSchema });
+        const { Entity, Layout, entityProps, independent, layoutProps } = renderKit[mode];
+        const togglerInput = Object.assign(Object.assign({}, input), { name: togglerArrayRemoveButton ? name : `${name}._____toggler`, value: togglerValues, onChange: (value) => {
+                if (Array.isArray(value)) {
+                    setTogglerValues(value.filter(isString_1.default));
+                }
+            } });
+        const togglerMeta = Object.assign(Object.assign({}, meta), { error: undefined });
+        if (Entity) {
+            result = (react_1.default.createElement(Entity, { Layout: independent ? Layout : undefined, headName: headName, input: togglerInput, layoutProps: independent ? layoutProps : undefined, meta: togglerMeta, mode: mode, props: entityProps, schema: togglerSchema, schemaPath: "___stub" }));
+            if (Layout && !independent) {
+                result = (react_1.default.createElement(Layout, { headName: headName, input: togglerInput, meta: togglerMeta, mode: mode, props: layoutProps, schema: togglerSchema, schemaPath: "___stub" }, result));
+            }
+        }
+        return result;
+    }, [
+        headName,
+        input,
+        meta,
+        mode,
+        name,
+        srState === null || srState === void 0 ? void 0 : srState.config,
+        togglerArrayRemoveButton,
+        togglerSchema,
+        togglerValues,
+    ]);
+    const wrapperInput = react_1.default.useMemo(() => {
+        if (!togglerArrayRemoveButton) {
+            return input;
+        }
+        return Object.assign(Object.assign({}, input), { name: `${name}._____wrapper` });
+    }, [name, input, togglerArrayRemoveButton]);
+    let content = (react_1.default.createElement(components_1.EntityContainer, { direction: "column-reverse", stretch: "by-child", fill: "populated" },
+        togglerValues.length ? (react_1.default.createElement(components_1.LayoutContainer, { className: b('content', { 'with-indent': withIndent }), hideEmpty: overviewFlag }, togglerValues.map((togglerValue) => (react_1.default.createElement(core_1.SchemaRendererNode, { headName: headName, key: togglerValue, name: `${name ? name + '.' : ''}${togglerValue}`, schemaPath: `${schemaPath}/properties/${togglerValue}` }))))) : null,
+        toggler));
+    if (overviewFlag && togglerValues.length === 0) {
+        content = react_1.default.createElement(react_1.default.Fragment, null, toggler);
+    }
+    if (Layout) {
+        content = (react_1.default.createElement(Layout, { headName: headName, input: wrapperInput, meta: meta, mode: mode, schema: schema, schemaPath: schemaPath, props: layoutProps || {} }, content));
+    }
+    return content;
+};
+exports.FewOfNested = FewOfNested;

package/build/cjs/lib/unstable/kit/entities/Label/Label.d.ts

@@ -0,0 +1,8 @@
+import * as icons from '@gravity-ui/icons';
+import { type IconProps, type LabelProps as UIKitLabelProps } from '@gravity-ui/uikit';
+import { type JsonSchemaString, type NodeEntity } from '../../../core';
+export interface LabelProps extends UIKitLabelProps {
+    iconName?: keyof typeof icons;
+    iconProps?: Partial<IconProps>;
+}
+export declare const Label: NodeEntity<JsonSchemaString, LabelProps>;

package/build/cjs/lib/unstable/kit/entities/Label/Label.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Label = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const icons = tslib_1.__importStar(require("@gravity-ui/icons"));
+const uikit_1 = require("@gravity-ui/uikit");
+const core_1 = require("../../../core");
+const components_1 = require("../../components");
+const Label = ({ input, mode, props, schema }) => {
+    const { value } = input;
+    const { iconName, iconProps, title } = props, restEntityProps = tslib_1.__rest(props, ["iconName", "iconProps", "title"]);
+    const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
+    const icon = react_1.default.useMemo(() => iconName && icons[iconName] ? (react_1.default.createElement(uikit_1.Icon, Object.assign({ data: icons[iconName] }, iconProps))) : undefined, [iconName, iconProps]);
+    const content = react_1.default.useMemo(() => {
+        if (title) {
+            if (typeof title === 'string') {
+                return react_1.default.createElement("span", { dangerouslySetInnerHTML: { __html: title } });
+            }
+            return title;
+        }
+        if (schema.description) {
+            return react_1.default.createElement("span", { dangerouslySetInnerHTML: { __html: schema.description } });
+        }
+        return undefined;
+    }, [title, schema.description]);
+    return (react_1.default.createElement(components_1.EntityContainer, { stretch: "fit", fill: "populated" },
+        react_1.default.createElement(uikit_1.Label, Object.assign({ size: overviewFlag ? 'xs' : 'm', value: value, icon: icon }, restEntityProps), content)));
+};
+exports.Label = Label;

package/build/cjs/lib/unstable/kit/entities/Monaco/Monaco.css

@@ -0,0 +1,6 @@
+.sr-monaco_error .sr-monaco__container {
+  border-color: var(--g-color-text-danger);
+}
+.sr-monaco__dialog-body {
+  padding: calc(var(--g-spacing-base) * 4);
+}

package/build/cjs/lib/unstable/kit/entities/Monaco/Monaco.d.ts

@@ -0,0 +1,7 @@
+import type { MonacoEditorProps } from 'react-monaco-editor/lib/types';
+import { type JsonSchemaString, type NodeEntity } from '../../../core';
+export interface MonacoProps extends Omit<MonacoEditorProps, 'defaultValue' | 'value' | 'onChange'> {
+    ignoreMonacoErrors?: boolean;
+    withDialog?: boolean;
+}
+export declare const Monaco: NodeEntity<JsonSchemaString, MonacoProps>;

package/build/cjs/lib/unstable/kit/entities/Monaco/Monaco.js

@@ -0,0 +1,80 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Monaco = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const core_1 = require("../../../core");
+const components_1 = require("../../components");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('monaco');
+const Monaco = ({ headName, input, meta, mode, props, schema, }) => {
+    const { name, onBlur, onChange, onFocus, value } = input;
+    const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
+    const { language = 'plaintext', options: optionsProps, withDialog = true, ignoreMonacoErrors = false, width = '100%', height = 350 } = props, restEntityProps = tslib_1.__rest(props, ["language", "options", "withDialog", "ignoreMonacoErrors", "width", "height"]);
+    const srState = (0, core_1.useSchemaRendererState)({
+        headName,
+        subscriptions: [core_1.SchemaRendererEventType.UserContext],
+    });
+    const { addExternalErrors, removeExternalErrors } = (0, core_1.useSchemaRendererTools)();
+    const { MonacoEditor } = (srState === null || srState === void 0 ? void 0 : srState.userContext) || {};
+    const modelUrisRef = react_1.default.useRef([]);
+    const innerErrorRef = react_1.default.useRef(null);
+    const [dialogOpen, setDialogOpen] = react_1.default.useState(false);
+    const toggleDialogOpen = react_1.default.useCallback(() => setDialogOpen((f) => !f), []);
+    const options = react_1.default.useMemo(() => (Object.assign({ fontSize: 12, readOnly: overviewFlag || schema.readOnly, formatOnPaste: true, formatOnType: true, contextmenu: false, minimap: { enabled: false }, autoClosingBrackets: 'languageDefined', automaticLayout: true }, optionsProps)), [optionsProps, overviewFlag, schema.readOnly]);
+    const onUpdate = react_1.default.useCallback((value) => {
+        onFocus();
+        onChange(value);
+        onBlur();
+    }, [onFocus, onChange, onBlur]);
+    const editorDidMount = react_1.default.useMemo(() => {
+        if (ignoreMonacoErrors) {
+            return undefined;
+        }
+        return (editor, monaco) => {
+            const model = editor.getModel();
+            if (model) {
+                const modelUri = model.uri.toString();
+                modelUrisRef.current.push(modelUri);
+                model.onWillDispose(() => {
+                    modelUrisRef.current = modelUrisRef.current.filter((u) => u !== modelUri);
+                });
+                monaco.editor.onDidChangeMarkers((uris) => {
+                    const editedUri = uris.find((u) => modelUrisRef.current.includes(u.toString()));
+                    if (!editedUri) {
+                        return;
+                    }
+                    const marker = monaco.editor
+                        .getModelMarkers({ resource: editedUri })
+                        .find((m) => m.severity === monaco.MarkerSeverity.Error);
+                    if (marker) {
+                        const error = `${marker.message}${marker.message[marker.message.length - 1] === '.' ? '' : '.'} ${marker.source}(${marker.code}) [Line ${marker.startLineNumber}, Column ${marker.startColumn}]`;
+                        if (innerErrorRef.current !== error) {
+                            innerErrorRef.current = error;
+                            addExternalErrors === null || addExternalErrors === void 0 ? void 0 : addExternalErrors({ headName, regularErrors: { [name]: error } });
+                        }
+                    }
+                    else if (innerErrorRef.current) {
+                        innerErrorRef.current = null;
+                        removeExternalErrors === null || removeExternalErrors === void 0 ? void 0 : removeExternalErrors({ headName, removeFunctionOrNames: [name] });
+                    }
+                });
+            }
+            return;
+        };
+    }, [addExternalErrors, headName, name, ignoreMonacoErrors, removeExternalErrors]);
+    if (!MonacoEditor) {
+        return null;
+    }
+    if (overviewFlag && !value) {
+        return react_1.default.createElement(components_1.EmptyEntityValue, null);
+    }
+    const control = (react_1.default.createElement(MonacoEditor, Object.assign({}, restEntityProps, { language: language, value: value, onChange: onUpdate, options: options, editorDidMount: editorDidMount })));
+    return (react_1.default.createElement(components_1.EntityContainer, { className: b({ error: (0, utils_1.getBooleanValidationState)(meta) }), stretch: "max", fill: "populated" },
+        react_1.default.createElement(components_1.MonacoContainer, { dialog: false, height: height, language: language, toggleDialogVisibility: toggleDialogOpen, width: width, withDialog: withDialog, qa: name }, control),
+        react_1.default.createElement(uikit_1.Dialog, { open: dialogOpen, onClose: toggleDialogOpen, hasCloseButton: false },
+            react_1.default.createElement(uikit_1.Dialog.Body, { className: b('dialog-body') },
+                react_1.default.createElement(components_1.MonacoContainer, { dialog: true, height: "90vh", language: language, toggleDialogVisibility: toggleDialogOpen, width: "80vw", withDialog: withDialog, qa: name }, control)))));
+};
+exports.Monaco = Monaco;

package/build/cjs/lib/unstable/kit/entities/Monaco/index.d.ts

@@ -0,0 +1 @@
+export { Monaco, type MonacoProps } from './Monaco';

package/build/cjs/lib/unstable/kit/entities/Monaco/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Monaco = void 0;
+var Monaco_1 = require("./Monaco");
+Object.defineProperty(exports, "Monaco", { enumerable: true, get: function () { return Monaco_1.Monaco; } });

package/build/cjs/lib/unstable/kit/entities/ObjectEntity/ObjectEntity.d.ts

@@ -0,0 +1,6 @@
+import { type JsonSchemaObject, type NodeEntity } from '../../../core';
+export interface ObjectEntityProps {
+    disabled?: boolean;
+    order?: string[];
+}
+export declare const ObjectEntity: NodeEntity<JsonSchemaObject, ObjectEntityProps>;

package/build/cjs/lib/unstable/kit/entities/ObjectEntity/ObjectEntity.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ObjectEntity = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const core_1 = require("../../../core");
+const components_1 = require("../../components");
+const ObjectEntity = ({ headName, mode, input, props, schema, schemaPath, }) => {
+    const { name } = input;
+    const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
+    if (overviewFlag && !Object.keys(schema.properties || {}).length) {
+        return react_1.default.createElement(components_1.EmptyEntityValue, null);
+    }
+    return (react_1.default.createElement(components_1.EntityContainer, { stretch: "by-child", fill: "by-child" }, (props.order || Object.keys(schema.properties || {})).map((property) => (react_1.default.createElement(core_1.SchemaRendererNode, { headName: headName, name: `${name ? name + '.' : ''}${property}`, schemaPath: `${schemaPath}/properties/${property}`, key: property })))));
+};
+exports.ObjectEntity = ObjectEntity;

package/build/cjs/lib/unstable/kit/entities/ObjectEntity/index.d.ts

@@ -0,0 +1 @@
+export { ObjectEntity, type ObjectEntityProps } from './ObjectEntity';

package/build/cjs/lib/unstable/kit/entities/ObjectEntity/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ObjectEntity = void 0;
+var ObjectEntity_1 = require("./ObjectEntity");
+Object.defineProperty(exports, "ObjectEntity", { enumerable: true, get: function () { return ObjectEntity_1.ObjectEntity; } });

package/build/cjs/lib/unstable/kit/entities/ObjectInline/ObjectInline.css

@@ -0,0 +1,11 @@
+.sr-object-inline .sr-object-inline__items > * {
+  margin-bottom: 0;
+}
+.sr-object-inline__items_overview .sr-object-inline__delimiter {
+  min-height: 18px;
+}
+.sr-object-inline__delimiter {
+  min-height: 28px;
+  display: flex;
+  align-items: center;
+}

package/build/cjs/lib/unstable/kit/entities/ObjectInline/ObjectInline.d.ts

@@ -0,0 +1,7 @@
+import { type JsonSchemaObject, type NodeEntity } from '../../../core';
+export interface ObjectInlineProps {
+    delimiter?: string | Record<string, string>;
+    disabled?: boolean;
+    order?: string[];
+}
+export declare const ObjectInline: NodeEntity<JsonSchemaObject, ObjectInlineProps>;

package/build/cjs/lib/unstable/kit/entities/ObjectInline/ObjectInline.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ObjectInline = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const isObject_1 = tslib_1.__importDefault(require("lodash/isObject"));
+const isString_1 = tslib_1.__importDefault(require("lodash/isString"));
+const core_1 = require("../../../core");
+const components_1 = require("../../components");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('object-inline');
+const ObjectInline = ({ headName, input, mode, props, schema, schemaPath, }) => {
+    const { delimiter, order } = props;
+    const { name } = input;
+    const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
+    if (overviewFlag && !Object.keys(input.value || {}).length) {
+        return react_1.default.createElement(components_1.EmptyEntityValue, null);
+    }
+    return (react_1.default.createElement(components_1.EntityContainer, { stretch: overviewFlag ? 'by-child' : 'max', className: b(), fill: "by-child" },
+        react_1.default.createElement(uikit_1.Flex, { className: b('items', { overview: overviewFlag }), direction: "row", alignItems: "flex-start", gap: overviewFlag ? 1 : 2 }, (order || Object.keys(schema.properties || {})).map((property, index, array) => (react_1.default.createElement(react_1.default.Fragment, { key: property },
+            react_1.default.createElement(core_1.SchemaRendererNode, { headName: headName, name: `${name ? name + '.' : ''}${property}`, schemaPath: `${schemaPath}/properties/${property}` }),
+            (0, isString_1.default)(delimiter) && index + 1 !== array.length ? (react_1.default.createElement(uikit_1.Text, { className: b('delimiter') }, delimiter)) : null,
+            (0, isObject_1.default)(delimiter) && delimiter[property] ? (react_1.default.createElement(uikit_1.Text, { className: b('delimiter') }, delimiter[property])) : null))))));
+};
+exports.ObjectInline = ObjectInline;

package/build/cjs/lib/unstable/kit/entities/OneOfNested/OneOfNested.css

@@ -0,0 +1,17 @@
+.sr-one-of-nested__content {
+  margin-top: calc(var(--g-spacing-base) * 4);
+}
+.sr-one-of-nested__content_with-indent {
+  position: relative;
+  padding-left: calc(var(--g-spacing-base) * 7);
+}
+.sr-one-of-nested__content_with-indent:before {
+  content: "";
+  display: block;
+  width: 1px;
+  height: calc(100% + var(--g-spacing-base) * 2);
+  background-color: var(--g-color-line-generic);
+  position: absolute;
+  left: calc(var(--g-spacing-base) * 3 + 1.5px);
+  bottom: 0;
+}

package/build/cjs/lib/unstable/kit/entities/OneOfNested/OneOfNested.d.ts

@@ -0,0 +1,11 @@
+import { type JsonSchema, type JsonSchemaObject, type NodeEntity } from '../../../core';
+export interface OneOfNestedProps {
+    toggler: JsonSchema;
+    booleanToKey?: {
+        true: string;
+        false: string;
+    };
+    withIndent?: boolean;
+    togglerArrayRemoveButton?: boolean;
+}
+export declare const OneOfNested: NodeEntity<JsonSchemaObject, OneOfNestedProps>;

package/build/cjs/lib/unstable/kit/entities/OneOfNested/OneOfNested.js

@@ -0,0 +1,70 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OneOfNested = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const core_1 = require("../../../core");
+const components_1 = require("../../components");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('one-of-nested');
+const OneOfNested = ({ Layout, headName, input, layoutProps, meta, mode, props, schema, schemaPath, }) => {
+    const { name, value } = input;
+    const { booleanToKey, togglerArrayRemoveButton = false, toggler: togglerSchema = {}, withIndent = false, } = props;
+    const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
+    const srState = (0, core_1.useSchemaRendererState)({
+        headName,
+        subscriptions: [core_1.SchemaRendererEventType.Config],
+    });
+    const [togglerValue, setTogglerValue] = react_1.default.useState(Object.keys(value || (overviewFlag ? undefined : schema.properties) || {})[0]);
+    const toggler = react_1.default.useMemo(() => {
+        var _a;
+        let result = null;
+        const renderKit = (0, core_1.getRenderKit)({ config: srState === null || srState === void 0 ? void 0 : srState.config, schema: togglerSchema });
+        const { Entity, Layout, entityProps, independent, layoutProps } = renderKit[mode];
+        const togglerInput = Object.assign(Object.assign({}, input), { name: togglerArrayRemoveButton ? name : `${name}._____toggler`, value: ((_a = togglerSchema.nodeParameters) === null || _a === void 0 ? void 0 : _a.type) === core_1.NodeType.Boolean &&
+                booleanToKey &&
+                togglerValue !== undefined
+                ? booleanToKey.true === togglerValue
+                : togglerValue, onChange: (value) => {
+                const nextValue = `${value}`;
+                setTogglerValue((booleanToKey === null || booleanToKey === void 0 ? void 0 : booleanToKey[nextValue]) || nextValue);
+            } });
+        const togglerMeta = Object.assign(Object.assign({}, meta), { error: undefined });
+        if (Entity) {
+            result = (react_1.default.createElement(Entity, { Layout: independent ? Layout : undefined, headName: headName, input: togglerInput, layoutProps: independent ? layoutProps : undefined, meta: togglerMeta, mode: mode, props: entityProps, schema: togglerSchema, schemaPath: "___stub" }));
+            if (Layout && !independent) {
+                result = (react_1.default.createElement(Layout, { headName: headName, input: togglerInput, meta: togglerMeta, mode: mode, props: layoutProps, schema: togglerSchema, schemaPath: "___stub" }, result));
+            }
+        }
+        return result;
+    }, [
+        booleanToKey,
+        headName,
+        input,
+        meta,
+        mode,
+        name,
+        srState === null || srState === void 0 ? void 0 : srState.config,
+        togglerArrayRemoveButton,
+        togglerSchema,
+        togglerValue,
+    ]);
+    const wrapperInput = react_1.default.useMemo(() => {
+        if (!togglerArrayRemoveButton) {
+            return input;
+        }
+        return Object.assign(Object.assign({}, input), { name: `${name}._____wrapper` });
+    }, [name, input, togglerArrayRemoveButton]);
+    let content = (react_1.default.createElement(components_1.EntityContainer, { direction: "column-reverse", stretch: "by-child", fill: "populated" },
+        togglerValue === undefined ? null : (react_1.default.createElement(components_1.LayoutContainer, { className: b('content', { 'with-indent': withIndent }), hideEmpty: overviewFlag },
+            react_1.default.createElement(core_1.SchemaRendererNode, { headName: headName, name: `${name ? name + '.' : ''}${togglerValue}`, schemaPath: `${schemaPath}/properties/${togglerValue}` }))),
+        toggler));
+    if (overviewFlag && Object.values(value || {}).length === 0) {
+        content = react_1.default.createElement(react_1.default.Fragment, null, toggler);
+    }
+    if (Layout) {
+        content = (react_1.default.createElement(Layout, { headName: headName, input: wrapperInput, meta: meta, mode: mode, schema: schema, schemaPath: schemaPath, props: layoutProps || {} }, content));
+    }
+    return content;
+};
+exports.OneOfNested = OneOfNested;

package/build/cjs/lib/unstable/kit/entities/TextContent/TextContent.css

@@ -0,0 +1,19 @@
+.sr-text-content {
+  border: none;
+  box-shadow: none;
+}
+.sr-text-content.g-label .g-label__addon_side_start {
+  position: unset;
+}
+.sr-text-content.g-label .g-label__text {
+  margin-left: calc(var(--g-spacing-base) * 1);
+}
+.sr-text-content.g-label:not(:has(.g-label__addon_side_start)) .g-label__text {
+  margin-left: 0;
+}
+.sr-text-content.g-label .g-label__separator {
+  margin-left: 0;
+}
+.sr-text-content.g-label .g-label__addon {
+  width: auto;
+}

package/build/cjs/lib/unstable/kit/entities/TextContent/TextContent.d.ts

@@ -0,0 +1,8 @@
+import * as icons from '@gravity-ui/icons';
+import { type IconProps, type LabelProps as UIKitLabelProps } from '@gravity-ui/uikit';
+import { type JsonSchemaString, type NodeEntity } from '../../../core';
+export interface TextContentProps extends Omit<UIKitLabelProps, 'theme'> {
+    iconName?: keyof typeof icons;
+    iconProps?: Partial<IconProps>;
+}
+export declare const TextContent: NodeEntity<JsonSchemaString, TextContentProps>;

package/build/cjs/lib/unstable/kit/entities/TextContent/TextContent.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TextContent = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const icons = tslib_1.__importStar(require("@gravity-ui/icons"));
+const uikit_1 = require("@gravity-ui/uikit");
+const core_1 = require("../../../core");
+const components_1 = require("../../components");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('text-content');
+const TextContent = ({ input, mode, props, schema, }) => {
+    const { className, iconName, iconProps, title: titleProp } = props, restEntityProps = tslib_1.__rest(props, ["className", "iconName", "iconProps", "title"]);
+    const overviewFlag = mode === core_1.SchemaRendererMode.Overview;
+    const icon = react_1.default.useMemo(() => iconName && icons[iconName] ? (react_1.default.createElement(uikit_1.Icon, Object.assign({ data: icons[iconName] }, iconProps))) : undefined, [iconName, iconProps]);
+    const content = react_1.default.useMemo(() => {
+        if (titleProp) {
+            if (typeof titleProp === 'string') {
+                return react_1.default.createElement("span", { dangerouslySetInnerHTML: { __html: titleProp } });
+            }
+            return titleProp;
+        }
+        if (schema.description) {
+            return react_1.default.createElement("span", { dangerouslySetInnerHTML: { __html: schema.description } });
+        }
+        return undefined;
+    }, [titleProp, schema.description]);
+    return (react_1.default.createElement(components_1.EntityContainer, { stretch: "fit", fill: "populated" },
+        react_1.default.createElement(uikit_1.Label, Object.assign({ size: overviewFlag ? 'xs' : 'm', value: input.value, icon: icon, className: b(null, className) }, restEntityProps, { theme: "clear" }), content)));
+};
+exports.TextContent = TextContent;

package/build/cjs/lib/unstable/kit/entities/index.d.ts

@@ -0,0 +1,11 @@
+export { Alert, type AlertProps } from './Alert';
+export { ArrayEntity, type ArrayEntityProps } from './ArrayEntity';
+export { ArrayTable, type ArrayTableProps } from './ArrayTable';
+export { DotValue, type DotValueProps } from './DotValue';
+export { FewOfNested, type FewOfNestedProps } from './FewOfNested';
+export { Label, type LabelProps } from './Label';
+export { Monaco, type MonacoProps } from './Monaco';
+export { ObjectEntity, type ObjectEntityProps } from './ObjectEntity';
+export { ObjectInline, type ObjectInlineProps } from './ObjectInline';
+export { OneOfNested, type OneOfNestedProps } from './OneOfNested';
+export { TextContent, type TextContentProps } from './TextContent';

package/build/cjs/lib/unstable/kit/entities/index.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TextContent = exports.OneOfNested = exports.ObjectInline = exports.ObjectEntity = exports.Monaco = exports.Label = exports.FewOfNested = exports.DotValue = exports.ArrayTable = exports.ArrayEntity = exports.Alert = void 0;
+var Alert_1 = require("./Alert");
+Object.defineProperty(exports, "Alert", { enumerable: true, get: function () { return Alert_1.Alert; } });
+var ArrayEntity_1 = require("./ArrayEntity");
+Object.defineProperty(exports, "ArrayEntity", { enumerable: true, get: function () { return ArrayEntity_1.ArrayEntity; } });
+var ArrayTable_1 = require("./ArrayTable");
+Object.defineProperty(exports, "ArrayTable", { enumerable: true, get: function () { return ArrayTable_1.ArrayTable; } });
+var DotValue_1 = require("./DotValue");
+Object.defineProperty(exports, "DotValue", { enumerable: true, get: function () { return DotValue_1.DotValue; } });
+var FewOfNested_1 = require("./FewOfNested");
+Object.defineProperty(exports, "FewOfNested", { enumerable: true, get: function () { return FewOfNested_1.FewOfNested; } });
+var Label_1 = require("./Label");
+Object.defineProperty(exports, "Label", { enumerable: true, get: function () { return Label_1.Label; } });
+var Monaco_1 = require("./Monaco");
+Object.defineProperty(exports, "Monaco", { enumerable: true, get: function () { return Monaco_1.Monaco; } });
+var ObjectEntity_1 = require("./ObjectEntity");
+Object.defineProperty(exports, "ObjectEntity", { enumerable: true, get: function () { return ObjectEntity_1.ObjectEntity; } });
+var ObjectInline_1 = require("./ObjectInline");
+Object.defineProperty(exports, "ObjectInline", { enumerable: true, get: function () { return ObjectInline_1.ObjectInline; } });
+var OneOfNested_1 = require("./OneOfNested");
+Object.defineProperty(exports, "OneOfNested", { enumerable: true, get: function () { return OneOfNested_1.OneOfNested; } });
+var TextContent_1 = require("./TextContent");
+Object.defineProperty(exports, "TextContent", { enumerable: true, get: function () { return TextContent_1.TextContent; } });

package/build/cjs/lib/unstable/kit/form-entities/CheckboxGroupInput/CheckboxGroupInput.css

@@ -0,0 +1,9 @@
+.sr-checkbox-group-input__checkbox {
+  min-height: 28px;
+}
+.sr-checkbox-group-input__checkbox_error .g-control-label .g-checkbox__indicator:hover::before {
+  border: 1px solid var(--g-color-text-danger);
+}
+.sr-checkbox-group-input__checkbox_error .g-control-label .g-checkbox__indicator::before {
+  border: 1px solid var(--g-color-text-danger);
+}

package/build/cjs/lib/unstable/kit/form-entities/CheckboxGroupInput/CheckboxGroupInput.d.ts

@@ -0,0 +1,8 @@
+import type { JsonSchemaArray, NodeEntity } from '../../../core';
+export interface CheckboxGroupInputProps {
+    enumDescriptions?: Record<string, string>;
+    optionsDisabled?: Record<string, boolean>;
+    direction?: 'row' | 'column';
+    disabled?: boolean;
+}
+export declare const CheckboxGroupInput: NodeEntity<JsonSchemaArray, CheckboxGroupInputProps>;

package/build/cjs/lib/unstable/kit/form-entities/CheckboxGroupInput/CheckboxGroupInput.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CheckboxGroupInput = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const components_1 = require("../../components");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('checkbox-group-input');
+const CheckboxGroupInput = ({ input, props, meta, schema, }) => {
+    const { name, onBlur, onChange, onFocus, value: inputValue } = input;
+    const { enumDescriptions, direction = 'row', disabled, optionsDisabled } = props;
+    const value = react_1.default.useMemo(() => (Array.isArray(inputValue) ? inputValue : []), [inputValue]);
+    const options = react_1.default.useMemo(() => {
+        var _a, _b;
+        if (schema.items && 'enum' in schema.items) {
+            return (_b = (_a = schema === null || schema === void 0 ? void 0 : schema.items) === null || _a === void 0 ? void 0 : _a.enum) === null || _b === void 0 ? void 0 : _b.map((el) => {
+                const value = `${el}`;
+                return {
+                    value,
+                    text: (enumDescriptions === null || enumDescriptions === void 0 ? void 0 : enumDescriptions[value]) || value,
+                };
+            });
+        }
+        return;
+    }, [enumDescriptions, schema]);
+    const onUpdate = react_1.default.useCallback((optionValue, selected) => {
+        onFocus();
+        if (selected) {
+            onChange([...value, optionValue]);
+        }
+        else {
+            onChange(value.filter((el) => el !== optionValue));
+        }
+        onBlur();
+    }, [onBlur, onChange, onFocus, value]);
+    return (react_1.default.createElement(components_1.EntityContainer, { stretch: "fit", direction: direction, gap: direction === 'row' ? 2 : undefined }, options === null || options === void 0 ? void 0 : options.map(({ value: optionValue, text }) => (react_1.default.createElement(uikit_1.Flex, { className: b('checkbox', {
+            error: value.includes(optionValue) && (0, utils_1.getBooleanValidationState)(meta),
+        }), alignItems: "center", key: optionValue },
+        react_1.default.createElement(uikit_1.Checkbox, { checked: value.includes(optionValue), onFocus: onFocus, onBlur: onBlur, onUpdate: (checked) => onUpdate(optionValue, checked), content: text, disabled: disabled || (optionsDisabled === null || optionsDisabled === void 0 ? void 0 : optionsDisabled[optionValue]) || schema.readOnly, qa: `${name}-${optionValue}` }))))));
+};
+exports.CheckboxGroupInput = CheckboxGroupInput;

package/build/cjs/lib/unstable/kit/form-entities/CheckboxGroupInput/index.d.ts

@@ -0,0 +1 @@
+export { CheckboxGroupInput, type CheckboxGroupInputProps } from './CheckboxGroupInput';

package/build/cjs/lib/unstable/kit/form-entities/CheckboxGroupInput/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CheckboxGroupInput = void 0;
+var CheckboxGroupInput_1 = require("./CheckboxGroupInput");
+Object.defineProperty(exports, "CheckboxGroupInput", { enumerable: true, get: function () { return CheckboxGroupInput_1.CheckboxGroupInput; } });

package/build/cjs/lib/unstable/kit/form-entities/CheckboxInput/CheckboxInput.css

@@ -0,0 +1,11 @@
+.sr-checkbox-input {
+  min-height: 28px;
+  display: flex;
+  justify-content: center;
+}
+.sr-checkbox-input_error .g-control-label .g-checkbox__indicator:hover::before {
+  border: 1px solid var(--g-color-text-danger);
+}
+.sr-checkbox-input_error .g-control-label .g-checkbox__indicator::before {
+  border: 1px solid var(--g-color-text-danger);
+}

package/build/cjs/lib/unstable/kit/form-entities/CheckboxInput/CheckboxInput.d.ts

@@ -0,0 +1,5 @@
+import { type CheckboxProps } from '@gravity-ui/uikit';
+import type { JsonSchemaBoolean, NodeEntity } from '../../../core';
+export interface CheckboxInputProps extends Omit<CheckboxProps, 'checked' | 'onFocus' | 'onBlur' | 'onChange' | 'onUpdate' | 'qa'> {
+}
+export declare const CheckboxInput: NodeEntity<JsonSchemaBoolean, CheckboxInputProps>;