@gravity-ui/page-constructor 6.3.1 → 6.3.2-alpha.10

package/build/esm/common/utils.d.ts

@@ -0,0 +1,25 @@
+import { StoreApi } from 'zustand';
+export declare function initializeStore<State extends {}, Methods extends {} = {}>(initialState: State, methods: (set: StoreApi<State & Methods>['setState'], get: StoreApi<State & Methods>['getState']) => Methods): (overrideInitialState?: Partial<State>) => import("zustand").UseBoundStore<Omit<Omit<Omit<StoreApi<State & Methods>, "subscribe"> & {
+    subscribe: {
+        (listener: (selectedState: State & Methods, previousSelectedState: State & Methods) => void): () => void;
+        <U>(selector: (state: State & Methods) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
+            equalityFn?: ((a: U, b: U) => boolean) | undefined;
+            fireImmediately?: boolean;
+        } | undefined): () => void;
+    };
+}, "setState"> & {
+    setState<A extends string | {
+        type: string;
+    }>(partial: (State & Methods) | Partial<State & Methods> | ((state: State & Methods) => (State & Methods) | Partial<State & Methods>), replace?: boolean | undefined, action?: A | undefined): void;
+}, "persist"> & {
+    persist: {
+        setOptions: (options: Partial<import("zustand/middleware").PersistOptions<State & Methods, State & Methods>>) => void;
+        clearStorage: () => void;
+        rehydrate: () => Promise<void> | void;
+        hasHydrated: () => boolean;
+        onHydrate: (fn: (state: State & Methods) => void) => () => void;
+        onFinishHydration: (fn: (state: State & Methods) => void) => () => void;
+        getOptions: () => Partial<import("zustand/middleware").PersistOptions<State & Methods, State & Methods>>;
+    };
+}>;
+export declare const removeFn: (object: object) => any;

package/build/esm/common/utils.js

@@ -0,0 +1,17 @@
+import { create } from 'zustand';
+import { devtools, subscribeWithSelector } from 'zustand/middleware';
+export function initializeStore(initialState, methods) {
+    return (overrideInitialState) => {
+        return create(subscribeWithSelector(devtools((set, get) => {
+            return {
+                ...initialState,
+                ...overrideInitialState,
+                ...methods(set, get),
+            };
+        })));
+    };
+}
+export const removeFn = (object) => {
+    return JSON.parse(JSON.stringify(object));
+};
+//# sourceMappingURL=utils.js.map

package/build/esm/common/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"../../../src","sources":["common/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAW,MAAM,EAAC,MAAM,SAAS,CAAC;AACzC,OAAO,EAAC,QAAQ,EAAE,qBAAqB,EAAC,MAAM,oBAAoB,CAAC;AAEnE,MAAM,UAAU,eAAe,CAC3B,YAAmB,EACnB,OAGY;IAEZ,OAAO,CAAC,oBAAqC,EAAE,EAAE;QAC7C,OAAO,MAAM,CAQT,qBAAqB,CACjB,QAAQ,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE;YAClB,OAAO;gBACH,GAAG,YAAY;gBACf,GAAG,oBAAoB;gBACvB,GAAG,OAAO,CAAC,GAAG,EAAE,GAAG,CAAC;aACvB,CAAC;QACN,CAAC,CAAC,CACL,CACJ,CAAC;IACN,CAAC,CAAC;AACN,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,MAAc,EAAE,EAAE;IACvC,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC;AAC9C,CAAC,CAAC","sourcesContent":["import {StoreApi, create} from 'zustand';\nimport {devtools, subscribeWithSelector} from 'zustand/middleware';\n\nexport function initializeStore<State extends {}, Methods extends {} = {}>(\n    initialState: State,\n    methods: (\n        set: StoreApi<State & Methods>['setState'],\n        get: StoreApi<State & Methods>['getState'],\n    ) => Methods,\n) {\n    return (overrideInitialState?: Partial<State>) => {\n        return create<\n            State & Methods,\n            [\n                ['zustand/subscribeWithSelector', State & Methods],\n                ['zustand/devtools', never],\n                ['zustand/persist', State & Methods],\n            ]\n        >(\n            subscribeWithSelector(\n                devtools((set, get) => {\n                    return {\n                        ...initialState,\n                        ...overrideInitialState,\n                        ...methods(set, get),\n                    };\n                }),\n            ),\n        );\n    };\n}\n\nexport const removeFn = (object: object) => {\n    return JSON.parse(JSON.stringify(object));\n};\n"]}

package/build/esm/components/BlockBase/BlockBase.css

@@ -4,30 +4,25 @@ unpredictable css rules order in build */
   --anchor-offset: 48px;
 }
 .pc-block-base.pc-block-base {
-  margin-top: 48px;
-  padding: 0 0 48px;
+  padding: 48px 0;
 }
-.pc-block-base.pc-block-base:first-child {
-  margin-top: var(--pc-first-block-indent, 96px);
-}
-
 .pc-block-base.pc-block-base.pc-block-base.pc-block-base_indentTop_0 {
-  margin-top: 0;
+  padding-top: 0;
 }
 .pc-block-base.pc-block-base.pc-block-base.pc-block-base_indentTop_xs {
-  margin-top: 16px;
+  padding-top: 16px;
 }
 .pc-block-base.pc-block-base.pc-block-base.pc-block-base_indentTop_s {
-  margin-top: 24px;
+  padding-top: 24px;
 }
 .pc-block-base.pc-block-base.pc-block-base.pc-block-base_indentTop_m {
-  margin-top: 32px;
+  padding-top: 32px;
 }
 .pc-block-base.pc-block-base.pc-block-base.pc-block-base_indentTop_l {
-  margin-top: 48px;
+  padding-top: 48px;
 }
 .pc-block-base.pc-block-base.pc-block-base.pc-block-base_indentTop_xl {
-  margin-top: 64px;
+  padding-top: 64px;
 }
 .pc-block-base.pc-block-base.pc-block-base.pc-block-base_indentBottom_0 {
   padding-bottom: 0;
@@ -50,12 +45,9 @@ unpredictable css rules order in build */
 
 @media only screen and (max-width: 577px) {
   .pc-block-base.pc-block-base {
-    margin-top: 32px;
+    padding-top: 32px;
     padding-bottom: 32px;
   }
-  .pc-block-base.pc-block-base:first-child {
-    margin-top: var(--pc-first-block-mobile-indent, 64px);
-  }
 }
 
 .pc-block-base_reset-paddings.pc-block-base.pc-block-base_reset-paddings.pc-block-base {

package/build/esm/components/FullscreenImage/FullscreenImage.css

@@ -53,7 +53,7 @@ unpredictable css rules order in build */
 .pc-fullscreen-image__icon-wrapper:focus:not(:focus-visible) {
   outline: 0;
 }
-.pc-fullscreen-image__icon-wrapper:focus {
+.pc-fullscreen-image__icon-wrapper_visible {
   opacity: 1;
 }
 .pc-fullscreen-image__icon {

package/build/esm/components/FullscreenMedia/FullscreenMedia.css

@@ -29,9 +29,7 @@ unpredictable css rules order in build */
   max-width: min(65vw, 1232px);
   width: 100%;
   aspect-ratio: 16/9;
-  height: calc(
-                min(65vw, 1232px) * 9 / 16
-            ) !important; /* stylelint-disable-line declaration-no-important */
+  height: calc(min(65vw, 1232px) * 9 / 16) !important; /* stylelint-disable-line declaration-no-important */
 }
 .pc-full-screen-media__modal .g-modal__content, .pc-full-screen-media__modal-image {
   border-radius: var(--pc-border-radius);

package/build/esm/components/Image/dynamic-form.d.ts

@@ -0,0 +1,2 @@
+import { ConfigInput } from "../../common/types/index.js";
+export declare const imageInputs: ConfigInput[];

package/build/esm/components/Image/dynamic-form.js

@@ -0,0 +1,81 @@
+import _ from 'lodash';
+const devices = ['desktop', 'tablet', 'mobile'];
+const imageBaseInputs = [
+    {
+        type: 'text',
+        name: 'alt',
+        title: 'Alternative',
+    },
+    {
+        type: 'boolean',
+        name: 'disableCompress',
+        title: 'Disable Compress',
+    },
+];
+const imageStyleInputs = [
+    {
+        type: 'text',
+        name: 'style.backgroundColor',
+        title: 'Background Color',
+    },
+    {
+        type: 'text',
+        name: 'style.height',
+        title: 'Height',
+    },
+    {
+        type: 'text',
+        name: 'style.width',
+        title: 'Width',
+    },
+    {
+        type: 'text',
+        name: 'style.color',
+        title: 'Color',
+    },
+];
+const devicesInputs = devices.map((device) => ({
+    type: 'text',
+    title: _.capitalize(device),
+    name: `${device}`,
+}));
+export const imageInputs = [
+    {
+        type: 'oneOf',
+        name: '',
+        key: 'imageType',
+        title: 'Image Type',
+        options: [
+            {
+                title: 'Simple',
+                value: 'simple',
+                properties: [
+                    {
+                        type: 'text',
+                        name: '', // image props
+                        title: 'Image URL',
+                    },
+                ],
+            },
+            {
+                title: 'Complex',
+                value: 'complex',
+                properties: [
+                    {
+                        type: 'text',
+                        name: 'src',
+                        title: 'Source',
+                    },
+                    ...imageStyleInputs,
+                    ...imageBaseInputs,
+                ],
+            },
+            {
+                title: 'Device Based',
+                value: 'deviseBased',
+                properties: [...devicesInputs, ...imageBaseInputs],
+            },
+        ],
+    },
+];
+//# sourceMappingURL=dynamic-form.js.map

package/build/esm/components/Image/dynamic-form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dynamic-form.js","sourceRoot":"../../../../src","sources":["components/Image/dynamic-form.ts"],"names":[],"mappings":"AAAA,OAAO,CAAC,MAAM,QAAQ,CAAC;AAIvB,MAAM,OAAO,GAAG,CAAC,SAAS,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAEhD,MAAM,eAAe,GAAkB;IACnC;QACI,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,KAAK;QACX,KAAK,EAAE,aAAa;KACvB;IACD;QACI,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,iBAAiB;QACvB,KAAK,EAAE,kBAAkB;KAC5B;CACJ,CAAC;AAEF,MAAM,gBAAgB,GAAkB;IACpC;QACI,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,uBAAuB;QAC7B,KAAK,EAAE,kBAAkB;KAC5B;IACD;QACI,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,cAAc;QACpB,KAAK,EAAE,QAAQ;KAClB;IACD;QACI,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,aAAa;QACnB,KAAK,EAAE,OAAO;KACjB;IACD;QACI,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,aAAa;QACnB,KAAK,EAAE,OAAO;KACjB;CACJ,CAAC;AAEF,MAAM,aAAa,GAAkB,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;IAC1D,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC;IAC3B,IAAI,EAAE,GAAG,MAAM,EAAE;CACpB,CAAC,CAAC,CAAC;AAEJ,MAAM,CAAC,MAAM,WAAW,GAAkB;IACtC;QACI,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,EAAE;QACR,GAAG,EAAE,WAAW;QAChB,KAAK,EAAE,YAAY;QACnB,OAAO,EAAE;YACL;gBACI,KAAK,EAAE,QAAQ;gBACf,KAAK,EAAE,QAAQ;gBACf,UAAU,EAAE;oBACR;wBACI,IAAI,EAAE,MAAM;wBACZ,IAAI,EAAE,EAAE,EAAE,cAAc;wBACxB,KAAK,EAAE,WAAW;qBACrB;iBACJ;aACJ;YACD;gBACI,KAAK,EAAE,SAAS;gBAChB,KAAK,EAAE,SAAS;gBAChB,UAAU,EAAE;oBACR;wBACI,IAAI,EAAE,MAAM;wBACZ,IAAI,EAAE,KAAK;wBACX,KAAK,EAAE,QAAQ;qBAClB;oBACD,GAAG,gBAAgB;oBACnB,GAAG,eAAe;iBACrB;aACJ;YACD;gBACI,KAAK,EAAE,cAAc;gBACrB,KAAK,EAAE,aAAa;gBACpB,UAAU,EAAE,CAAC,GAAG,aAAa,EAAE,GAAG,eAAe,CAAC;aACrD;SACJ;KACJ;CACJ,CAAC","sourcesContent":["import _ from 'lodash';\n\nimport {ConfigInput} from '../../common/types';\n\nconst devices = ['desktop', 'tablet', 'mobile'];\n\nconst imageBaseInputs: ConfigInput[] = [\n    {\n        type: 'text',\n        name: 'alt',\n        title: 'Alternative',\n    },\n    {\n        type: 'boolean',\n        name: 'disableCompress',\n        title: 'Disable Compress',\n    },\n];\n\nconst imageStyleInputs: ConfigInput[] = [\n    {\n        type: 'text',\n        name: 'style.backgroundColor',\n        title: 'Background Color',\n    },\n    {\n        type: 'text',\n        name: 'style.height',\n        title: 'Height',\n    },\n    {\n        type: 'text',\n        name: 'style.width',\n        title: 'Width',\n    },\n    {\n        type: 'text',\n        name: 'style.color',\n        title: 'Color',\n    },\n];\n\nconst devicesInputs: ConfigInput[] = devices.map((device) => ({\n    type: 'text',\n    title: _.capitalize(device),\n    name: `${device}`,\n}));\n\nexport const imageInputs: ConfigInput[] = [\n    {\n        type: 'oneOf',\n        name: '',\n        key: 'imageType',\n        title: 'Image Type',\n        options: [\n            {\n                title: 'Simple',\n                value: 'simple',\n                properties: [\n                    {\n                        type: 'text',\n                        name: '', // image props\n                        title: 'Image URL',\n                    },\n                ],\n            },\n            {\n                title: 'Complex',\n                value: 'complex',\n                properties: [\n                    {\n                        type: 'text',\n                        name: 'src',\n                        title: 'Source',\n                    },\n                    ...imageStyleInputs,\n                    ...imageBaseInputs,\n                ],\n            },\n            {\n                title: 'Device Based',\n                value: 'deviseBased',\n                properties: [...devicesInputs, ...imageBaseInputs],\n            },\n        ],\n    },\n];\n"]}

package/build/esm/components/ReactPlayer/ReactPlayer.js

@@ -3,7 +3,7 @@ import * as React from 'react';
 import { PlayFill } from '@gravity-ui/icons';
 import { Icon } from '@gravity-ui/uikit';
 import debounce from "lodash/debounce.js";
-import ReactPlayer from 'react-player';
+import _ReactPlayer from 'react-player';
 import { MobileContext } from "../../context/mobileContext/index.js";
 import { VideoContext } from "../../context/videoContext/index.js";
 import { useAnalytics, useMount } from "../../hooks/index.js";
@@ -16,6 +16,9 @@ import { isYoutubePlayerInstance } from "./utils/youtube.js";
 import './ReactPlayer.css';
 const b = block('ReactPlayer');
 const FPS = 60;
+const ReactPlayer = 'default' in _ReactPlayer && _ReactPlayer.default
+    ? _ReactPlayer.default
+    : _ReactPlayer;
 // eslint-disable-next-line react/display-name
 export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
     const isMobile = React.useContext(MobileContext);

package/build/esm/components/ReactPlayer/ReactPlayer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReactPlayer.js","sourceRoot":"../../../../src","sources":["components/ReactPlayer/ReactPlayer.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {PlayFill} from '@gravity-ui/icons';\nimport {Icon} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\nimport ReactPlayer from 'react-player';\n\nimport {MobileContext} from '../../context/mobileContext';\nimport {VideoContext} from '../../context/videoContext';\nimport {useAnalytics, useMount} from '../../hooks';\nimport {\n    AnalyticsEvent,\n    ClassNameProps,\n    CustomControlsButtonPositioning,\n    CustomControlsType,\n    DefaultEventNames,\n    MediaVideoControlsType,\n    MediaVideoProps,\n    PlayButtonProps,\n    PlayButtonThemes,\n    PlayButtonType,\n    PredefinedEventTypes,\n    ReactPlayerBlockHandler,\n} from '../../models';\nimport {block} from '../../utils';\n\nimport CustomBarControls from './CustomBarControls';\nimport {i18n} from './i18n';\nimport {checkYoutubeVideos} from './utils';\nimport {isYoutubePlayerInstance} from './utils/youtube';\n\nimport './ReactPlayer.scss';\n\nconst b = block('ReactPlayer');\n\nconst FPS = 60;\n\nexport interface ReactPlayerBlockProps\n    extends Omit<MediaVideoProps, 'loop' | 'src'>,\n        ClassNameProps {\n    src: string | string[];\n    previewImgUrl?: string;\n    loop?: boolean;\n    customBarControlsClassName?: string;\n    showPreview?: boolean;\n    onClickPreview?: () => void;\n    height?: number;\n    ratio?: number;\n    autoRatio?: boolean;\n    children?: React.ReactNode;\n}\n\ninterface PlayerPropgress {\n    played: number;\n}\n\n// eslint-disable-next-line react/display-name\nexport const ReactPlayerBlock = React.forwardRef<ReactPlayerBlockHandler, ReactPlayerBlockProps>(\n    (props, originRef) => {\n        const isMobile = React.useContext(MobileContext);\n        const {\n            src,\n            previewImgUrl,\n            loop = false,\n            controls = MediaVideoControlsType.Default,\n            customControlsOptions = {},\n            muted: initiallyMuted = false,\n            elapsedTime,\n            playButton,\n            className,\n            customBarControlsClassName,\n            showPreview,\n            onClickPreview,\n            analyticsEvents,\n            height,\n            ariaLabel,\n            ratio,\n            autoRatio,\n            contain = true,\n        } = props;\n\n        const {\n            type = PlayButtonType.Default,\n            theme = PlayButtonThemes.Blue,\n            text,\n            className: buttonClassName,\n        } = playButton || ({} as PlayButtonProps);\n        const {\n            type: customControlsType = CustomControlsType.WithMuteButton,\n            muteButtonShown,\n            positioning = CustomControlsButtonPositioning.Center,\n        } = customControlsOptions;\n\n        const autoPlay = Boolean(!isMobile && !previewImgUrl && props.autoplay);\n        const mute = initiallyMuted || autoPlay;\n\n        const {playingVideoRef, setProps} = React.useContext(VideoContext);\n\n        const ref = React.useRef<HTMLDivElement>(null);\n        const buttonRef = React.useRef<HTMLButtonElement>(null);\n\n        const [playerRef, setPlayerRef] = React.useState<ReactPlayer>();\n        const [isPlaying, setIsPlaying] = React.useState(autoPlay);\n        const [playedPercent, setPlayedPercent] = React.useState<number>(0);\n        const [currentHeight, setCurrentHeight] = React.useState(height);\n        const [width, setWidth] = React.useState<number>(0);\n        const [actualRatio, setActualRatio] = React.useState<number>();\n        const [muted, setMuted] = React.useState<boolean>(mute);\n        const [started, setStarted] = React.useState(autoPlay);\n        const [ended, setEnded] = React.useState<boolean>(false);\n        const [isMounted, setIsMounted] = React.useState(false);\n        const [hovered, setHovered] = React.useState(isMobile);\n\n        useMount(() => setIsMounted(true));\n\n        const videoSrc = React.useMemo(() => checkYoutubeVideos(src), [src]);\n\n        const eventsArray = React.useMemo(() => {\n            if (analyticsEvents) {\n                return Array.isArray(analyticsEvents) ? analyticsEvents : [analyticsEvents];\n            }\n\n            return [];\n        }, [analyticsEvents]);\n        const handleAnalytics = useAnalytics(DefaultEventNames.ReactPlayerControls);\n\n        React.useImperativeHandle(originRef, () => {\n            if (!playerRef) {\n                return;\n            }\n\n            let play, pause, addEventListener;\n            const videoInstance = playerRef.getInternalPlayer();\n            if (isYoutubePlayerInstance(videoInstance)) {\n                ({pauseVideo: pause, playVideo: play, addEventListener} = videoInstance);\n            } else {\n                // it is assumed that `videoInstance` is HTMLVideoElement by default\n                ({play, pause, addEventListener} = videoInstance);\n            }\n\n            // eslint-disable-next-line consistent-return\n            return {\n                play: play.bind(videoInstance),\n                pause: pause.bind(videoInstance),\n                addEventListener: addEventListener.bind(videoInstance),\n            };\n        }, [playerRef]);\n\n        React.useEffect(() => {\n            if (ref.current && !playingVideoRef?.contains(ref.current)) {\n                setMuted(true);\n            }\n        }, [playingVideoRef]);\n\n        React.useEffect(() => {\n            if (showPreview) {\n                playerRef?.showPreview();\n            }\n        }, [showPreview, playerRef]);\n\n        React.useEffect(() => {\n            if (playerRef && !started) {\n                setIsPlaying(autoPlay);\n            }\n        }, [autoPlay, playerRef, started]);\n\n        React.useEffect(() => setMuted(mute), [mute]);\n\n        React.useEffect(() => {\n            if (!started && isPlaying) {\n                setStarted(true);\n            }\n        }, [isPlaying, started]);\n\n        React.useEffect(() => {\n            if (started && !Number.isNaN(Number(elapsedTime))) {\n                playerRef?.seekTo(elapsedTime ?? 0, 'seconds');\n            }\n        }, [elapsedTime, playerRef, started]);\n\n        React.useEffect(() => {\n            const updateSize = debounce(() => {\n                if (ref.current) {\n                    // We need to get parent's width does not equal 0\n                    const parentElement = getParentElement(ref.current);\n                    const {paddingLeft, paddingRight} = getComputedStyle(parentElement);\n                    const newWidth =\n                        parentElement.offsetWidth -\n                        parseFloat(paddingLeft) -\n                        parseFloat(paddingRight);\n\n                    setWidth(newWidth);\n                    setCurrentHeight(\n                        Math.floor(\n                            getHeight(newWidth, ratio ?? (autoRatio ? actualRatio : undefined)),\n                        ),\n                    );\n                }\n            }, 200);\n\n            updateSize();\n            window.addEventListener('resize', updateSize, {passive: true});\n            return () => {\n                window.removeEventListener('resize', updateSize);\n            };\n        }, [actualRatio, autoRatio, ratio]);\n\n        const playEvents = React.useMemo(\n            () => eventsArray?.filter((e: AnalyticsEvent) => e.type === PredefinedEventTypes.Play),\n            [eventsArray],\n        );\n        const stopEvents = React.useMemo(\n            () => eventsArray?.filter((e: AnalyticsEvent) => e.type === PredefinedEventTypes.Stop),\n            [eventsArray],\n        );\n\n        const playIcon = React.useMemo(() => {\n            let playButtonContent;\n\n            switch (type) {\n                case PlayButtonType.Text:\n                    playButtonContent = text;\n                    break;\n                case PlayButtonType.Default:\n                default:\n                    playButtonContent = <Icon className={b('icon')} data={PlayFill} size={24} />;\n                    break;\n            }\n\n            return (\n                <button\n                    className={b('button', {theme, text: Boolean(text)}, buttonClassName)}\n                    aria-label={i18n('play')}\n                    ref={buttonRef}\n                >\n                    {playButtonContent}\n                </button>\n            );\n        }, [type, theme, text, buttonClassName]);\n\n        const changeMute = React.useCallback(\n            (isMuted: boolean) => {\n                if (\n                    isMuted &&\n                    playerRef &&\n                    controls === MediaVideoControlsType.Custom &&\n                    customControlsType === CustomControlsType.WithMuteButton\n                ) {\n                    playerRef.seekTo(0);\n                    setPlayedPercent(0);\n                }\n\n                const events = isMuted ? playEvents : stopEvents;\n                handleAnalytics(events);\n\n                if (isMuted) {\n                    setProps({playingVideoRef: ref.current});\n                }\n\n                // In order to the progress bar to update (equals 0) before displaying\n                setTimeout(() => setMuted(!isMuted), 0);\n            },\n            [\n                playerRef,\n                customControlsType,\n                playEvents,\n                stopEvents,\n                handleAnalytics,\n                setProps,\n                controls,\n            ],\n        );\n\n        const handleClickPreview = React.useCallback(() => {\n            setIsPlaying(true);\n            onClickPreview?.();\n\n            handleAnalytics(playEvents);\n        }, [onClickPreview, handleAnalytics, playEvents]);\n\n        const onPause = React.useCallback(() => {\n            // For support correct state for youtube\n            if (\n                controls !== MediaVideoControlsType.Custom ||\n                customControlsType !== CustomControlsType.WithMuteButton\n            ) {\n                setIsPlaying(false);\n            }\n        }, [controls, customControlsType]);\n\n        const onStart = React.useCallback(() => {\n            if (!autoPlay && !initiallyMuted) {\n                setMuted(false);\n            }\n        }, [autoPlay, initiallyMuted]);\n\n        const onPlay = React.useCallback(() => {\n            setIsPlaying(true);\n\n            if (\n                controls === MediaVideoControlsType.Custom &&\n                customControlsType === CustomControlsType.WithMuteButton\n            ) {\n                if (ended) {\n                    changeMute(false);\n                } else if (!isPlaying) {\n                    changeMute(muted);\n                }\n                setEnded(false);\n            }\n        }, [changeMute, controls, customControlsType, ended, isPlaying, muted]);\n\n        const onReady = React.useCallback((player: ReactPlayer) => {\n            setPlayerRef(player);\n            const videoElement = player.getInternalPlayer();\n            const videoWidth = videoElement.videoWidth as number | undefined;\n            const videoHeight = videoElement.videoHeight as number | undefined;\n            if (videoWidth && videoHeight) {\n                setActualRatio(videoHeight / videoWidth);\n            }\n        }, []);\n\n        const onProgress = React.useCallback((progress: PlayerPropgress) => {\n            setPlayedPercent(progress.played);\n\n            if (progress.played === 1) {\n                setMuted(true);\n            }\n        }, []);\n\n        const onEnded = React.useCallback(() => {\n            // Youtube videos not muted after finishing playing and start again.\n            // 'onEnded' does not fire when 'loop' is set to true.\n            // It is custom loop with muted sound after finishing playing and start again.\n            if (loop) {\n                setPlayedPercent(0);\n                setIsPlaying(true);\n                playerRef?.seekTo(0);\n            }\n\n            setEnded(true);\n        }, [loop, playerRef]);\n\n        const onPlayClick = React.useCallback(() => {\n            if (isPlaying) {\n                onPause();\n            } else {\n                onPlay();\n            }\n        }, [isPlaying, onPlay, onPause]);\n\n        const handleClick = React.useCallback(() => {\n            buttonRef.current?.click();\n\n            if (controls === MediaVideoControlsType.Custom) {\n                if (customControlsType === CustomControlsType.WithMuteButton) {\n                    changeMute(muted);\n                } else {\n                    onPlayClick();\n                }\n            }\n        }, [controls, customControlsType, changeMute, muted, onPlayClick]);\n\n        const handleKeyDown = React.useCallback((e: React.KeyboardEvent) => {\n            const key = e.key.toLowerCase();\n\n            if (key === 'enter') {\n                buttonRef.current?.click();\n            }\n        }, []);\n\n        const onFocusIn = React.useCallback(() => setHovered(true), []);\n        const onFocusOut = React.useCallback(() => setHovered(false), []);\n\n        return (\n            <div\n                className={b(\n                    {\n                        wrapper: !currentHeight,\n                        controls,\n                        contain,\n                        'auto-ratio': autoRatio,\n                    },\n                    className,\n                )}\n                ref={ref}\n                onClick={handleClick}\n                onMouseEnter={onFocusIn}\n                onMouseLeave={onFocusOut}\n                onFocus={onFocusIn}\n                onBlur={onFocusOut}\n                onKeyDown={handleKeyDown}\n                role=\"button\"\n                tabIndex={0}\n            >\n                {isMounted ? (\n                    <React.Fragment>\n                        <ReactPlayer\n                            className={b('player')}\n                            url={videoSrc}\n                            muted={muted}\n                            controls={controls === MediaVideoControlsType.Default}\n                            height={currentHeight || '100%'}\n                            width={width || '100%'}\n                            light={previewImgUrl}\n                            playing={isPlaying}\n                            playIcon={playIcon}\n                            progressInterval={FPS}\n                            onClickPreview={handleClickPreview}\n                            onStart={onStart}\n                            onReady={onReady}\n                            onPlay={onPlay}\n                            onPause={\n                                autoPlay && customControlsType !== CustomControlsType.WithMuteButton\n                                    ? undefined\n                                    : onPause\n                            } // to prevent pause icon flickering when autoplayed video ends\n                            onProgress={onProgress}\n                            onEnded={onEnded}\n                            aria-label={ariaLabel}\n                            previewTabIndex={-1}\n                            config={{\n                                file: {\n                                    attributes: {\n                                        pip: isMobile ? 'false' : undefined,\n                                        playsinline: isMobile ? '' : undefined,\n                                        disablepictureinpicture: isMobile ? '' : undefined,\n                                    },\n                                },\n                            }}\n                        />\n                        {controls === MediaVideoControlsType.Custom && (\n                            <CustomBarControls\n                                className={customBarControlsClassName}\n                                mute={{\n                                    isMuted: muted,\n                                    changeMute: (event: React.MouseEvent) => {\n                                        event.stopPropagation();\n                                        changeMute(muted);\n                                    },\n                                }}\n                                elapsedTimePercent={playedPercent}\n                                type={customControlsType}\n                                isPaused={!isPlaying}\n                                onPlayClick={onPlayClick}\n                                muteButtonShown={muteButtonShown}\n                                shown={hovered && ((!started && !previewImgUrl) || started)}\n                                positioning={positioning}\n                            />\n                        )}\n                    </React.Fragment>\n                ) : null}\n            </div>\n        );\n    },\n);\n\nfunction getHeight(width: number, ratio: number = 9 / 16): number {\n    return width * ratio;\n}\n\nfunction getParentElement(element: HTMLElement): HTMLElement {\n    const parentElement = element.parentElement;\n\n    if (!parentElement) {\n        return element;\n    }\n\n    return parentElement.offsetWidth ? parentElement : getParentElement(parentElement);\n}\n\nexport default ReactPlayerBlock;\n"]}
+{"version":3,"file":"ReactPlayer.js","sourceRoot":"../../../../src","sources":["components/ReactPlayer/ReactPlayer.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {PlayFill} from '@gravity-ui/icons';\nimport {Icon} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\nimport _ReactPlayer from 'react-player';\n\nimport {MobileContext} from '../../context/mobileContext';\nimport {VideoContext} from '../../context/videoContext';\nimport {useAnalytics, useMount} from '../../hooks';\nimport {\n    AnalyticsEvent,\n    ClassNameProps,\n    CustomControlsButtonPositioning,\n    CustomControlsType,\n    DefaultEventNames,\n    MediaVideoControlsType,\n    MediaVideoProps,\n    PlayButtonProps,\n    PlayButtonThemes,\n    PlayButtonType,\n    PredefinedEventTypes,\n    ReactPlayerBlockHandler,\n} from '../../models';\nimport {block} from '../../utils';\n\nimport CustomBarControls from './CustomBarControls';\nimport {i18n} from './i18n';\nimport {checkYoutubeVideos} from './utils';\nimport {isYoutubePlayerInstance} from './utils/youtube';\n\nimport './ReactPlayer.scss';\n\nconst b = block('ReactPlayer');\n\nconst FPS = 60;\n\nconst ReactPlayer =\n    'default' in _ReactPlayer && _ReactPlayer.default\n        ? (_ReactPlayer.default as typeof _ReactPlayer)\n        : _ReactPlayer;\n\nexport interface ReactPlayerBlockProps\n    extends Omit<MediaVideoProps, 'loop' | 'src'>,\n        ClassNameProps {\n    src: string | string[];\n    previewImgUrl?: string;\n    loop?: boolean;\n    customBarControlsClassName?: string;\n    showPreview?: boolean;\n    onClickPreview?: () => void;\n    height?: number;\n    ratio?: number;\n    autoRatio?: boolean;\n    children?: React.ReactNode;\n}\n\ninterface PlayerPropgress {\n    played: number;\n}\n\n// eslint-disable-next-line react/display-name\nexport const ReactPlayerBlock = React.forwardRef<ReactPlayerBlockHandler, ReactPlayerBlockProps>(\n    (props, originRef) => {\n        const isMobile = React.useContext(MobileContext);\n        const {\n            src,\n            previewImgUrl,\n            loop = false,\n            controls = MediaVideoControlsType.Default,\n            customControlsOptions = {},\n            muted: initiallyMuted = false,\n            elapsedTime,\n            playButton,\n            className,\n            customBarControlsClassName,\n            showPreview,\n            onClickPreview,\n            analyticsEvents,\n            height,\n            ariaLabel,\n            ratio,\n            autoRatio,\n            contain = true,\n        } = props;\n\n        const {\n            type = PlayButtonType.Default,\n            theme = PlayButtonThemes.Blue,\n            text,\n            className: buttonClassName,\n        } = playButton || ({} as PlayButtonProps);\n        const {\n            type: customControlsType = CustomControlsType.WithMuteButton,\n            muteButtonShown,\n            positioning = CustomControlsButtonPositioning.Center,\n        } = customControlsOptions;\n\n        const autoPlay = Boolean(!isMobile && !previewImgUrl && props.autoplay);\n        const mute = initiallyMuted || autoPlay;\n\n        const {playingVideoRef, setProps} = React.useContext(VideoContext);\n\n        const ref = React.useRef<HTMLDivElement>(null);\n        const buttonRef = React.useRef<HTMLButtonElement>(null);\n\n        const [playerRef, setPlayerRef] = React.useState<_ReactPlayer>();\n        const [isPlaying, setIsPlaying] = React.useState(autoPlay);\n        const [playedPercent, setPlayedPercent] = React.useState<number>(0);\n        const [currentHeight, setCurrentHeight] = React.useState(height);\n        const [width, setWidth] = React.useState<number>(0);\n        const [actualRatio, setActualRatio] = React.useState<number>();\n        const [muted, setMuted] = React.useState<boolean>(mute);\n        const [started, setStarted] = React.useState(autoPlay);\n        const [ended, setEnded] = React.useState<boolean>(false);\n        const [isMounted, setIsMounted] = React.useState(false);\n        const [hovered, setHovered] = React.useState(isMobile);\n\n        useMount(() => setIsMounted(true));\n\n        const videoSrc = React.useMemo(() => checkYoutubeVideos(src), [src]);\n\n        const eventsArray = React.useMemo(() => {\n            if (analyticsEvents) {\n                return Array.isArray(analyticsEvents) ? analyticsEvents : [analyticsEvents];\n            }\n\n            return [];\n        }, [analyticsEvents]);\n        const handleAnalytics = useAnalytics(DefaultEventNames.ReactPlayerControls);\n\n        React.useImperativeHandle(originRef, () => {\n            if (!playerRef) {\n                return;\n            }\n\n            let play, pause, addEventListener;\n            const videoInstance = playerRef.getInternalPlayer();\n            if (isYoutubePlayerInstance(videoInstance)) {\n                ({pauseVideo: pause, playVideo: play, addEventListener} = videoInstance);\n            } else {\n                // it is assumed that `videoInstance` is HTMLVideoElement by default\n                ({play, pause, addEventListener} = videoInstance);\n            }\n\n            // eslint-disable-next-line consistent-return\n            return {\n                play: play.bind(videoInstance),\n                pause: pause.bind(videoInstance),\n                addEventListener: addEventListener.bind(videoInstance),\n            };\n        }, [playerRef]);\n\n        React.useEffect(() => {\n            if (ref.current && !playingVideoRef?.contains(ref.current)) {\n                setMuted(true);\n            }\n        }, [playingVideoRef]);\n\n        React.useEffect(() => {\n            if (showPreview) {\n                playerRef?.showPreview();\n            }\n        }, [showPreview, playerRef]);\n\n        React.useEffect(() => {\n            if (playerRef && !started) {\n                setIsPlaying(autoPlay);\n            }\n        }, [autoPlay, playerRef, started]);\n\n        React.useEffect(() => setMuted(mute), [mute]);\n\n        React.useEffect(() => {\n            if (!started && isPlaying) {\n                setStarted(true);\n            }\n        }, [isPlaying, started]);\n\n        React.useEffect(() => {\n            if (started && !Number.isNaN(Number(elapsedTime))) {\n                playerRef?.seekTo(elapsedTime ?? 0, 'seconds');\n            }\n        }, [elapsedTime, playerRef, started]);\n\n        React.useEffect(() => {\n            const updateSize = debounce(() => {\n                if (ref.current) {\n                    // We need to get parent's width does not equal 0\n                    const parentElement = getParentElement(ref.current);\n                    const {paddingLeft, paddingRight} = getComputedStyle(parentElement);\n                    const newWidth =\n                        parentElement.offsetWidth -\n                        parseFloat(paddingLeft) -\n                        parseFloat(paddingRight);\n\n                    setWidth(newWidth);\n                    setCurrentHeight(\n                        Math.floor(\n                            getHeight(newWidth, ratio ?? (autoRatio ? actualRatio : undefined)),\n                        ),\n                    );\n                }\n            }, 200);\n\n            updateSize();\n            window.addEventListener('resize', updateSize, {passive: true});\n            return () => {\n                window.removeEventListener('resize', updateSize);\n            };\n        }, [actualRatio, autoRatio, ratio]);\n\n        const playEvents = React.useMemo(\n            () => eventsArray?.filter((e: AnalyticsEvent) => e.type === PredefinedEventTypes.Play),\n            [eventsArray],\n        );\n        const stopEvents = React.useMemo(\n            () => eventsArray?.filter((e: AnalyticsEvent) => e.type === PredefinedEventTypes.Stop),\n            [eventsArray],\n        );\n\n        const playIcon = React.useMemo(() => {\n            let playButtonContent;\n\n            switch (type) {\n                case PlayButtonType.Text:\n                    playButtonContent = text;\n                    break;\n                case PlayButtonType.Default:\n                default:\n                    playButtonContent = <Icon className={b('icon')} data={PlayFill} size={24} />;\n                    break;\n            }\n\n            return (\n                <button\n                    className={b('button', {theme, text: Boolean(text)}, buttonClassName)}\n                    aria-label={i18n('play')}\n                    ref={buttonRef}\n                >\n                    {playButtonContent}\n                </button>\n            );\n        }, [type, theme, text, buttonClassName]);\n\n        const changeMute = React.useCallback(\n            (isMuted: boolean) => {\n                if (\n                    isMuted &&\n                    playerRef &&\n                    controls === MediaVideoControlsType.Custom &&\n                    customControlsType === CustomControlsType.WithMuteButton\n                ) {\n                    playerRef.seekTo(0);\n                    setPlayedPercent(0);\n                }\n\n                const events = isMuted ? playEvents : stopEvents;\n                handleAnalytics(events);\n\n                if (isMuted) {\n                    setProps({playingVideoRef: ref.current});\n                }\n\n                // In order to the progress bar to update (equals 0) before displaying\n                setTimeout(() => setMuted(!isMuted), 0);\n            },\n            [\n                playerRef,\n                customControlsType,\n                playEvents,\n                stopEvents,\n                handleAnalytics,\n                setProps,\n                controls,\n            ],\n        );\n\n        const handleClickPreview = React.useCallback(() => {\n            setIsPlaying(true);\n            onClickPreview?.();\n\n            handleAnalytics(playEvents);\n        }, [onClickPreview, handleAnalytics, playEvents]);\n\n        const onPause = React.useCallback(() => {\n            // For support correct state for youtube\n            if (\n                controls !== MediaVideoControlsType.Custom ||\n                customControlsType !== CustomControlsType.WithMuteButton\n            ) {\n                setIsPlaying(false);\n            }\n        }, [controls, customControlsType]);\n\n        const onStart = React.useCallback(() => {\n            if (!autoPlay && !initiallyMuted) {\n                setMuted(false);\n            }\n        }, [autoPlay, initiallyMuted]);\n\n        const onPlay = React.useCallback(() => {\n            setIsPlaying(true);\n\n            if (\n                controls === MediaVideoControlsType.Custom &&\n                customControlsType === CustomControlsType.WithMuteButton\n            ) {\n                if (ended) {\n                    changeMute(false);\n                } else if (!isPlaying) {\n                    changeMute(muted);\n                }\n                setEnded(false);\n            }\n        }, [changeMute, controls, customControlsType, ended, isPlaying, muted]);\n\n        const onReady = React.useCallback((player: _ReactPlayer) => {\n            setPlayerRef(player);\n            const videoElement = player.getInternalPlayer();\n            const videoWidth = videoElement.videoWidth as number | undefined;\n            const videoHeight = videoElement.videoHeight as number | undefined;\n            if (videoWidth && videoHeight) {\n                setActualRatio(videoHeight / videoWidth);\n            }\n        }, []);\n\n        const onProgress = React.useCallback((progress: PlayerPropgress) => {\n            setPlayedPercent(progress.played);\n\n            if (progress.played === 1) {\n                setMuted(true);\n            }\n        }, []);\n\n        const onEnded = React.useCallback(() => {\n            // Youtube videos not muted after finishing playing and start again.\n            // 'onEnded' does not fire when 'loop' is set to true.\n            // It is custom loop with muted sound after finishing playing and start again.\n            if (loop) {\n                setPlayedPercent(0);\n                setIsPlaying(true);\n                playerRef?.seekTo(0);\n            }\n\n            setEnded(true);\n        }, [loop, playerRef]);\n\n        const onPlayClick = React.useCallback(() => {\n            if (isPlaying) {\n                onPause();\n            } else {\n                onPlay();\n            }\n        }, [isPlaying, onPlay, onPause]);\n\n        const handleClick = React.useCallback(() => {\n            buttonRef.current?.click();\n\n            if (controls === MediaVideoControlsType.Custom) {\n                if (customControlsType === CustomControlsType.WithMuteButton) {\n                    changeMute(muted);\n                } else {\n                    onPlayClick();\n                }\n            }\n        }, [controls, customControlsType, changeMute, muted, onPlayClick]);\n\n        const handleKeyDown = React.useCallback((e: React.KeyboardEvent) => {\n            const key = e.key.toLowerCase();\n\n            if (key === 'enter') {\n                buttonRef.current?.click();\n            }\n        }, []);\n\n        const onFocusIn = React.useCallback(() => setHovered(true), []);\n        const onFocusOut = React.useCallback(() => setHovered(false), []);\n\n        return (\n            <div\n                className={b(\n                    {\n                        wrapper: !currentHeight,\n                        controls,\n                        contain,\n                        'auto-ratio': autoRatio,\n                    },\n                    className,\n                )}\n                ref={ref}\n                onClick={handleClick}\n                onMouseEnter={onFocusIn}\n                onMouseLeave={onFocusOut}\n                onFocus={onFocusIn}\n                onBlur={onFocusOut}\n                onKeyDown={handleKeyDown}\n                role=\"button\"\n                tabIndex={0}\n            >\n                {isMounted ? (\n                    <React.Fragment>\n                        <ReactPlayer\n                            className={b('player')}\n                            url={videoSrc}\n                            muted={muted}\n                            controls={controls === MediaVideoControlsType.Default}\n                            height={currentHeight || '100%'}\n                            width={width || '100%'}\n                            light={previewImgUrl}\n                            playing={isPlaying}\n                            playIcon={playIcon}\n                            progressInterval={FPS}\n                            onClickPreview={handleClickPreview}\n                            onStart={onStart}\n                            onReady={onReady}\n                            onPlay={onPlay}\n                            onPause={\n                                autoPlay && customControlsType !== CustomControlsType.WithMuteButton\n                                    ? undefined\n                                    : onPause\n                            } // to prevent pause icon flickering when autoplayed video ends\n                            onProgress={onProgress}\n                            onEnded={onEnded}\n                            aria-label={ariaLabel}\n                            previewTabIndex={-1}\n                            config={{\n                                file: {\n                                    attributes: {\n                                        pip: isMobile ? 'false' : undefined,\n                                        playsinline: isMobile ? '' : undefined,\n                                        disablepictureinpicture: isMobile ? '' : undefined,\n                                    },\n                                },\n                            }}\n                        />\n                        {controls === MediaVideoControlsType.Custom && (\n                            <CustomBarControls\n                                className={customBarControlsClassName}\n                                mute={{\n                                    isMuted: muted,\n                                    changeMute: (event: React.MouseEvent) => {\n                                        event.stopPropagation();\n                                        changeMute(muted);\n                                    },\n                                }}\n                                elapsedTimePercent={playedPercent}\n                                type={customControlsType}\n                                isPaused={!isPlaying}\n                                onPlayClick={onPlayClick}\n                                muteButtonShown={muteButtonShown}\n                                shown={hovered && ((!started && !previewImgUrl) || started)}\n                                positioning={positioning}\n                            />\n                        )}\n                    </React.Fragment>\n                ) : null}\n            </div>\n        );\n    },\n);\n\nfunction getHeight(width: number, ratio: number = 9 / 16): number {\n    return width * ratio;\n}\n\nfunction getParentElement(element: HTMLElement): HTMLElement {\n    const parentElement = element.parentElement;\n\n    if (!parentElement) {\n        return element;\n    }\n\n    return parentElement.offsetWidth ? parentElement : getParentElement(parentElement);\n}\n\nexport default ReactPlayerBlock;\n"]}

package/build/esm/components/editor/ItemWrap/ItemWrap.css

@@ -0,0 +1,9 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-item-wrap {
+  height: 100%;
+}
+
+.pc-page-constructor_with-editor .pc-item-wrap {
+  cursor: pointer;
+}

package/build/esm/components/editor/ItemWrap/ItemWrap.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import './ItemWrap.css';
+export interface ItemWrapProps extends React.PropsWithChildren {
+    index: number;
+}
+declare const ItemWrap: ({ index, children }: ItemWrapProps) => import("react/jsx-runtime").JSX.Element;
+export default ItemWrap;

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

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { usePCEditorItemWrap } from "../../../hooks/usePCEditorItemWrap.js";
+import { block } from "../../../utils/index.js";
+import './ItemWrap.css';
+const b = block('item-wrap');
+const ItemWrap = ({ index, children }) => {
+    const { blockRef, adminBlockMouseEvents } = usePCEditorItemWrap(index);
+    return (_jsx("div", { ref: blockRef, className: b(), ...adminBlockMouseEvents, children: children }));
+};
+export default ItemWrap;
+//# sourceMappingURL=ItemWrap.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ItemWrap.js","sourceRoot":"../../../../../src","sources":["components/editor/ItemWrap/ItemWrap.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAC,mBAAmB,EAAC,8CAA2C;AACvE,OAAO,EAAC,KAAK,EAAC,gCAAuB;AAErC,OAAO,gBAAgB,CAAC;AAExB,MAAM,CAAC,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC;AAM7B,MAAM,QAAQ,GAAG,CAAC,EAAC,KAAK,EAAE,QAAQ,EAAgB,EAAE,EAAE;IAClD,MAAM,EAAC,QAAQ,EAAE,qBAAqB,EAAC,GAAG,mBAAmB,CAAC,KAAK,CAAC,CAAC;IACrE,OAAO,CACH,cAAK,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,KAAM,qBAAqB,YACxD,QAAQ,GACP,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {usePCEditorItemWrap} from '../../../hooks/usePCEditorItemWrap';\nimport {block} from '../../../utils';\n\nimport './ItemWrap.scss';\n\nconst b = block('item-wrap');\n\nexport interface ItemWrapProps extends React.PropsWithChildren {\n    index: number;\n}\n\nconst ItemWrap = ({index, children}: ItemWrapProps) => {\n    const {blockRef, adminBlockMouseEvents} = usePCEditorItemWrap(index);\n    return (\n        <div ref={blockRef} className={b()} {...adminBlockMouseEvents}>\n            {children}\n        </div>\n    );\n};\n\nexport default ItemWrap;\n"]}

package/build/esm/constructor-items.d.ts

@@ -1,8 +1,15 @@
+import * as React from 'react';
+import { BlockConfig } from "./common/types/index.js";
+/**
+ * TODO: remove it
+ * @deprecated use blockDataMap
+ **/
 export declare const blockMap: {
     "slider-block": (props: React.PropsWithChildren<import("./blocks/Slider/Slider.js").SliderProps>) => import("react/jsx-runtime").JSX.Element;
     "extended-features-block": ({ title, description, items, colSizes, animated, }: import("./models/index.js").ExtendedFeaturesProps) => import("react/jsx-runtime").JSX.Element;
     "promo-features-block": (props: import("./models/index.js").PromoFeaturesProps) => import("react/jsx-runtime").JSX.Element;
     "questions-block": (props: import("./models/index.js").QuestionsProps) => import("react/jsx-runtime").JSX.Element;
+    "foldable-list-block": (props: import("./models/index.js").FoldableListProps) => import("react/jsx-runtime").JSX.Element;
     "banner-block": (props: import("./models/index.js").BannerBlockProps) => import("react/jsx-runtime").JSX.Element;
     "companies-block": ({ title, description, images, animated }: import("./models/index.js").CompaniesBlockProps) => import("react/jsx-runtime").JSX.Element;
     "media-block": (props: import("./models/index.js").MediaBlockProps) => import("react/jsx-runtime").JSX.Element;
@@ -12,14 +19,19 @@ export declare const blockMap: {
     "header-block": (props: React.PropsWithChildren<import("./models/index.js").HeaderBlockProps & import("./models/index.js").ClassNameProps>) => import("react/jsx-runtime").JSX.Element;
     "icons-block": ({ title, description, size, colSizes, items }: import("./models/index.js").IconsBlockProps) => import("react/jsx-runtime").JSX.Element;
     "header-slider-block": ({ items, arrows, ...props }: import("./models/index.js").HeaderSliderBlockProps) => import("react/jsx-runtime").JSX.Element;
-    "card-layout-block": import("react").FC<import("./blocks/CardLayout/CardLayout").CardLayoutBlockProps>;
+    "card-layout-block": React.FC<import("./blocks/CardLayout/CardLayout.js").CardLayoutBlockProps>;
     "content-layout-block": (props: import("./models/index.js").ContentLayoutBlockProps) => import("react/jsx-runtime").JSX.Element;
     "share-block": ({ items, title }: import("./models/index.js").ShareBlockProps) => import("react/jsx-runtime").JSX.Element;
     "map-block": ({ map, border, disableShadow, ...props }: import("./models/index.js").MapBlockProps) => import("react/jsx-runtime").JSX.Element;
-    "filter-block": import("react").FC<import("./models").FilterBlockProps>;
-    "form-block": import("react").FC<import("./models").FormBlockProps>;
+    "filter-block": React.FC<import("./models/index.js").FilterBlockProps>;
+    "form-block": React.FC<import("./models/index.js").FormBlockProps>;
     "slider-new-block": ({ animated, title, description, type, anchorId, arrows, adaptive, autoplay: autoplayMs, dots, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }: React.PropsWithChildren<import("./blocks/SliderNew/Slider.js").SliderNewProps>) => import("react/jsx-runtime").JSX.Element;
+    "test-editor-block": (props: import("./blocks/TestEditorBlock/TestEditorBlock.js").TestEditorBlockProps) => import("react/jsx-runtime").JSX.Element;
 };
+/**
+ * TODO: remove it
+ * @deprecated use blockDataMap
+ **/
 export declare const subBlockMap: {
     divider: ({ size, border }: import("./models/index.js").DividerProps) => import("react/jsx-runtime").JSX.Element;
     "price-detailed": (props: import("./models/index.js").PriceDetailedProps) => import("react/jsx-runtime").JSX.Element;
@@ -34,9 +46,14 @@ export declare const subBlockMap: {
     "image-card": (props: import("./models/index.js").ImageCardProps) => import("react/jsx-runtime").JSX.Element;
 };
 export declare const navItemMap: {
-    button: import("react").FC<Pick<import("./navigation").NavigationItemProps, "className"> & import("./models").ButtonProps>;
-    social: import("react").FC<import("./navigation").NavigationSocialItemOwnProps>;
+    button: React.FC<Pick<import("./navigation/index.js").NavigationItemProps, "className"> & import("./models/index.js").ButtonProps>;
+    social: React.FC<import("./navigation/index.js").NavigationSocialItemOwnProps>;
     dropdown: ({ text, icon, className, iconSize, hidePopup, items, isActive, ...props }: import("./navigation/index.js").NavigationItemProps & import("./models/index.js").NavigationDropdownItem) => import("react/jsx-runtime").JSX.Element;
-    link: import("react").FC<import("./navigation").NavigationItemProps & import("./models").NavigationLinkItem>;
+    link: React.FC<import("./navigation/index.js").NavigationItemProps & import("./models/index.js").NavigationLinkItem>;
     "github-button": ({ text, url, className, label, size, icon, urlTitle, }: import("./navigation/index.js").NavigationItemProps & import("./models/index.js").NavigationGithubButton) => import("react/jsx-runtime").JSX.Element;
 };
+export interface BlockData {
+    component: React.ComponentType<any>;
+    schema: BlockConfig;
+}
+export declare const blockDataMap: Record<string, BlockData>;

package/build/esm/constructor-items.js

@@ -1,14 +1,50 @@
-import { BannerBlock, CardLayoutBlock, CompaniesBlock, ContentLayoutBlock, ExtendedFeaturesBlock, FilterBlock, FormBlock, HeaderBlock, HeaderSliderBlock, IconsBlock, InfoBlock, MapBlock, MediaBlock, PromoFeaturesBlock, QuestionsBlock, ShareBlock, SliderBlock, TableBlock, TabsBlock, } from "./blocks/index.js";
+import { BannerBlock, CardLayoutBlock, CompaniesBlock, ContentLayoutBlock, ExtendedFeaturesBlock, FilterBlock, FoldableListBlock, FormBlock, HeaderBlock, HeaderSliderBlock, IconsBlock, InfoBlock, MapBlock, MediaBlock, PromoFeaturesBlock, QuestionsBlock, ShareBlock, SliderBlock, TableBlock, TabsBlock, } from "./blocks/index.js";
+import BannerBlockConfig from "./blocks/Banner/index.js";
+import CardLayoutBlockConfig from "./blocks/CardLayout/index.js";
+import CompaniesBlockConfig from "./blocks/Companies/index.js";
+import ContentLayoutBlockConfig from "./blocks/ContentLayout/index.js";
+import ExtendedFeaturesBlockConfig from "./blocks/ExtendedFeatures/index.js";
+// import FilterBlockConfig from './blocks/FilterBlock';
+import FormBlockConfig from "./blocks/Form/index.js";
+import HeaderBlockConfig from "./blocks/Header/index.js";
+import HeaderSliderBlockConfig from "./blocks/HeaderSlider/index.js";
+import IconsBlockConfig from "./blocks/Icons/index.js";
+import InfoBlockConfig from "./blocks/Info/index.js";
+import MapBlockConfig from "./blocks/Map/index.js";
+import MediaBlockConfig from "./blocks/Media/index.js";
+import PromoFeaturesBlockConfig from "./blocks/PromoFeaturesBlock/index.js";
+import QuestionsBlockConfig from "./blocks/Questions/index.js";
+import ShareBlockConfig from "./blocks/Share/index.js";
+import SliderBlockConfig from "./blocks/Slider/index.js";
+import TableBlockConfig from "./blocks/Table/index.js";
+import TabsBlockConfig from "./blocks/Tabs/index.js";
+import TestEditorBlockConfig from "./blocks/TestEditorBlock/index.js";
+import TestEditorBlock from "./blocks/TestEditorBlock/TestEditorBlock.js";
 import { SliderNewBlock } from "./blocks/unstable.js";
 import { BlockType, NavigationItemType, SubBlockType } from "./models/index.js";
-import { GithubButton, NavigationButton, NavigationDropdown, NavigationLink, } from "./navigation/components/NavigationItem/index.js";
+import { GithubButton, NavigationButton, NavigationDropdown, NavigationLink } from "./navigation/index.js";
 import SocialIcon from "./navigation/components/SocialIcon/SocialIcon.js";
 import { BackgroundCard, BannerCard, BasicCard, Content, Divider, ImageCard, LayoutItem, MediaCard, PriceCard, PriceDetailed, Quote, } from "./sub-blocks/index.js";
+import BackgroundCardConfig from "./sub-blocks/BackgroundCard/index.js";
+import BannerCardConfig from "./sub-blocks/BannerCard/index.js";
+import BasicCardConfig from "./sub-blocks/BasicCard/index.js";
+import ContentConfig from "./sub-blocks/Content/index.js";
+import DividerConfig from "./sub-blocks/Divider/index.js";
+import ImageCardConfig from "./sub-blocks/ImageCard/index.js";
+import LayoutItemConfig from "./sub-blocks/LayoutItem/index.js";
+import MediaCardConfig from "./sub-blocks/MediaCard/index.js";
+import PriceCardConfig from "./sub-blocks/PriceCard/index.js";
+import QuoteConfig from "./sub-blocks/Quote/index.js";
+/**
+ * TODO: remove it
+ * @deprecated use blockDataMap
+ **/
 export const blockMap = {
     [BlockType.SliderBlock]: SliderBlock,
     [BlockType.ExtendedFeaturesBlock]: ExtendedFeaturesBlock,
     [BlockType.PromoFeaturesBlock]: PromoFeaturesBlock,
     [BlockType.QuestionsBlock]: QuestionsBlock,
+    [BlockType.FoldableListBlock]: FoldableListBlock,
     [BlockType.BannerBlock]: BannerBlock,
     [BlockType.CompaniesBlock]: CompaniesBlock,
     [BlockType.MediaBlock]: MediaBlock,
@@ -26,7 +62,12 @@ export const blockMap = {
     [BlockType.FormBlock]: FormBlock,
     // unstable
     [BlockType.SliderNewBlock]: SliderNewBlock,
+    [BlockType.TestEditorBlock]: TestEditorBlock,
 };
+/**
+ * TODO: remove it
+ * @deprecated use blockDataMap
+ **/
 export const subBlockMap = {
     [SubBlockType.Divider]: Divider,
     [SubBlockType.PriceDetailed]: PriceDetailed,
@@ -47,4 +88,37 @@ export const navItemMap = {
     [NavigationItemType.Link]: NavigationLink,
     [NavigationItemType.GithubButton]: GithubButton,
 };
+export const blockDataMap = {
+    [BlockType.ExtendedFeaturesBlock]: ExtendedFeaturesBlockConfig,
+    [BlockType.PromoFeaturesBlock]: PromoFeaturesBlockConfig,
+    [BlockType.QuestionsBlock]: QuestionsBlockConfig,
+    [BlockType.BannerBlock]: BannerBlockConfig,
+    [BlockType.CompaniesBlock]: CompaniesBlockConfig,
+    [BlockType.MediaBlock]: MediaBlockConfig,
+    [BlockType.InfoBlock]: InfoBlockConfig,
+    [BlockType.TableBlock]: TableBlockConfig,
+    [BlockType.TabsBlock]: TabsBlockConfig,
+    [BlockType.HeaderBlock]: HeaderBlockConfig,
+    [BlockType.IconsBlock]: IconsBlockConfig,
+    [BlockType.HeaderSliderBlock]: HeaderSliderBlockConfig,
+    [BlockType.CardLayoutBlock]: CardLayoutBlockConfig,
+    [BlockType.ContentLayoutBlock]: ContentLayoutBlockConfig,
+    [BlockType.ShareBlock]: ShareBlockConfig,
+    [BlockType.MapBlock]: MapBlockConfig,
+    // TODO: fix items prop for editor compatibility
+    // [BlockType.FilterBlock]: FilterBlockConfig,
+    [BlockType.FormBlock]: FormBlockConfig,
+    [BlockType.TestEditorBlock]: TestEditorBlockConfig,
+    [BlockType.SliderBlock]: SliderBlockConfig,
+    [SubBlockType.Divider]: DividerConfig,
+    [SubBlockType.MediaCard]: MediaCardConfig,
+    [SubBlockType.BannerCard]: BannerCardConfig,
+    [SubBlockType.LayoutItem]: LayoutItemConfig,
+    [SubBlockType.BackgroundCard]: BackgroundCardConfig,
+    [SubBlockType.BasicCard]: BasicCardConfig,
+    [SubBlockType.Content]: ContentConfig,
+    [SubBlockType.Quote]: QuoteConfig,
+    [SubBlockType.PriceCard]: PriceCardConfig,
+    [SubBlockType.ImageCard]: ImageCardConfig,
+};
 //# sourceMappingURL=constructor-items.js.map