@gravity-ui/page-constructor 6.3.2-alpha.3 → 6.5.0

package/build/cjs/editor-v2/containers/Overlay/Overlay.js

@@ -1,90 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const icons_1 = require("@gravity-ui/icons");
-const uikit_1 = require("@gravity-ui/uikit");
-const React = tslib_1.__importStar(require("react"));
-const postMessage_1 = require("../../../common/postMessage.js");
-const useMainEditorStore_1 = require("../../hooks/useMainEditorStore.js");
-const cn_1 = require("../../utils/cn.js");
-const b = (0, cn_1.editorCn)('overlay');
-const Overlay = ({ className, canvasElement }) => {
-    const { height, selectedBlock, setSelectedBlock, deleteBlock, duplicateBlock, manipulateOverlayMode, reorderBlock, } = (0, useMainEditorStore_1.useMainEditorStore)();
-    const [insertLineBox, setInsertLineBox] = React.useState(undefined);
-    const [hoverBorders, setHoverBorders] = React.useState(null);
-    const [blockBorders, setBlockBorders] = React.useState(null);
-    // Listen for updates to the selected block's position
-    (0, postMessage_1.usePostMessageAPIListener)('ON_UPDATE_BLOCK_SELECTION', ({ rect }) => {
-        setBlockBorders(rect || null);
-    });
-    // Update blockBorders when selectedBlock changes
-    React.useEffect(() => {
-        if (!selectedBlock) {
-            setBlockBorders(null);
-        }
-    }, [selectedBlock]);
-    // Auto scroll to the selected block when blockBorders changes
-    React.useEffect(() => {
-        if (blockBorders && canvasElement) {
-            // Calculate the scroll position to center the block in the viewport
-            const canvasHeight = canvasElement.clientHeight;
-            const scrollPosition = blockBorders.top - canvasHeight / 2 + blockBorders.height / 2;
-            // Scroll the canvas element to the calculated position with smooth behavior
-            canvasElement.scrollTo({
-                top: Math.max(0, scrollPosition),
-                behavior: 'smooth',
-            });
-        }
-    }, [blockBorders, canvasElement]);
-    const margin = 0;
-    (0, postMessage_1.usePostMessageAPIListener)('ON_HOVER_BLOCK', ({ rect, position }) => {
-        setHoverBorders(rect || null);
-        if (rect && position) {
-            setInsertLineBox({
-                left: rect.x,
-                top: rect.y,
-                height: rect.height,
-                width: rect.width,
-                position: position,
-            });
-        }
-    });
-    (0, postMessage_1.usePostMessageAPIListener)('ON_CLICK_BLOCK', ({ path }) => {
-        setSelectedBlock(path);
-    });
-    const handleMoveUp = () => {
-        if (!selectedBlock)
-            return;
-        const destination = [...selectedBlock];
-        destination[destination.length - 1] = destination[destination.length - 1] - 1;
-        reorderBlock(selectedBlock, destination, 'prepend');
-    };
-    const handleMoveDown = () => {
-        if (!selectedBlock)
-            return;
-        const destination = [...selectedBlock];
-        destination[destination.length - 1] = destination[destination.length - 1] + 1;
-        reorderBlock(selectedBlock, destination, 'append');
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b(null, className), style: { height: `${height}px` }, children: [blockBorders ? ((0, jsx_runtime_1.jsx)("div", { className: b('border'), style: {
-                    top: blockBorders.top - margin,
-                    left: blockBorders.left - margin,
-                    width: blockBorders.width + margin * 2,
-                    height: blockBorders.height + margin * 2,
-                }, children: (0, jsx_runtime_1.jsxs)("div", { className: b('actions'), children: [(0, jsx_runtime_1.jsx)("div", { className: b('actions-box', { reorder: true }), children: (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat", size: 'm', onClick: handleMoveUp, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.ChevronUp, size: 18 }) }) }), (0, jsx_runtime_1.jsxs)("div", { className: b('actions-box', { main: true }), children: [(0, jsx_runtime_1.jsx)(uikit_1.Button, { className: b('action-button'), size: 'm', view: 'action', onClick: () => selectedBlock && duplicateBlock(selectedBlock), children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Copy, size: 18 }) }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { className: b('action-button'), size: 'm', view: 'action', onClick: () => selectedBlock && deleteBlock(selectedBlock), children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.TrashBin, size: 18 }) })] }), (0, jsx_runtime_1.jsx)("div", { className: b('actions-box', { reorder: true }), children: (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat", size: 'm', onClick: handleMoveDown, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.ChevronDown, size: 18 }) }) })] }) })) : null, hoverBorders ? ((0, jsx_runtime_1.jsx)("div", { className: b('border', { hover: true }), style: {
-                    top: hoverBorders.top - margin,
-                    left: hoverBorders.left - margin,
-                    width: hoverBorders.width + margin * 2,
-                    height: hoverBorders.height + margin * 2,
-                } })) : null, manipulateOverlayMode && hoverBorders && insertLineBox ? ((0, jsx_runtime_1.jsx)("div", { className: b('line', {
-                    position: insertLineBox.position,
-                }), style: {
-                    top: hoverBorders.top,
-                    left: hoverBorders.left,
-                    width: hoverBorders.width,
-                    height: hoverBorders.height,
-                } })) : null] }));
-};
-exports.default = Overlay;
-//# sourceMappingURL=Overlay.js.map

package/build/cjs/editor-v2/containers/Overlay/Overlay.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Overlay.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/Overlay/Overlay.tsx"],"names":[],"mappings":"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","sourcesContent":["import {ChevronDown, ChevronUp, Copy, TrashBin} from '@gravity-ui/icons';\nimport {Button, Icon} from '@gravity-ui/uikit';\nimport * as React from 'react';\n\nimport {usePostMessageAPIListener} from '../../../common/postMessage';\nimport {useMainEditorStore} from '../../hooks/useMainEditorStore';\nimport {editorCn} from '../../utils/cn';\n\nimport './Overlay.scss';\n\nconst b = editorCn('overlay');\n\ninterface OverlayProps {\n    className?: string;\n    canvasElement?: HTMLDivElement | null;\n}\ninterface InsertLineProps {\n    top: number;\n    left: number;\n    height: number;\n    width: number;\n    position: string;\n}\n\nconst Overlay = ({className, canvasElement}: OverlayProps) => {\n    const {\n        height,\n        selectedBlock,\n        setSelectedBlock,\n        deleteBlock,\n        duplicateBlock,\n        manipulateOverlayMode,\n        reorderBlock,\n    } = useMainEditorStore();\n    const [insertLineBox, setInsertLineBox] = React.useState<InsertLineProps | undefined>(\n        undefined,\n    );\n    const [hoverBorders, setHoverBorders] = React.useState<DOMRect | null>(null);\n    const [blockBorders, setBlockBorders] = React.useState<DOMRect | null>(null);\n\n    // Listen for updates to the selected block's position\n    usePostMessageAPIListener('ON_UPDATE_BLOCK_SELECTION', ({rect}) => {\n        setBlockBorders(rect || null);\n    });\n\n    // Update blockBorders when selectedBlock changes\n    React.useEffect(() => {\n        if (!selectedBlock) {\n            setBlockBorders(null);\n        }\n    }, [selectedBlock]);\n\n    // Auto scroll to the selected block when blockBorders changes\n    React.useEffect(() => {\n        if (blockBorders && canvasElement) {\n            // Calculate the scroll position to center the block in the viewport\n            const canvasHeight = canvasElement.clientHeight;\n            const scrollPosition = blockBorders.top - canvasHeight / 2 + blockBorders.height / 2;\n\n            // Scroll the canvas element to the calculated position with smooth behavior\n            canvasElement.scrollTo({\n                top: Math.max(0, scrollPosition),\n                behavior: 'smooth',\n            });\n        }\n    }, [blockBorders, canvasElement]);\n\n    const margin = 0;\n\n    usePostMessageAPIListener('ON_HOVER_BLOCK', ({rect, position}) => {\n        setHoverBorders(rect || null);\n        if (rect && position) {\n            setInsertLineBox({\n                left: rect.x,\n                top: rect.y,\n                height: rect.height,\n                width: rect.width,\n                position: position,\n            });\n        }\n    });\n\n    usePostMessageAPIListener('ON_CLICK_BLOCK', ({path}) => {\n        setSelectedBlock(path);\n    });\n\n    const handleMoveUp = () => {\n        if (!selectedBlock) return;\n        const destination = [...selectedBlock];\n        destination[destination.length - 1] = destination[destination.length - 1] - 1;\n        reorderBlock(selectedBlock, destination, 'prepend');\n    };\n\n    const handleMoveDown = () => {\n        if (!selectedBlock) return;\n        const destination = [...selectedBlock];\n        destination[destination.length - 1] = destination[destination.length - 1] + 1;\n        reorderBlock(selectedBlock, destination, 'append');\n    };\n\n    return (\n        <div className={b(null, className)} style={{height: `${height}px`}}>\n            {blockBorders ? (\n                <div\n                    className={b('border')}\n                    style={{\n                        top: blockBorders.top - margin,\n                        left: blockBorders.left - margin,\n                        width: blockBorders.width + margin * 2,\n                        height: blockBorders.height + margin * 2,\n                    }}\n                >\n                    <div className={b('actions')}>\n                        <div className={b('actions-box', {reorder: true})}>\n                            <Button view=\"flat\" size={'m'} onClick={handleMoveUp}>\n                                <Icon data={ChevronUp} size={18} />\n                            </Button>\n                        </div>\n                        <div className={b('actions-box', {main: true})}>\n                            <Button\n                                className={b('action-button')}\n                                size={'m'}\n                                view={'action'}\n                                onClick={() => selectedBlock && duplicateBlock(selectedBlock)}\n                            >\n                                <Icon data={Copy} size={18} />\n                            </Button>\n                            <Button\n                                className={b('action-button')}\n                                size={'m'}\n                                view={'action'}\n                                onClick={() => selectedBlock && deleteBlock(selectedBlock)}\n                            >\n                                <Icon data={TrashBin} size={18} />\n                            </Button>\n                        </div>\n                        <div className={b('actions-box', {reorder: true})}>\n                            <Button view=\"flat\" size={'m'} onClick={handleMoveDown}>\n                                <Icon data={ChevronDown} size={18} />\n                            </Button>\n                        </div>\n                    </div>\n                </div>\n            ) : null}\n            {hoverBorders ? (\n                <div\n                    className={b('border', {hover: true})}\n                    style={{\n                        top: hoverBorders.top - margin,\n                        left: hoverBorders.left - margin,\n                        width: hoverBorders.width + margin * 2,\n                        height: hoverBorders.height + margin * 2,\n                    }}\n                ></div>\n            ) : null}\n            {manipulateOverlayMode && hoverBorders && insertLineBox ? (\n                <div\n                    className={b('line', {\n                        position: insertLineBox.position,\n                    })}\n                    style={{\n                        top: hoverBorders.top,\n                        left: hoverBorders.left,\n                        width: hoverBorders.width,\n                        height: hoverBorders.height,\n                    }}\n                />\n            ) : null}\n        </div>\n    );\n};\n\nexport default Overlay;\n"]}

package/build/cjs/editor-v2/containers/Source/Source.css

@@ -1,14 +0,0 @@
-.pceditor-source {
-  width: 100%;
-  display: inline-flex;
-  box-sizing: border-box;
-  align-items: center;
-  flex-direction: row;
-  padding: 16px 12px;
-}
-.pceditor-source__icon {
-  flex: 0 0 auto;
-}
-.pceditor-source__text {
-  flex: 1;
-}

package/build/cjs/editor-v2/containers/Source/Source.d.ts

@@ -1,2 +0,0 @@
-declare const Source: () => import("react/jsx-runtime").JSX.Element;
-export default Source;

package/build/cjs/editor-v2/containers/Source/Source.js

@@ -1,28 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const icons_1 = require("@gravity-ui/icons");
-const uikit_1 = require("@gravity-ui/uikit");
-const React = tslib_1.__importStar(require("react"));
-const iframeContext_1 = require("../../context/iframeContext/index.js");
-const useMainEditorStore_1 = require("../../hooks/useMainEditorStore.js");
-const cn_1 = require("../../utils/cn.js");
-const b = (0, cn_1.editorCn)('source');
-const Source = () => {
-    const { resetInitialize } = (0, useMainEditorStore_1.useMainEditorStore)();
-    const { disableUrlField, url, setUrl } = React.useContext(iframeContext_1.IframeContext);
-    const onUpdateUrl = React.useCallback((value) => {
-        setUrl(value);
-        resetInitialize();
-    }, [resetInitialize, setUrl]);
-    const reloadIframe = () => {
-        setUrl('');
-        setTimeout(() => {
-            setUrl(url);
-        }, 0);
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), children: [(0, jsx_runtime_1.jsx)(uikit_1.Button, { className: b('icon'), view: "flat", size: "m", onClick: reloadIframe, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.ArrowRotateRight, size: 18 }) }), (0, jsx_runtime_1.jsx)(uikit_1.TextInput, { disabled: disableUrlField, className: b('text'), size: "s", value: url, onUpdate: onUpdateUrl })] }));
-};
-exports.default = Source;
-//# sourceMappingURL=Source.js.map

package/build/cjs/editor-v2/containers/Source/Source.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Source.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/Source/Source.tsx"],"names":[],"mappings":";;;;AAAA,6CAAmD;AACnD,6CAA0D;AAC1D,qDAA+B;AAE/B,wEAA0D;AAC1D,0EAAkE;AAClE,0CAAwC;AAIxC,MAAM,CAAC,GAAG,IAAA,aAAQ,EAAC,QAAQ,CAAC,CAAC;AAE7B,MAAM,MAAM,GAAG,GAAG,EAAE;IAChB,MAAM,EAAC,eAAe,EAAC,GAAG,IAAA,uCAAkB,GAAE,CAAC;IAC/C,MAAM,EAAC,eAAe,EAAE,GAAG,EAAE,MAAM,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IAEvE,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CACjC,CAAC,KAAa,EAAE,EAAE;QACd,MAAM,CAAC,KAAK,CAAC,CAAC;QACd,eAAe,EAAE,CAAC;IACtB,CAAC,EACD,CAAC,eAAe,EAAE,MAAM,CAAC,CAC5B,CAAC;IAEF,MAAM,YAAY,GAAG,GAAG,EAAE;QACtB,MAAM,CAAC,EAAE,CAAC,CAAC;QACX,UAAU,CAAC,GAAG,EAAE;YACZ,MAAM,CAAC,GAAG,CAAC,CAAC;QAChB,CAAC,EAAE,CAAC,CAAC,CAAC;IACV,CAAC,CAAC;IAEF,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,EAAE,aACf,uBAAC,cAAM,IAAC,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,YAAY,YACpE,uBAAC,YAAI,IAAC,IAAI,EAAE,wBAAgB,EAAE,IAAI,EAAE,EAAE,GAAI,GACrC,EACT,uBAAC,iBAAS,IACN,QAAQ,EAAE,eAAe,EACzB,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,IAAI,EAAC,GAAG,EACR,KAAK,EAAE,GAAG,EACV,QAAQ,EAAE,WAAW,GACvB,IACA,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,MAAM,CAAC","sourcesContent":["import {ArrowRotateRight} from '@gravity-ui/icons';\nimport {Button, Icon, TextInput} from '@gravity-ui/uikit';\nimport * as React from 'react';\n\nimport {IframeContext} from '../../context/iframeContext';\nimport {useMainEditorStore} from '../../hooks/useMainEditorStore';\nimport {editorCn} from '../../utils/cn';\n\nimport './Source.scss';\n\nconst b = editorCn('source');\n\nconst Source = () => {\n    const {resetInitialize} = useMainEditorStore();\n    const {disableUrlField, url, setUrl} = React.useContext(IframeContext);\n\n    const onUpdateUrl = React.useCallback(\n        (value: string) => {\n            setUrl(value);\n            resetInitialize();\n        },\n        [resetInitialize, setUrl],\n    );\n\n    const reloadIframe = () => {\n        setUrl('');\n        setTimeout(() => {\n            setUrl(url);\n        }, 0);\n    };\n\n    return (\n        <div className={b()}>\n            <Button className={b('icon')} view=\"flat\" size=\"m\" onClick={reloadIframe}>\n                <Icon data={ArrowRotateRight} size={18} />\n            </Button>\n            <TextInput\n                disabled={disableUrlField}\n                className={b('text')}\n                size=\"s\"\n                value={url}\n                onUpdate={onUpdateUrl}\n            />\n        </div>\n    );\n};\n\nexport default Source;\n"]}

package/build/cjs/editor-v2/containers/SourceCode/SourceCode.css

@@ -1,37 +0,0 @@
-.pceditor-source-code {
-  height: 100%;
-  padding: 16px 12px;
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-}
-.pceditor-source-code__title {
-  font-weight: 500;
-  font-size: 13px;
-  line-height: 18px;
-  color: var(--g-color-text-secondary);
-}
-.pceditor-source-code__code {
-  white-space: pre;
-  font-family: var(--g-text-code-font-family);
-  font-weight: var(--g-text-code-font-weight);
-  font-size: var(--g-text-code-inline-1-font-size);
-  line-height: var(--g-text-code-inline-1-line-height);
-  padding: 6px 2px 8px;
-  overflow: auto;
-  border: 1px solid var(--g-color-line-generic);
-  border-radius: 6px;
-  position: relative;
-}
-.pceditor-source-code__code:hover .pceditor-source-code__controls {
-  display: flex;
-  flex-direction: row;
-  gap: 8px;
-}
-.pceditor-source-code__controls {
-  display: none;
-  position: absolute;
-  top: 10px;
-  right: 10px;
-}

package/build/cjs/editor-v2/containers/SourceCode/SourceCode.d.ts

@@ -1,6 +0,0 @@
-interface SourceCodeProps {
-    className?: string;
-    format: 'yaml' | 'json';
-}
-declare const SourceCode: ({ className, format }: SourceCodeProps) => import("react/jsx-runtime").JSX.Element;
-export default SourceCode;

package/build/cjs/editor-v2/containers/SourceCode/SourceCode.js

@@ -1,41 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const icons_1 = require("@gravity-ui/icons");
-const uikit_1 = require("@gravity-ui/uikit");
-const js_yaml_1 = tslib_1.__importDefault(require("js-yaml"));
-const React = tslib_1.__importStar(require("react"));
-const useMainEditorStore_1 = require("../../hooks/useMainEditorStore.js");
-const cn_1 = require("../../utils/cn.js");
-const UpdateModal_1 = require("./UpdateModal/UpdateModal.js");
-const b = (0, cn_1.editorCn)('source-code');
-const SourceCode = ({ className, format }) => {
-    const { content, setContent } = (0, useMainEditorStore_1.useMainEditorStore)();
-    const [isOpen, setIsOpen] = React.useState(false);
-    const handleUpdate = (tempConfig) => {
-        let object;
-        try {
-            if (tempConfig.trim().startsWith('{') && tempConfig.trim().endsWith('}')) {
-                object = JSON.parse(tempConfig);
-            }
-            else {
-                object = js_yaml_1.default.load(tempConfig);
-            }
-        }
-        catch {
-            // eslint-disable-next-line no-console
-            console.error('JSON.parse failed');
-        }
-        if (object) {
-            setContent(object);
-        }
-        setIsOpen(false);
-    };
-    const textContent = React.useMemo(() => {
-        return format === 'yaml' ? js_yaml_1.default.dump(content) : JSON.stringify(content, null, 2);
-    }, [format, content]);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b(null, className), children: [(0, jsx_runtime_1.jsx)("div", { className: b('title'), children: format }), (0, jsx_runtime_1.jsxs)("div", { className: b('code'), children: [(0, jsx_runtime_1.jsx)("div", { className: b('content'), children: textContent }), (0, jsx_runtime_1.jsxs)("div", { className: b('controls'), children: [(0, jsx_runtime_1.jsx)(uikit_1.ClipboardButton, { view: "flat", size: "xs", text: textContent }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat", size: "xs", onClick: () => setIsOpen(true), children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { size: 14, data: icons_1.ArrowDownToSquare }) })] })] }), (0, jsx_runtime_1.jsx)(UpdateModal_1.UpdateModal, { onApply: handleUpdate, onClose: () => setIsOpen(false), isOpen: isOpen })] }));
-};
-exports.default = SourceCode;
-//# sourceMappingURL=SourceCode.js.map

package/build/cjs/editor-v2/containers/SourceCode/SourceCode.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SourceCode.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/SourceCode/SourceCode.tsx"],"names":[],"mappings":";;;;AAAA,6CAAoD;AACpD,6CAAgE;AAChE,8DAA2B;AAC3B,qDAA+B;AAG/B,0EAAkE;AAClE,0CAAwC;AAGxC,8DAAsD;AAEtD,MAAM,CAAC,GAAG,IAAA,aAAQ,EAAC,aAAa,CAAC,CAAC;AAOlC,MAAM,UAAU,GAAG,CAAC,EAAC,SAAS,EAAE,MAAM,EAAkB,EAAE,EAAE;IACxD,MAAM,EAAC,OAAO,EAAE,UAAU,EAAC,GAAG,IAAA,uCAAkB,GAAE,CAAC;IACnD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElD,MAAM,YAAY,GAAG,CAAC,UAAkB,EAAE,EAAE;QACxC,IAAI,MAA6C,CAAC;QAElD,IAAI,CAAC;YACD,IAAI,UAAU,CAAC,IAAI,EAAE,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,UAAU,CAAC,IAAI,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;gBACvE,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;YACpC,CAAC;iBAAM,CAAC;gBACJ,MAAM,GAAG,iBAAI,CAAC,IAAI,CAAC,UAAU,CAA8B,CAAC;YAChE,CAAC;QACL,CAAC;QAAC,MAAM,CAAC;YACL,sCAAsC;YACtC,OAAO,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC;QACvC,CAAC;QAED,IAAI,MAAM,EAAE,CAAC;YACT,UAAU,CAAC,MAAM,CAAC,CAAC;QACvB,CAAC;QAED,SAAS,CAAC,KAAK,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACnC,OAAO,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,iBAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IACrF,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAEtB,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,aAC9B,gCAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YAAG,MAAM,GAAO,EAC1C,iCAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,aACrB,gCAAK,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,YAAG,WAAW,GAAO,EACjD,iCAAK,SAAS,EAAE,CAAC,CAAC,UAAU,CAAC,aACzB,uBAAC,uBAAe,IAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,IAAI,EAAE,WAAW,GAAI,EAC5D,uBAAC,cAAM,IAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,YACxD,uBAAC,YAAI,IAAC,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,yBAAiB,GAAI,GACtC,IACP,IACJ,EACN,uBAAC,yBAAW,IAAC,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,MAAM,GAAI,IACrF,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,UAAU,CAAC","sourcesContent":["import {ArrowDownToSquare} from '@gravity-ui/icons';\nimport {Button, ClipboardButton, Icon} from '@gravity-ui/uikit';\nimport yaml from 'js-yaml';\nimport * as React from 'react';\n\nimport {PageContentWithNavigation} from '../../../models';\nimport {useMainEditorStore} from '../../hooks/useMainEditorStore';\nimport {editorCn} from '../../utils/cn';\n\nimport './SourceCode.scss';\nimport {UpdateModal} from './UpdateModal/UpdateModal';\n\nconst b = editorCn('source-code');\n\ninterface SourceCodeProps {\n    className?: string;\n    format: 'yaml' | 'json';\n}\n\nconst SourceCode = ({className, format}: SourceCodeProps) => {\n    const {content, setContent} = useMainEditorStore();\n    const [isOpen, setIsOpen] = React.useState(false);\n\n    const handleUpdate = (tempConfig: string) => {\n        let object: PageContentWithNavigation | undefined;\n\n        try {\n            if (tempConfig.trim().startsWith('{') && tempConfig.trim().endsWith('}')) {\n                object = JSON.parse(tempConfig);\n            } else {\n                object = yaml.load(tempConfig) as PageContentWithNavigation;\n            }\n        } catch {\n            // eslint-disable-next-line no-console\n            console.error('JSON.parse failed');\n        }\n\n        if (object) {\n            setContent(object);\n        }\n\n        setIsOpen(false);\n    };\n\n    const textContent = React.useMemo(() => {\n        return format === 'yaml' ? yaml.dump(content) : JSON.stringify(content, null, 2);\n    }, [format, content]);\n\n    return (\n        <div className={b(null, className)}>\n            <div className={b('title')}>{format}</div>\n            <div className={b('code')}>\n                <div className={b('content')}>{textContent}</div>\n                <div className={b('controls')}>\n                    <ClipboardButton view=\"flat\" size=\"xs\" text={textContent} />\n                    <Button view=\"flat\" size=\"xs\" onClick={() => setIsOpen(true)}>\n                        <Icon size={14} data={ArrowDownToSquare} />\n                    </Button>\n                </div>\n            </div>\n            <UpdateModal onApply={handleUpdate} onClose={() => setIsOpen(false)} isOpen={isOpen} />\n        </div>\n    );\n};\n\nexport default SourceCode;\n"]}

package/build/cjs/editor-v2/containers/SourceCode/UpdateModal/UpdateModal.css

@@ -1,3 +0,0 @@
-.pceditor-source-code-update-modal__alert {
-  margin-bottom: 8px;
-}

package/build/cjs/editor-v2/containers/SourceCode/UpdateModal/UpdateModal.d.ts

@@ -1,7 +0,0 @@
-interface UpdateModalProps {
-    onClose(): void;
-    onApply(tempConfig?: string): void;
-    isOpen: boolean;
-}
-export declare const UpdateModal: ({ onClose, onApply, isOpen }: UpdateModalProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/build/cjs/editor-v2/containers/SourceCode/UpdateModal/UpdateModal.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.UpdateModal = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const uikit_1 = require("@gravity-ui/uikit");
-const React = tslib_1.__importStar(require("react"));
-const cn_1 = require("../../../utils/cn.js");
-const b = (0, cn_1.editorCn)('source-code-update-modal');
-const UpdateModal = ({ onClose, onApply, isOpen }) => {
-    const [tempConfig, setTempConfig] = React.useState('');
-    const handleApply = () => {
-        onApply(tempConfig);
-    };
-    return ((0, jsx_runtime_1.jsxs)(uikit_1.Dialog, { onClose: onClose, open: isOpen, size: 'l', className: b(), children: [(0, jsx_runtime_1.jsx)(uikit_1.Dialog.Header, { caption: "New configuration" }), (0, jsx_runtime_1.jsxs)(uikit_1.Dialog.Body, { children: [(0, jsx_runtime_1.jsx)(uikit_1.Alert, { theme: 'info', title: 'You can use YAML or JSON', message: 'The editor will automatically understand which format is needed.', className: b('alert') }), (0, jsx_runtime_1.jsx)(uikit_1.TextArea, { value: tempConfig, onUpdate: setTempConfig, rows: 25 })] }), (0, jsx_runtime_1.jsx)(uikit_1.Dialog.Footer, { showError: false, preset: 'default', textButtonApply: 'Apply', textButtonCancel: 'Cancel', onClickButtonApply: handleApply, onClickButtonCancel: onClose })] }));
-};
-exports.UpdateModal = UpdateModal;
-//# sourceMappingURL=UpdateModal.js.map

package/build/cjs/editor-v2/containers/SourceCode/UpdateModal/UpdateModal.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"UpdateModal.js","sourceRoot":"../../../../../../src","sources":["editor-v2/containers/SourceCode/UpdateModal/UpdateModal.tsx"],"names":[],"mappings":";;;;;AAAA,6CAA0D;AAC1D,qDAA+B;AAE/B,6CAA2C;AAI3C,MAAM,CAAC,GAAG,IAAA,aAAQ,EAAC,0BAA0B,CAAC,CAAC;AAQxC,MAAM,WAAW,GAAG,CAAC,EAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAmB,EAAE,EAAE;IACxE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IACvD,MAAM,WAAW,GAAG,GAAG,EAAE;QACrB,OAAO,CAAC,UAAU,CAAC,CAAC;IACxB,CAAC,CAAC;IACF,OAAO,CACH,wBAAC,cAAM,IAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,EAAE,aAC7D,uBAAC,cAAM,CAAC,MAAM,IAAC,OAAO,EAAC,mBAAmB,GAAG,EAC7C,wBAAC,cAAM,CAAC,IAAI,eACR,uBAAC,aAAK,IACF,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,0BAA0B,EACjC,OAAO,EAAE,kEAAkE,EAC3E,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,GAChB,EACT,uBAAC,gBAAQ,IAAC,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,aAAa,EAAE,IAAI,EAAE,EAAE,GAAI,IACxD,EACd,uBAAC,cAAM,CAAC,MAAM,IACV,SAAS,EAAE,KAAK,EAChB,MAAM,EAAE,SAAS,EACjB,eAAe,EAAE,OAAO,EACxB,gBAAgB,EAAE,QAAQ,EAC1B,kBAAkB,EAAE,WAAW,EAC/B,mBAAmB,EAAE,OAAO,GAC9B,IACG,CACZ,CAAC;AACN,CAAC,CAAC;AA3BW,QAAA,WAAW,eA2BtB","sourcesContent":["import {Alert, Dialog, TextArea} from '@gravity-ui/uikit';\nimport * as React from 'react';\n\nimport {editorCn} from '../../../utils/cn';\n\nimport './UpdateModal.scss';\n\nconst b = editorCn('source-code-update-modal');\n\ninterface UpdateModalProps {\n    onClose(): void;\n    onApply(tempConfig?: string): void;\n    isOpen: boolean;\n}\n\nexport const UpdateModal = ({onClose, onApply, isOpen}: UpdateModalProps) => {\n    const [tempConfig, setTempConfig] = React.useState('');\n    const handleApply = () => {\n        onApply(tempConfig);\n    };\n    return (\n        <Dialog onClose={onClose} open={isOpen} size={'l'} className={b()}>\n            <Dialog.Header caption=\"New configuration\" />\n            <Dialog.Body>\n                <Alert\n                    theme={'info'}\n                    title={'You can use YAML or JSON'}\n                    message={'The editor will automatically understand which format is needed.'}\n                    className={b('alert')}\n                ></Alert>\n                <TextArea value={tempConfig} onUpdate={setTempConfig} rows={25} />\n            </Dialog.Body>\n            <Dialog.Footer\n                showError={false}\n                preset={'default'}\n                textButtonApply={'Apply'}\n                textButtonCancel={'Cancel'}\n                onClickButtonApply={handleApply}\n                onClickButtonCancel={onClose}\n            />\n        </Dialog>\n    );\n};\n"]}

package/build/cjs/editor-v2/containers/Tree/DragContext.css

@@ -1,25 +0,0 @@
-.pceditor-preview {
-  position: absolute;
-  height: auto;
-  background-color: var(--g-color-text-hint);
-  border: 1px dashed var(--g-color-text-primary);
-  border-radius: 4px;
-  padding: 8px;
-  z-index: 1000;
-  pointer-events: none;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
-}
-.pceditor-preview-content {
-  display: flex;
-  flex-direction: column;
-}
-.pceditor-preview-type {
-  color: var(--g-color-text-dark-secondary);
-  font-size: 12px;
-}
-.pceditor-preview-title {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  font-size: 14px;
-}

package/build/cjs/editor-v2/containers/Tree/DragContext.d.ts

@@ -1,14 +0,0 @@
-import * as React from 'react';
-export interface DragItem {
-    path: number[];
-    type: string;
-    treeTitle?: string;
-}
-export declare const DragContext: React.Context<{
-    draggedItem: DragItem | null;
-    setDraggedItem: React.Dispatch<React.SetStateAction<DragItem | null>>;
-    previewRef: React.RefObject<HTMLDivElement>;
-    showPreview: (rect: DOMRect, item: DragItem) => void;
-    hidePreview: () => void;
-}>;
-export declare const DragContextProvider: React.FC<React.PropsWithChildren<{}>>;

package/build/cjs/editor-v2/containers/Tree/DragContext.js

@@ -1,49 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DragContextProvider = exports.DragContext = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
-const cn_1 = require("../../utils/cn.js");
-const b = (0, cn_1.editorCn)('preview');
-// Context for drag and drop operations
-exports.DragContext = React.createContext({
-    draggedItem: null,
-    setDraggedItem: () => { },
-    previewRef: { current: null },
-    showPreview: () => { },
-    hidePreview: () => { },
-});
-// Component for the drag preview
-const DragPreview = React.forwardRef((_, ref) => {
-    return (0, jsx_runtime_1.jsx)("div", { ref: ref, className: b(), style: { display: 'none' } });
-});
-DragPreview.displayName = 'DragPreview';
-// Provider component for drag context
-const DragContextProvider = ({ children }) => {
-    const [draggedItem, setDraggedItem] = React.useState(null);
-    const previewRef = React.useRef(null);
-    const showPreview = React.useCallback((rect, item) => {
-        if (!previewRef.current)
-            return;
-        const previewEl = previewRef.current;
-        previewEl.style.display = 'block';
-        previewEl.style.width = `${rect.width}px`;
-        previewEl.style.top = `${rect.bottom}px`;
-        previewEl.style.left = `${rect.left}px`;
-        previewEl.innerHTML = `
-            <div class="${b('content')}">
-                <div class="${b('type')}">${item.type}</div>
-                ${item.treeTitle ? `<div class="${b('title')}">${item.treeTitle}</div>` : ''}
-            </div>
-        `;
-    }, []);
-    const hidePreview = React.useCallback(() => {
-        if (previewRef.current) {
-            previewRef.current.style.display = 'none';
-        }
-    }, []);
-    return ((0, jsx_runtime_1.jsxs)(exports.DragContext.Provider, { value: { draggedItem, setDraggedItem, previewRef, showPreview, hidePreview }, children: [children, (0, jsx_runtime_1.jsx)(DragPreview, { ref: previewRef })] }));
-};
-exports.DragContextProvider = DragContextProvider;
-//# sourceMappingURL=DragContext.js.map

package/build/cjs/editor-v2/containers/Tree/DragContext.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DragContext.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/Tree/DragContext.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAC/B,0CAAwC;AAIxC,MAAM,CAAC,GAAG,IAAA,aAAQ,EAAC,SAAS,CAAC,CAAC;AAQ9B,uCAAuC;AAC1B,QAAA,WAAW,GAAG,KAAK,CAAC,aAAa,CAM3C;IACC,WAAW,EAAE,IAAI;IACjB,cAAc,EAAE,GAAG,EAAE,GAAE,CAAC;IACxB,UAAU,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC;IAC3B,WAAW,EAAE,GAAG,EAAE,GAAE,CAAC;IACrB,WAAW,EAAE,GAAG,EAAE,GAAE,CAAC;CACxB,CAAC,CAAC;AAEH,iCAAiC;AACjC,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAAiB,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE;IAC5D,OAAO,gCAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,EAAE,EAAE,KAAK,EAAE,EAAC,OAAO,EAAE,MAAM,EAAC,GAAI,CAAC;AACvE,CAAC,CAAC,CAAC;AAEH,WAAW,CAAC,WAAW,GAAG,aAAa,CAAC;AAExC,sCAAsC;AAC/B,MAAM,mBAAmB,GAA0C,CAAC,EAAC,QAAQ,EAAC,EAAE,EAAE;IACrF,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAkB,IAAI,CAAC,CAAC;IAC5E,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEtD,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,IAAa,EAAE,IAAc,EAAE,EAAE;QACpE,IAAI,CAAC,UAAU,CAAC,OAAO;YAAE,OAAO;QAEhC,MAAM,SAAS,GAAG,UAAU,CAAC,OAAO,CAAC;QACrC,SAAS,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;QAClC,SAAS,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC;QAC1C,SAAS,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,IAAI,CAAC,MAAM,IAAI,CAAC;QACzC,SAAS,CAAC,KAAK,CAAC,IAAI,GAAG,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC;QAExC,SAAS,CAAC,SAAS,GAAG;0BACJ,CAAC,CAAC,SAAS,CAAC;8BACR,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,IAAI;kBACnC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC,SAAS,QAAQ,CAAC,CAAC,CAAC,EAAE;;SAEnF,CAAC;IACN,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACvC,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YACrB,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;QAC9C,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACH,wBAAC,mBAAW,CAAC,QAAQ,IACjB,KAAK,EAAE,EAAC,WAAW,EAAE,cAAc,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,EAAC,aAEzE,QAAQ,EACT,uBAAC,WAAW,IAAC,GAAG,EAAE,UAAU,GAAI,IACb,CAC1B,CAAC;AACN,CAAC,CAAC;AAnCW,QAAA,mBAAmB,uBAmC9B","sourcesContent":["import * as React from 'react';\nimport {editorCn} from '../../utils/cn';\n\nimport './DragContext.scss';\n\nconst b = editorCn('preview');\n\nexport interface DragItem {\n    path: number[];\n    type: string;\n    treeTitle?: string;\n}\n\n// Context for drag and drop operations\nexport const DragContext = React.createContext<{\n    draggedItem: DragItem | null;\n    setDraggedItem: React.Dispatch<React.SetStateAction<DragItem | null>>;\n    previewRef: React.RefObject<HTMLDivElement>;\n    showPreview: (rect: DOMRect, item: DragItem) => void;\n    hidePreview: () => void;\n}>({\n    draggedItem: null,\n    setDraggedItem: () => {},\n    previewRef: {current: null},\n    showPreview: () => {},\n    hidePreview: () => {},\n});\n\n// Component for the drag preview\nconst DragPreview = React.forwardRef<HTMLDivElement>((_, ref) => {\n    return <div ref={ref} className={b()} style={{display: 'none'}} />;\n});\n\nDragPreview.displayName = 'DragPreview';\n\n// Provider component for drag context\nexport const DragContextProvider: React.FC<React.PropsWithChildren<{}>> = ({children}) => {\n    const [draggedItem, setDraggedItem] = React.useState<DragItem | null>(null);\n    const previewRef = React.useRef<HTMLDivElement>(null);\n\n    const showPreview = React.useCallback((rect: DOMRect, item: DragItem) => {\n        if (!previewRef.current) return;\n\n        const previewEl = previewRef.current;\n        previewEl.style.display = 'block';\n        previewEl.style.width = `${rect.width}px`;\n        previewEl.style.top = `${rect.bottom}px`;\n        previewEl.style.left = `${rect.left}px`;\n\n        previewEl.innerHTML = `\n            <div class=\"${b('content')}\">\n                <div class=\"${b('type')}\">${item.type}</div>\n                ${item.treeTitle ? `<div class=\"${b('title')}\">${item.treeTitle}</div>` : ''}\n            </div>\n        `;\n    }, []);\n\n    const hidePreview = React.useCallback(() => {\n        if (previewRef.current) {\n            previewRef.current.style.display = 'none';\n        }\n    }, []);\n\n    return (\n        <DragContext.Provider\n            value={{draggedItem, setDraggedItem, previewRef, showPreview, hidePreview}}\n        >\n            {children}\n            <DragPreview ref={previewRef} />\n        </DragContext.Provider>\n    );\n};\n"]}

package/build/cjs/editor-v2/containers/Tree/Tree.css

@@ -1,10 +0,0 @@
-.pceditor-tree {
-  padding: 12px;
-  position: relative;
-}
-.pceditor-tree__head {
-  margin-bottom: 10px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}

package/build/cjs/editor-v2/containers/Tree/Tree.d.ts

@@ -1,2 +0,0 @@
-declare const Tree: () => import("react/jsx-runtime").JSX.Element;
-export default Tree;

package/build/cjs/editor-v2/containers/Tree/Tree.js

@@ -1,36 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
-const cn_1 = require("../../utils/cn.js");
-const DragContext_1 = require("./DragContext.js");
-const TreeContent_1 = require("./TreeContent.js");
-const useMainEditorStore_1 = require("../../hooks/useMainEditorStore.js");
-const uikit_1 = require("@gravity-ui/uikit");
-const icons_1 = require("@gravity-ui/icons");
-const utils_1 = require("../../utils/index.js");
-const b = (0, cn_1.editorCn)('tree');
-const generateTree = (items) => {
-    return items.map((item) => {
-        let children;
-        if ('children' in item && item.children?.length) {
-            children = generateTree(item.children);
-        }
-        return {
-            type: item.type,
-            children,
-            treeTitle: (0, utils_1.getItemTitle)(item),
-        };
-    });
-};
-// Main Tree component with context provider
-const Tree = () => {
-    const { content, resetBlocks, selectedBlock, duplicateBlock, deleteBlock, setSelectedBlock, reorderBlock, } = (0, useMainEditorStore_1.useMainEditorStore)();
-    const selectedBlockPath = React.useMemo(() => {
-        return (0, utils_1.generateChildrenPathFromArray)(selectedBlock || []);
-    }, [selectedBlock]);
-    return ((0, jsx_runtime_1.jsx)(DragContext_1.DragContextProvider, { children: (0, jsx_runtime_1.jsxs)("div", { className: b(), children: [(0, jsx_runtime_1.jsx)("div", { className: b('head'), children: (0, jsx_runtime_1.jsxs)(uikit_1.Button, { view: "outlined-danger", onClick: () => resetBlocks(), children: [(0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.TrashBin }), "Clear all"] }) }), (0, jsx_runtime_1.jsx)(TreeContent_1.TreeContent, { reorderBlock: reorderBlock, onCopy: duplicateBlock, onDelete: deleteBlock, onSelect: setSelectedBlock, blockTree: generateTree(content.blocks), selectedBlockPath: selectedBlockPath })] }) }));
-};
-exports.default = Tree;
-//# sourceMappingURL=Tree.js.map

package/build/cjs/editor-v2/containers/Tree/Tree.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tree.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/Tree/Tree.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,0CAAwC;AACxC,kDAAkD;AAClD,kDAAoD;AAEpD,0EAAkE;AAClE,6CAA+C;AAC/C,6CAA2C;AAC3C,gDAAwE;AAIxE,MAAM,CAAC,GAAG,IAAA,aAAQ,EAAC,MAAM,CAAC,CAAC;AAE3B,MAAM,YAAY,GAAG,CAAC,KAAiB,EAAc,EAAE;IACnD,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;QACtB,IAAI,QAAQ,CAAC;QAEb,IAAI,UAAU,IAAI,IAAI,IAAI,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,CAAC;YAC9C,QAAQ,GAAG,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC3C,CAAC;QAED,OAAO;YACH,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,QAAQ;YACR,SAAS,EAAE,IAAA,oBAAY,EAAC,IAAI,CAAC;SAChC,CAAC;IACN,CAAC,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,4CAA4C;AAC5C,MAAM,IAAI,GAAG,GAAG,EAAE;IACd,MAAM,EACF,OAAO,EACP,WAAW,EACX,aAAa,EACb,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,YAAY,GACf,GAAG,IAAA,uCAAkB,GAAE,CAAC;IAEzB,MAAM,iBAAiB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACzC,OAAO,IAAA,qCAA6B,EAAC,aAAa,IAAI,EAAE,CAAC,CAAC;IAC9D,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,OAAO,CACH,uBAAC,iCAAmB,cAChB,iCAAK,SAAS,EAAE,CAAC,EAAE,aACf,gCAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YACrB,wBAAC,cAAM,IAAC,IAAI,EAAC,iBAAiB,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,EAAE,aACvD,uBAAC,YAAI,IAAC,IAAI,EAAE,gBAAQ,GAAI,iBAEnB,GACP,EACN,uBAAC,yBAAW,IACR,YAAY,EAAE,YAAY,EAC1B,MAAM,EAAE,cAAc,EACtB,QAAQ,EAAE,WAAW,EACrB,QAAQ,EAAE,gBAAgB,EAC1B,SAAS,EAAE,YAAY,CAAC,OAAO,CAAC,MAAM,CAAC,EACvC,iBAAiB,EAAE,iBAAiB,GACtC,IACA,GACY,CACzB,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,IAAI,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {editorCn} from '../../utils/cn';\nimport {DragContextProvider} from './DragContext';\nimport {TreeContent, TreeItem} from './TreeContent';\n\nimport {useMainEditorStore} from '../../hooks/useMainEditorStore';\nimport {Button, Icon} from '@gravity-ui/uikit';\nimport {TrashBin} from '@gravity-ui/icons';\nimport {generateChildrenPathFromArray, getItemTitle} from '../../utils';\n\nimport './Tree.scss';\n\nconst b = editorCn('tree');\n\nconst generateTree = (items: TreeItem[]): TreeItem[] => {\n    return items.map((item) => {\n        let children;\n\n        if ('children' in item && item.children?.length) {\n            children = generateTree(item.children);\n        }\n\n        return {\n            type: item.type,\n            children,\n            treeTitle: getItemTitle(item),\n        };\n    });\n};\n\n// Main Tree component with context provider\nconst Tree = () => {\n    const {\n        content,\n        resetBlocks,\n        selectedBlock,\n        duplicateBlock,\n        deleteBlock,\n        setSelectedBlock,\n        reorderBlock,\n    } = useMainEditorStore();\n\n    const selectedBlockPath = React.useMemo(() => {\n        return generateChildrenPathFromArray(selectedBlock || []);\n    }, [selectedBlock]);\n\n    return (\n        <DragContextProvider>\n            <div className={b()}>\n                <div className={b('head')}>\n                    <Button view=\"outlined-danger\" onClick={() => resetBlocks()}>\n                        <Icon data={TrashBin} />\n                        Clear all\n                    </Button>\n                </div>\n                <TreeContent\n                    reorderBlock={reorderBlock}\n                    onCopy={duplicateBlock}\n                    onDelete={deleteBlock}\n                    onSelect={setSelectedBlock}\n                    blockTree={generateTree(content.blocks)}\n                    selectedBlockPath={selectedBlockPath}\n                />\n            </div>\n        </DragContextProvider>\n    );\n};\n\nexport default Tree;\n"]}

package/build/cjs/editor-v2/containers/Tree/TreeContent.css

@@ -1,12 +0,0 @@
-.pceditor-tree-content {
-  position: relative;
-}
-.pceditor-tree-content__drop-zone {
-  height: 8px;
-  margin-bottom: 8px;
-  border-radius: 4px;
-  transition: background-color 0.2s;
-}
-.pceditor-tree-content__children {
-  margin-top: 8px;
-}

package/build/cjs/editor-v2/containers/Tree/TreeContent.d.ts

@@ -1,16 +0,0 @@
-import * as React from 'react';
-interface TreeContentProps {
-    blockTree: TreeItem[];
-    selectedBlockPath: string;
-    reorderBlock(selectedBlock: number[], destination: number[], position?: 'prepend' | 'append'): void;
-    onCopy(path: number[]): void;
-    onDelete(path: number[]): void;
-    onSelect(path: number[]): void;
-}
-export type TreeItem = {
-    type: string;
-    children?: TreeItem[];
-    treeTitle?: string;
-};
-export declare const TreeContent: ({ blockTree, selectedBlockPath, reorderBlock, onCopy, onDelete, onSelect, }: React.PropsWithChildren<TreeContentProps>) => import("react/jsx-runtime").JSX.Element;
-export {};

package/build/cjs/editor-v2/containers/Tree/TreeContent.js

@@ -1,61 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TreeContent = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
-const utils_1 = require("../../utils/index.js");
-const DragContext_1 = require("./DragContext.js");
-const TreeItem_1 = require("./TreeItem.js");
-const cn_1 = require("../../utils/cn.js");
-const b = (0, cn_1.editorCn)('tree-content');
-const TreeContent = ({ blockTree, selectedBlockPath, reorderBlock, onCopy, onDelete, onSelect, }) => {
-    const { draggedItem, setDraggedItem, hidePreview, showPreview } = React.useContext(DragContext_1.DragContext);
-    const handleFirstPositionDrop = React.useCallback((e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        try {
-            const data = e.dataTransfer.getData('application/json');
-            if (data) {
-                const dragItem = JSON.parse(data);
-                // Reorder to the first position by using [0] as destination
-                // and 'prepend' as position
-                reorderBlock(dragItem.path, [0], 'prepend');
-                // Reset drag context
-                setDraggedItem(null);
-                hidePreview();
-            }
-        }
-        catch (error) {
-            // eslint-disable-next-line no-console
-            console.error('Error parsing drag data:', error);
-        }
-    }, [reorderBlock, hidePreview, setDraggedItem]);
-    const handleDragOver = React.useCallback((e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        // eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign, no-param-reassign
-        e.dataTransfer.dropEffect = 'move';
-        // Show preview element at this position
-        const rect = e.currentTarget.getBoundingClientRect();
-        if (draggedItem) {
-            showPreview(rect, draggedItem);
-        }
-    }, [draggedItem, showPreview]);
-    const renderTree = (items, parentPathArray) => {
-        return items.map(({ type, treeTitle, children }, index) => {
-            let blockPathArray;
-            if (parentPathArray) {
-                blockPathArray = [...parentPathArray, index];
-            }
-            else {
-                blockPathArray = [index];
-            }
-            const blockPath = (0, utils_1.generateChildrenPathFromArray)(blockPathArray);
-            return ((0, jsx_runtime_1.jsx)(TreeItem_1.Item, { type: type, treeTitle: treeTitle, onCopy: onCopy, onDelete: onDelete, onSelect: onSelect, onReorder: reorderBlock, path: blockPathArray, selected: selectedBlockPath === blockPath, children: children && ((0, jsx_runtime_1.jsx)("div", { className: b('children'), children: renderTree(children, blockPathArray) })) }, index));
-        });
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), children: [(0, jsx_runtime_1.jsx)("div", { className: b('drop-zone'), onDragOver: handleDragOver, onDragLeave: hidePreview, onDrop: handleFirstPositionDrop }), (0, jsx_runtime_1.jsx)("div", { children: renderTree(blockTree) })] }));
-};
-exports.TreeContent = TreeContent;
-//# sourceMappingURL=TreeContent.js.map

package/build/cjs/editor-v2/containers/Tree/TreeContent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TreeContent.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/Tree/TreeContent.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {generateChildrenPathFromArray} from '../../utils';\nimport {DragContext, DragItem} from './DragContext';\nimport {Item} from './TreeItem';\nimport {editorCn} from '../../utils/cn';\n\nimport './TreeContent.scss';\n\nconst b = editorCn('tree-content');\n\ninterface TreeContentProps {\n    blockTree: TreeItem[];\n    selectedBlockPath: string;\n    reorderBlock(\n        selectedBlock: number[],\n        destination: number[],\n        position?: 'prepend' | 'append',\n    ): void;\n    onCopy(path: number[]): void;\n    onDelete(path: number[]): void;\n    onSelect(path: number[]): void;\n}\n\nexport type TreeItem = {\n    type: string;\n    children?: TreeItem[];\n    treeTitle?: string;\n};\n\nexport const TreeContent = ({\n    blockTree,\n    selectedBlockPath,\n    reorderBlock,\n    onCopy,\n    onDelete,\n    onSelect,\n}: React.PropsWithChildren<TreeContentProps>) => {\n    const {draggedItem, setDraggedItem, hidePreview, showPreview} = React.useContext(DragContext);\n\n    const handleFirstPositionDrop = React.useCallback(\n        (e: React.DragEvent<HTMLDivElement>) => {\n            e.preventDefault();\n            e.stopPropagation();\n\n            try {\n                const data = e.dataTransfer.getData('application/json');\n                if (data) {\n                    const dragItem: DragItem = JSON.parse(data);\n                    // Reorder to the first position by using [0] as destination\n                    // and 'prepend' as position\n                    reorderBlock(dragItem.path, [0], 'prepend');\n\n                    // Reset drag context\n                    setDraggedItem(null);\n                    hidePreview();\n                }\n            } catch (error) {\n                // eslint-disable-next-line no-console\n                console.error('Error parsing drag data:', error);\n            }\n        },\n        [reorderBlock, hidePreview, setDraggedItem],\n    );\n\n    const handleDragOver = React.useCallback(\n        (e: React.DragEvent<HTMLDivElement>) => {\n            e.preventDefault();\n            e.stopPropagation();\n            // eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign, no-param-reassign\n            e.dataTransfer.dropEffect = 'move';\n\n            // Show preview element at this position\n            const rect = e.currentTarget.getBoundingClientRect();\n            if (draggedItem) {\n                showPreview(rect, draggedItem);\n            }\n        },\n        [draggedItem, showPreview],\n    );\n\n    const renderTree = (items: TreeItem[], parentPathArray?: number[]) => {\n        return items.map(({type, treeTitle, children}, index) => {\n            let blockPathArray: number[];\n            if (parentPathArray) {\n                blockPathArray = [...parentPathArray, index];\n            } else {\n                blockPathArray = [index];\n            }\n            const blockPath = generateChildrenPathFromArray(blockPathArray);\n\n            return (\n                <Item\n                    type={type}\n                    treeTitle={treeTitle}\n                    onCopy={onCopy}\n                    onDelete={onDelete}\n                    onSelect={onSelect}\n                    onReorder={reorderBlock}\n                    key={index}\n                    path={blockPathArray}\n                    selected={selectedBlockPath === blockPath}\n                >\n                    {children && (\n                        <div className={b('children')}>{renderTree(children, blockPathArray)}</div>\n                    )}\n                </Item>\n            );\n        });\n    };\n\n    return (\n        <div className={b()}>\n            <div\n                className={b('drop-zone')}\n                onDragOver={handleDragOver}\n                onDragLeave={hidePreview}\n                onDrop={handleFirstPositionDrop}\n            ></div>\n            <div>{renderTree(blockTree)}</div>\n        </div>\n    );\n};\n"]}