@gravity-ui/page-constructor 8.5.0-alpha.0 → 8.5.0-alpha.10

package/build/esm/components/editor/ChildrenItemWrap/ChildrenItemWrap.js

@@ -3,9 +3,9 @@ import { usePCEditorChildrenItemWrap } from "../../../hooks/usePCEditorChildrenI
 import { block } from "../../../utils/index.js";
 import './ChildrenItemWrap.css';
 const b = block('item-wrap');
-const ChildrenItemWrap = ({ index, children }) => {
+const ChildrenItemWrap = ({ index, children, className }) => {
     const { blockRef } = usePCEditorChildrenItemWrap(index);
-    return (_jsx("div", { ref: blockRef, className: b(), children: children }));
+    return (_jsx("div", { ref: blockRef, className: b(null, className), children: children }));
 };
 export default ChildrenItemWrap;
 //# sourceMappingURL=ChildrenItemWrap.js.map

package/build/esm/components/editor/ChildrenItemWrap/ChildrenItemWrap.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChildrenItemWrap.js","sourceRoot":"../../../../../src","sources":["components/editor/ChildrenItemWrap/ChildrenItemWrap.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAC,2BAA2B,EAAC,sDAAmD;AACvF,OAAO,EAAC,KAAK,EAAC,gCAAuB;AAErC,OAAO,wBAAwB,CAAC;AAEhC,MAAM,CAAC,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC;AAM7B,MAAM,gBAAgB,GAAG,CAAC,EAAC,KAAK,EAAE,QAAQ,EAAwB,EAAE,EAAE;IAClE,MAAM,EAAC,QAAQ,EAAC,GAAG,2BAA2B,CAAC,KAAK,CAAC,CAAC;IACtD,OAAO,CACH,cAAK,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,YAC7B,QAAQ,GACP,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {usePCEditorChildrenItemWrap} from '../../../hooks/usePCEditorChildrenItemWrap';\nimport {block} from '../../../utils';\n\nimport './ChildrenItemWrap.scss';\n\nconst b = block('item-wrap');\n\nexport interface ChildrenItemWrapProps extends React.PropsWithChildren {\n    index: number;\n}\n\nconst ChildrenItemWrap = ({index, children}: ChildrenItemWrapProps) => {\n    const {blockRef} = usePCEditorChildrenItemWrap(index);\n    return (\n        <div ref={blockRef} className={b()}>\n            {children}\n        </div>\n    );\n};\n\nexport default ChildrenItemWrap;\n"]}
+{"version":3,"file":"ChildrenItemWrap.js","sourceRoot":"../../../../../src","sources":["components/editor/ChildrenItemWrap/ChildrenItemWrap.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAC,2BAA2B,EAAC,sDAAmD;AAEvF,OAAO,EAAC,KAAK,EAAC,gCAAuB;AAErC,OAAO,wBAAwB,CAAC;AAEhC,MAAM,CAAC,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC;AAM7B,MAAM,gBAAgB,GAAG,CAAC,EAAC,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAwB,EAAE,EAAE;IAC7E,MAAM,EAAC,QAAQ,EAAC,GAAG,2BAA2B,CAAC,KAAK,CAAC,CAAC;IACtD,OAAO,CACH,cAAK,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,YAC5C,QAAQ,GACP,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {usePCEditorChildrenItemWrap} from '../../../hooks/usePCEditorChildrenItemWrap';\nimport {ClassNameProps} from '../../../models';\nimport {block} from '../../../utils';\n\nimport './ChildrenItemWrap.scss';\n\nconst b = block('item-wrap');\n\nexport interface ChildrenItemWrapProps extends React.PropsWithChildren<ClassNameProps> {\n    index: number;\n}\n\nconst ChildrenItemWrap = ({index, children, className}: ChildrenItemWrapProps) => {\n    const {blockRef} = usePCEditorChildrenItemWrap(index);\n    return (\n        <div ref={blockRef} className={b(null, className)}>\n            {children}\n        </div>\n    );\n};\n\nexport default ChildrenItemWrap;\n"]}

package/build/esm/containers/PageConstructor/PageConstructor.d.ts

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import '@diplodoc/transform/dist/js/yfm';
 import type { PageConstructorWrapper } from "../../common/types/index.js";
 import { BlockData, blockMap, navItemMap, subBlockMap } from "../../constructor-items.js";
 import { Fields } from "../../form-generator-v2/types.js";

package/build/esm/containers/PageConstructor/PageConstructor.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
-import '@diplodoc/transform/dist/js/yfm';
 import RootCn from "../../components/RootCn/index.js";
 import { navItemMap } from "../../constructor-items.js";
 import { BlockRegistryContext, useBlockRegistryProvider } from "../../context/blockRegistryContext/index.js";

package/build/esm/containers/PageConstructor/PageConstructor.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageConstructor.js","sourceRoot":"../../../../src","sources":["containers/PageConstructor/PageConstructor.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport '@diplodoc/transform/dist/js/yfm';\n\nimport type {PageConstructorWrapper} from '../../common/types';\nimport RootCn from '../../components/RootCn';\nimport {BlockData, blockMap, navItemMap, subBlockMap} from '../../constructor-items';\nimport {BlockRegistryContext, useBlockRegistryProvider} from '../../context/blockRegistryContext';\nimport {BlocksContext} from '../../context/blocksContext';\nimport {InnerContext} from '../../context/innerContext';\nimport {Fields} from '../../form-generator-v2/types';\nimport {usePCEditorInitializeEvents} from '../../hooks/usePCEditorInitializeEvents';\nimport {usePCEditorStore} from '../../hooks/usePCEditorStore';\nimport {\n    BlockWrapperDataProps,\n    CustomConfig,\n    CustomItems,\n    PageContent,\n    ShouldRenderBlock,\n} from '../../models';\nimport {block as cnBlock, getCustomItems} from '../../utils';\n\nimport {ConstructorBlocks} from './components';\nimport {ConstructorRow} from './components/ConstructorRow';\n\nimport './PageConstructor.scss';\n\nexport interface PageConstructorExtension<\n    GlobalConfig extends Object = {},\n    WrapperProps extends Object = {},\n    BlockWrapperProps extends Object = {},\n> {\n    name: string;\n    id: string;\n    settings: {\n        ContentWrapper?: PageConstructorWrapper<WrapperProps>;\n        contentWrapperProps?: WrapperProps;\n        globalInputs?: Fields;\n        globalDefaults?: GlobalConfig;\n        blockWrapper?: React.ComponentType<\n            BlockWrapperDataProps<BlockWrapperProps> & React.PropsWithChildren\n        >;\n        blockWrapperProps?: BlockWrapperProps;\n        blockInputs?: Fields;\n    };\n}\n\nconst b = cnBlock('page-constructor');\n\nexport type ItemMap = typeof blockMap & typeof subBlockMap & CustomItems;\n\nexport type NavItemMap = typeof navItemMap & CustomItems;\n\nexport interface PageConstructorProps {\n    content?: PageContent;\n    shouldRenderBlock?: ShouldRenderBlock;\n    custom?: CustomConfig;\n    blocks?: Array<BlockData>;\n    extensions?: Array<PageConstructorExtension>;\n}\n\nexport const PageConstructor = (props: PageConstructorProps) => {\n    const {\n        content: initialContent = {blocks: []},\n        shouldRenderBlock,\n        custom,\n        blocks: availableLocalBlocks = [],\n        extensions: extensionsProp,\n    } = props;\n\n    const extensions = React.useMemo(() => extensionsProp ?? [], [extensionsProp]);\n\n    const {blocks: availableGlobalBlocks} = React.useContext(BlocksContext);\n\n    const availableBlocks = React.useMemo(\n        () => [...availableGlobalBlocks, ...availableLocalBlocks],\n        [availableGlobalBlocks, availableLocalBlocks],\n    );\n\n    const globalDefaults = extensions.reduce(\n        (acc, extension) => ({\n            ...acc,\n            ...(extension.settings.globalDefaults || {}),\n        }),\n        {},\n    );\n\n    const [content, setContent] = React.useState<PageContent>({\n        ...globalDefaults,\n        ...initialContent,\n    });\n\n    const store = usePCEditorStore();\n    const {initialized} = store;\n\n    const blockRegistry = useBlockRegistryProvider();\n\n    const blockWrappers = React.useMemo(\n        () =>\n            extensions.flatMap((ext) =>\n                ext.settings.blockWrapper\n                    ? [\n                          {\n                              wrapper: ext.settings.blockWrapper,\n                              props: ext.settings.blockWrapperProps ?? {},\n                          },\n                      ]\n                    : [],\n            ),\n        [extensions],\n    );\n\n    const blockInputs = React.useMemo(\n        () =>\n            extensions.reduce<Fields>(\n                (acc, ext) => [...acc, ...((ext.settings.blockInputs || []) as Fields)],\n                [],\n            ),\n        [extensions],\n    );\n\n    usePCEditorInitializeEvents({\n        initialContent: content,\n        setContent,\n        blocks: availableBlocks,\n        global: extensions.reduce<Fields>(\n            (acc, extension) => [...acc, ...((extension.settings.globalInputs || []) as Fields)],\n            [],\n        ),\n        blockInputs,\n        registry: blockRegistry,\n    });\n\n    const context = React.useMemo(\n        () => ({\n            blocks: availableBlocks,\n            navItemMap: {\n                ...navItemMap,\n                ...getCustomItems(['navigation'], custom),\n            },\n            loadables: custom?.loadable,\n            shouldRenderBlock,\n            blockWrappers,\n            content,\n            setContent,\n        }),\n        [custom, shouldRenderBlock, availableBlocks, content, setContent, blockWrappers],\n    );\n\n    const restBlocks = content.blocks;\n\n    const blocksContent = restBlocks && (\n        <ConstructorRow>\n            <ConstructorBlocks items={restBlocks} />\n        </ConstructorRow>\n    );\n\n    // Apply extensions (wrappers) from outermost to innermost\n    const wrappedContent = extensions.reduceRight<React.ReactNode>(\n        (children, extension) =>\n            extension.settings.ContentWrapper ? (\n                <extension.settings.ContentWrapper\n                    {...(extension.settings.contentWrapperProps || {})}\n                >\n                    {children}\n                </extension.settings.ContentWrapper>\n            ) : (\n                children\n            ),\n        blocksContent || null,\n    );\n\n    return (\n        <BlockRegistryContext.Provider value={blockRegistry}>\n            <InnerContext.Provider value={context}>\n                <RootCn className={b('', {['with-editor']: initialized})}>{wrappedContent}</RootCn>\n            </InnerContext.Provider>\n        </BlockRegistryContext.Provider>\n    );\n};\n"]}
+{"version":3,"file":"PageConstructor.js","sourceRoot":"../../../../src","sources":["containers/PageConstructor/PageConstructor.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport type {PageConstructorWrapper} from '../../common/types';\nimport RootCn from '../../components/RootCn';\nimport {BlockData, blockMap, navItemMap, subBlockMap} from '../../constructor-items';\nimport {BlockRegistryContext, useBlockRegistryProvider} from '../../context/blockRegistryContext';\nimport {BlocksContext} from '../../context/blocksContext';\nimport {InnerContext} from '../../context/innerContext';\nimport {Fields} from '../../form-generator-v2/types';\nimport {usePCEditorInitializeEvents} from '../../hooks/usePCEditorInitializeEvents';\nimport {usePCEditorStore} from '../../hooks/usePCEditorStore';\nimport {\n    BlockWrapperDataProps,\n    CustomConfig,\n    CustomItems,\n    PageContent,\n    ShouldRenderBlock,\n} from '../../models';\nimport {block as cnBlock, getCustomItems} from '../../utils';\n\nimport {ConstructorBlocks} from './components';\nimport {ConstructorRow} from './components/ConstructorRow';\n\nimport './PageConstructor.scss';\n\nexport interface PageConstructorExtension<\n    GlobalConfig extends Object = {},\n    WrapperProps extends Object = {},\n    BlockWrapperProps extends Object = {},\n> {\n    name: string;\n    id: string;\n    settings: {\n        ContentWrapper?: PageConstructorWrapper<WrapperProps>;\n        contentWrapperProps?: WrapperProps;\n        globalInputs?: Fields;\n        globalDefaults?: GlobalConfig;\n        blockWrapper?: React.ComponentType<\n            BlockWrapperDataProps<BlockWrapperProps> & React.PropsWithChildren\n        >;\n        blockWrapperProps?: BlockWrapperProps;\n        blockInputs?: Fields;\n    };\n}\n\nconst b = cnBlock('page-constructor');\n\nexport type ItemMap = typeof blockMap & typeof subBlockMap & CustomItems;\n\nexport type NavItemMap = typeof navItemMap & CustomItems;\n\nexport interface PageConstructorProps {\n    content?: PageContent;\n    shouldRenderBlock?: ShouldRenderBlock;\n    custom?: CustomConfig;\n    blocks?: Array<BlockData>;\n    extensions?: Array<PageConstructorExtension>;\n}\n\nexport const PageConstructor = (props: PageConstructorProps) => {\n    const {\n        content: initialContent = {blocks: []},\n        shouldRenderBlock,\n        custom,\n        blocks: availableLocalBlocks = [],\n        extensions: extensionsProp,\n    } = props;\n\n    const extensions = React.useMemo(() => extensionsProp ?? [], [extensionsProp]);\n\n    const {blocks: availableGlobalBlocks} = React.useContext(BlocksContext);\n\n    const availableBlocks = React.useMemo(\n        () => [...availableGlobalBlocks, ...availableLocalBlocks],\n        [availableGlobalBlocks, availableLocalBlocks],\n    );\n\n    const globalDefaults = extensions.reduce(\n        (acc, extension) => ({\n            ...acc,\n            ...(extension.settings.globalDefaults || {}),\n        }),\n        {},\n    );\n\n    const [content, setContent] = React.useState<PageContent>({\n        ...globalDefaults,\n        ...initialContent,\n    });\n\n    const store = usePCEditorStore();\n    const {initialized} = store;\n\n    const blockRegistry = useBlockRegistryProvider();\n\n    const blockWrappers = React.useMemo(\n        () =>\n            extensions.flatMap((ext) =>\n                ext.settings.blockWrapper\n                    ? [\n                          {\n                              wrapper: ext.settings.blockWrapper,\n                              props: ext.settings.blockWrapperProps ?? {},\n                          },\n                      ]\n                    : [],\n            ),\n        [extensions],\n    );\n\n    const blockInputs = React.useMemo(\n        () =>\n            extensions.reduce<Fields>(\n                (acc, ext) => [...acc, ...((ext.settings.blockInputs || []) as Fields)],\n                [],\n            ),\n        [extensions],\n    );\n\n    usePCEditorInitializeEvents({\n        initialContent: content,\n        setContent,\n        blocks: availableBlocks,\n        global: extensions.reduce<Fields>(\n            (acc, extension) => [...acc, ...((extension.settings.globalInputs || []) as Fields)],\n            [],\n        ),\n        blockInputs,\n        registry: blockRegistry,\n    });\n\n    const context = React.useMemo(\n        () => ({\n            blocks: availableBlocks,\n            navItemMap: {\n                ...navItemMap,\n                ...getCustomItems(['navigation'], custom),\n            },\n            loadables: custom?.loadable,\n            shouldRenderBlock,\n            blockWrappers,\n            content,\n            setContent,\n        }),\n        [custom, shouldRenderBlock, availableBlocks, content, setContent, blockWrappers],\n    );\n\n    const restBlocks = content.blocks;\n\n    const blocksContent = restBlocks && (\n        <ConstructorRow>\n            <ConstructorBlocks items={restBlocks} />\n        </ConstructorRow>\n    );\n\n    // Apply extensions (wrappers) from outermost to innermost\n    const wrappedContent = extensions.reduceRight<React.ReactNode>(\n        (children, extension) =>\n            extension.settings.ContentWrapper ? (\n                <extension.settings.ContentWrapper\n                    {...(extension.settings.contentWrapperProps || {})}\n                >\n                    {children}\n                </extension.settings.ContentWrapper>\n            ) : (\n                children\n            ),\n        blocksContent || null,\n    );\n\n    return (\n        <BlockRegistryContext.Provider value={blockRegistry}>\n            <InnerContext.Provider value={context}>\n                <RootCn className={b('', {['with-editor']: initialized})}>{wrappedContent}</RootCn>\n            </InnerContext.Provider>\n        </BlockRegistryContext.Provider>\n    );\n};\n"]}

package/build/esm/containers/PageConstructor/components/ConstructorBlock/ConstructorBlock.css

@@ -35,8 +35,4 @@ unpredictable css rules order in build */
 }
 .pc-constructor-block.pc-constructor-block.pc-constructor-block.pc-constructor-block_indentBottom_xl {
   padding-bottom: 64px;
-}
-
-.pc-page-constructor_with-editor .pc-constructor-block {
-  cursor: pointer;
 }

package/build/esm/containers/PageConstructor/components/ConstructorItem/ConstructorItem.css

@@ -0,0 +1,6 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-constructor-item {
+  height: inherit;
+  width: inherit;
+}

package/build/esm/containers/PageConstructor/components/ConstructorItem/ConstructorItem.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { ConstructorBlock } from "../../../../models/index.js";
+import './ConstructorItem.css';
 export interface ConstructorItemProps {
     data: ConstructorBlock;
     blockKey: number;

package/build/esm/containers/PageConstructor/components/ConstructorItem/ConstructorItem.js

@@ -3,6 +3,9 @@ import * as React from 'react';
 import { BlockIdContext } from "../../../../context/blockIdContext/index.js";
 import { InnerContext } from "../../../../context/innerContext/index.js";
 import { usePCEditorBlockRegister } from "../../../../hooks/usePCEditorBlockRegister.js";
+import { block } from "../../../../utils/index.js";
+import './ConstructorItem.css';
+const b = block('constructor-item');
 export const ConstructorItem = ({ data, blockKey, children, }) => {
     const { blocks } = React.useContext(InnerContext);
     const parentId = React.useContext(BlockIdContext);
@@ -14,6 +17,6 @@ export const ConstructorItem = ({ data, blockKey, children, }) => {
         return null;
     }
     const Component = blockData.component;
-    return (_jsx(BlockIdContext.Provider, { value: path, children: _jsx("div", { ref: blockRef, children: _jsx(Component, { ...rest, children: children }) }) }, blockKey));
+    return (_jsx(BlockIdContext.Provider, { value: path, children: _jsx("div", { ref: blockRef, className: b(), children: _jsx(Component, { ...rest, children: children }) }) }, blockKey));
 };
 //# sourceMappingURL=ConstructorItem.js.map

package/build/esm/containers/PageConstructor/components/ConstructorItem/ConstructorItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConstructorItem.js","sourceRoot":"../../../../../../src","sources":["containers/PageConstructor/components/ConstructorItem/ConstructorItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,cAAc,EAAC,oDAA2C;AAClE,OAAO,EAAC,YAAY,EAAC,kDAAyC;AAC9D,OAAO,EAAC,wBAAwB,EAAC,sDAAmD;AAQpF,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAC5B,IAAI,EACJ,QAAQ,EACR,QAAQ,GACoC,EAAE,EAAE;IAChD,MAAM,EAAC,MAAM,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;IAChD,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC;IAClD,MAAM,EAAC,IAAI,EAAE,GAAG,IAAI,EAAC,GAAG,IAAI,CAAC;IAE7B,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,GAAG,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IAChF,MAAM,QAAQ,GAAG,wBAAwB,CAAC,IAAI,CAAC,CAAC;IAEhD,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,EAAC,IAAI,EAAE,SAAS,EAAC,EAAE,EAAE,CAAC,SAAS,KAAK,IAAI,CAAC,CAAC;IAEzE,IAAI,CAAC,SAAS,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,MAAM,SAAS,GAAG,SAAS,CAAC,SAE3B,CAAC;IAEF,OAAO,CACH,KAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,YAChC,cAAK,GAAG,EAAE,QAAQ,YACd,KAAC,SAAS,OAAK,IAAI,YAAG,QAAQ,GAAa,GACzC,IAHiC,QAAQ,CAIzB,CAC7B,CAAC;AACN,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {BlockIdContext} from '../../../../context/blockIdContext';\nimport {InnerContext} from '../../../../context/innerContext';\nimport {usePCEditorBlockRegister} from '../../../../hooks/usePCEditorBlockRegister';\nimport {ConstructorBlock} from '../../../../models';\n\nexport interface ConstructorItemProps {\n    data: ConstructorBlock;\n    blockKey: number;\n}\n\nexport const ConstructorItem = ({\n    data,\n    blockKey,\n    children,\n}: React.PropsWithChildren<ConstructorItemProps>) => {\n    const {blocks} = React.useContext(InnerContext);\n    const parentId = React.useContext(BlockIdContext);\n    const {type, ...rest} = data;\n\n    const path = React.useMemo(() => [...parentId, blockKey], [parentId, blockKey]);\n    const blockRef = usePCEditorBlockRegister(path);\n\n    const blockData = blocks.find(({type: blockType}) => blockType === type);\n\n    if (!blockData) {\n        return null;\n    }\n\n    const Component = blockData.component as React.ComponentType<\n        React.ComponentProps<(typeof blockData)['component']>\n    >;\n\n    return (\n        <BlockIdContext.Provider value={path} key={blockKey}>\n            <div ref={blockRef}>\n                <Component {...rest}>{children}</Component>\n            </div>\n        </BlockIdContext.Provider>\n    );\n};\n"]}
+{"version":3,"file":"ConstructorItem.js","sourceRoot":"../../../../../../src","sources":["containers/PageConstructor/components/ConstructorItem/ConstructorItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,cAAc,EAAC,oDAA2C;AAClE,OAAO,EAAC,YAAY,EAAC,kDAAyC;AAC9D,OAAO,EAAC,wBAAwB,EAAC,sDAAmD;AAEpF,OAAO,EAAC,KAAK,EAAC,mCAA0B;AAExC,OAAO,uBAAuB,CAAC;AAE/B,MAAM,CAAC,GAAG,KAAK,CAAC,kBAAkB,CAAC,CAAC;AAOpC,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAC5B,IAAI,EACJ,QAAQ,EACR,QAAQ,GACoC,EAAE,EAAE;IAChD,MAAM,EAAC,MAAM,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;IAChD,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC;IAClD,MAAM,EAAC,IAAI,EAAE,GAAG,IAAI,EAAC,GAAG,IAAI,CAAC;IAE7B,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,GAAG,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IAChF,MAAM,QAAQ,GAAG,wBAAwB,CAAC,IAAI,CAAC,CAAC;IAEhD,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,EAAC,IAAI,EAAE,SAAS,EAAC,EAAE,EAAE,CAAC,SAAS,KAAK,IAAI,CAAC,CAAC;IAEzE,IAAI,CAAC,SAAS,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,MAAM,SAAS,GAAG,SAAS,CAAC,SAE3B,CAAC;IAEF,OAAO,CACH,KAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,YAChC,cAAK,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,YAC9B,KAAC,SAAS,OAAK,IAAI,YAAG,QAAQ,GAAa,GACzC,IAHiC,QAAQ,CAIzB,CAC7B,CAAC;AACN,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {BlockIdContext} from '../../../../context/blockIdContext';\nimport {InnerContext} from '../../../../context/innerContext';\nimport {usePCEditorBlockRegister} from '../../../../hooks/usePCEditorBlockRegister';\nimport {ConstructorBlock} from '../../../../models';\nimport {block} from '../../../../utils';\n\nimport './ConstructorItem.scss';\n\nconst b = block('constructor-item');\n\nexport interface ConstructorItemProps {\n    data: ConstructorBlock;\n    blockKey: number;\n}\n\nexport const ConstructorItem = ({\n    data,\n    blockKey,\n    children,\n}: React.PropsWithChildren<ConstructorItemProps>) => {\n    const {blocks} = React.useContext(InnerContext);\n    const parentId = React.useContext(BlockIdContext);\n    const {type, ...rest} = data;\n\n    const path = React.useMemo(() => [...parentId, blockKey], [parentId, blockKey]);\n    const blockRef = usePCEditorBlockRegister(path);\n\n    const blockData = blocks.find(({type: blockType}) => blockType === type);\n\n    if (!blockData) {\n        return null;\n    }\n\n    const Component = blockData.component as React.ComponentType<\n        React.ComponentProps<(typeof blockData)['component']>\n    >;\n\n    return (\n        <BlockIdContext.Provider value={path} key={blockKey}>\n            <div ref={blockRef} className={b()}>\n                <Component {...rest}>{children}</Component>\n            </div>\n        </BlockIdContext.Provider>\n    );\n};\n"]}

package/build/esm/context/editorStoreContext/PCEditorStoreProvider.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
+import { isValidPostMessage } from "../../common/postMessage.js";
 import { createPCEditorStore } from "../../common/store.js";
 import { sendEventPostMessage } from "../../hooks/usePostMessageAPI.js";
 import { PCEditorStoreContext } from "./PCEditorStoreContext.js";
@@ -12,13 +13,14 @@ export const PCEditorStoreProvider = ({ children }) => {
     }, []);
     React.useEffect(() => {
         const onMessage = (e) => {
+            if (!isValidPostMessage(e.data)) {
+                return;
+            }
             const message = e.data;
             syncStore(message);
         };
         window.addEventListener('message', onMessage);
-        return () => {
-            window.removeEventListener('message', onMessage);
-        };
+        return () => window.removeEventListener('message', onMessage);
     }, [syncStore]);
     // When Page Constructor runs inside the editor preview iframe, keyboard focus stays in the iframe
     // after clicking the canvas — parent window never receives Cmd+Z. Forward to parent via postMessage.

package/build/esm/context/editorStoreContext/PCEditorStoreProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"PCEditorStoreProvider.js","sourceRoot":"../../../../src","sources":["context/editorStoreContext/PCEditorStoreProvider.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAc,mBAAmB,EAAC,8BAA2B;AAEpE,OAAO,EAAC,oBAAoB,EAAC,yCAAsC;AAEnE,OAAO,EAAC,oBAAoB,EAAC,kCAA+B;AAI5D,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,EAAC,QAAQ,EAA6B,EAAE,EAAE;IAC5E,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,EAAyB,CAAC;IAEvD,MAAM,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,OAAyB,EAAE,EAAE;QAC9D,IAAI,QAAQ,CAAC,OAAO,IAAI,OAAO,CAAC,KAAK,EAAE,CAAC;YACpC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QAC7C,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,MAAM,SAAS,GAAG,CAAC,CAAe,EAAE,EAAE;YAClC,MAAM,OAAO,GAAG,CAAC,CAAC,IAAwB,CAAC;YAC3C,SAAS,CAAC,OAAO,CAAC,CAAC;QACvB,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QAE9C,OAAO,GAAG,EAAE;YACR,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QACrD,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,kGAAkG;IAClG,qGAAqG;IACrG,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,MAAM,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;YAC5D,OAAO,SAAS,CAAC;QACrB,CAAC;QACD,MAAM,SAAS,GAAG,CAAC,CAAgB,EAAE,EAAE;YACnC,IAAI,CAAC,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,KAAK,GAAG,EAAE,CAAC;gBAC3D,OAAO;YACX,CAAC;YAED,MAAM,MAAM,GAAG,CAAC,CAAC,MAA4B,CAAC;YAC9C,IAAI,MAAM,EAAE,OAAO,CAAC,mDAAmD,CAAC,EAAE,CAAC;gBACvE,OAAO;YACX,CAAC;YAED,CAAC,CAAC,cAAc,EAAE,CAAC;YAEnB,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC;gBACb,oBAAoB,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC;YAC/C,CAAC;iBAAM,CAAC;gBACJ,oBAAoB,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC;YAC/C,CAAC;QACL,CAAC,CAAC;QACF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;QACpD,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;IACxE,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,QAAQ,CAAC,OAAO,GAAG,mBAAmB,EAAE,CAAC;IAC7C,CAAC;IAED,OAAO,CACH,KAAC,oBAAoB,CAAC,QAAQ,IAC1B,KAAK,EAAE;YACH,KAAK,EAAE,QAAQ,CAAC,OAAO;SAC1B,YAEA,QAAQ,GACmB,CACnC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {StoreApi} from 'zustand';\n\nimport {EditorState, createPCEditorStore} from '../../common/store';\nimport {StoreSyncMessage} from '../../common/types';\nimport {sendEventPostMessage} from '../../hooks/usePostMessageAPI';\n\nimport {PCEditorStoreContext} from './PCEditorStoreContext';\n\ninterface PCEditorStoreProviderProps extends React.PropsWithChildren {}\n\nexport const PCEditorStoreProvider = ({children}: PCEditorStoreProviderProps) => {\n    const storeRef = React.useRef<StoreApi<EditorState>>();\n\n    const syncStore = React.useCallback((message: StoreSyncMessage) => {\n        if (storeRef.current && message.state) {\n            storeRef.current.setState(message.state);\n        }\n    }, []);\n\n    React.useEffect(() => {\n        const onMessage = (e: MessageEvent) => {\n            const message = e.data as StoreSyncMessage;\n            syncStore(message);\n        };\n\n        window.addEventListener('message', onMessage);\n\n        return () => {\n            window.removeEventListener('message', onMessage);\n        };\n    }, [syncStore]);\n\n    // When Page Constructor runs inside the editor preview iframe, keyboard focus stays in the iframe\n    // after clicking the canvas — parent window never receives Cmd+Z. Forward to parent via postMessage.\n    React.useEffect(() => {\n        if (typeof window === 'undefined' || window.parent === window) {\n            return undefined;\n        }\n        const onKeyDown = (e: KeyboardEvent) => {\n            if (!(e.metaKey || e.ctrlKey) || e.key.toLowerCase() !== 'z') {\n                return;\n            }\n\n            const target = e.target as HTMLElement | null;\n            if (target?.closest('input, textarea, select, [contenteditable=\"true\"]')) {\n                return;\n            }\n\n            e.preventDefault();\n\n            if (e.shiftKey) {\n                sendEventPostMessage('ON_EDITOR_REDO', {});\n            } else {\n                sendEventPostMessage('ON_EDITOR_UNDO', {});\n            }\n        };\n        window.addEventListener('keydown', onKeyDown, true);\n        return () => window.removeEventListener('keydown', onKeyDown, true);\n    }, []);\n\n    if (!storeRef.current) {\n        storeRef.current = createPCEditorStore();\n    }\n\n    return (\n        <PCEditorStoreContext.Provider\n            value={{\n                state: storeRef.current,\n            }}\n        >\n            {children}\n        </PCEditorStoreContext.Provider>\n    );\n};\n"]}
+{"version":3,"file":"PCEditorStoreProvider.js","sourceRoot":"../../../../src","sources":["context/editorStoreContext/PCEditorStoreProvider.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,kBAAkB,EAAC,oCAAiC;AAC5D,OAAO,EAAc,mBAAmB,EAAC,8BAA2B;AAEpE,OAAO,EAAC,oBAAoB,EAAC,yCAAsC;AAEnE,OAAO,EAAC,oBAAoB,EAAC,kCAA+B;AAI5D,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,EAAC,QAAQ,EAA6B,EAAE,EAAE;IAC5E,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,EAAyB,CAAC;IAEvD,MAAM,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,OAAyB,EAAE,EAAE;QAC9D,IAAI,QAAQ,CAAC,OAAO,IAAI,OAAO,CAAC,KAAK,EAAE,CAAC;YACpC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QAC7C,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,MAAM,SAAS,GAAG,CAAC,CAAe,EAAE,EAAE;YAClC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;gBAC9B,OAAO;YACX,CAAC;YAED,MAAM,OAAO,GAAG,CAAC,CAAC,IAAwB,CAAC;YAC3C,SAAS,CAAC,OAAO,CAAC,CAAC;QACvB,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QAC9C,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAClE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,kGAAkG;IAClG,qGAAqG;IACrG,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,MAAM,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;YAC5D,OAAO,SAAS,CAAC;QACrB,CAAC;QACD,MAAM,SAAS,GAAG,CAAC,CAAgB,EAAE,EAAE;YACnC,IAAI,CAAC,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,KAAK,GAAG,EAAE,CAAC;gBAC3D,OAAO;YACX,CAAC;YAED,MAAM,MAAM,GAAG,CAAC,CAAC,MAA4B,CAAC;YAC9C,IAAI,MAAM,EAAE,OAAO,CAAC,mDAAmD,CAAC,EAAE,CAAC;gBACvE,OAAO;YACX,CAAC;YAED,CAAC,CAAC,cAAc,EAAE,CAAC;YAEnB,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC;gBACb,oBAAoB,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC;YAC/C,CAAC;iBAAM,CAAC;gBACJ,oBAAoB,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC;YAC/C,CAAC;QACL,CAAC,CAAC;QACF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;QACpD,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;IACxE,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,QAAQ,CAAC,OAAO,GAAG,mBAAmB,EAAE,CAAC;IAC7C,CAAC;IAED,OAAO,CACH,KAAC,oBAAoB,CAAC,QAAQ,IAC1B,KAAK,EAAE;YACH,KAAK,EAAE,QAAQ,CAAC,OAAO;SAC1B,YAEA,QAAQ,GACmB,CACnC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {StoreApi} from 'zustand';\n\nimport {isValidPostMessage} from '../../common/postMessage';\nimport {EditorState, createPCEditorStore} from '../../common/store';\nimport {StoreSyncMessage} from '../../common/types';\nimport {sendEventPostMessage} from '../../hooks/usePostMessageAPI';\n\nimport {PCEditorStoreContext} from './PCEditorStoreContext';\n\ninterface PCEditorStoreProviderProps extends React.PropsWithChildren {}\n\nexport const PCEditorStoreProvider = ({children}: PCEditorStoreProviderProps) => {\n    const storeRef = React.useRef<StoreApi<EditorState>>();\n\n    const syncStore = React.useCallback((message: StoreSyncMessage) => {\n        if (storeRef.current && message.state) {\n            storeRef.current.setState(message.state);\n        }\n    }, []);\n\n    React.useEffect(() => {\n        const onMessage = (e: MessageEvent) => {\n            if (!isValidPostMessage(e.data)) {\n                return;\n            }\n\n            const message = e.data as StoreSyncMessage;\n            syncStore(message);\n        };\n\n        window.addEventListener('message', onMessage);\n        return () => window.removeEventListener('message', onMessage);\n    }, [syncStore]);\n\n    // When Page Constructor runs inside the editor preview iframe, keyboard focus stays in the iframe\n    // after clicking the canvas — parent window never receives Cmd+Z. Forward to parent via postMessage.\n    React.useEffect(() => {\n        if (typeof window === 'undefined' || window.parent === window) {\n            return undefined;\n        }\n        const onKeyDown = (e: KeyboardEvent) => {\n            if (!(e.metaKey || e.ctrlKey) || e.key.toLowerCase() !== 'z') {\n                return;\n            }\n\n            const target = e.target as HTMLElement | null;\n            if (target?.closest('input, textarea, select, [contenteditable=\"true\"]')) {\n                return;\n            }\n\n            e.preventDefault();\n\n            if (e.shiftKey) {\n                sendEventPostMessage('ON_EDITOR_REDO', {});\n            } else {\n                sendEventPostMessage('ON_EDITOR_UNDO', {});\n            }\n        };\n        window.addEventListener('keydown', onKeyDown, true);\n        return () => window.removeEventListener('keydown', onKeyDown, true);\n    }, []);\n\n    if (!storeRef.current) {\n        storeRef.current = createPCEditorStore();\n    }\n\n    return (\n        <PCEditorStoreContext.Provider\n            value={{\n                state: storeRef.current,\n            }}\n        >\n            {children}\n        </PCEditorStoreContext.Provider>\n    );\n};\n"]}

package/build/esm/editor-v2/components/BlockCard/BlockCard.js

@@ -1,15 +1,15 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
-import { SquareBars } from '@gravity-ui/icons';
-import { Card, Icon } from '@gravity-ui/uikit';
+import { Card } from '@gravity-ui/uikit';
 import { editorCn } from "../../utils/cn.js";
+import { defaultIcon } from "./defaultIcon.js";
 import './BlockCard.css';
 const b = editorCn('block-card');
 const BlockCard = ({ className, type, name, previewImg, onMouseDown }) => {
     const handleMouseDown = React.useCallback(() => {
         onMouseDown(type);
     }, [onMouseDown, type]);
-    return (_jsxs(Card, { className: b(null, className), onMouseDown: handleMouseDown, children: [_jsx("div", { className: b('image'), children: previewImg ? (_jsx("img", { className: b('image-img'), src: previewImg, alt: "" })) : (_jsx(Icon, { className: b('icon'), size: 45, data: SquareBars })) }), _jsx("div", { className: b('name'), children: name })] }));
+    return (_jsxs(Card, { className: b(null, className), onMouseDown: handleMouseDown, children: [_jsx("div", { className: b('image'), children: previewImg ? (_jsx("img", { className: b('image-img'), src: previewImg, alt: "preview of the block" })) : (_jsx("img", { className: b('image-img'), src: defaultIcon, alt: "preview of the block" })) }), _jsx("div", { className: b('name'), children: name })] }));
 };
 export default BlockCard;
 //# sourceMappingURL=BlockCard.js.map

package/build/esm/editor-v2/components/BlockCard/BlockCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlockCard.js","sourceRoot":"../../../../../src","sources":["editor-v2/components/BlockCard/BlockCard.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAC,IAAI,EAAE,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAC,QAAQ,EAAC,0BAAuB;AAExC,OAAO,iBAAiB,CAAC;AAEzB,MAAM,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;AAUjC,MAAM,SAAS,GAAG,CAAC,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,WAAW,EAAiB,EAAE,EAAE;IACnF,MAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC3C,WAAW,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC;IAExB,OAAO,CACH,MAAC,IAAI,IAAC,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,WAAW,EAAE,eAAe,aAC7D,cAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YACrB,UAAU,CAAC,CAAC,CAAC,CACV,cAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,EAAE,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,EAAE,GAAG,CAC7D,CAAC,CAAC,CAAC,CACA,KAAC,IAAI,IAAC,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,UAAU,GAAI,CAC7D,GACC,EACN,cAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAAG,IAAI,GAAO,IACpC,CACV,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {SquareBars} from '@gravity-ui/icons';\nimport {Card, Icon} from '@gravity-ui/uikit';\n\nimport {editorCn} from '../../utils/cn';\n\nimport './BlockCard.scss';\n\nconst b = editorCn('block-card');\n\nexport interface BlockCardProps {\n    className?: string;\n    type: string;\n    name: string;\n    previewImg?: string;\n    onMouseDown: (type: string) => void;\n}\n\nconst BlockCard = ({className, type, name, previewImg, onMouseDown}: BlockCardProps) => {\n    const handleMouseDown = React.useCallback(() => {\n        onMouseDown(type);\n    }, [onMouseDown, type]);\n\n    return (\n        <Card className={b(null, className)} onMouseDown={handleMouseDown}>\n            <div className={b('image')}>\n                {previewImg ? (\n                    <img className={b('image-img')} src={previewImg} alt=\"\" />\n                ) : (\n                    <Icon className={b('icon')} size={45} data={SquareBars} />\n                )}\n            </div>\n            <div className={b('name')}>{name}</div>\n        </Card>\n    );\n};\n\nexport default BlockCard;\n"]}
+{"version":3,"file":"BlockCard.js","sourceRoot":"../../../../../src","sources":["editor-v2/components/BlockCard/BlockCard.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAC,QAAQ,EAAC,0BAAuB;AAExC,OAAO,EAAC,WAAW,EAAC,yBAAsB;AAE1C,OAAO,iBAAiB,CAAC;AAEzB,MAAM,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;AAUjC,MAAM,SAAS,GAAG,CAAC,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,WAAW,EAAiB,EAAE,EAAE;IACnF,MAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC3C,WAAW,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC;IAExB,OAAO,CACH,MAAC,IAAI,IAAC,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,WAAW,EAAE,eAAe,aAC7D,cAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YACrB,UAAU,CAAC,CAAC,CAAC,CACV,cAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,EAAE,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,sBAAsB,GAAG,CACjF,CAAC,CAAC,CAAC,CACA,cAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,EAAE,GAAG,EAAE,WAAW,EAAE,GAAG,EAAC,sBAAsB,GAAG,CAClF,GACC,EACN,cAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAAG,IAAI,GAAO,IACpC,CACV,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {Card} from '@gravity-ui/uikit';\n\nimport {editorCn} from '../../utils/cn';\n\nimport {defaultIcon} from './defaultIcon';\n\nimport './BlockCard.scss';\n\nconst b = editorCn('block-card');\n\nexport interface BlockCardProps {\n    className?: string;\n    type: string;\n    name: string;\n    previewImg?: string;\n    onMouseDown: (type: string) => void;\n}\n\nconst BlockCard = ({className, type, name, previewImg, onMouseDown}: BlockCardProps) => {\n    const handleMouseDown = React.useCallback(() => {\n        onMouseDown(type);\n    }, [onMouseDown, type]);\n\n    return (\n        <Card className={b(null, className)} onMouseDown={handleMouseDown}>\n            <div className={b('image')}>\n                {previewImg ? (\n                    <img className={b('image-img')} src={previewImg} alt=\"preview of the block\" />\n                ) : (\n                    <img className={b('image-img')} src={defaultIcon} alt=\"preview of the block\" />\n                )}\n            </div>\n            <div className={b('name')}>{name}</div>\n        </Card>\n    );\n};\n\nexport default BlockCard;\n"]}

package/build/esm/editor-v2/components/BlockCard/defaultIcon.d.ts

@@ -0,0 +1 @@
+export declare const defaultIcon: string;

package/build/esm/editor-v2/components/BlockCard/defaultIcon.js

@@ -0,0 +1,8 @@
+import { svgToDataUri } from "../../../utils/index.js";
+export const defaultIcon = svgToDataUri(`<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.81395" fill="white"/>
+<rect x="8.93024" y="7" width="82" height="36" rx="3" fill="#262626"/>
+<path d="M53.7548 21.64C53.7548 22.0667 53.6948 22.4467 53.5748 22.78C53.4681 23.1133 53.3148 23.42 53.1148 23.7C52.9281 23.98 52.7081 24.2333 52.4548 24.46C52.2148 24.6867 51.9548 24.9067 51.6748 25.12C51.3681 25.36 51.0814 25.58 50.8148 25.78C50.5614 25.9667 50.3414 26.16 50.1548 26.36C49.9681 26.5467 49.8214 26.7533 49.7148 26.98C49.6081 27.1933 49.5548 27.44 49.5548 27.72V27.94H47.6948V27.6C47.6948 27.1867 47.7414 26.8267 47.8348 26.52C47.9281 26.2 48.0681 25.9133 48.2548 25.66C48.4548 25.3933 48.6948 25.14 48.9748 24.9C49.2548 24.6467 49.5748 24.3867 49.9348 24.12C50.3614 23.7733 50.6948 23.42 50.9348 23.06C51.1881 22.6867 51.3148 22.24 51.3148 21.72C51.3148 21.4667 51.2748 21.2133 51.1948 20.96C51.1281 20.7067 51.0014 20.4867 50.8148 20.3C50.6281 20.1133 50.3748 19.96 50.0548 19.84C49.7348 19.72 49.3214 19.66 48.8148 19.66C48.4148 19.66 48.0548 19.6933 47.7348 19.76C47.4148 19.8267 47.1414 19.9067 46.9148 20C46.6881 20.08 46.5081 20.16 46.3748 20.24C46.2548 20.3067 46.1814 20.3467 46.1548 20.36V18.64C46.1814 18.6267 46.2681 18.58 46.4148 18.5C46.5748 18.42 46.7881 18.34 47.0548 18.26C47.3214 18.1667 47.6414 18.0867 48.0148 18.02C48.4014 17.9533 48.8348 17.92 49.3148 17.92C50.0748 17.92 50.7281 18.0133 51.2748 18.2C51.8348 18.3867 52.2948 18.6467 52.6548 18.98C53.0281 19.3133 53.3014 19.7067 53.4748 20.16C53.6614 20.6133 53.7548 21.1067 53.7548 21.64ZM48.7148 32.14C48.3148 32.14 47.9748 32 47.6948 31.72C47.4281 31.44 47.2948 31.1067 47.2948 30.72C47.2948 30.32 47.4281 29.98 47.6948 29.7C47.9748 29.42 48.3148 29.28 48.7148 29.28C49.1281 29.28 49.4681 29.42 49.7348 29.7C50.0148 29.98 50.1548 30.32 50.1548 30.72C50.1548 31.1067 50.0148 31.44 49.7348 31.72C49.4681 32 49.1281 32.14 48.7148 32.14Z" fill="#C0C8DB"/>
+</svg>
+`);
+//# sourceMappingURL=defaultIcon.js.map

package/build/esm/editor-v2/components/BlockCard/defaultIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaultIcon.js","sourceRoot":"../../../../../src","sources":["editor-v2/components/BlockCard/defaultIcon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAC,gCAAuB;AAE5C,MAAM,CAAC,MAAM,WAAW,GAAG,YAAY,CACnC;;;;;CAKH,CACA,CAAC","sourcesContent":["import {svgToDataUri} from '../../../utils';\n\nexport const defaultIcon = svgToDataUri(\n    `<svg width=\"100\" height=\"50\" viewBox=\"0 0 100 50\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<rect width=\"100\" height=\"50\" rx=\"7.81395\" fill=\"white\"/>\n<rect x=\"8.93024\" y=\"7\" width=\"82\" height=\"36\" rx=\"3\" fill=\"#262626\"/>\n<path d=\"M53.7548 21.64C53.7548 22.0667 53.6948 22.4467 53.5748 22.78C53.4681 23.1133 53.3148 23.42 53.1148 23.7C52.9281 23.98 52.7081 24.2333 52.4548 24.46C52.2148 24.6867 51.9548 24.9067 51.6748 25.12C51.3681 25.36 51.0814 25.58 50.8148 25.78C50.5614 25.9667 50.3414 26.16 50.1548 26.36C49.9681 26.5467 49.8214 26.7533 49.7148 26.98C49.6081 27.1933 49.5548 27.44 49.5548 27.72V27.94H47.6948V27.6C47.6948 27.1867 47.7414 26.8267 47.8348 26.52C47.9281 26.2 48.0681 25.9133 48.2548 25.66C48.4548 25.3933 48.6948 25.14 48.9748 24.9C49.2548 24.6467 49.5748 24.3867 49.9348 24.12C50.3614 23.7733 50.6948 23.42 50.9348 23.06C51.1881 22.6867 51.3148 22.24 51.3148 21.72C51.3148 21.4667 51.2748 21.2133 51.1948 20.96C51.1281 20.7067 51.0014 20.4867 50.8148 20.3C50.6281 20.1133 50.3748 19.96 50.0548 19.84C49.7348 19.72 49.3214 19.66 48.8148 19.66C48.4148 19.66 48.0548 19.6933 47.7348 19.76C47.4148 19.8267 47.1414 19.9067 46.9148 20C46.6881 20.08 46.5081 20.16 46.3748 20.24C46.2548 20.3067 46.1814 20.3467 46.1548 20.36V18.64C46.1814 18.6267 46.2681 18.58 46.4148 18.5C46.5748 18.42 46.7881 18.34 47.0548 18.26C47.3214 18.1667 47.6414 18.0867 48.0148 18.02C48.4014 17.9533 48.8348 17.92 49.3148 17.92C50.0748 17.92 50.7281 18.0133 51.2748 18.2C51.8348 18.3867 52.2948 18.6467 52.6548 18.98C53.0281 19.3133 53.3014 19.7067 53.4748 20.16C53.6614 20.6133 53.7548 21.1067 53.7548 21.64ZM48.7148 32.14C48.3148 32.14 47.9748 32 47.6948 31.72C47.4281 31.44 47.2948 31.1067 47.2948 30.72C47.2948 30.32 47.4281 29.98 47.6948 29.7C47.9748 29.42 48.3148 29.28 48.7148 29.28C49.1281 29.28 49.4681 29.42 49.7348 29.7C50.0148 29.98 50.1548 30.32 50.1548 30.72C50.1548 31.1067 50.0148 31.44 49.7348 31.72C49.4681 32 49.1281 32.14 48.7148 32.14Z\" fill=\"#C0C8DB\"/>\n</svg>\n`,\n);\n"]}

package/build/esm/editor-v2/containers/BigOverlay/BigOverlay.js

@@ -8,9 +8,14 @@ const b = editorCn('big-overlay');
 const BigOverlay = ({ className }) => {
     const { manipulateOverlayMode } = useMainEditorStore();
     const [mousePosition, setMousePosition] = React.useState(undefined);
+    const overlayRef = React.useRef(null);
     React.useEffect(() => {
         const onMouseMove = (event) => {
-            setMousePosition({ x: event.clientX, y: event.clientY });
+            const rect = overlayRef.current?.getBoundingClientRect();
+            setMousePosition({
+                x: event.clientX - (rect?.left ?? 0),
+                y: event.clientY - (rect?.top ?? 0),
+            });
         };
         const onMouseUp = () => {
             setMousePosition(undefined);
@@ -24,7 +29,7 @@ const BigOverlay = ({ className }) => {
             document.removeEventListener('mouseup', onMouseUp);
         };
     }, []);
-    return (_jsx("div", { className: b(null, className), children: mousePosition && manipulateOverlayMode ? (_jsx("div", { className: b('border'), style: {
+    return (_jsx("div", { ref: overlayRef, className: b(null, className), children: mousePosition && manipulateOverlayMode ? (_jsx("div", { className: b('border'), style: {
                 top: mousePosition.y,
                 left: mousePosition.x,
             }, children: _jsx(Stop, { height: 20, width: 20 }) })) : null }));

package/build/esm/editor-v2/containers/BigOverlay/BigOverlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"BigOverlay.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/BigOverlay/BigOverlay.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAC,kBAAkB,EAAC,0CAAuC;AAClE,OAAO,EAAC,QAAQ,EAAC,0BAAuB;AAExC,OAAO,kBAAkB,CAAC;AAE1B,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAC;AAElC,MAAM,UAAU,GAAG,CAAC,EAAC,SAAS,EAAuB,EAAE,EAAE;IACrD,MAAM,EAAC,qBAAqB,EAAC,GAAG,kBAAkB,EAAE,CAAC;IACrD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CACpD,SAAS,CACZ,CAAC;IAEF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,MAAM,WAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;YACtC,gBAAgB,CAAC,EAAC,CAAC,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,EAAC,CAAC,CAAC;QAC3D,CAAC,CAAC;QAEF,MAAM,SAAS,GAAG,GAAG,EAAE;YACnB,gBAAgB,CAAC,SAAS,CAAC,CAAC;QAChC,CAAC,CAAC;QAEF,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;QACpD,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;QACpD,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QAEhD,OAAO,GAAG,EAAE;YACR,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;YACvD,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;YACvD,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QACvD,CAAC,CAAC;IACN,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,YAC7B,aAAa,IAAI,qBAAqB,CAAC,CAAC,CAAC,CACtC,cACI,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,EACtB,KAAK,EAAE;gBACH,GAAG,EAAE,aAAa,CAAC,CAAC;gBACpB,IAAI,EAAE,aAAa,CAAC,CAAC;aACxB,YAED,KAAC,IAAI,IAAC,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,GAAI,GAC7B,CACT,CAAC,CAAC,CAAC,IAAI,GACN,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {Stop} from '@gravity-ui/icons';\n\nimport {useMainEditorStore} from '../../hooks/useMainEditorStore';\nimport {editorCn} from '../../utils/cn';\n\nimport './BigOverlay.scss';\n\nconst b = editorCn('big-overlay');\n\nconst BigOverlay = ({className}: {className?: string}) => {\n    const {manipulateOverlayMode} = useMainEditorStore();\n    const [mousePosition, setMousePosition] = React.useState<{x: number; y: number} | undefined>(\n        undefined,\n    );\n\n    React.useEffect(() => {\n        const onMouseMove = (event: MouseEvent) => {\n            setMousePosition({x: event.clientX, y: event.clientY});\n        };\n\n        const onMouseUp = () => {\n            setMousePosition(undefined);\n        };\n\n        document.addEventListener('mousemove', onMouseMove);\n        document.addEventListener('mousedown', onMouseMove);\n        document.addEventListener('mouseup', onMouseUp);\n\n        return () => {\n            document.removeEventListener('mousemove', onMouseMove);\n            document.removeEventListener('mousedown', onMouseMove);\n            document.removeEventListener('mouseup', onMouseUp);\n        };\n    }, []);\n\n    return (\n        <div className={b(null, className)}>\n            {mousePosition && manipulateOverlayMode ? (\n                <div\n                    className={b('border')}\n                    style={{\n                        top: mousePosition.y,\n                        left: mousePosition.x,\n                    }}\n                >\n                    <Stop height={20} width={20} />\n                </div>\n            ) : null}\n        </div>\n    );\n};\n\nexport default BigOverlay;\n"]}
+{"version":3,"file":"BigOverlay.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/BigOverlay/BigOverlay.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAC,kBAAkB,EAAC,0CAAuC;AAClE,OAAO,EAAC,QAAQ,EAAC,0BAAuB;AAExC,OAAO,kBAAkB,CAAC;AAE1B,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAC;AAElC,MAAM,UAAU,GAAG,CAAC,EAAC,SAAS,EAAuB,EAAE,EAAE;IACrD,MAAM,EAAC,qBAAqB,EAAC,GAAG,kBAAkB,EAAE,CAAC;IACrD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CACpD,SAAS,CACZ,CAAC;IACF,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEtD,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,MAAM,WAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;YACtC,MAAM,IAAI,GAAG,UAAU,CAAC,OAAO,EAAE,qBAAqB,EAAE,CAAC;YACzD,gBAAgB,CAAC;gBACb,CAAC,EAAE,KAAK,CAAC,OAAO,GAAG,CAAC,IAAI,EAAE,IAAI,IAAI,CAAC,CAAC;gBACpC,CAAC,EAAE,KAAK,CAAC,OAAO,GAAG,CAAC,IAAI,EAAE,GAAG,IAAI,CAAC,CAAC;aACtC,CAAC,CAAC;QACP,CAAC,CAAC;QAEF,MAAM,SAAS,GAAG,GAAG,EAAE;YACnB,gBAAgB,CAAC,SAAS,CAAC,CAAC;QAChC,CAAC,CAAC;QAEF,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;QACpD,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;QACpD,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QAEhD,OAAO,GAAG,EAAE;YACR,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;YACvD,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;YACvD,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QACvD,CAAC,CAAC;IACN,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACH,cAAK,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,YAC9C,aAAa,IAAI,qBAAqB,CAAC,CAAC,CAAC,CACtC,cACI,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,EACtB,KAAK,EAAE;gBACH,GAAG,EAAE,aAAa,CAAC,CAAC;gBACpB,IAAI,EAAE,aAAa,CAAC,CAAC;aACxB,YAED,KAAC,IAAI,IAAC,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,GAAI,GAC7B,CACT,CAAC,CAAC,CAAC,IAAI,GACN,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {Stop} from '@gravity-ui/icons';\n\nimport {useMainEditorStore} from '../../hooks/useMainEditorStore';\nimport {editorCn} from '../../utils/cn';\n\nimport './BigOverlay.scss';\n\nconst b = editorCn('big-overlay');\n\nconst BigOverlay = ({className}: {className?: string}) => {\n    const {manipulateOverlayMode} = useMainEditorStore();\n    const [mousePosition, setMousePosition] = React.useState<{x: number; y: number} | undefined>(\n        undefined,\n    );\n    const overlayRef = React.useRef<HTMLDivElement>(null);\n\n    React.useEffect(() => {\n        const onMouseMove = (event: MouseEvent) => {\n            const rect = overlayRef.current?.getBoundingClientRect();\n            setMousePosition({\n                x: event.clientX - (rect?.left ?? 0),\n                y: event.clientY - (rect?.top ?? 0),\n            });\n        };\n\n        const onMouseUp = () => {\n            setMousePosition(undefined);\n        };\n\n        document.addEventListener('mousemove', onMouseMove);\n        document.addEventListener('mousedown', onMouseMove);\n        document.addEventListener('mouseup', onMouseUp);\n\n        return () => {\n            document.removeEventListener('mousemove', onMouseMove);\n            document.removeEventListener('mousedown', onMouseMove);\n            document.removeEventListener('mouseup', onMouseUp);\n        };\n    }, []);\n\n    return (\n        <div ref={overlayRef} className={b(null, className)}>\n            {mousePosition && manipulateOverlayMode ? (\n                <div\n                    className={b('border')}\n                    style={{\n                        top: mousePosition.y,\n                        left: mousePosition.x,\n                    }}\n                >\n                    <Stop height={20} width={20} />\n                </div>\n            ) : null}\n        </div>\n    );\n};\n\nexport default BigOverlay;\n"]}

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

@@ -6,7 +6,7 @@ interface SidebarTabComponent {
     title: string;
     component: React.ElementType;
 }
-interface ComponentsConfig {
+interface EditorSlots {
     middleTop?: React.ElementType;
     leftTop?: React.ElementType[];
     rightTop?: React.ElementType[];
@@ -20,8 +20,8 @@ export interface EditorProviderProps {
 }
 export interface EditorViewProps {
     onUpdate?: (pageContent: PageContent) => void;
-    initialContent?: PageContent;
-    componentsConfig?: ComponentsConfig;
+    content?: PageContent;
+    slots?: EditorSlots;
 }
 type EditorProps = Omit<EditorProviderProps, 'children'> & EditorViewProps;
 export declare const EditorProvider: ({ initialUrl, disableUrlField, children }: EditorProviderProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -15,10 +15,10 @@ import Source from "../Source/Source.js";
 import ViewSwitches from "../ViewSwitches/ViewSwitches.js";
 import './Editor.css';
 const b = editorCn('editor');
-const EditorViewInternal = ({ componentsConfig = {}, initialContent }) => {
+const EditorViewInternal = ({ slots = {}, content }) => {
     const store = useMainEditorStore();
     const { manipulateOverlayMode, disableMode, undo, redo } = store;
-    useMainEditorInitialize(initialContent);
+    useMainEditorInitialize(content);
     usePostMessageAPIListener('ON_EDITOR_UNDO', () => {
         undo();
     }, [undo]);
@@ -56,10 +56,10 @@ const EditorViewInternal = ({ componentsConfig = {}, initialContent }) => {
             disableMode();
         }
     }, [disableMode, manipulateOverlayMode]);
-    const { left, right } = useEditorTabs(componentsConfig);
+    const { left, right } = useEditorTabs(slots);
     return (
     // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-    _jsxs("div", { className: b(), onMouseUp: onMouseUp, children: [_jsx("div", { className: b('body'), children: _jsx(Panels, { left: _jsx(Sidebar, { tabs: left, top: componentsConfig.leftTop }), right: _jsx(Sidebar, { tabs: right, top: [...(componentsConfig.rightTop || []), Source, ViewSwitches], defaultTab: "block-config" }), middle: _jsx(MiddleScreen, { CustomTop: componentsConfig.middleTop }) }) }), _jsx(BigOverlay, { className: b('overlay') })] }));
+    _jsxs("div", { className: b(), onMouseUp: onMouseUp, children: [_jsx("div", { className: b('body'), children: _jsx(Panels, { left: _jsx(Sidebar, { tabs: left, top: slots.leftTop }), right: _jsx(Sidebar, { tabs: right, top: [...(slots.rightTop || []), Source, ViewSwitches], defaultTab: "block-config" }), middle: _jsx(MiddleScreen, { CustomTop: slots.middleTop }) }) }), _jsx(BigOverlay, { className: b('overlay') })] }));
 };
 export const EditorProvider = ({ initialUrl, disableUrlField, children }) => {
     return (_jsx(IframeProvider, { initialUrl: initialUrl, disableUrlField: disableUrlField, children: _jsx(MainEditorStoreProvider, { children: children }) }));

package/build/esm/editor-v2/containers/Editor/Editor.js.map

@@ -1 +1 @@
-{"version":3,"file":"Editor.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/Editor/Editor.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {usePostMessageAPIListener} from '../../../common/postMessage';\nimport {PageContent} from '../../../models';\nimport {Panels} from '../../components/Panels/Panels';\nimport {Sidebar} from '../../components/Sidebar/Sidebar';\nimport BigOverlay from '../../containers/BigOverlay/BigOverlay';\nimport MiddleScreen from '../../containers/MiddleScreen/MiddleScreen';\nimport {MainEditorStoreProvider} from '../../context/editorStore';\nimport {IframeProvider} from '../../context/iframeContext';\nimport {useEditorTabs} from '../../hooks/useEditorTabs';\nimport useMainEditorInitialize from '../../hooks/useMainEditorInitialize';\nimport {useMainEditorStore} from '../../hooks/useMainEditorStore';\nimport {editorCn} from '../../utils/cn';\nimport Source from '../Source/Source';\nimport ViewSwitches from '../ViewSwitches/ViewSwitches';\n\nimport './Editor.scss';\n\nconst b = editorCn('editor');\n\ninterface SidebarTabComponent {\n    id: string;\n    title: string;\n    component: React.ElementType;\n}\n\ninterface ComponentsConfig {\n    middleTop?: React.ElementType;\n    leftTop?: React.ElementType[];\n    rightTop?: React.ElementType[];\n    leftTabs?: SidebarTabComponent[];\n    rightTabs?: SidebarTabComponent[];\n}\n\nexport interface EditorProviderProps {\n    initialUrl: string;\n    disableUrlField?: boolean;\n    children: React.ReactNode;\n}\n\nexport interface EditorViewProps {\n    onUpdate?: (pageContent: PageContent) => void;\n    initialContent?: PageContent;\n    componentsConfig?: ComponentsConfig;\n}\n\ntype EditorProps = Omit<EditorProviderProps, 'children'> & EditorViewProps;\n\nconst EditorViewInternal = ({componentsConfig = {}, initialContent}: EditorViewProps) => {\n    const store = useMainEditorStore();\n    const {manipulateOverlayMode, disableMode, undo, redo} = store;\n\n    useMainEditorInitialize(initialContent);\n\n    usePostMessageAPIListener(\n        'ON_EDITOR_UNDO',\n        () => {\n            undo();\n        },\n        [undo],\n    );\n    usePostMessageAPIListener(\n        'ON_EDITOR_REDO',\n        () => {\n            redo();\n        },\n        [redo],\n    );\n\n    React.useEffect(() => {\n        const onKeyDown = (e: KeyboardEvent) => {\n            if (!(e.metaKey || e.ctrlKey)) {\n                return;\n            }\n\n            if (e.key.toLowerCase() !== 'z') {\n                return;\n            }\n\n            const target = e.target as HTMLElement | null;\n            if (target?.closest('input, textarea, select, [contenteditable=\"true\"]')) {\n                return;\n            }\n\n            e.preventDefault();\n\n            if (e.shiftKey) {\n                redo();\n            } else {\n                undo();\n            }\n        };\n\n        window.addEventListener('keydown', onKeyDown, true);\n\n        return () => window.removeEventListener('keydown', onKeyDown, true);\n    }, [redo, undo]);\n\n    // Disable insert mode on any MouseUp event\n    // Maybe should be attached to body\n    const onMouseUp = React.useCallback(\n        (e: React.MouseEvent) => {\n            if (manipulateOverlayMode) {\n                e.preventDefault();\n                disableMode();\n            }\n        },\n        [disableMode, manipulateOverlayMode],\n    );\n    const {left, right} = useEditorTabs(componentsConfig);\n\n    return (\n        // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n        <div className={b()} onMouseUp={onMouseUp}>\n            <div className={b('body')}>\n                <Panels\n                    left={<Sidebar tabs={left} top={componentsConfig.leftTop} />}\n                    right={\n                        <Sidebar\n                            tabs={right}\n                            top={[...(componentsConfig.rightTop || []), Source, ViewSwitches]}\n                            defaultTab=\"block-config\"\n                        />\n                    }\n                    middle={<MiddleScreen CustomTop={componentsConfig.middleTop} />}\n                />\n            </div>\n            <BigOverlay className={b('overlay')} />\n        </div>\n    );\n};\n\nexport const EditorProvider = ({initialUrl, disableUrlField, children}: EditorProviderProps) => {\n    return (\n        <IframeProvider initialUrl={initialUrl} disableUrlField={disableUrlField}>\n            <MainEditorStoreProvider>{children}</MainEditorStoreProvider>\n        </IframeProvider>\n    );\n};\n\nexport const EditorView = (props: EditorViewProps) => <EditorViewInternal {...props} />;\n\nexport const Editor = (props: EditorProps) => {\n    return (\n        <EditorProvider initialUrl={props.initialUrl} disableUrlField={props.disableUrlField}>\n            <EditorView {...props} />\n        </EditorProvider>\n    );\n};\n"]}
+{"version":3,"file":"Editor.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/Editor/Editor.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {usePostMessageAPIListener} from '../../../common/postMessage';\nimport {PageContent} from '../../../models';\nimport {Panels} from '../../components/Panels/Panels';\nimport {Sidebar} from '../../components/Sidebar/Sidebar';\nimport BigOverlay from '../../containers/BigOverlay/BigOverlay';\nimport MiddleScreen from '../../containers/MiddleScreen/MiddleScreen';\nimport {MainEditorStoreProvider} from '../../context/editorStore';\nimport {IframeProvider} from '../../context/iframeContext';\nimport {useEditorTabs} from '../../hooks/useEditorTabs';\nimport useMainEditorInitialize from '../../hooks/useMainEditorInitialize';\nimport {useMainEditorStore} from '../../hooks/useMainEditorStore';\nimport {editorCn} from '../../utils/cn';\nimport Source from '../Source/Source';\nimport ViewSwitches from '../ViewSwitches/ViewSwitches';\n\nimport './Editor.scss';\n\nconst b = editorCn('editor');\n\ninterface SidebarTabComponent {\n    id: string;\n    title: string;\n    component: React.ElementType;\n}\n\ninterface EditorSlots {\n    middleTop?: React.ElementType;\n    leftTop?: React.ElementType[];\n    rightTop?: React.ElementType[];\n    leftTabs?: SidebarTabComponent[];\n    rightTabs?: SidebarTabComponent[];\n}\n\nexport interface EditorProviderProps {\n    initialUrl: string;\n    disableUrlField?: boolean;\n    children: React.ReactNode;\n}\n\nexport interface EditorViewProps {\n    onUpdate?: (pageContent: PageContent) => void;\n    content?: PageContent;\n    slots?: EditorSlots;\n}\n\ntype EditorProps = Omit<EditorProviderProps, 'children'> & EditorViewProps;\n\nconst EditorViewInternal = ({slots = {}, content}: EditorViewProps) => {\n    const store = useMainEditorStore();\n    const {manipulateOverlayMode, disableMode, undo, redo} = store;\n\n    useMainEditorInitialize(content);\n\n    usePostMessageAPIListener(\n        'ON_EDITOR_UNDO',\n        () => {\n            undo();\n        },\n        [undo],\n    );\n    usePostMessageAPIListener(\n        'ON_EDITOR_REDO',\n        () => {\n            redo();\n        },\n        [redo],\n    );\n\n    React.useEffect(() => {\n        const onKeyDown = (e: KeyboardEvent) => {\n            if (!(e.metaKey || e.ctrlKey)) {\n                return;\n            }\n\n            if (e.key.toLowerCase() !== 'z') {\n                return;\n            }\n\n            const target = e.target as HTMLElement | null;\n            if (target?.closest('input, textarea, select, [contenteditable=\"true\"]')) {\n                return;\n            }\n\n            e.preventDefault();\n\n            if (e.shiftKey) {\n                redo();\n            } else {\n                undo();\n            }\n        };\n\n        window.addEventListener('keydown', onKeyDown, true);\n\n        return () => window.removeEventListener('keydown', onKeyDown, true);\n    }, [redo, undo]);\n\n    // Disable insert mode on any MouseUp event\n    // Maybe should be attached to body\n    const onMouseUp = React.useCallback(\n        (e: React.MouseEvent) => {\n            if (manipulateOverlayMode) {\n                e.preventDefault();\n                disableMode();\n            }\n        },\n        [disableMode, manipulateOverlayMode],\n    );\n    const {left, right} = useEditorTabs(slots);\n\n    return (\n        // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n        <div className={b()} onMouseUp={onMouseUp}>\n            <div className={b('body')}>\n                <Panels\n                    left={<Sidebar tabs={left} top={slots.leftTop} />}\n                    right={\n                        <Sidebar\n                            tabs={right}\n                            top={[...(slots.rightTop || []), Source, ViewSwitches]}\n                            defaultTab=\"block-config\"\n                        />\n                    }\n                    middle={<MiddleScreen CustomTop={slots.middleTop} />}\n                />\n            </div>\n            <BigOverlay className={b('overlay')} />\n        </div>\n    );\n};\n\nexport const EditorProvider = ({initialUrl, disableUrlField, children}: EditorProviderProps) => {\n    return (\n        <IframeProvider initialUrl={initialUrl} disableUrlField={disableUrlField}>\n            <MainEditorStoreProvider>{children}</MainEditorStoreProvider>\n        </IframeProvider>\n    );\n};\n\nexport const EditorView = (props: EditorViewProps) => <EditorViewInternal {...props} />;\n\nexport const Editor = (props: EditorProps) => {\n    return (\n        <EditorProvider initialUrl={props.initialUrl} disableUrlField={props.disableUrlField}>\n            <EditorView {...props} />\n        </EditorProvider>\n    );\n};\n"]}

package/build/esm/editor-v2/containers/MiddleScreen/MiddleScreen.js

@@ -9,6 +9,8 @@ import { editorCn } from "../../utils/cn.js";
 import Overlay from "../Overlay/Overlay.js";
 import './MiddleScreen.css';
 const b = editorCn('middle-screen');
+// the maximum height of the iframe
+const IFRAME_MAX_HEIGHT = 50000;
 const MiddleScreen = ({ className, CustomTop }) => {
     const { zoom, initialized, deviceWidth, isPreviewMode, togglePreviewMode } = useMainEditorStore();
     const { url, setIframeElement } = React.useContext(IframeContext);
@@ -21,7 +23,8 @@ const MiddleScreen = ({ className, CustomTop }) => {
         maxWidth: isPreviewMode ? '100%' : `${(100 / zoom) * 100}%`,
     }), [isPreviewMode, zoom]);
     const onResize = React.useCallback((newHeight) => {
-        setHeight(newHeight + 100);
+        const settedHeight = newHeight + 100;
+        setHeight(settedHeight > IFRAME_MAX_HEIGHT ? IFRAME_MAX_HEIGHT : settedHeight);
     }, [setHeight]);
     usePostMessageAPIListener('ON_RESIZE', ({ height: newHeight }) => {
         onResize(newHeight);

package/build/esm/editor-v2/containers/MiddleScreen/MiddleScreen.js.map

@@ -1 +1 @@
-{"version":3,"file":"MiddleScreen.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/MiddleScreen/MiddleScreen.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Xmark} from '@gravity-ui/icons';\nimport {Button, Icon, Loader} from '@gravity-ui/uikit';\n\nimport {usePostMessageAPIListener} from '../../../common/postMessage';\nimport {IframeContext} from '../../context/iframeContext';\nimport {useMainEditorStore} from '../../hooks/useMainEditorStore';\nimport {editorCn} from '../../utils/cn';\nimport Overlay from '../Overlay/Overlay';\n\nimport './MiddleScreen.scss';\n\nconst b = editorCn('middle-screen');\n\ninterface MiddleScreenProps {\n    className?: string;\n    CustomTop?: React.ElementType;\n}\n\nconst MiddleScreen = ({className, CustomTop}: MiddleScreenProps) => {\n    const {zoom, initialized, deviceWidth, isPreviewMode, togglePreviewMode} = useMainEditorStore();\n    const {url, setIframeElement} = React.useContext(IframeContext);\n    const [canvasRef, setCanvasRef] = React.useState<HTMLDivElement | null>(null);\n    const [height, setHeight] = React.useState(0);\n\n    const canvasStyle = React.useMemo(\n        () => ({\n            transform: isPreviewMode ? 'none' : `scale(${zoom}%)`,\n            height: isPreviewMode ? '100%' : `${(100 / zoom) * 100}%`,\n            width: isPreviewMode ? '100%' : `${(100 / zoom) * 100}%`,\n            maxWidth: isPreviewMode ? '100%' : `${(100 / zoom) * 100}%`,\n        }),\n        [isPreviewMode, zoom],\n    );\n\n    const onResize = React.useCallback(\n        (newHeight: number) => {\n            setHeight(newHeight + 100);\n        },\n        [setHeight],\n    );\n\n    usePostMessageAPIListener('ON_RESIZE', ({height: newHeight}) => {\n        onResize(newHeight);\n    });\n\n    usePostMessageAPIListener('ON_INIT', ({height: newHeight}) => {\n        onResize(newHeight);\n    });\n\n    const isWithBackground = React.useMemo(() => {\n        return deviceWidth !== '100%';\n    }, [deviceWidth]);\n\n    return (\n        <div className={b(null, className)}>\n            {CustomTop && !isPreviewMode ? (\n                <div className={b('topbar')}>\n                    <CustomTop />\n                </div>\n            ) : null}\n            <div className={b('content', {fullscreen: isPreviewMode})}>\n                <div className={b('wrapper')}>\n                    <div\n                        ref={setCanvasRef}\n                        className={b('canvas', {\n                            hidden: !initialized,\n                            fullscreen: isPreviewMode,\n                            withBackground: isWithBackground,\n                        })}\n                        style={canvasStyle}\n                    >\n                        <div\n                            className={b('iframe-container', {fullscreen: isPreviewMode})}\n                            style={{width: isPreviewMode ? '100%' : deviceWidth}}\n                        >\n                            <iframe\n                                ref={(instance) => {\n                                    if (instance) {\n                                        setIframeElement(instance);\n                                    }\n                                }}\n                                className={b('iframe', {fullscreen: isPreviewMode})}\n                                src={url}\n                                height={isPreviewMode ? '100%' : `${height}px`}\n                                width={isPreviewMode ? '100%' : deviceWidth}\n                                frameBorder=\"0\"\n                                title=\"Page Constructor Iframe\"\n                            />\n                            {!isPreviewMode && (\n                                <Overlay className={b('overlay')} canvasElement={canvasRef} />\n                            )}\n                        </div>\n                        {isPreviewMode && (\n                            <Button\n                                view=\"normal-contrast\"\n                                className={b('exit-preview')}\n                                onClick={togglePreviewMode}\n                                aria-label=\"Exit preview mode\"\n                                title=\"Exit preview mode\"\n                                size=\"l\"\n                            >\n                                <Icon size={24} data={Xmark} />\n                            </Button>\n                        )}\n                        {!initialized && (\n                            <div className={b('loading')}>\n                                <Loader size={'l'} />\n                            </div>\n                        )}\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default MiddleScreen;\n"]}
+{"version":3,"file":"MiddleScreen.js","sourceRoot":"../../../../../src","sources":["editor-v2/containers/MiddleScreen/MiddleScreen.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Xmark} from '@gravity-ui/icons';\nimport {Button, Icon, Loader} from '@gravity-ui/uikit';\n\nimport {usePostMessageAPIListener} from '../../../common/postMessage';\nimport {IframeContext} from '../../context/iframeContext';\nimport {useMainEditorStore} from '../../hooks/useMainEditorStore';\nimport {editorCn} from '../../utils/cn';\nimport Overlay from '../Overlay/Overlay';\n\nimport './MiddleScreen.scss';\n\nconst b = editorCn('middle-screen');\n\n// the maximum height of the iframe\nconst IFRAME_MAX_HEIGHT = 50000;\n\ninterface MiddleScreenProps {\n    className?: string;\n    CustomTop?: React.ElementType;\n}\n\nconst MiddleScreen = ({className, CustomTop}: MiddleScreenProps) => {\n    const {zoom, initialized, deviceWidth, isPreviewMode, togglePreviewMode} = useMainEditorStore();\n    const {url, setIframeElement} = React.useContext(IframeContext);\n    const [canvasRef, setCanvasRef] = React.useState<HTMLDivElement | null>(null);\n    const [height, setHeight] = React.useState(0);\n\n    const canvasStyle = React.useMemo(\n        () => ({\n            transform: isPreviewMode ? 'none' : `scale(${zoom}%)`,\n            height: isPreviewMode ? '100%' : `${(100 / zoom) * 100}%`,\n            width: isPreviewMode ? '100%' : `${(100 / zoom) * 100}%`,\n            maxWidth: isPreviewMode ? '100%' : `${(100 / zoom) * 100}%`,\n        }),\n        [isPreviewMode, zoom],\n    );\n\n    const onResize = React.useCallback(\n        (newHeight: number) => {\n            const settedHeight = newHeight + 100;\n            setHeight(settedHeight > IFRAME_MAX_HEIGHT ? IFRAME_MAX_HEIGHT : settedHeight);\n        },\n        [setHeight],\n    );\n\n    usePostMessageAPIListener('ON_RESIZE', ({height: newHeight}) => {\n        onResize(newHeight);\n    });\n\n    usePostMessageAPIListener('ON_INIT', ({height: newHeight}) => {\n        onResize(newHeight);\n    });\n\n    const isWithBackground = React.useMemo(() => {\n        return deviceWidth !== '100%';\n    }, [deviceWidth]);\n\n    return (\n        <div className={b(null, className)}>\n            {CustomTop && !isPreviewMode ? (\n                <div className={b('topbar')}>\n                    <CustomTop />\n                </div>\n            ) : null}\n            <div className={b('content', {fullscreen: isPreviewMode})}>\n                <div className={b('wrapper')}>\n                    <div\n                        ref={setCanvasRef}\n                        className={b('canvas', {\n                            hidden: !initialized,\n                            fullscreen: isPreviewMode,\n                            withBackground: isWithBackground,\n                        })}\n                        style={canvasStyle}\n                    >\n                        <div\n                            className={b('iframe-container', {fullscreen: isPreviewMode})}\n                            style={{width: isPreviewMode ? '100%' : deviceWidth}}\n                        >\n                            <iframe\n                                ref={(instance) => {\n                                    if (instance) {\n                                        setIframeElement(instance);\n                                    }\n                                }}\n                                className={b('iframe', {fullscreen: isPreviewMode})}\n                                src={url}\n                                height={isPreviewMode ? '100%' : `${height}px`}\n                                width={isPreviewMode ? '100%' : deviceWidth}\n                                frameBorder=\"0\"\n                                title=\"Page Constructor Iframe\"\n                            />\n                            {!isPreviewMode && (\n                                <Overlay className={b('overlay')} canvasElement={canvasRef} />\n                            )}\n                        </div>\n                        {isPreviewMode && (\n                            <Button\n                                view=\"normal-contrast\"\n                                className={b('exit-preview')}\n                                onClick={togglePreviewMode}\n                                aria-label=\"Exit preview mode\"\n                                title=\"Exit preview mode\"\n                                size=\"l\"\n                            >\n                                <Icon size={24} data={Xmark} />\n                            </Button>\n                        )}\n                        {!initialized && (\n                            <div className={b('loading')}>\n                                <Loader size={'l'} />\n                            </div>\n                        )}\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default MiddleScreen;\n"]}

package/build/esm/editor-v2/context/editorStore/MainEditorStoreProvider.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
+import { POST_MESSAGE_SOURCE } from "../../../common/constants.js";
 import { removeFn } from "../../../common/utils.js";
 import { createEditorStore } from "../../store.js";
 import { IframeContext } from "../iframeContext/index.js";
@@ -10,6 +11,7 @@ export const MainEditorStoreProvider = ({ children }) => {
     const sendPostMessage = React.useCallback((data) => {
         const message = {
             state: data,
+            source: POST_MESSAGE_SOURCE,
         };
         if (iframeElement && iframeElement.contentWindow) {
             iframeElement.contentWindow.postMessage(message, '*');

package/build/esm/editor-v2/context/editorStore/MainEditorStoreProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"MainEditorStoreProvider.js","sourceRoot":"../../../../../src","sources":["editor-v2/context/editorStore/MainEditorStoreProvider.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAC,QAAQ,EAAC,iCAA8B;AAC/C,OAAO,EAAc,iBAAiB,EAAC,uBAAoB;AAC3D,OAAO,EAAC,aAAa,EAAC,kCAAyB;AAE/C,OAAO,EAAC,sBAAsB,EAAC,oCAAiC;AAIhE,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,EAAC,QAAQ,EAA0B,EAAE,EAAE;IAC3E,MAAM,EAAC,aAAa,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IACxD,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,EAAyB,CAAC;IAEvD,MAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CACrC,CAAC,IAAiB,EAAE,EAAE;QAClB,MAAM,OAAO,GAAqB;YAC9B,KAAK,EAAE,IAAI;SACd,CAAC;QAEF,IAAI,aAAa,IAAI,aAAa,CAAC,aAAa,EAAE,CAAC;YAC/C,aAAa,CAAC,aAAa,CAAC,WAAW,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;QAC1D,CAAC;IACL,CAAC,EACD,CAAC,aAAa,CAAC,CAClB,CAAC;IAEF,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,QAAQ,CAAC,OAAO,GAAG,iBAAiB,EAAE,CAAC;IAC3C,CAAC;IAED,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC,KAAK,EAAE,EAAE;YAClC,MAAM,EAAC,WAAW,EAAE,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,GAAG,QAAQ,EAAC,GAAG,KAAK,CAAC;YACtF,eAAe,CAAC,QAAQ,CAAC,EAAC,GAAG,QAAQ,EAAE,WAAW,EAAE,EAAE,EAAE,aAAa,EAAE,EAAE,EAAC,CAAC,CAAC,CAAC;QACjF,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,OAAO,CACH,KAAC,sBAAsB,CAAC,QAAQ,IAC5B,KAAK,EAAE;YACH,KAAK,EAAE,QAAQ,CAAC,OAAO;SAC1B,YAEA,QAAQ,GACqB,CACrC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {StoreApi} from 'zustand';\n\nimport {EditorState} from '../../../common/store';\nimport {StoreSyncMessage} from '../../../common/types';\nimport {removeFn} from '../../../common/utils';\nimport {EditorStore, createEditorStore} from '../../store';\nimport {IframeContext} from '../iframeContext';\n\nimport {MainEditorStoreContext} from './MainEditorStoreContext';\n\ninterface MainEditorProviderProps extends React.PropsWithChildren {}\n\nexport const MainEditorStoreProvider = ({children}: MainEditorProviderProps) => {\n    const {iframeElement} = React.useContext(IframeContext);\n    const storeRef = React.useRef<StoreApi<EditorStore>>();\n\n    const sendPostMessage = React.useCallback(\n        (data: EditorState) => {\n            const message: StoreSyncMessage = {\n                state: data,\n            };\n\n            if (iframeElement && iframeElement.contentWindow) {\n                iframeElement.contentWindow.postMessage(message, '*');\n            }\n        },\n        [iframeElement],\n    );\n\n    if (!storeRef.current) {\n        storeRef.current = createEditorStore();\n    }\n\n    React.useEffect(() => {\n        storeRef.current?.subscribe((state) => {\n            const {historyPast: _historyPast, historyFuture: _historyFuture, ...syncable} = state;\n            sendPostMessage(removeFn({...syncable, historyPast: [], historyFuture: []}));\n        });\n    }, [sendPostMessage]);\n\n    return (\n        <MainEditorStoreContext.Provider\n            value={{\n                state: storeRef.current,\n            }}\n        >\n            {children}\n        </MainEditorStoreContext.Provider>\n    );\n};\n"]}
+{"version":3,"file":"MainEditorStoreProvider.js","sourceRoot":"../../../../../src","sources":["editor-v2/context/editorStore/MainEditorStoreProvider.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,mBAAmB,EAAC,qCAAkC;AAG9D,OAAO,EAAC,QAAQ,EAAC,iCAA8B;AAC/C,OAAO,EAAc,iBAAiB,EAAC,uBAAoB;AAC3D,OAAO,EAAC,aAAa,EAAC,kCAAyB;AAE/C,OAAO,EAAC,sBAAsB,EAAC,oCAAiC;AAIhE,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,EAAC,QAAQ,EAA0B,EAAE,EAAE;IAC3E,MAAM,EAAC,aAAa,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IACxD,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,EAAyB,CAAC;IAEvD,MAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CACrC,CAAC,IAAiB,EAAE,EAAE;QAClB,MAAM,OAAO,GAAqB;YAC9B,KAAK,EAAE,IAAI;YACX,MAAM,EAAE,mBAAmB;SAC9B,CAAC;QAEF,IAAI,aAAa,IAAI,aAAa,CAAC,aAAa,EAAE,CAAC;YAC/C,aAAa,CAAC,aAAa,CAAC,WAAW,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;QAC1D,CAAC;IACL,CAAC,EACD,CAAC,aAAa,CAAC,CAClB,CAAC;IAEF,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,QAAQ,CAAC,OAAO,GAAG,iBAAiB,EAAE,CAAC;IAC3C,CAAC;IAED,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC,KAAK,EAAE,EAAE;YAClC,MAAM,EAAC,WAAW,EAAE,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,GAAG,QAAQ,EAAC,GAAG,KAAK,CAAC;YACtF,eAAe,CAAC,QAAQ,CAAC,EAAC,GAAG,QAAQ,EAAE,WAAW,EAAE,EAAE,EAAE,aAAa,EAAE,EAAE,EAAC,CAAC,CAAC,CAAC;QACjF,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,OAAO,CACH,KAAC,sBAAsB,CAAC,QAAQ,IAC5B,KAAK,EAAE;YACH,KAAK,EAAE,QAAQ,CAAC,OAAO;SAC1B,YAEA,QAAQ,GACqB,CACrC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {StoreApi} from 'zustand';\n\nimport {POST_MESSAGE_SOURCE} from '../../../common/constants';\nimport {EditorState} from '../../../common/store';\nimport {StoreSyncMessage} from '../../../common/types';\nimport {removeFn} from '../../../common/utils';\nimport {EditorStore, createEditorStore} from '../../store';\nimport {IframeContext} from '../iframeContext';\n\nimport {MainEditorStoreContext} from './MainEditorStoreContext';\n\ninterface MainEditorProviderProps extends React.PropsWithChildren {}\n\nexport const MainEditorStoreProvider = ({children}: MainEditorProviderProps) => {\n    const {iframeElement} = React.useContext(IframeContext);\n    const storeRef = React.useRef<StoreApi<EditorStore>>();\n\n    const sendPostMessage = React.useCallback(\n        (data: EditorState) => {\n            const message: StoreSyncMessage = {\n                state: data,\n                source: POST_MESSAGE_SOURCE,\n            };\n\n            if (iframeElement && iframeElement.contentWindow) {\n                iframeElement.contentWindow.postMessage(message, '*');\n            }\n        },\n        [iframeElement],\n    );\n\n    if (!storeRef.current) {\n        storeRef.current = createEditorStore();\n    }\n\n    React.useEffect(() => {\n        storeRef.current?.subscribe((state) => {\n            const {historyPast: _historyPast, historyFuture: _historyFuture, ...syncable} = state;\n            sendPostMessage(removeFn({...syncable, historyPast: [], historyFuture: []}));\n        });\n    }, [sendPostMessage]);\n\n    return (\n        <MainEditorStoreContext.Provider\n            value={{\n                state: storeRef.current,\n            }}\n        >\n            {children}\n        </MainEditorStoreContext.Provider>\n    );\n};\n"]}

package/build/esm/editor-v2/hooks/useMainEditorInitialize.d.ts

@@ -1,3 +1,3 @@
 import { PageContent } from "../../models/index.js";
-declare const useMainEditorInitialize: (initialContent?: PageContent) => void;
+declare const useMainEditorInitialize: (content?: PageContent) => void;
 export default useMainEditorInitialize;

package/build/esm/editor-v2/hooks/useMainEditorInitialize.js

@@ -2,22 +2,22 @@ import * as React from 'react';
 import { usePostMessageAPIListener } from "../../common/postMessage.js";
 import { useMainEditorStore } from "./useMainEditorStore.js";
 import { usePostMessageEvents } from "./usePostMessageEvents.js";
-const useMainEditorInitialize = (initialContent) => {
+const useMainEditorInitialize = (content) => {
     const { requestPostMessage } = usePostMessageEvents();
     const { initialize, setConfig, setContent } = useMainEditorStore();
     usePostMessageAPIListener('ON_INIT', () => {
         initialize();
         requestPostMessage('GET_SUPPORTED_BLOCKS', {});
-        if (!initialContent) {
+        if (!content) {
             requestPostMessage('GET_INITIAL_CONTENT', {});
         }
     }, [requestPostMessage]);
     React.useEffect(() => {
-        if (initialContent) {
-            setContent(initialContent, true);
+        if (content) {
+            setContent(content, true);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [initialContent]);
+    }, [content]);
     usePostMessageAPIListener('ON_INITIAL_CONTENT', (data) => {
         setContent(data, true);
     });

package/build/esm/editor-v2/hooks/useMainEditorInitialize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMainEditorInitialize.js","sourceRoot":"../../../../src","sources":["editor-v2/hooks/useMainEditorInitialize.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,yBAAyB,EAAC,oCAAiC;AAGnE,OAAO,EAAC,kBAAkB,EAAC,gCAA6B;AACxD,OAAO,EAAC,oBAAoB,EAAC,kCAA+B;AAE5D,MAAM,uBAAuB,GAAG,CAAC,cAA4B,EAAE,EAAE;IAC7D,MAAM,EAAC,kBAAkB,EAAC,GAAG,oBAAoB,EAAE,CAAC;IACpD,MAAM,EAAC,UAAU,EAAE,SAAS,EAAE,UAAU,EAAC,GAAG,kBAAkB,EAAE,CAAC;IAEjE,yBAAyB,CACrB,SAAS,EACT,GAAG,EAAE;QACD,UAAU,EAAE,CAAC;QACb,kBAAkB,CAAC,sBAAsB,EAAE,EAAE,CAAC,CAAC;QAE/C,IAAI,CAAC,cAAc,EAAE,CAAC;YAClB,kBAAkB,CAAC,qBAAqB,EAAE,EAAE,CAAC,CAAC;QAClD,CAAC;IACL,CAAC,EACD,CAAC,kBAAkB,CAAC,CACvB,CAAC;IAEF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,cAAc,EAAE,CAAC;YACjB,UAAU,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;QACrC,CAAC;QACD,uDAAuD;IAC3D,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAErB,yBAAyB,CAAC,oBAAoB,EAAE,CAAC,IAAI,EAAE,EAAE;QACrD,UAAU,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC3B,CAAC,CAAC,CAAC;IAEH,yBAAyB,CAAC,qBAAqB,EAAE,CAAC,IAAI,EAAE,EAAE;QACtD,SAAS,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,eAAe,uBAAuB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {usePostMessageAPIListener} from '../../common/postMessage';\nimport {PageContent} from '../../models';\n\nimport {useMainEditorStore} from './useMainEditorStore';\nimport {usePostMessageEvents} from './usePostMessageEvents';\n\nconst useMainEditorInitialize = (initialContent?: PageContent) => {\n    const {requestPostMessage} = usePostMessageEvents();\n    const {initialize, setConfig, setContent} = useMainEditorStore();\n\n    usePostMessageAPIListener(\n        'ON_INIT',\n        () => {\n            initialize();\n            requestPostMessage('GET_SUPPORTED_BLOCKS', {});\n\n            if (!initialContent) {\n                requestPostMessage('GET_INITIAL_CONTENT', {});\n            }\n        },\n        [requestPostMessage],\n    );\n\n    React.useEffect(() => {\n        if (initialContent) {\n            setContent(initialContent, true);\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [initialContent]);\n\n    usePostMessageAPIListener('ON_INITIAL_CONTENT', (data) => {\n        setContent(data, true);\n    });\n\n    usePostMessageAPIListener('ON_SUPPORTED_BLOCKS', (data) => {\n        setConfig(data);\n    });\n};\n\nexport default useMainEditorInitialize;\n"]}
+{"version":3,"file":"useMainEditorInitialize.js","sourceRoot":"../../../../src","sources":["editor-v2/hooks/useMainEditorInitialize.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,yBAAyB,EAAC,oCAAiC;AAGnE,OAAO,EAAC,kBAAkB,EAAC,gCAA6B;AACxD,OAAO,EAAC,oBAAoB,EAAC,kCAA+B;AAE5D,MAAM,uBAAuB,GAAG,CAAC,OAAqB,EAAE,EAAE;IACtD,MAAM,EAAC,kBAAkB,EAAC,GAAG,oBAAoB,EAAE,CAAC;IACpD,MAAM,EAAC,UAAU,EAAE,SAAS,EAAE,UAAU,EAAC,GAAG,kBAAkB,EAAE,CAAC;IAEjE,yBAAyB,CACrB,SAAS,EACT,GAAG,EAAE;QACD,UAAU,EAAE,CAAC;QACb,kBAAkB,CAAC,sBAAsB,EAAE,EAAE,CAAC,CAAC;QAE/C,IAAI,CAAC,OAAO,EAAE,CAAC;YACX,kBAAkB,CAAC,qBAAqB,EAAE,EAAE,CAAC,CAAC;QAClD,CAAC;IACL,CAAC,EACD,CAAC,kBAAkB,CAAC,CACvB,CAAC;IAEF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,OAAO,EAAE,CAAC;YACV,UAAU,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;QAC9B,CAAC;QACD,uDAAuD;IAC3D,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,yBAAyB,CAAC,oBAAoB,EAAE,CAAC,IAAI,EAAE,EAAE;QACrD,UAAU,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC3B,CAAC,CAAC,CAAC;IAEH,yBAAyB,CAAC,qBAAqB,EAAE,CAAC,IAAI,EAAE,EAAE;QACtD,SAAS,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,eAAe,uBAAuB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {usePostMessageAPIListener} from '../../common/postMessage';\nimport {PageContent} from '../../models';\n\nimport {useMainEditorStore} from './useMainEditorStore';\nimport {usePostMessageEvents} from './usePostMessageEvents';\n\nconst useMainEditorInitialize = (content?: PageContent) => {\n    const {requestPostMessage} = usePostMessageEvents();\n    const {initialize, setConfig, setContent} = useMainEditorStore();\n\n    usePostMessageAPIListener(\n        'ON_INIT',\n        () => {\n            initialize();\n            requestPostMessage('GET_SUPPORTED_BLOCKS', {});\n\n            if (!content) {\n                requestPostMessage('GET_INITIAL_CONTENT', {});\n            }\n        },\n        [requestPostMessage],\n    );\n\n    React.useEffect(() => {\n        if (content) {\n            setContent(content, true);\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [content]);\n\n    usePostMessageAPIListener('ON_INITIAL_CONTENT', (data) => {\n        setContent(data, true);\n    });\n\n    usePostMessageAPIListener('ON_SUPPORTED_BLOCKS', (data) => {\n        setConfig(data);\n    });\n};\n\nexport default useMainEditorInitialize;\n"]}

package/build/esm/form-builder-v2/CanvasContentContext.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import type { Content } from "../form-generator-v2/types.js";
+interface CanvasContentContextType {
+    content: Content;
+    setContent: React.Dispatch<React.SetStateAction<Content>>;
+    templateContent: Content;
+    setTemplateContent: React.Dispatch<React.SetStateAction<Content>>;
+}
+interface CanvasContentProviderProps {
+    content: Content;
+    setContent: React.Dispatch<React.SetStateAction<Content>>;
+    templateContent: Content;
+    setTemplateContent: React.Dispatch<React.SetStateAction<Content>>;
+    children: React.ReactNode;
+}
+export declare const CanvasContentProvider: ({ content, setContent, templateContent, setTemplateContent, children, }: CanvasContentProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const useCanvasContent: () => CanvasContentContextType;
+export {};

package/build/esm/form-builder-v2/CanvasContentContext.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+const CanvasContentContext = React.createContext(null);
+export const CanvasContentProvider = ({ content, setContent, templateContent, setTemplateContent, children, }) => {
+    const value = React.useMemo(() => ({ content, setContent, templateContent, setTemplateContent }), [content, setContent, templateContent, setTemplateContent]);
+    return _jsx(CanvasContentContext.Provider, { value: value, children: children });
+};
+export const useCanvasContent = () => {
+    const context = React.useContext(CanvasContentContext);
+    if (!context) {
+        throw new Error('useCanvasContent must be used within a CanvasContentProvider');
+    }
+    return context;
+};
+//# sourceMappingURL=CanvasContentContext.js.map