@gravity-ui/page-constructor 5.33.4-beta.0 → 5.34.0

package/build/esm/editor/components/PageSettings/i18n/index.d.ts

@@ -1,5 +1 @@
-export declare const i18n: ((key: "page-settings-title", params?: import("@gravity-ui/i18n").Params) => string) & {
-    keysetData: {
-        "pc-PageSettings": Record<"page-settings-title", import("@gravity-ui/i18n").KeyData>;
-    };
-};
+export declare const i18n: (key: "page-settings-title", params?: import("@gravity-ui/i18n").Params | undefined) => string;

package/build/esm/editor/components/PageSettings/i18n/index.js

@@ -1,6 +1,5 @@
 import { addComponentKeysets } from '@gravity-ui/uikit/i18n';
-import { NAMESPACE } from "../../../../utils/cn.js";
-import en from "./en.json";
-import ru from "./ru.json";
+import { NAMESPACE } from '../../../../utils/cn';
+import en from './en.json';
+import ru from './ru.json';
 export const i18n = addComponentKeysets({ en, ru }, `${NAMESPACE}PageSettings`);
-//# sourceMappingURL=index.js.map

package/build/esm/editor/containers/Editor/Editor.d.ts

@@ -1,3 +1,3 @@
-import { EditorProps } from "../../types/index.js";
+import { EditorProps } from '../../types';
 import './Editor.css';
-export declare const Editor: (props: EditorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Editor: (props: EditorProps) => JSX.Element;

package/build/esm/editor/containers/Editor/Editor.js

@@ -1,20 +1,30 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { PageConstructor, PageConstructorProvider } from "../../../containers/PageConstructor/index.js";
-import { block } from "../../../utils/index.js";
-import AddBlock from "../../components/AddBlock/AddBlock.js";
-import { CodeEditor } from "../../components/CodeEditor/CodeEditor.js";
-import ControlPanel from "../../components/ControlPanel/ControlPanel.js";
-import { ErrorBoundary } from "../../components/ErrorBoundary/ErrorBoundary.js";
-import Layout from "../../components/Layout/Layout.js";
-import { PageSettings } from "../../components/PageSettings/PageSettings.js";
-import { EditorContext } from "../../context.js";
-import { Form } from "../Form/Form.js";
-import { useEditorState } from "./hooks/useEditorState.js";
+import React from 'react';
+import { PageConstructor, PageConstructorProvider } from '../../../containers/PageConstructor';
+import { block } from '../../../utils';
+import AddBlock from '../../components/AddBlock/AddBlock';
+import { CodeEditor } from '../../components/CodeEditor/CodeEditor';
+import ControlPanel from '../../components/ControlPanel/ControlPanel';
+import { ErrorBoundary } from '../../components/ErrorBoundary/ErrorBoundary';
+import Layout from '../../components/Layout/Layout';
+import { PageSettings } from '../../components/PageSettings/PageSettings';
+import { EditorContext } from '../../context';
+import { Form } from '../Form/Form';
+import { useEditorState } from './hooks/useEditorState';
 import './Editor.css';
 const b = block('editor');
 export const Editor = (props) => {
     const { providerProps } = props;
     const { context, viewMode, editMode, constructorTheme, onThemeUpdate, onViewModeUpdate, onEditModeUpdate, isCodeEditMode, isFormEditMode, isDesktopViewMode, content, schema, onContentUpdate, code, codeValidator, codeFullscreeModeOn, onCodeFullscreeModeOnUpdate, activeBlockIndex, onSelect, isCodeOnlyMode, errorBoundaryState, outgoingProps, onAdd, } = useEditorState(props);
-    return (_jsxs(EditorContext.Provider, { value: context, children: [_jsx(ControlPanel, { viewMode: viewMode, onViewModeChange: onViewModeUpdate, editMode: editMode, onEditModeChange: onEditModeUpdate, theme: constructorTheme, className: b('panel'), onThemeChange: onThemeUpdate }), isFormEditMode && isDesktopViewMode && (_jsx(PageSettings, { content: content, schema: schema, onChange: onContentUpdate })), isCodeEditMode && (_jsx(CodeEditor, { code: code, onChange: onContentUpdate, validator: codeValidator, fullscreenModeOn: codeFullscreeModeOn, onFullscreenModeOnUpdate: onCodeFullscreeModeOnUpdate })), _jsxs(Layout, { editMode: editMode, viewMode: viewMode, children: [isFormEditMode && isDesktopViewMode && (_jsx(Layout.Left, { children: _jsx(Form, { content: content, onChange: onContentUpdate, activeBlockIndex: activeBlockIndex, schema: schema, onSelect: onSelect }) })), !isCodeOnlyMode && (_jsxs(Layout.Right, { children: [_jsx(ErrorBoundary, { children: _jsx(PageConstructorProvider, Object.assign({}, providerProps, { theme: constructorTheme, children: _jsx(PageConstructor, Object.assign({}, outgoingProps)) })) }, errorBoundaryState), isFormEditMode && _jsx(AddBlock, { onAdd: onAdd })] }))] })] }));
+    return (React.createElement(EditorContext.Provider, { value: context },
+        React.createElement(ControlPanel, { viewMode: viewMode, onViewModeChange: onViewModeUpdate, editMode: editMode, onEditModeChange: onEditModeUpdate, theme: constructorTheme, className: b('panel'), onThemeChange: onThemeUpdate }),
+        isFormEditMode && isDesktopViewMode && (React.createElement(PageSettings, { content: content, schema: schema, onChange: onContentUpdate })),
+        isCodeEditMode && (React.createElement(CodeEditor, { code: code, onChange: onContentUpdate, validator: codeValidator, fullscreenModeOn: codeFullscreeModeOn, onFullscreenModeOnUpdate: onCodeFullscreeModeOnUpdate })),
+        React.createElement(Layout, { editMode: editMode, viewMode: viewMode },
+            isFormEditMode && isDesktopViewMode && (React.createElement(Layout.Left, null,
+                React.createElement(Form, { content: content, onChange: onContentUpdate, activeBlockIndex: activeBlockIndex, schema: schema, onSelect: onSelect }))),
+            !isCodeOnlyMode && (React.createElement(Layout.Right, null,
+                React.createElement(ErrorBoundary, { key: errorBoundaryState },
+                    React.createElement(PageConstructorProvider, Object.assign({}, providerProps, { theme: constructorTheme }),
+                        React.createElement(PageConstructor, Object.assign({}, outgoingProps)))),
+                isFormEditMode && React.createElement(AddBlock, { onAdd: onAdd }))))));
 };
-//# sourceMappingURL=Editor.js.map

package/build/esm/editor/containers/Editor/hooks/useCode.d.ts

@@ -1,4 +1,4 @@
-import { PageContent } from "../../../../models/index.js";
+import { PageContent } from '../../../../models';
 type UseCodeProps = {
     content: PageContent;
     codeFullscreeModeOn: boolean;

package/build/esm/editor/containers/Editor/hooks/useCode.js

@@ -1,6 +1,6 @@
-import * as React from 'react';
+import { useEffect, useState } from 'react';
 import yaml from 'js-yaml';
-import usePreviousValue from "../../../hooks/usePreviousValue.js";
+import usePreviousValue from '../../../hooks/usePreviousValue';
 /**
  * Transorms PageConstructor content in JSON to YAML on code editor mode switching
  *
@@ -9,10 +9,10 @@ import usePreviousValue from "../../../hooks/usePreviousValue.js";
  */
 export function useCode({ content, codeFullscreeModeOn, isCodeEditMode }) {
     var _a;
-    const [code, setCode] = React.useState('');
+    const [code, setCode] = useState('');
     const prevContentLength = usePreviousValue((_a = content.blocks) === null || _a === void 0 ? void 0 : _a.length);
     const prevCodeFullscreeModeOn = usePreviousValue(codeFullscreeModeOn);
-    React.useEffect(() => {
+    useEffect(() => {
         var _a;
         const blocksCountChanged = prevContentLength !== ((_a = content.blocks) === null || _a === void 0 ? void 0 : _a.length);
         const codeModeSwitched = codeFullscreeModeOn !== prevCodeFullscreeModeOn;
@@ -22,4 +22,3 @@ export function useCode({ content, codeFullscreeModeOn, isCodeEditMode }) {
     }, [isCodeEditMode, content, prevContentLength, codeFullscreeModeOn, prevCodeFullscreeModeOn]);
     return code;
 }
-//# sourceMappingURL=useCode.js.map

package/build/esm/editor/containers/Editor/hooks/useEditorState.d.ts

@@ -1,38 +1,38 @@
-import { EditModeItem, EditorProps, ViewModeItem } from "../../../types/index.js";
+import { EditModeItem, EditorProps, ViewModeItem } from '../../../types';
 export declare const useEditorState: ({ customSchema, onChange, providerProps, transformContent, deviceEmulationSettings, theme: editorTheme, ...rest }: EditorProps) => {
     context: {
         constructorProps: {
-            content: import("../../../../index.js").PageContent;
-            custom: import("../../../../index.js").CustomConfig | undefined;
+            content: import("../../../../models").PageContent;
+            custom: import("../../../../models").CustomConfig | undefined;
         };
         providerProps: {
             isMobile: boolean;
-            theme: import("../../../../index.js").Theme;
-            locale?: import("../../../../context/localeContext/index.js").LocaleContextProps;
-            location?: import("../../../../context/locationContext/index.js").LocationContextProps;
-            ssrConfig?: import("../../../../context/ssrContext/index.js").SSRContextProps;
-            mapsContext?: import("../../../../context/mapsContext/mapsContext.js").MapsContextType;
-            projectSettings?: import("../../../../context/projectSettingsContext/index.js").ProjectSettingsContextProps;
-            analytics?: import("../../../../index.js").AnalyticsContextProps;
-            forms?: import("../../../../context/formsContext/index.js").FormsContextProps;
-            image?: import("../../../../context/imageContext/index.js").ImageContextProps;
+            theme: import("../../../../models").Theme;
+            locale?: import("../../../../context/localeContext").LocaleContextProps | undefined;
+            location?: import("../../../../context/locationContext").LocationContextProps | undefined;
+            ssrConfig?: import("../../../../context/ssrContext").SSRContextProps | undefined;
+            mapsContext?: import("../../../../context/mapsContext/mapsContext").MapsContextType | undefined;
+            projectSettings?: import("../../../../context/projectSettingsContext").ProjectSettingsContextProps | undefined;
+            analytics?: import("../../../..").AnalyticsContextProps | undefined;
+            forms?: import("../../../../context/formsContext").FormsContextProps | undefined;
+            image?: import("../../../../context/imageContext").ImageContextProps | undefined;
         };
-        deviceEmulationSettings: import("../../../index.js").DeviceEmulationSettings | undefined;
-        theme: import("../../../../index.js").Theme | undefined;
+        deviceEmulationSettings: import("../../../types").DeviceEmulationSettings | undefined;
+        theme: import("../../../../models").Theme | undefined;
     };
     viewMode: ViewModeItem;
     editMode: EditModeItem;
-    constructorTheme: import("../../../../index.js").Theme;
-    onThemeUpdate: (newTheme: import("../../../../index.js").Theme) => void;
+    constructorTheme: import("../../../../models").Theme;
+    onThemeUpdate: (newTheme: import("../../../../models").Theme) => void;
     onViewModeUpdate: (newViewMode: ViewModeItem) => void;
     onEditModeUpdate: (newEditMode: EditModeItem) => void;
     isCodeEditMode: boolean;
     isDesktopViewMode: boolean;
-    content: import("../../../../index.js").PageContent;
+    content: import("../../../../models").PageContent;
     schema: import("json-schema").JSONSchema4;
-    onContentUpdate: (newContent: import("../../../../index.js").PageContent) => void;
+    onContentUpdate: (newContent: import("../../../../models").PageContent) => void;
     code: string;
-    codeValidator: import("../../../hooks/useCodeValidator.js").CodeValidator;
+    codeValidator: import("../../../hooks/useCodeValidator").CodeValidator;
     codeFullscreeModeOn: boolean;
     onCodeFullscreeModeOnUpdate: (newCodeFullscreeModeOn: boolean) => void;
     activeBlockIndex: number;
@@ -40,10 +40,10 @@ export declare const useEditorState: ({ customSchema, onChange, providerProps, t
     isCodeOnlyMode: boolean;
     errorBoundaryState: number;
     outgoingProps: {
-        content: import("../../../../index.js").PageContent;
-        custom: import("../../../../index.js").CustomConfig | undefined;
+        content: import("../../../../models").PageContent;
+        custom: import("../../../../models").CustomConfig | undefined;
         viewMode: ViewModeItem;
     };
-    onAdd: (block: import("../../../../index.js").Block) => void;
+    onAdd: (block: import("../../../../models").Block) => void;
     isFormEditMode: boolean;
 };

package/build/esm/editor/containers/Editor/hooks/useEditorState.js

@@ -1,17 +1,15 @@
 import { __rest } from "tslib";
-import { createElement as _createElement } from "react";
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
-import { generateDefaultSchema } from "../../../../schema/index.js";
-import EditBlock from "../../../components/EditBlock/EditBlock.js";
-import { ErrorBoundary } from "../../../components/ErrorBoundary/ErrorBoundary.js";
-import { NotFoundBlock } from "../../../components/NotFoundBlock/NotFoundBlock.js";
-import { useCodeValidator } from "../../../hooks/useCodeValidator.js";
-import { useMainState } from "../../../store/main/index.js";
-import { useSettingsState } from "../../../store/settings/index.js";
-import { EditModeItem, ViewModeItem } from "../../../types/index.js";
-import { addCustomDecorator, checkIsMobile, getBlockId } from "../../../utils/index.js";
-import { useCode } from "./useCode.js";
+import React, { useEffect, useMemo } from 'react';
+import { generateDefaultSchema } from '../../../../schema';
+import EditBlock from '../../../components/EditBlock/EditBlock';
+import { ErrorBoundary } from '../../../components/ErrorBoundary/ErrorBoundary';
+import { NotFoundBlock } from '../../../components/NotFoundBlock/NotFoundBlock';
+import { useCodeValidator } from '../../../hooks/useCodeValidator';
+import { useMainState } from '../../../store/main';
+import { useSettingsState } from '../../../store/settings';
+import { EditModeItem, ViewModeItem } from '../../../types';
+import { addCustomDecorator, checkIsMobile, getBlockId } from '../../../utils';
+import { useCode } from './useCode';
 // Editor business logic
 export const useEditorState = (_a) => {
     var { customSchema, onChange, providerProps, transformContent, deviceEmulationSettings, theme: editorTheme } = _a, rest = __rest(_a, ["customSchema", "onChange", "providerProps", "transformContent", "deviceEmulationSettings", "theme"]);
@@ -22,17 +20,17 @@ export const useEditorState = (_a) => {
     const isFormEditMode = editMode === EditModeItem.Form;
     const isDesktopViewMode = viewMode === ViewModeItem.Desktop;
     const isCodeOnlyMode = codeFullscreeModeOn && isCodeEditMode;
-    const transformedContent = React.useMemo(() => (transformContent ? transformContent(content, { viewMode, editMode }) : content), [content, transformContent, viewMode, editMode]);
-    const schema = React.useMemo(() => generateDefaultSchema(customSchema), [customSchema]);
+    const transformedContent = useMemo(() => (transformContent ? transformContent(content, { viewMode, editMode }) : content), [content, transformContent, viewMode, editMode]);
+    const schema = useMemo(() => generateDefaultSchema(customSchema), [customSchema]);
     const codeValidator = useCodeValidator(schema);
-    const outgoingProps = React.useMemo(() => {
+    const outgoingProps = useMemo(() => {
         const custom = isCodeEditMode || isViewEditMode
             ? rest.custom
             : addCustomDecorator([
-                (props) => _jsx(NotFoundBlock, Object.assign({}, props)),
-                (props) => (_jsx(EditBlock, Object.assign({}, injectEditBlockProps(props)))),
+                (props) => React.createElement(NotFoundBlock, Object.assign({}, props)),
+                (props) => (React.createElement(EditBlock, Object.assign({}, injectEditBlockProps(props)))),
                 // need errorBoundaryState flag to reset error on content update
-                (props) => (_createElement(ErrorBoundary, Object.assign({}, props, { key: `${getBlockId(props)}-${errorBoundaryState}` }))),
+                (props) => (React.createElement(ErrorBoundary, Object.assign({}, props, { key: `${getBlockId(props)}-${errorBoundaryState}` }))),
             ], rest.custom);
         return {
             content: transformedContent,
@@ -48,7 +46,7 @@ export const useEditorState = (_a) => {
         isCodeEditMode,
         isViewEditMode,
     ]);
-    const context = React.useMemo(() => ({
+    const context = useMemo(() => ({
         constructorProps: {
             content: transformedContent,
             custom: rest.custom,
@@ -65,7 +63,7 @@ export const useEditorState = (_a) => {
         constructorTheme,
         editorTheme,
     ]);
-    React.useEffect(() => {
+    useEffect(() => {
         onChange === null || onChange === void 0 ? void 0 : onChange(content);
     }, [content, onChange]);
     const code = useCode({ isCodeEditMode, content, codeFullscreeModeOn });
@@ -95,4 +93,3 @@ export const useEditorState = (_a) => {
         isFormEditMode,
     };
 };
-//# sourceMappingURL=useEditorState.js.map

package/build/esm/editor/containers/Form/Form.d.ts

@@ -1,6 +1,6 @@
-import * as React from 'react';
+import React from 'react';
 import { JSONSchema4 } from 'json-schema';
-import { PageContent } from "../../../models/index.js";
+import { PageContent } from '../../../models';
 import './Form.css';
 export interface FormProps {
     content: PageContent;
@@ -9,4 +9,4 @@ export interface FormProps {
     onChange: (content: PageContent) => void;
     onSelect: (index: number) => void;
 }
-export declare const Form: React.MemoExoticComponent<({ content, onChange, activeBlockIndex, onSelect, schema }: FormProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Form: React.MemoExoticComponent<({ content, onChange, activeBlockIndex, onSelect, schema }: FormProps) => JSX.Element>;

package/build/esm/editor/containers/Form/Form.js

@@ -1,23 +1,24 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
+import React, { memo } from 'react';
 import { Text } from '@gravity-ui/uikit';
-import { block, getBlockKey } from "../../../utils/index.js";
-import { BlockForm } from "../../components/BlockForm/BlockForm.js";
-import useFormSpec from "../../hooks/useFormSpec.js";
+import { block, getBlockKey } from '../../../utils';
+import { BlockForm } from '../../components/BlockForm/BlockForm';
+import useFormSpec from '../../hooks/useFormSpec';
 import './Form.css';
 const b = block('editor-form');
 // TODO in https://github.com/gravity-ui/page-constructor/issues/884 this component will be extremely refactor
-export const Form = React.memo(({ content, onChange, activeBlockIndex, onSelect, schema }) => {
+export const Form = memo(({ content, onChange, activeBlockIndex, onSelect, schema }) => {
     const { blocks } = content || {};
     const spec = useFormSpec(schema);
     const { blocks: blocksSpec } = spec || {};
-    return (_jsxs("div", { className: b(), children: [_jsx(Text, { variant: "body-2", children: 'Blocks' }), blocks.map((blockData, index) => blocksSpec[blockData.type] ? (_jsx("div", { className: b('block-form'), children: _jsx(BlockForm, { spec: blocksSpec[blockData.type], data: blockData, active: activeBlockIndex === index, onChange: (data) => {
-                        onChange(Object.assign(Object.assign({}, content), { blocks: [
-                                ...blocks.slice(0, index),
-                                data,
-                                ...blocks.slice(index + 1),
-                            ] }));
-                    }, onSelect: () => onSelect(index) }) }, getBlockKey(blockData, index))) : null)] }));
+    return (React.createElement("div", { className: b() },
+        React.createElement(Text, { variant: "body-2" }, 'Blocks'),
+        blocks.map((blockData, index) => blocksSpec[blockData.type] ? (React.createElement("div", { className: b('block-form'), key: getBlockKey(blockData, index) },
+            React.createElement(BlockForm, { spec: blocksSpec[blockData.type], data: blockData, active: activeBlockIndex === index, onChange: (data) => {
+                    onChange(Object.assign(Object.assign({}, content), { blocks: [
+                            ...blocks.slice(0, index),
+                            data,
+                            ...blocks.slice(index + 1),
+                        ] }));
+                }, onSelect: () => onSelect(index) }))) : null)));
 });
 Form.displayName = 'Form';
-//# sourceMappingURL=Form.js.map

package/build/esm/editor/context.d.ts

@@ -1,7 +1,7 @@
-import * as React from 'react';
-import { PageConstructorProps, PageConstructorProviderProps } from "../containers/PageConstructor/index.js";
-import { Theme } from "../models/common.js";
-import { EditorProps } from "./types/index.js";
+import React from 'react';
+import { PageConstructorProps, PageConstructorProviderProps } from '../containers/PageConstructor';
+import { Theme } from '../models/common';
+import { EditorProps } from './types';
 export interface EditorContextType {
     constructorProps?: PageConstructorProps;
     providerProps?: PageConstructorProviderProps;

package/build/esm/editor/context.js

@@ -1,3 +1,2 @@
-import * as React from 'react';
+import React from 'react';
 export const EditorContext = React.createContext({});
-//# sourceMappingURL=context.js.map

package/build/esm/editor/data/index.d.ts

@@ -1,4 +1,5 @@
-import { Block, BlockType } from "../../models/index.js";
+/// <reference types="react" />
+import { Block, BlockType } from '../../models';
 export type PreviewComponent = React.FunctionComponent<React.SVGProps<SVGSVGElement>>;
 export interface EdiorBlockData {
     template: Block;

package/build/esm/editor/data/index.js

@@ -1,7 +1,7 @@
-import { BlockType } from "../../models/index.js";
-import { formatBlockName } from "../utils/index.js";
-import DefaultPreview from "./previews/default-preview.js";
-import HeaderBlock from "./previews/header-block.js";
+import { BlockType } from '../../models';
+import { formatBlockName } from '../utils';
+import DefaultPreview from './previews/default-preview';
+import HeaderBlock from './previews/header-block';
 const getBlockTemplate = (blockType) => import(`./templates/${blockType}.json`).then((data) => data.default);
 const getBlockPreview = (blockType) => {
     try {
@@ -28,4 +28,3 @@ async function getEditorBlocksData() {
     return EdiorBlockData;
 }
 export { getEditorBlocksData };
-//# sourceMappingURL=index.js.map

package/build/esm/editor/data/previews/default-preview.d.ts

@@ -1,3 +1,3 @@
-import * as React from 'react';
+import React from 'react';
 declare const DefaultPreview: React.FC<React.SVGProps<SVGSVGElement>>;
 export default DefaultPreview;

package/build/esm/editor/data/previews/default-preview.js

@@ -1,5 +1,15 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { a11yHiddenSvgProps } from "../../../utils/svg.js";
-const DefaultPreview = (props) => (_jsxs("svg", Object.assign({ width: "150", height: "76", viewBox: "0 0 150 76", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, a11yHiddenSvgProps, props, { children: [_jsx("rect", { x: "1", y: "1", width: "148", height: "74", rx: "8", fill: "white" }), _jsx("rect", { x: "14.7674", y: "21.6512", width: "28.3953", height: "6.88372", rx: "0.860465", fill: "#E7E7E7" }), _jsx("rect", { x: "43.1628", y: "21.6512", width: "28.3953", height: "6.88372", rx: "0.860465", fill: "white" }), _jsx("rect", { x: "14.7674", y: "31.9767", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "#E7E7E7" }), _jsx("rect", { x: "14.7675", y: "37.1395", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "#E7E7E7" }), _jsx("rect", { x: "14.7675", y: "42.3023", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "#E7E7E7" }), _jsx("rect", { x: "14.7674", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "#E7E7E7" }), _jsx("rect", { x: "33.6977", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "white" }), _jsx("rect", { x: "52.6279", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "white" }), _jsx("rect", { x: "78.4418", y: "9.60464", width: "56.7907", height: "56.7907", rx: "5.16279", fill: "currentColor" }), _jsx("rect", { x: "0.5", y: "0.5", width: "149", height: "75", rx: "8.5", stroke: "black", strokeOpacity: "0.1" })] })));
+import React from 'react';
+import { a11yHiddenSvgProps } from '../../../utils/svg';
+const DefaultPreview = (props) => (React.createElement("svg", Object.assign({ width: "150", height: "76", viewBox: "0 0 150 76", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, a11yHiddenSvgProps, props),
+    React.createElement("rect", { x: "1", y: "1", width: "148", height: "74", rx: "8", fill: "white" }),
+    React.createElement("rect", { x: "14.7674", y: "21.6512", width: "28.3953", height: "6.88372", rx: "0.860465", fill: "#E7E7E7" }),
+    React.createElement("rect", { x: "43.1628", y: "21.6512", width: "28.3953", height: "6.88372", rx: "0.860465", fill: "white" }),
+    React.createElement("rect", { x: "14.7674", y: "31.9767", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "#E7E7E7" }),
+    React.createElement("rect", { x: "14.7675", y: "37.1395", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "#E7E7E7" }),
+    React.createElement("rect", { x: "14.7675", y: "42.3023", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "#E7E7E7" }),
+    React.createElement("rect", { x: "14.7674", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "#E7E7E7" }),
+    React.createElement("rect", { x: "33.6977", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "white" }),
+    React.createElement("rect", { x: "52.6279", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "white" }),
+    React.createElement("rect", { x: "78.4418", y: "9.60464", width: "56.7907", height: "56.7907", rx: "5.16279", fill: "currentColor" }),
+    React.createElement("rect", { x: "0.5", y: "0.5", width: "149", height: "75", rx: "8.5", stroke: "black", strokeOpacity: "0.1" })));
 export default DefaultPreview;
-//# sourceMappingURL=default-preview.js.map

package/build/esm/editor/data/previews/header-block.d.ts

@@ -1,3 +1,3 @@
-import * as React from 'react';
+import React from 'react';
 declare const Header: React.FC<React.SVGProps<SVGSVGElement>>;
 export default Header;

package/build/esm/editor/data/previews/header-block.js

@@ -1,5 +1,16 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { a11yHiddenSvgProps } from "../../../utils/svg.js";
-const Header = (props) => (_jsxs("svg", Object.assign({ width: "150", height: "76", viewBox: "0 0 150 76", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, a11yHiddenSvgProps, props, { children: [_jsx("rect", { x: "1", y: "1", width: "148", height: "74", rx: "8", fill: "white" }), _jsx("rect", { x: "4.44174", y: "9.60464", width: "141.116", height: "56.7907", rx: "5.16279", fill: "currentColor" }), _jsx("rect", { x: "14.7674", y: "21.6512", width: "28.3953", height: "6.88372", rx: "0.860465", fill: "white" }), _jsx("rect", { x: "43.1628", y: "21.6512", width: "28.3953", height: "6.88372", rx: "0.860465", fill: "currentColor" }), _jsx("rect", { x: "14.7674", y: "31.9767", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "white" }), _jsx("rect", { x: "14.7674", y: "37.1395", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "white" }), _jsx("rect", { x: "14.7674", y: "42.3023", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "white" }), _jsx("rect", { x: "14.7674", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "white" }), _jsx("rect", { x: "33.6976", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "currentColor" }), _jsx("rect", { x: "52.6279", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "currentColor" }), _jsx("rect", { x: "78.4418", y: "9.60464", width: "56.7907", height: "56.7907", rx: "5.16279", fill: "currentColor" }), _jsx("rect", { x: "0.5", y: "0.5", width: "149", height: "75", rx: "8.5", stroke: "black", strokeOpacity: "0.1" })] })));
+import React from 'react';
+import { a11yHiddenSvgProps } from '../../../utils/svg';
+const Header = (props) => (React.createElement("svg", Object.assign({ width: "150", height: "76", viewBox: "0 0 150 76", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, a11yHiddenSvgProps, props),
+    React.createElement("rect", { x: "1", y: "1", width: "148", height: "74", rx: "8", fill: "white" }),
+    React.createElement("rect", { x: "4.44174", y: "9.60464", width: "141.116", height: "56.7907", rx: "5.16279", fill: "currentColor" }),
+    React.createElement("rect", { x: "14.7674", y: "21.6512", width: "28.3953", height: "6.88372", rx: "0.860465", fill: "white" }),
+    React.createElement("rect", { x: "43.1628", y: "21.6512", width: "28.3953", height: "6.88372", rx: "0.860465", fill: "currentColor" }),
+    React.createElement("rect", { x: "14.7674", y: "31.9767", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "white" }),
+    React.createElement("rect", { x: "14.7674", y: "37.1395", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "white" }),
+    React.createElement("rect", { x: "14.7674", y: "42.3023", width: "56.7907", height: "3.44186", rx: "0.860465", fill: "white" }),
+    React.createElement("rect", { x: "14.7674", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "white" }),
+    React.createElement("rect", { x: "33.6976", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "currentColor" }),
+    React.createElement("rect", { x: "52.6279", y: "49.186", width: "18.9302", height: "5.16279", rx: "0.860465", fill: "currentColor" }),
+    React.createElement("rect", { x: "78.4418", y: "9.60464", width: "56.7907", height: "56.7907", rx: "5.16279", fill: "currentColor" }),
+    React.createElement("rect", { x: "0.5", y: "0.5", width: "149", height: "75", rx: "8.5", stroke: "black", strokeOpacity: "0.1" })));
 export default Header;
-//# sourceMappingURL=header-block.js.map

package/build/esm/editor/dynamic-forms-custom/components/OneOfCustom/OneOfCustom.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 import { ObjectIndependentInputProps } from '@gravity-ui/dynamic-forms';
 import './OneOfCustom.css';
 /**

package/build/esm/editor/dynamic-forms-custom/components/OneOfCustom/OneOfCustom.js

@@ -1,10 +1,9 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
+import React, { useMemo } from 'react';
 import { Controller, GroupIndent, SpecTypes, transformArrOut, } from '@gravity-ui/dynamic-forms';
 import Ajv from 'ajv';
 import isEmpty from 'lodash/isEmpty';
-import { block } from "../../../../utils/index.js";
-import { getSpecTypeDefaultValue, useOneOf } from "../../hooks/useOneOf.js";
+import { block } from '../../../../utils';
+import { getSpecTypeDefaultValue, useOneOf } from '../../hooks/useOneOf';
 import './OneOfCustom.css';
 const b = block('one-of-custom');
 const ajv = new Ajv({
@@ -43,7 +42,7 @@ export const OneOfCustom = (props) => {
     const { spec, input, name } = props;
     const { properties } = spec;
     //getting oneOf option type from initial value
-    const valueType = React.useMemo(() => {
+    const valueType = useMemo(() => {
         var _a;
         return (properties &&
             ((_a = Object.keys(properties)) === null || _a === void 0 ? void 0 : _a.find((key) => {
@@ -62,6 +61,8 @@ export const OneOfCustom = (props) => {
     }, [input]);
     const parentOnUnmount = React.useCallback((childName) => input.onChange((currentValue) => currentValue, { [childName]: false }), [input]);
     const valueSpecType = ((_a = specProperties[oneOfValue]) === null || _a === void 0 ? void 0 : _a.type) || SpecTypes.Object;
-    return (_jsxs("div", { className: b(), children: [_jsx("div", { children: toggler }), specProperties[oneOfValue] && (_jsx(GroupIndent, { children: _jsx(Controller, { value: getControllerDefautValue(input.value, valueSpecType), name: name, spec: specProperties[oneOfValue], parentOnChange: parentOnChange, parentOnUnmount: parentOnUnmount }, `${name}.${oneOfValue}`) }))] }));
+    return (React.createElement("div", { className: b() },
+        React.createElement("div", null, toggler),
+        specProperties[oneOfValue] && (React.createElement(GroupIndent, null,
+            React.createElement(Controller, { value: getControllerDefautValue(input.value, valueSpecType), name: name, spec: specProperties[oneOfValue], parentOnChange: parentOnChange, parentOnUnmount: parentOnUnmount, key: `${name}.${oneOfValue}` })))));
 };
-//# sourceMappingURL=OneOfCustom.js.map

package/build/esm/editor/dynamic-forms-custom/config.js

@@ -1,11 +1,9 @@
 import { dynamicConfig as libConfig } from '@gravity-ui/dynamic-forms';
 import cloneDeep from 'lodash/cloneDeep';
-import { OneOfCustom } from "./components/OneOfCustom/OneOfCustom.js";
+import { OneOfCustom } from './components/OneOfCustom/OneOfCustom';
 const getDynamicConfig = () => {
     const dynamicConfig = cloneDeep(libConfig);
-    // @ts-ignore
     dynamicConfig.object.inputs['oneof_custom'] = { Component: OneOfCustom, independent: true };
     return dynamicConfig;
 };
 export const dynamicConfig = getDynamicConfig();
-//# sourceMappingURL=config.js.map

package/build/esm/editor/dynamic-forms-custom/hooks/useOneOf.d.ts

@@ -6,7 +6,7 @@ export interface UseOneOfParams {
 export declare const getSpecTypeDefaultValue: (type: SpecTypes) => {} | undefined;
 export declare const useOneOf: ({ props, onTogglerChange }: UseOneOfParams) => {
     oneOfValue: string;
-    specProperties: Record<string, Spec>;
-    toggler: import("react/jsx-runtime").JSX.Element;
-    togglerInput: import("react/jsx-runtime").JSX.Element;
+    specProperties: Record<string, Spec<any, undefined, undefined>>;
+    toggler: JSX.Element;
+    togglerInput: JSX.Element;
 };

package/build/esm/editor/dynamic-forms-custom/hooks/useOneOf.js

@@ -1,7 +1,6 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
+import React from 'react';
 import { SpecTypes, } from '@gravity-ui/dynamic-forms';
-import { SegmentedRadioGroup, Select } from '@gravity-ui/uikit';
+import { RadioButton, Select } from '@gravity-ui/uikit';
 import isObjectLike from 'lodash/isObjectLike';
 import some from 'lodash/some';
 const MAX_TAB_TITLE_LENGTH = 20;
@@ -57,16 +56,15 @@ export const useOneOf = ({ props, onTogglerChange }) => {
             ((oneOfParams === null || oneOfParams === void 0 ? void 0 : oneOfParams.toggler) === 'select' ||
                 options.length > 3 ||
                 some(options, ({ title }) => title.length > MAX_TAB_TITLE_LENGTH))) {
-            return (_jsx(Select, { width: "max", value: [oneOfValue], onUpdate: onOneOfChange, options: options, disabled: disabled, filterable: options.length > 7, qa: name }));
+            return (React.createElement(Select, { width: "max", value: [oneOfValue], onUpdate: onOneOfChange, options: options, disabled: disabled, filterable: options.length > 7, qa: name }));
         }
-        return (_jsx(SegmentedRadioGroup, { value: oneOfValue, onChange: (event) => onOneOfChange([event.target.value]), disabled: disabled, qa: name, children: options.map(({ value, title }) => (_jsx(SegmentedRadioGroup.Option, { value: value, children: title }, value))) }));
+        return (React.createElement(RadioButton, { value: oneOfValue, onChange: (event) => onOneOfChange([event.target.value]), disabled: disabled, qa: name }, options.map(({ value, title }) => (React.createElement(RadioButton.Option, { key: value, value: value }, title)))));
     }, [options, oneOfValue, onOneOfChange, name, oneOfParams === null || oneOfParams === void 0 ? void 0 : oneOfParams.toggler, disabled]);
     const toggler = React.useMemo(() => {
         if (Layout) {
-            return _jsx(Layout, Object.assign({}, props, { children: togglerInput }));
+            return React.createElement(Layout, Object.assign({}, props), togglerInput);
         }
         return togglerInput;
     }, [Layout, togglerInput, props]);
     return { oneOfValue, specProperties, toggler, togglerInput };
 };
-//# sourceMappingURL=useOneOf.js.map

package/build/esm/editor/dynamic-forms-custom/parser/detect.d.ts

@@ -1,4 +1,4 @@
-import { Schema } from "../../../schema/index.js";
+import { Schema } from '../../../schema';
 export declare enum ParserType {
     Object = "object",
     Array = "array",

package/build/esm/editor/dynamic-forms-custom/parser/detect.js

@@ -30,4 +30,3 @@ export const detectParserType = (data) => {
     }
     return ParserType.Primitive;
 };
-//# sourceMappingURL=detect.js.map

package/build/esm/editor/dynamic-forms-custom/parser/index.d.ts

@@ -1,5 +1,5 @@
-import { Schema } from "../../../schema/index.js";
-import { FormSpecs } from "./types.js";
+import { Schema } from '../../../schema';
+import { FormSpecs } from './types';
 declare class FormSpecParser {
     private schema;
     private definitions;

package/build/esm/editor/dynamic-forms-custom/parser/index.js

@@ -2,8 +2,8 @@ import { __rest } from "tslib";
 /* eslint-disable no-param-reassign */
 /* eslint-disable no-not-accumulator-reassign/no-not-accumulator-reassign */
 import { SpecTypes } from '@gravity-ui/dynamic-forms';
-import { ParserType, detectParserType } from "./detect.js";
-import { getArrayViewSpec, getObjectViewSpec, getOneOfViewSpec, getPrimitiveViewSpec } from "./views.js";
+import { ParserType, detectParserType } from './detect';
+import { getArrayViewSpec, getObjectViewSpec, getOneOfViewSpec, getPrimitiveViewSpec } from './views';
 class FormSpecParser {
     constructor() {
         this.schema = {};
@@ -183,4 +183,3 @@ class FormSpecParser {
     }
 }
 export default new FormSpecParser();
-//# sourceMappingURL=index.js.map

package/build/esm/editor/dynamic-forms-custom/parser/types.d.ts

@@ -1,5 +1,5 @@
 import { Spec as DynamicFormSpec, ObjectSpec } from '@gravity-ui/dynamic-forms';
-import { Schema } from "../../../schema/index.js";
+import { Schema } from '../../../schema';
 export type OneOfSpec = {
     oneOf: DynamicFormSpec[];
     viewSpec: ObjectSpec['viewSpec'];

package/build/esm/editor/dynamic-forms-custom/parser/types.js

@@ -1,2 +1 @@
 export {};
-//# sourceMappingURL=types.js.map

package/build/esm/editor/dynamic-forms-custom/parser/views.d.ts

@@ -1,5 +1,5 @@
-import { Schema } from "../../../schema/index.js";
-import { CustomObjectSpec, CustomSpec } from "./types.js";
+import { Schema } from '../../../schema';
+import { CustomObjectSpec, CustomSpec } from './types';
 interface BaseParams {
     layoutTitle?: string;
 }

package/build/esm/editor/dynamic-forms-custom/parser/views.js

@@ -37,4 +37,3 @@ export const getPrimitiveViewSpec = (_a) => {
         layoutTitle,
     };
 };
-//# sourceMappingURL=views.js.map