@gravity-ui/page-constructor 1.15.0-alpha.2 → 1.15.0-alpha.4

package/build/cjs/blocks/Banner/Banner.js

@@ -4,13 +4,14 @@ exports.BannerBlock = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const AnimateBlock_1 = tslib_1.__importDefault(require("../../components/AnimateBlock/AnimateBlock"));
 const sub_blocks_1 = require("../../sub-blocks");
 const b = (0, utils_1.block)('banner-block');
 const BannerBlock = (props) => {
-    const { animated } = props, bannerProps = tslib_1.__rest(props, ["animated"]);
+    const { animated, blockName = models_1.BlockType.BannerBlock } = props, bannerProps = tslib_1.__rest(props, ["animated", "blockName"]);
     return (react_1.default.createElement(AnimateBlock_1.default, { className: b(), animate: animated },
-        react_1.default.createElement(sub_blocks_1.BannerCard, Object.assign({}, bannerProps))));
+        react_1.default.createElement(sub_blocks_1.BannerCard, Object.assign({}, bannerProps, { blockName: blockName }))));
 };
 exports.BannerBlock = BannerBlock;
 exports.default = exports.BannerBlock;

package/build/cjs/blocks/Banner/schema.d.ts

@@ -264,6 +264,9 @@ export declare const BannerCardProps: {
                 required: string[];
             };
         };
+        blockName: {
+            type: string;
+        };
         animated: {
             type: string;
         };
@@ -538,6 +541,9 @@ export declare const BannerBlock: {
                     required: string[];
                 };
             };
+            blockName: {
+                type: string;
+            };
             animated: {
                 type: string;
             };
@@ -813,6 +819,9 @@ export declare const BannerCard: {
                     required: string[];
                 };
             };
+            blockName: {
+                type: string;
+            };
             animated: {
                 type: string;
             };

package/build/cjs/blocks/Banner/schema.js

@@ -20,7 +20,9 @@ exports.BannerCardProps = {
         }), theme: common_1.ThemeProps, width: {
             type: 'string',
             enum: ['s', 'm', 'l'],
-        }, button: common_1.ButtonBlock }),
+        }, button: common_1.ButtonBlock, blockName: {
+            type: 'string',
+        } }),
 };
 exports.BannerBlock = {
     'banner-block': exports.BannerCardProps,

package/build/cjs/blocks/CardLayout/schema.d.ts

@@ -66,6 +66,9 @@ export declare const CardLayoutProps: {
         resetPaddings: {
             type: string;
         };
+        blockName: {
+            type: string;
+        };
         type: {};
         when: {};
     };
@@ -139,6 +142,9 @@ export declare const CardLayoutBlock: {
             resetPaddings: {
                 type: string;
             };
+            blockName: {
+                type: string;
+            };
             type: {};
             when: {};
         };

package/build/cjs/blocks/ContentLayout/ContentLayout.js

@@ -4,6 +4,7 @@ exports.ContentLayoutBlock = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const sub_blocks_1 = require("../../sub-blocks");
 const components_1 = require("../../components");
 const grid_1 = require("../../grid");
@@ -31,11 +32,11 @@ function getTextWidth(size) {
 }
 const ContentLayoutBlock = (props) => {
     const isMobile = (0, react_1.useContext)(mobileContext_1.MobileContext);
-    const { textContent, fileContent, properties: cardLayoutProperties = { size: 'l' } } = props;
+    const { textContent, fileContent, properties: cardLayoutProperties = { size: 'l' }, blockName = models_1.BlockType.ContentLayoutBlock, } = props;
     const { size = 'l', background, centered, theme = 'default', textWidth = 'm', } = cardLayoutProperties;
     const colSizes = (0, react_1.useMemo)(() => getTextWidth(textWidth), [textWidth]);
     return (react_1.default.createElement("div", { className: b({ size, background: Boolean(background) }) },
-        react_1.default.createElement(sub_blocks_1.Content, Object.assign({ className: b('content') }, textContent, { size: size, centered: centered, colSizes: colSizes, theme: theme })),
+        react_1.default.createElement(sub_blocks_1.Content, Object.assign({ className: b('content') }, textContent, { size: size, centered: centered, colSizes: colSizes, theme: theme, blockName: blockName })),
         fileContent && (react_1.default.createElement(grid_1.Col, { className: b('files', { size, centered }), reset: true, sizes: colSizes }, fileContent.map((file) => (react_1.default.createElement(components_1.FileLink, Object.assign({ className: b('file') }, file, { key: file.href, type: "horizontal", textSize: getFileTextSize(size), theme: theme })))))),
         background && (react_1.default.createElement("div", { className: b('background') },
             react_1.default.createElement(components_1.BackgroundImage, Object.assign({ className: b('background-item') }, background, { hide: isMobile }))))));

package/build/cjs/blocks/ContentLayout/schema.d.ts

@@ -144,6 +144,9 @@ export declare const ContentLayoutBlock: {
             resetPaddings: {
                 type: string;
             };
+            blockName: {
+                type: string;
+            };
             type: {};
             when: {};
         };

package/build/cjs/blocks/ExtendedFeatures/ExtendedFeatures.d.ts

@@ -1,3 +1,3 @@
 import { ExtendedFeaturesProps } from '../../models';
-export declare const ExtendedFeaturesBlock: ({ title, description, items, colSizes, animated, }: ExtendedFeaturesProps) => JSX.Element;
+export declare const ExtendedFeaturesBlock: ({ title, description, items, colSizes, animated, blockName, }: ExtendedFeaturesProps) => JSX.Element;
 export default ExtendedFeaturesBlock;

package/build/cjs/blocks/ExtendedFeatures/ExtendedFeatures.js

@@ -4,6 +4,7 @@ exports.ExtendedFeaturesBlock = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const grid_1 = require("../../grid");
 const components_1 = require("../../components/");
 const sub_blocks_1 = require("../../sub-blocks");
@@ -16,7 +17,7 @@ const DEFAULT_SIZES = {
     sm: 6,
     md: 4,
 };
-const ExtendedFeaturesBlock = ({ title, description, items, colSizes = DEFAULT_SIZES, animated, }) => {
+const ExtendedFeaturesBlock = ({ title, description, items, colSizes = DEFAULT_SIZES, animated, blockName = models_1.BlockType.ExtendedFeaturesBlock, }) => {
     const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
     return (react_1.default.createElement(components_1.AnimateBlock, { className: b(), animate: animated },
         react_1.default.createElement(components_1.BlockHeader, { title: title, description: description, className: b('header') }),
@@ -34,7 +35,7 @@ const ExtendedFeaturesBlock = ({ title, description, items, colSizes = DEFAULT_S
                         itemTitle && (react_1.default.createElement("h5", { className: b('item-title') },
                             react_1.default.createElement(components_1.HTML, null, itemTitle),
                             label && (react_1.default.createElement("div", { className: b('item-label') }, label)))),
-                        react_1.default.createElement(sub_blocks_1.Content, { text: text, links: itemLinks, size: "s", colSizes: { all: 12, md: 12 }, buttons: buttons, additionalInfo: additionalInfo }))));
+                        react_1.default.createElement(sub_blocks_1.Content, { text: text, links: itemLinks, size: "s", colSizes: { all: 12, md: 12 }, buttons: buttons, additionalInfo: additionalInfo, blockName: blockName }))));
             })))));
 };
 exports.ExtendedFeaturesBlock = ExtendedFeaturesBlock;

package/build/cjs/blocks/ExtendedFeatures/schema.d.ts

@@ -124,6 +124,9 @@ export declare const ExtendedFeaturesBlock: {
             resetPaddings: {
                 type: string;
             };
+            blockName: {
+                type: string;
+            };
             type: {};
             when: {};
         };

package/build/cjs/blocks/Header/Header.js

@@ -4,6 +4,7 @@ exports.HeaderBlock = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const components_1 = require("../../components");
 const grid_1 = require("../../grid");
 const utils_2 = require("./utils");
@@ -13,15 +14,15 @@ const HeaderBreadcrumbs_1 = tslib_1.__importDefault(require("../../components/He
 const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
 const utils_3 = require("../../components/Media/Image/utils");
 const b = (0, utils_1.block)('header-block');
-const Background = ({ background, isMobile }) => {
+const Background = ({ background, isMobile, blockName }) => {
     const { url, image, fullWidthMedia, video, color } = background;
     const imageObject = url ? (0, utils_3.getMediaImage)(url) : image;
     const renderMedia = !isMobile || (typeof image === 'object' && 'mobile' in image);
-    return (react_1.default.createElement("div", { className: b('background', { media: true, 'full-width-media': fullWidthMedia }), style: { backgroundColor: color } }, renderMedia && (react_1.default.createElement(components_1.Media, Object.assign({}, background, { className: b('background-media'), imageClassName: b('image'), videoClassName: b('video'), isBackground: true, parallax: false, video: isMobile ? undefined : video, image: imageObject })))));
+    return (react_1.default.createElement("div", { className: b('background', { media: true, 'full-width-media': fullWidthMedia }), style: { backgroundColor: color } }, renderMedia && (react_1.default.createElement(components_1.Media, Object.assign({}, background, { className: b('background-media'), imageClassName: b('image'), videoClassName: b('video'), isBackground: true, parallax: false, video: isMobile ? undefined : video, image: imageObject, blockName: blockName })))));
 };
 const FullWidthBackground = ({ background }) => (react_1.default.createElement("div", { className: b('background', { ['full-width']: true }), style: { backgroundColor: background === null || background === void 0 ? void 0 : background.color } }));
 const HeaderBlock = (props) => {
-    const { title, overtitle, description, buttons, image, video, width = 'm', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, children, } = props;
+    const { title, overtitle, description, buttons, image, video, width = 'm', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, children, blockName = models_1.BlockType.HeaderBlock, } = props;
     const isMobile = (0, react_1.useContext)(mobileContext_1.MobileContext);
     const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
     const hasRightSideImage = Boolean(image || video);
@@ -60,9 +61,9 @@ const HeaderBlock = (props) => {
                                     react_1.default.createElement(YFMWrapper_1.default, { content: description, modifiers: { constructor: true } }))),
                                 buttons && (react_1.default.createElement("div", { className: b('buttons'), "data-qa": "header-buttons" }, buttons &&
                                     buttons.map((button, index) => (react_1.default.createElement(components_1.RouterLink, { href: button.url, key: index },
-                                        react_1.default.createElement(components_1.Button, Object.assign({ key: index, className: b('button'), size: "xl" }, button))))))),
+                                        react_1.default.createElement(components_1.Button, Object.assign({ key: index, className: b('button'), size: "xl" }, button, { blockName: models_1.BlockType.HeaderBlock }))))))),
                                 children))),
-                    hasRightSideImage && (react_1.default.createElement(components_1.Media, { className: b('media', { [curImageSize]: true }), videoClassName: b('video'), imageClassName: b('image'), video: videoThemed, image: imageThemed })))))));
+                    hasRightSideImage && (react_1.default.createElement(components_1.Media, { className: b('media', { [curImageSize]: true }), videoClassName: b('video'), imageClassName: b('image'), video: videoThemed, image: imageThemed, blockName: blockName })))))));
 };
 exports.HeaderBlock = HeaderBlock;
 exports.default = exports.HeaderBlock;

package/build/cjs/blocks/Header/schema.d.ts

@@ -821,6 +821,9 @@ export declare const HeaderBlock: {
             resetPaddings: {
                 type: string;
             };
+            blockName: {
+                type: string;
+            };
             type: {};
             when: {};
         };

package/build/cjs/blocks/HeaderSlider/schema.d.ts

@@ -433,6 +433,9 @@ export declare const HeaderSliderBlock: {
             resetPaddings: {
                 type: string;
             };
+            blockName: {
+                type: string;
+            };
             type: {};
             when: {};
         };

package/build/cjs/blocks/Icons/schema.d.ts

@@ -54,6 +54,9 @@ export declare const IconsProps: {
         resetPaddings: {
             type: string;
         };
+        blockName: {
+            type: string;
+        };
         type: {};
         when: {};
     };
@@ -115,6 +118,9 @@ export declare const IconsBlock: {
             resetPaddings: {
                 type: string;
             };
+            blockName: {
+                type: string;
+            };
             type: {};
             when: {};
         };

package/build/cjs/blocks/Info/Info.js

@@ -4,13 +4,14 @@ exports.InfoBlock = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const grid_1 = require("../../grid");
 const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
 const Content_1 = tslib_1.__importDefault(require("../../sub-blocks/Content/Content"));
 const b = (0, utils_1.block)('info-block');
 const sizes = { md: 6, all: 12 };
 const InfoBlock = (props) => {
-    const { backgroundColor, theme: blockTheme = 'dark', buttons = [], title, sectionsTitle, links = [], rightContent = {}, leftContent = {}, } = props;
+    const { backgroundColor, theme: blockTheme = 'dark', buttons = [], title, sectionsTitle, links = [], rightContent = {}, leftContent = {}, blockName = models_1.BlockType.InfoBlock, } = props;
     const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
     const contentTheme = blockTheme === 'dark' ? 'dark' : 'default';
     const rightLinks = [
@@ -28,9 +29,9 @@ const InfoBlock = (props) => {
             react_1.default.createElement(grid_1.Grid, null,
                 react_1.default.createElement(grid_1.Row, null,
                     react_1.default.createElement(grid_1.Col, { sizes: sizes, className: b('left') },
-                        react_1.default.createElement(Content_1.default, Object.assign({ title: title || (leftContent === null || leftContent === void 0 ? void 0 : leftContent.title), text: leftContent === null || leftContent === void 0 ? void 0 : leftContent.text, links: leftContent === null || leftContent === void 0 ? void 0 : leftContent.links, buttons: leftButtons, additionalInfo: leftContent === null || leftContent === void 0 ? void 0 : leftContent.additionalInfo }, commonProps))),
+                        react_1.default.createElement(Content_1.default, Object.assign({ title: title || (leftContent === null || leftContent === void 0 ? void 0 : leftContent.title), text: leftContent === null || leftContent === void 0 ? void 0 : leftContent.text, links: leftContent === null || leftContent === void 0 ? void 0 : leftContent.links, buttons: leftButtons, additionalInfo: leftContent === null || leftContent === void 0 ? void 0 : leftContent.additionalInfo }, commonProps, { blockName: blockName }))),
                     react_1.default.createElement(grid_1.Col, { sizes: sizes, className: b('right') },
-                        react_1.default.createElement(Content_1.default, Object.assign({ title: sectionsTitle || (rightContent === null || rightContent === void 0 ? void 0 : rightContent.title), text: rightContent === null || rightContent === void 0 ? void 0 : rightContent.text, links: rightLinks, buttons: rightContent === null || rightContent === void 0 ? void 0 : rightContent.buttons, additionalInfo: rightContent === null || rightContent === void 0 ? void 0 : rightContent.additionalInfo }, commonProps))))))));
+                        react_1.default.createElement(Content_1.default, Object.assign({ title: sectionsTitle || (rightContent === null || rightContent === void 0 ? void 0 : rightContent.title), text: rightContent === null || rightContent === void 0 ? void 0 : rightContent.text, links: rightLinks, buttons: rightContent === null || rightContent === void 0 ? void 0 : rightContent.buttons, additionalInfo: rightContent === null || rightContent === void 0 ? void 0 : rightContent.additionalInfo }, commonProps, { blockName: blockName }))))))));
 };
 exports.InfoBlock = InfoBlock;
 exports.default = exports.InfoBlock;

package/build/cjs/blocks/Info/schema.d.ts

@@ -21,6 +21,9 @@ export declare const InfoBlock: {
                 type: string;
                 contentType: string;
             };
+            blockName: {
+                type: string;
+            };
             buttons: {
                 type: string;
                 items: {

package/build/cjs/blocks/Info/schema.js

@@ -22,6 +22,8 @@ exports.InfoBlock = {
             }), sectionsTitle: {
                 type: 'string',
                 contentType: 'text',
+            }, blockName: {
+                type: 'string',
             }, buttons: (0, utils_1.filteredArray)(common_1.ButtonBlock), theme: common_1.ThemeProps, links: (0, utils_1.filteredArray)(common_1.LinkProps), leftContent: ContentProps, rightContent: ContentProps }),
     },
 };

package/build/cjs/blocks/LinkTable/schema.d.ts

@@ -67,6 +67,9 @@ export declare const LinkTableBlock: {
             resetPaddings: {
                 type: string;
             };
+            blockName: {
+                type: string;
+            };
             type: {};
             when: {};
         };

package/build/cjs/blocks/Media/Media.js

@@ -5,6 +5,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const utils_1 = require("../../utils");
 const grid_1 = require("../../grid");
+const models_1 = require("../../models");
 const Media_1 = tslib_1.__importDefault(require("../../components/Media/Media"));
 const AnimateBlock_1 = tslib_1.__importDefault(require("../../components/AnimateBlock/AnimateBlock"));
 const BlockHeader_1 = tslib_1.__importDefault(require("../../components/BlockHeader/BlockHeader"));
@@ -12,7 +13,7 @@ const MediaContent_1 = tslib_1.__importDefault(require("./MediaContent"));
 const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
 const b = (0, utils_1.block)('media-block');
 const MediaBlock = (props) => {
-    const { media, largeMedia, direction = 'content-media', mobileDirection = 'content-media', animated, mediaOnly, disableShadow = false } = props, mediaContentProps = tslib_1.__rest(props, ["media", "largeMedia", "direction", "mobileDirection", "animated", "mediaOnly", "disableShadow"]);
+    const { media, largeMedia, direction = 'content-media', mobileDirection = 'content-media', animated, mediaOnly, disableShadow = false, blockName = models_1.BlockType.MediaBlock } = props, mediaContentProps = tslib_1.__rest(props, ["media", "largeMedia", "direction", "mobileDirection", "animated", "mediaOnly", "disableShadow", "blockName"]);
     const { title, description } = mediaContentProps;
     const [play, setPlay] = (0, react_1.useState)(false);
     const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
@@ -36,7 +37,7 @@ const MediaBlock = (props) => {
                 react_1.default.createElement(grid_1.Col, { className: b('content'), sizes: contentSizes }, mediaContent),
                 react_1.default.createElement(grid_1.Col, { sizes: mediaSizes },
                     react_1.default.createElement("div", { className: b('card', { shadow: !disableShadow }) },
-                        react_1.default.createElement(Media_1.default, Object.assign({}, mediaThemed, { playVideo: play }))))))));
+                        react_1.default.createElement(Media_1.default, Object.assign({}, mediaThemed, { playVideo: play, blockName: blockName }))))))));
 };
 exports.MediaBlock = MediaBlock;
 exports.default = exports.MediaBlock;

package/build/cjs/blocks/Media/MediaContent.js

@@ -3,12 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const sub_blocks_1 = require("../../sub-blocks");
 const b = (0, utils_1.block)('media-content');
 const MediaContent = (props) => {
-    const { title, description, button, links, buttons = [], additionalInfo, size = 'l' } = props;
+    const { title, description, button, links, buttons = [], additionalInfo, size = 'l', blockName = models_1.BlockType.MediaBlock, } = props;
     const allButtons = button ? [Object.assign(Object.assign({}, button), { size: 'xl' }), ...buttons] : buttons;
     return (react_1.default.createElement("div", { className: b() },
-        react_1.default.createElement(sub_blocks_1.Content, { title: title, text: description, links: links, theme: "default", buttons: allButtons, additionalInfo: additionalInfo, size: size, colSizes: { all: 12, md: 12 } })));
+        react_1.default.createElement(sub_blocks_1.Content, { title: title, text: description, links: links, theme: "default", buttons: allButtons, additionalInfo: additionalInfo, size: size, colSizes: { all: 12, md: 12 }, blockName: blockName })));
 };
 exports.default = MediaContent;

package/build/cjs/blocks/Media/schema.d.ts

@@ -597,6 +597,9 @@ export declare const MediaBlock: {
             resetPaddings: {
                 type: string;
             };
+            blockName: {
+                type: string;
+            };
             type: {};
             when: {};
         };

package/build/cjs/blocks/Preview/MediaContent/MediaContent.d.ts

@@ -8,6 +8,7 @@ interface MediaContentProps extends Refable<HTMLDivElement> {
     switching: boolean;
     isActiveBlock: (id: number, isMediaBlock?: boolean) => boolean;
     showMediaContent: (id: number) => void;
+    blockName?: string;
 }
-declare const MediaContent: React.ForwardRefExoticComponent<Pick<MediaContentProps, "title" | "items" | "description" | "ratioMediaContent" | "switching" | "isActiveBlock" | "showMediaContent"> & React.RefAttributes<HTMLDivElement>>;
+declare const MediaContent: React.ForwardRefExoticComponent<Pick<MediaContentProps, "title" | "blockName" | "items" | "description" | "ratioMediaContent" | "switching" | "isActiveBlock" | "showMediaContent"> & React.RefAttributes<HTMLDivElement>>;
 export default MediaContent;

package/build/cjs/blocks/Preview/MediaContent/MediaContent.js

@@ -9,8 +9,9 @@ const PreviewContent_1 = tslib_1.__importDefault(require("./PreviewContent"));
 const PreviewMedia_1 = tslib_1.__importDefault(require("./PreviewMedia"));
 const ThemeValueContext_1 = require("../../../context/theme/ThemeValueContext");
 const b = (0, utils_1.block)('preview-media-content-block');
+const COMPONENT_NAME = 'preview-media-content';
 const MediaContent = (0, react_1.forwardRef)((props, ref) => {
-    const { items, title, description = '', switching, ratioMediaContent = '1-1', isActiveBlock, showMediaContent, } = props;
+    const { items, title, description = '', switching, ratioMediaContent = '1-1', isActiveBlock, showMediaContent, blockName = COMPONENT_NAME, } = props;
     const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
     const [mediaSizes, setMediaSizes] = (0, react_1.useState)({ [grid_1.GridColumnSize.All]: 12 });
     const [contentSizes, setContentSizes] = (0, react_1.useState)({ [grid_1.GridColumnSize.All]: 12 });
@@ -32,7 +33,7 @@ const MediaContent = (0, react_1.forwardRef)((props, ref) => {
         const mediaMods = { active: isActiveBlock(id, true) };
         const onClick = () => showMediaContent(id);
         contentComponents.push(react_1.default.createElement(PreviewContent_1.default, Object.assign({ key: id, id: id }, content, { switching: switching, onClick: onClick, mods: contentMods })));
-        mediaComponents.push(react_1.default.createElement(PreviewMedia_1.default, { key: id, id: id, media: media && (0, utils_1.getThemedValue)(media, theme), play: isActive, mods: mediaMods }));
+        mediaComponents.push(react_1.default.createElement(PreviewMedia_1.default, { key: id, id: id, media: media && (0, utils_1.getThemedValue)(media, theme), play: isActive, mods: mediaMods, blockName: blockName }));
     });
     return (react_1.default.createElement(react_1.Fragment, null,
         react_1.default.createElement(grid_1.Col, { sizes: contentSizes, className: b('content') },

package/build/cjs/blocks/Preview/MediaContent/PreviewMedia.d.ts

@@ -4,6 +4,7 @@ interface PreviewMediaProps {
     media: MediaProps;
     play: boolean;
     mods: Modifiers | null;
+    blockName?: string;
 }
 declare const PreviewMedia: (props: PreviewMediaProps) => JSX.Element;
 export default PreviewMedia;

package/build/cjs/blocks/Preview/MediaContent/PreviewMedia.js

@@ -5,9 +5,10 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const utils_1 = require("../../../utils");
 const Media_1 = tslib_1.__importDefault(require("../../../components/Media/Media"));
 const b = (0, utils_1.block)('preview-media-block');
+const COMPONENT_NAME = 'preview-media';
 const PreviewMedia = (props) => {
-    const { id, media, play, mods } = props;
+    const { id, media, play, mods, blockName = COMPONENT_NAME } = props;
     return (react_1.default.createElement("div", { key: id, className: b('media', mods) },
-        react_1.default.createElement(Media_1.default, Object.assign({}, media, { playVideo: play }))));
+        react_1.default.createElement(Media_1.default, Object.assign({}, media, { playVideo: play, blockName: blockName }))));
 };
 exports.default = PreviewMedia;

package/build/cjs/blocks/Preview/Preview.js

@@ -8,6 +8,7 @@ const breakpointContext_1 = require("../../context/breakpointContext");
 const AnimateBlock_1 = tslib_1.__importDefault(require("../../components/AnimateBlock/AnimateBlock"));
 const MediaContent_1 = tslib_1.__importDefault(require("./MediaContent/MediaContent"));
 const grid_1 = require("../../grid");
+const models_1 = require("../../models");
 const constants_1 = require("../../constants");
 const useIntersection_1 = require("../../hooks/useIntersection");
 const b = (0, utils_1.block)('preview-block');
@@ -22,7 +23,7 @@ const INDENT_BETWEEN_TITLE_DESCRIPTION = 16;
 const PreviewBlock = (props) => {
     const { direction = 'content-media', animated, items, title, description, ratioMediaContent = '1-1', stopVideo = false, 
     // TODO YDB-server doesn't see previewRef.current and doesn't update the component CLOUDFRONT-9395
-    showImmediately = false, } = props;
+    showImmediately = false, blockName = models_1.BlockType.PreviewBlock, } = props;
     const breakpoint = (0, react_1.useContext)(breakpointContext_1.BreakpointContext);
     const isDesktop = breakpoint >= constants_1.BREAKPOINTS.md;
     const menuRef = react_1.default.useRef(null);
@@ -85,7 +86,7 @@ const PreviewBlock = (props) => {
     }, [changeActiveSlide, activeSlide, autoSwitchTimerId]);
     return (react_1.default.createElement(AnimateBlock_1.default, { className: b(), animate: animated },
         react_1.default.createElement(grid_1.Row, { ref: previewRef, className: b('row', { reverse: direction === 'media-content' }) },
-            react_1.default.createElement(MediaContent_1.default, { ref: menuRef, items: items, title: title, description: description, ratioMediaContent: ratioMediaContent, switching: !stopSwitching, isActiveBlock: isActiveBlock, showMediaContent: showMediaContent }))));
+            react_1.default.createElement(MediaContent_1.default, { ref: menuRef, items: items, title: title, description: description, ratioMediaContent: ratioMediaContent, switching: !stopSwitching, isActiveBlock: isActiveBlock, showMediaContent: showMediaContent, blockName: blockName }))));
 };
 exports.PreviewBlock = PreviewBlock;
 function changeMenuScroll(element, nextSlide, activeSlide) {

package/build/cjs/blocks/Preview/schema.d.ts

@@ -30,6 +30,9 @@ export declare const PreviewBlock: {
                     };
                 };
             };
+            blockName: {
+                type: string;
+            };
             animated: {
                 type: string;
             };

package/build/cjs/blocks/Preview/schema.js

@@ -48,6 +48,8 @@ exports.PreviewBlock = {
             }, ratioMediaContent: {
                 type: 'string',
                 enum: previewRatioMediaContent,
-            }, items: (0, utils_1.filteredArray)(PreviewItem) }),
+            }, items: (0, utils_1.filteredArray)(PreviewItem), blockName: {
+                type: 'string',
+            } }),
     },
 };

package/build/cjs/blocks/PromoFeaturesBlock/PromoFeaturesBlock.js

@@ -5,6 +5,7 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const utils_1 = require("../../utils");
 const constants_1 = require("../../constants");
 const YFMWrapper_1 = tslib_1.__importDefault(require("../../components/YFMWrapper/YFMWrapper"));
+const models_1 = require("../../models");
 const Media_1 = tslib_1.__importDefault(require("../../components/Media/Media"));
 const BlockHeader_1 = tslib_1.__importDefault(require("../../components/BlockHeader/BlockHeader"));
 const AnimateBlock_1 = tslib_1.__importDefault(require("../../components/AnimateBlock/AnimateBlock"));
@@ -17,7 +18,7 @@ const breakpointColumns = {
     [constants_1.BREAKPOINTS.sm]: 1,
 };
 const PromoFeaturesBlock = (props) => {
-    const { items, title, description, theme, animated = true } = props;
+    const { items, title, description, theme, animated = true, blockName = models_1.BlockType.PromoFeaturesBlock, } = props;
     const backgroundTheme = theme || 'default';
     return (react_1.default.createElement(AnimateBlock_1.default, { className: b({ [backgroundTheme]: true }), animate: animated },
         react_1.default.createElement(FullWidthBackground_1.default, { className: b('background', { [backgroundTheme]: true }) }),
@@ -33,7 +34,7 @@ const PromoFeaturesBlock = (props) => {
                     react_1.default.createElement("h4", { className: b('card-title') }, cardTitle),
                     react_1.default.createElement("div", { className: b('card-text') },
                         react_1.default.createElement(YFMWrapper_1.default, { content: text, modifiers: { constructor: true } }))),
-                media && react_1.default.createElement(Media_1.default, Object.assign({ className: b('card-media') }, media))));
+                media && (react_1.default.createElement(Media_1.default, Object.assign({ className: b('card-media'), blockName: blockName }, media)))));
         }))));
 };
 exports.default = PromoFeaturesBlock;

package/build/cjs/blocks/PromoFeaturesBlock/schema.d.ts

@@ -222,6 +222,9 @@ export declare const PromoFeaturesBlock: {
             resetPaddings: {
                 type: string;
             };
+            blockName: {
+                type: string;
+            };
             type: {};
             when: {};
         };

package/build/cjs/blocks/Questions/Questions.js

@@ -3,13 +3,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const Link_1 = tslib_1.__importDefault(require("../../components/Link/Link"));
 const components_1 = require("../../components");
 const grid_1 = require("../../grid");
 const sub_blocks_1 = require("../../sub-blocks");
 const b = (0, utils_1.block)('QuestionsBlock');
 const QuestionsBlock = (props) => {
-    const { title, text, additionalInfo, links, buttons, items } = props;
+    const { title, text, additionalInfo, links, buttons, items, blockName = models_1.BlockType.QuestionsBlock, } = props;
     const [opened, setOpened] = (0, react_1.useState)([0]);
     const toggleItem = (index) => {
         let newState;
@@ -25,7 +26,7 @@ const QuestionsBlock = (props) => {
         react_1.default.createElement(grid_1.Row, null,
             react_1.default.createElement(grid_1.Col, { sizes: { all: 12, md: 4 } },
                 react_1.default.createElement("div", { className: b('title') },
-                    react_1.default.createElement(sub_blocks_1.Content, { title: title, text: text, additionalInfo: additionalInfo, links: links, buttons: buttons, colSizes: { all: 12, md: 12 } }))),
+                    react_1.default.createElement(sub_blocks_1.Content, { title: title, text: text, additionalInfo: additionalInfo, links: links, buttons: buttons, colSizes: { all: 12, md: 12 }, blockName: blockName }))),
             react_1.default.createElement(grid_1.Col, { sizes: { all: 12, md: 8 } }, items.map(({ title: itemTitle, text: itemText, link, listStyle = 'dash' }, index) => {
                 const isOpened = opened.includes(index);
                 return (react_1.default.createElement("div", { key: itemTitle, className: b('item') },

package/build/cjs/blocks/Questions/schema.d.ts

@@ -91,6 +91,9 @@ export declare const QuestionsBlock: {
             resetPaddings: {
                 type: string;
             };
+            blockName: {
+                type: string;
+            };
             type: {};
             when: {};
         };

package/build/cjs/blocks/Security/Security.js

@@ -4,11 +4,12 @@ exports.SecurityBlock = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const components_1 = require("../../components");
 const grid_1 = require("../../grid");
 const b = (0, utils_1.block)('SecurityBlock');
 const SecurityBlock = (props) => {
-    const { backgroundColor, theme = 'dark', title, points, media, animated } = props;
+    const { backgroundColor, theme = 'dark', title, points, media, animated, blockName = models_1.BlockType.SecurityBlock, } = props;
     return (react_1.default.createElement(components_1.AnimateBlock, { className: b({ theme }), offset: 200, animate: animated },
         react_1.default.createElement("div", { className: b('content') },
             react_1.default.createElement(components_1.FullWidthBackground, { className: b('background'), style: { backgroundColor } }),
@@ -22,7 +23,7 @@ const SecurityBlock = (props) => {
                     link && (react_1.default.createElement(components_1.Link, { className: b('point-link'), text: link.text, url: link.url, theme: 'normal', arrow: true }))))))),
                 media && (react_1.default.createElement(grid_1.Row, { className: b('media') },
                     react_1.default.createElement(grid_1.Col, null,
-                        react_1.default.createElement(components_1.Media, Object.assign({ className: b('media') }, media)))))))));
+                        react_1.default.createElement(components_1.Media, Object.assign({ className: b('media') }, media, { blockName: blockName })))))))));
 };
 exports.SecurityBlock = SecurityBlock;
 exports.default = exports.SecurityBlock;

package/build/cjs/blocks/Security/schema.d.ts

@@ -160,6 +160,9 @@ export declare const SecurityBlock: {
                     };
                 };
             };
+            blockName: {
+                type: string;
+            };
             animated: {
                 type: string;
             };

package/build/cjs/blocks/Security/schema.js

@@ -27,6 +27,8 @@ exports.SecurityBlock = {
                     },
                     link: lodash_1.default.pick(common_1.LinkProps, ['text', 'url']),
                 },
-            }) }),
+            }), blockName: {
+                type: 'string',
+            } }),
     },
 };

package/build/cjs/blocks/Share/Share.d.ts

@@ -1,3 +1,3 @@
 import { ShareBlockProps } from '../../models';
-declare const Share: ({ items, title }: ShareBlockProps) => JSX.Element;
+declare const Share: ({ items, title, blockName }: ShareBlockProps) => JSX.Element;
 export default Share;