@gravity-ui/page-constructor 1.15.0-alpha.19 → 1.15.0-alpha.20

package/build/esm/blocks/Security/Security.js

@@ -1,12 +1,11 @@
 import React from 'react';
 import { block } from '../../utils';
-import { BlockType } from '../../models';
 import { FullWidthBackground, HTML, Media, Link, AnimateBlock } from '../../components';
 import { Grid, Row, Col } from '../../grid';
 import './Security.css';
 const b = block('SecurityBlock');
 export const SecurityBlock = (props) => {
-    const { backgroundColor, theme = 'dark', title, points, media, animated, blockName = BlockType.SecurityBlock, } = props;
+    const { backgroundColor, theme = 'dark', title, points, media, animated } = props;
     return (React.createElement(AnimateBlock, { className: b({ theme }), offset: 200, animate: animated },
         React.createElement("div", { className: b('content') },
             React.createElement(FullWidthBackground, { className: b('background'), style: { backgroundColor } }),
@@ -20,6 +19,6 @@ export const SecurityBlock = (props) => {
                     link && (React.createElement(Link, { className: b('point-link'), text: link.text, url: link.url, theme: 'normal', arrow: true }))))))),
                 media && (React.createElement(Row, { className: b('media') },
                     React.createElement(Col, null,
-                        React.createElement(Media, Object.assign({ className: b('media') }, media, { blockName: blockName })))))))));
+                        React.createElement(Media, Object.assign({ className: b('media') }, media)))))))));
 };
 export default SecurityBlock;

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

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

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

@@ -23,7 +23,7 @@ export const SecurityBlock = {
                     },
                     link: _.pick(LinkProps, ['text', 'url']),
                 },
-            }), blockName: {
+            }), context: {
                 type: 'string',
             } }),
     },

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

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

package/build/esm/blocks/Share/Share.js

@@ -1,8 +1,9 @@
 import React, { useContext, useCallback, useMemo } from 'react';
 import { Icon, Button } from '@gravity-ui/uikit';
 import { block, getAbsolutePath, getShareLink } from '../../utils';
-import { BlockType, PredefinedEventTypes } from '../../models';
+import { PredefinedEventTypes } from '../../models';
 import { LocationContext } from '../../context/locationContext';
+import { BlockPositionContext } from '../../context/blockPositionContext';
 import i18n from './i18n';
 import { useAnalytics } from '../../hooks';
 import { Facebook } from '../../icons/Facebook';
@@ -19,13 +20,14 @@ const icons = {
     telegram: Telegram,
 };
 const b = block('share-block');
-const Share = ({ items, title, blockName = BlockType.ShareBlock }) => {
+const Share = ({ items, title }) => {
     const { pathname, hostname } = useContext(LocationContext);
+    const context = useContext(BlockPositionContext);
     const defaultEvent = useMemo(() => ({
         name: 'share-button-click',
         type: PredefinedEventTypes.Default,
-        blockName: blockName,
-    }), [blockName]);
+        context,
+    }), [context]);
     const handleAnalytics = useAnalytics(defaultEvent);
     const handleButtonClick = useCallback(() => handleAnalytics(), [handleAnalytics]);
     return (React.createElement("div", { className: b() },

package/build/esm/blocks/Simple/schema.d.ts

@@ -33,7 +33,7 @@ export declare const SimpleBlock: {
             resetPaddings: {
                 type: string;
             };
-            blockName: {
+            context: {
                 type: string;
             };
             type: {};

package/build/esm/blocks/Slider/schema.d.ts

@@ -211,7 +211,7 @@ export declare const SliderBlock: {
             resetPaddings: {
                 type: string;
             };
-            blockName: {
+            context: {
                 type: string;
             };
             type: {};

package/build/esm/blocks/Table/schema.d.ts

@@ -64,7 +64,7 @@ export declare const TableBlock: {
             resetPaddings: {
                 type: string;
             };
-            blockName: {
+            context: {
                 type: string;
             };
             type: {};

package/build/esm/blocks/Tabs/Tabs.d.ts

@@ -1,4 +1,4 @@
 import { TabsBlockProps } from '../../models';
 import './Tabs.css';
-export declare const TabsBlock: ({ items, title, description, animated, tabsColSizes, centered, direction, blockName, }: TabsBlockProps) => JSX.Element;
+export declare const TabsBlock: ({ items, title, description, animated, tabsColSizes, centered, direction, }: TabsBlockProps) => JSX.Element;
 export default TabsBlock;

package/build/esm/blocks/Tabs/Tabs.js

@@ -1,7 +1,6 @@
 import React, { Fragment, useContext, useRef, useState } from 'react';
 import { block, getThemedValue } from '../../utils';
 import { Row, Col, GridColumnOrderClasses } from '../../grid';
-import { BlockType } from '../../models';
 import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
 import BlockHeader from '../../components/BlockHeader/BlockHeader';
 import FullScreenImage from '../../components/FullscreenImage/FullscreenImage';
@@ -13,7 +12,7 @@ import { Content } from '../../sub-blocks';
 import { getHeight } from '../../components/VideoBlock/VideoBlock';
 import './Tabs.css';
 const b = block('tabs-block');
-export const TabsBlock = ({ items, title, description, animated, tabsColSizes, centered, direction = 'media-content', blockName = BlockType.TabsBlock, }) => {
+export const TabsBlock = ({ items, title, description, animated, tabsColSizes, centered, direction = 'media-content', }) => {
     var _a;
     const [activeTab, setActiveTab] = useState(items[0].tabName);
     const [play, setPlay] = useState(false);
@@ -38,12 +37,12 @@ export const TabsBlock = ({ items, title, description, animated, tabsColSizes, c
             React.createElement(Content, { title: activeTabData.title, text: activeTabData.text, additionalInfo: activeTabData.additionalInfo, size: "s", links: [
                     ...(activeTabData.link ? [activeTabData.link] : []),
                     ...(activeTabData.links || []),
-                ], buttons: activeTabData.buttons, colSizes: { all: 12 }, blockName: blockName }))));
+                ], buttons: activeTabData.buttons, colSizes: { all: 12 } }))));
     const mediaContent = showMedia && (React.createElement(Col, { sizes: { all: 12, md: 8 }, orders: {
             all: GridColumnOrderClasses.Last,
             md: GridColumnOrderClasses.First,
         }, className: b('col', { centered: centered }) },
-        React.createElement("div", { ref: ref }, (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (React.createElement(Media, Object.assign({}, getThemedValue(activeTabData.media, theme), { key: activeTab, className: b('media'), playVideo: play, height: mediaHeight, blockName: blockName })))),
+        React.createElement("div", { ref: ref }, (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (React.createElement(Media, Object.assign({}, getThemedValue(activeTabData.media, theme), { key: activeTab, className: b('media'), playVideo: play, height: mediaHeight })))),
         imageProps && (React.createElement(Fragment, null,
             React.createElement(FullScreenImage, Object.assign({}, imageProps, { imageClassName: b('image') })))),
         (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.caption) && React.createElement("p", { className: b('caption') }, activeTabData.caption)));
@@ -51,7 +50,7 @@ export const TabsBlock = ({ items, title, description, animated, tabsColSizes, c
         React.createElement(BlockHeader, { title: title, description: description, className: b('block-title', { centered: centered }) }),
         React.createElement(Row, null,
             React.createElement(Col, { sizes: tabsColSizes },
-                React.createElement(ButtonTabs, { items: tabs, onSelectTab: setActiveTab, activeTab: activeTab, className: b('tabs', { centered: centered }), blockName: BlockType.TabsBlock }))),
+                React.createElement(ButtonTabs, { items: tabs, onSelectTab: setActiveTab, activeTab: activeTab, className: b('tabs', { centered: centered }) }))),
         activeTabData && (React.createElement(Row, { className: b('row', { reverse: isReverse }) },
             mediaContent,
             textContent))));

package/build/esm/blocks/Tabs/schema.d.ts

@@ -341,7 +341,7 @@ export declare const TabsBlock: {
             resetPaddings: {
                 type: string;
             };
-            blockName: {
+            context: {
                 type: string;
             };
             type: {};

package/build/esm/components/BackLink/BackLink.d.ts

@@ -9,6 +9,6 @@ export interface BackLinkProps {
     className?: string;
     shouldHandleBackAction?: boolean;
     onClick?: () => void;
-    blockName?: string;
+    context?: string;
 }
 export default function BackLink(props: BackLinkProps): JSX.Element;

package/build/esm/components/BackLink/BackLink.js

@@ -7,11 +7,11 @@ import { PredefinedEventTypes } from '../../models';
 const COMPONENT_NAME = 'backlink';
 export default function BackLink(props) {
     const { history } = useContext(LocationContext);
-    const { url, title, theme = 'default', size = 'l', className, shouldHandleBackAction = false, onClick, blockName = COMPONENT_NAME, } = props;
+    const { url, title, theme = 'default', size = 'l', className, shouldHandleBackAction = false, onClick, context = COMPONENT_NAME, } = props;
     const handleAnalytics = useAnalytics({
         name: 'back-link-click',
         type: PredefinedEventTypes.Default,
-        blockName: blockName,
+        context: context,
         target: url,
     });
     const backActionHandler = useCallback(async () => {

package/build/esm/components/BackgroundMedia/BackgroundMedia.js

@@ -6,12 +6,11 @@ import AnimateBlock from '../AnimateBlock/AnimateBlock';
 import { MobileContext } from '../../context/mobileContext';
 import './BackgroundMedia.css';
 const b = block('BackgroundMedia');
-const COMPONENT_NAME = 'backgound-media-component';
 const BackgroundMedia = (_a) => {
     var { className, color, animated, parallax = true, video, mediaClassName } = _a, props = __rest(_a, ["className", "color", "animated", "parallax", "video", "mediaClassName"]);
     const isMobile = useContext(MobileContext);
     return (React.createElement(AnimateBlock, { className: b(null, className), style: { backgroundColor: color }, animate: animated },
         React.createElement(Media, Object.assign({ className: b('media', mediaClassName), imageClassName: b('image'), videoClassName: b('video'), isBackground: true }, Object.assign({ height: 720, color,
-            parallax, video: isMobile ? undefined : video }, props), { blockName: COMPONENT_NAME }))));
+            parallax, video: isMobile ? undefined : video }, props)))));
 };
 export default BackgroundMedia;

package/build/esm/components/Button/Button.d.ts

@@ -4,7 +4,7 @@ export interface ButtonProps extends Omit<ButtonParams, 'url'> {
     className?: string;
     url?: string;
     onClick?: () => void;
-    blockName?: string;
+    context?: string;
 }
 declare const Button: (props: ButtonProps) => JSX.Element;
 export default Button;

package/build/esm/components/Button/Button.js

@@ -15,14 +15,15 @@ const b = block('button-block');
 const Button = (props) => {
     const handleMetrika = useMetrika();
     const { lang, tld } = useContext(LocaleContext);
-    const { className, metrikaGoals, pixelEvents, analyticsEvents, size = 'l', theme = 'normal', url, img, onClick: onClickOrigin, text, blockName = COMPONENT_NAME } = props, rest = __rest(props, ["className", "metrikaGoals", "pixelEvents", "analyticsEvents", "size", "theme", "url", "img", "onClick", "text", "blockName"]);
+    const { className, metrikaGoals, pixelEvents, analyticsEvents, size = 'l', theme = 'normal', url, img, onClick: onClickOrigin, text } = props, rest = __rest(props, ["className", "metrikaGoals", "pixelEvents", "analyticsEvents", "size", "theme", "url", "img", "onClick", "text"]);
+    const context = useContext(BlockPositionContext);
     const defaultImgPosition = 'left';
     const defaultEvent = useMemo(() => ({
         name: 'button-click',
         type: PredefinedEventTypes.Default,
-        blockName: blockName,
+        context: context || COMPONENT_NAME,
         target: url,
-    }), [blockName, url]);
+    }), [context, url]);
     const handleAnalytics = useAnalytics(defaultEvent);
     const blockPosition = useContext(BlockPositionContext);
     // eslint-disable-next-line no-console

package/build/esm/components/ButtonTabs/ButtonTabs.d.ts

@@ -9,7 +9,7 @@ export interface ButtonTabsProps {
     items: ButtonTabsItemProps[];
     activeTab?: string;
     onSelectTab?: (tabId: string) => void;
-    blockName?: string;
+    context?: string;
 }
 declare const ButtonTabs: (props: ButtonTabsProps) => JSX.Element;
 export default ButtonTabs;

package/build/esm/components/ButtonTabs/ButtonTabs.js

@@ -3,9 +3,8 @@ import { block } from '../../utils';
 import { Button } from '../index';
 import './ButtonTabs.css';
 const b = block('button-tabs');
-const COMPONENT_NAME = 'button-tabs';
 const ButtonTabs = (props) => {
-    const { className, items, activeTab, onSelectTab, blockName = COMPONENT_NAME } = props;
+    const { className, items, activeTab, onSelectTab } = props;
     const activeTabId = useMemo(() => {
         if (activeTab) {
             return activeTab;
@@ -19,7 +18,7 @@ const ButtonTabs = (props) => {
     }, [onSelectTab]);
     return (React.createElement("div", { className: b(null, className) }, items.map((item) => {
         const isActive = item.id === activeTabId;
-        return (React.createElement(Button, { text: item.title, className: b('item', { active: isActive }), key: item.title, size: 'l', onClick: () => handleClick(item.id), theme: isActive ? 'monochrome' : 'normal', blockName: blockName }));
+        return (React.createElement(Button, { text: item.title, className: b('item', { active: isActive }), key: item.title, size: 'l', onClick: () => handleClick(item.id), theme: isActive ? 'monochrome' : 'normal' }));
     })));
 };
 export default ButtonTabs;

package/build/esm/components/CardBase/CardBase.d.ts

@@ -12,7 +12,7 @@ export interface CardBaseProps extends CardBaseParams {
     metrikaGoals?: MetrikaGoal;
     pixelEvents?: ButtonPixel;
     analyticsEvents?: AnalyticsEvent | AnalyticsEvent[];
-    blockName?: string;
+    context?: string;
 }
 export interface CardHeaderBaseProps {
     className?: string;

package/build/esm/components/CardBase/CardBase.js

@@ -1,25 +1,26 @@
-import React, { Children, Fragment, useMemo } from 'react';
+import React, { Children, Fragment, useMemo, useContext, } from 'react';
 import { block } from '../../utils';
+import { BlockPositionContext } from '../../context/blockPositionContext';
 import BackgroundImage from '../BackgroundImage/BackgroundImage';
 import RouterLink from '../RouterLink/RouterLink';
 import { useMetrika } from '../../hooks/useMetrika';
 import { PredefinedEventTypes } from '../../models/common';
 import { useAnalytics } from '../../hooks';
 import './CardBase.css';
-const COMPONENT_NAME = 'card-base';
 const b = block('card-base-block');
 const Header = () => null;
 const Content = () => null;
 const Footer = () => null;
 export const Layout = (props) => {
-    const { className, bodyClassName, metrikaGoals, pixelEvents, analyticsEvents, contentClassName, children, url, target, border = 'shadow', blockName = COMPONENT_NAME, } = props;
+    const { className, bodyClassName, metrikaGoals, pixelEvents, analyticsEvents, contentClassName, children, url, target, border = 'shadow', } = props;
     const handleMetrika = useMetrika();
+    const context = useContext(BlockPositionContext);
     const defaultEvent = useMemo(() => ({
         name: 'card-base-click',
         type: PredefinedEventTypes.Default,
-        blockName: blockName,
+        context,
         target: url,
-    }), [blockName, url]);
+    }), [context, url]);
     const handleAnalytics = useAnalytics(defaultEvent);
     let header, content, footer, image, headerClass, footerClass;
     function handleChild(child) {

package/build/esm/components/HeaderBreadcrumbs/HeaderBreadcrumbs.js

@@ -3,8 +3,7 @@ import { block } from '../../utils';
 import HeaderBreadcrumbsItem from './HeaderBreadcrumbsItem';
 import './HeaderBreadcrumbs.css';
 const b = block('header-breadcrumbs');
-const COMPONENT_NAME = 'header-breadcrumbs';
 export default function HeaderBreadcrumbs(props) {
-    const { items, metrikaGoals, pixelEvents, theme = 'light', blockName = COMPONENT_NAME, className, } = props;
-    return (React.createElement("div", { className: b({ theme }, className) }, items.map((item) => (React.createElement(HeaderBreadcrumbsItem, { key: item.url, url: item.url, text: item.text, metrikaGoals: metrikaGoals, pixelEvents: pixelEvents, analyticsEvents: item.analyticsEvents, blockName: blockName })))));
+    const { items, metrikaGoals, pixelEvents, theme = 'light', className } = props;
+    return (React.createElement("div", { className: b({ theme }, className) }, items.map((item) => (React.createElement(HeaderBreadcrumbsItem, { key: item.url, url: item.url, text: item.text, metrikaGoals: metrikaGoals, pixelEvents: pixelEvents, analyticsEvents: item.analyticsEvents })))));
 }

package/build/esm/components/HeaderBreadcrumbs/HeaderBreadcrumbsItem.d.ts

@@ -7,7 +7,7 @@ type HeaderBreadcrumbsItemProps = {
     metrikaGoals?: MetrikaGoal;
     pixelEvents?: ButtonPixel;
     analyticsEvents?: AnalyticsEvent | AnalyticsEvent[];
-    blockName?: string;
+    context?: string;
 };
-export default function HeaderBreadcrumbsItem({ url, text, metrikaGoals, pixelEvents, analyticsEvents, blockName, }: HeaderBreadcrumbsItemProps): JSX.Element;
+export default function HeaderBreadcrumbsItem({ url, text, metrikaGoals, pixelEvents, analyticsEvents, }: HeaderBreadcrumbsItemProps): JSX.Element;
 export {};

package/build/esm/components/HeaderBreadcrumbs/HeaderBreadcrumbsItem.js

@@ -1,19 +1,20 @@
-import React, { useMemo } from 'react';
+import React, { useContext, useMemo } from 'react';
 import { block } from '../../utils';
 import { PredefinedEventTypes } from '../../models';
 import { useMetrika } from '../../hooks/useMetrika';
 import { useAnalytics } from '../../hooks';
+import { BlockPositionContext } from '../../context/blockPositionContext';
 import './HeaderBreadcrumbsItem.css';
 const b = block('header-breadcrumbs-item');
-const COMPONENT_NAME = 'header-breadcrumbs-item';
-export default function HeaderBreadcrumbsItem({ url, text, metrikaGoals, pixelEvents, analyticsEvents, blockName = COMPONENT_NAME, }) {
+export default function HeaderBreadcrumbsItem({ url, text, metrikaGoals, pixelEvents, analyticsEvents, }) {
     const handleMetrika = useMetrika();
+    const context = useContext(BlockPositionContext);
     const defaultEvent = useMemo(() => ({
         name: 'header-breadcrumbs-click',
         type: PredefinedEventTypes.Default,
-        blockName: blockName,
+        context: context,
         target: url,
-    }), [blockName, url]);
+    }), [context, url]);
     const handleAnalytics = useAnalytics(defaultEvent);
     const onClick = () => {
         handleMetrika({ metrikaGoals, pixelEvents });

package/build/esm/components/Link/Link.js

@@ -9,10 +9,10 @@ import { LocaleContext } from '../../context/localeContext/localeContext';
 import { LocationContext } from '../../context/locationContext/locationContext';
 import { useMetrika } from '../../hooks/useMetrika';
 import { useAnalytics } from '../../hooks';
+import { BlockPositionContext } from '../../context/blockPositionContext';
 import './Link.css';
 const b = block('link-block');
 const WORD_JOINER_SYM = '\u200b';
-const COMPONENT_NAME = 'link';
 function getArrowSize(size) {
     switch (size) {
         case 'l':
@@ -26,14 +26,15 @@ function getArrowSize(size) {
     }
 }
 const LinkBlock = (props) => {
-    const { text, url, arrow, metrikaGoals, pixelEvents, analyticsEvents, theme = 'file-link', colorTheme = 'light', textSize = 'm', className, target, children, blockName = COMPONENT_NAME, } = props;
+    const { text, url, arrow, metrikaGoals, pixelEvents, analyticsEvents, theme = 'file-link', colorTheme = 'light', textSize = 'm', className, target, children, } = props;
     const handleMetrika = useMetrika();
+    const context = useContext(BlockPositionContext);
     const defaultEvent = useMemo(() => ({
         name: 'link-click',
         type: PredefinedEventTypes.Default,
-        blockName: blockName,
+        context,
         target: url,
-    }), [blockName, url]);
+    }), [context, url]);
     const handleAnalytics = useAnalytics(defaultEvent);
     const { hostname } = useContext(LocationContext);
     const { tld } = useContext(LocaleContext);
@@ -46,7 +47,7 @@ const LinkBlock = (props) => {
     const getLinkByType = () => {
         switch (theme) {
             case 'back':
-                return (React.createElement(BackLink, { title: children || text, url: href, onClick: onClick, blockName: blockName }));
+                return React.createElement(BackLink, { title: children || text, url: href, onClick: onClick });
             case 'file-link':
             case 'underline':
                 return (React.createElement(FileLink, { text: children || text, href: href, type: "horizontal", textSize: textSize, onClick: onClick }));

package/build/esm/components/Media/Media.js

@@ -6,10 +6,9 @@ import Video from './Video/Video';
 import YoutubeBlock from '../VideoBlock/VideoBlock';
 import './Media.css';
 const b = block('Media');
-const COMPONENT_NAME = 'media-component';
 export const Media = (props) => {
     const { image, video, youtube, dataLens, color, height, previewImg, parallax = false, metrika, analyticsEvents, } = props;
-    const { className, imageClassName, videoClassName, youtubeClassName, playVideo = true, isBackground, playButton, customBarControlsClassName, blockName = COMPONENT_NAME, } = props;
+    const { className, imageClassName, videoClassName, youtubeClassName, playVideo = true, isBackground, playButton, customBarControlsClassName, } = props;
     const [hasVideoFallback, setHasVideoFallback] = useState(false);
     const content = useMemo(() => {
         let result = [];
@@ -17,7 +16,7 @@ export const Media = (props) => {
             result.push(React.createElement(Image, { key: "image", parallax: parallax, image: image, height: height, imageClassName: imageClassName, isBackground: isBackground, video: video, hasVideoFallback: hasVideoFallback }));
         }
         if (video) {
-            result.push(React.createElement(Video, { key: "video", video: video, videoClassName: videoClassName, height: height, metrika: metrika, analyticsEvents: analyticsEvents, playVideo: playVideo, previewImg: previewImg, playButton: playButton, customBarControlsClassName: customBarControlsClassName, hasVideoFallback: hasVideoFallback, setHasVideoFallback: setHasVideoFallback, blockName: blockName }));
+            result.push(React.createElement(Video, { key: "video", video: video, videoClassName: videoClassName, height: height, metrika: metrika, analyticsEvents: analyticsEvents, playVideo: playVideo, previewImg: previewImg, playButton: playButton, customBarControlsClassName: customBarControlsClassName, hasVideoFallback: hasVideoFallback, setHasVideoFallback: setHasVideoFallback }));
         }
         if (youtube) {
             result = (React.createElement(YoutubeBlock, { className: b('youtube', youtubeClassName), record: youtube, attributes: { color: 'white', rel: '0' }, previewImg: previewImg, height: height }));
@@ -43,7 +42,6 @@ export const Media = (props) => {
         previewImg,
         playButton,
         customBarControlsClassName,
-        blockName,
         youtubeClassName,
     ]);
     return (React.createElement("div", { className: b(null, className), style: { backgroundColor: color } }, content));

package/build/esm/components/Media/Video/Video.js

@@ -5,9 +5,8 @@ import { getVideoTypesWithPriority } from './utils';
 import { block } from '../../../utils';
 import './Video.css';
 const b = block('media-component-video');
-const COMPONENT_NAME = 'media-video';
 const Video = (props) => {
-    const { video, height, metrika, analyticsEvents, previewImg, playButton: commonPlayButton, customBarControlsClassName, videoClassName, playVideo, setHasVideoFallback, hasVideoFallback, blockName = COMPONENT_NAME, } = props;
+    const { video, height, metrika, analyticsEvents, previewImg, playButton: commonPlayButton, customBarControlsClassName, videoClassName, playVideo, setHasVideoFallback, hasVideoFallback, } = props;
     const ref = useRef(null);
     useEffect(() => {
         if (ref && ref.current) {
@@ -30,7 +29,7 @@ const Video = (props) => {
     }, [playVideo, video, setHasVideoFallback]);
     const reactPlayerBlock = useMemo(() => {
         const { src, loop, controls, muted, autoplay = true, elapsedTime, playButton } = video;
-        return (React.createElement(ReactPlayerBlock, { className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: Boolean(loop), controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, metrika: metrika, analyticsEvents: analyticsEvents, height: height, blockName: blockName }));
+        return (React.createElement(ReactPlayerBlock, { className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: Boolean(loop), controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, metrika: metrika, analyticsEvents: analyticsEvents, height: height }));
     }, [
         video,
         height,
@@ -41,7 +40,6 @@ const Video = (props) => {
         customBarControlsClassName,
         metrika,
         analyticsEvents,
-        blockName,
     ]);
     const defaultVideoBlock = useMemo(() => {
         return video.src.length && !hasVideoFallback ? (React.createElement("div", { className: b('wrap', videoClassName), style: { height } },

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

@@ -8,17 +8,17 @@ import CustomBarControls from './CustomBarControls';
 import { VideoContext } from '../../context/videoContext';
 import { MetrikaContext } from '../../context/metrikaContext';
 import { MobileContext } from '../../context/mobileContext';
+import { BlockPositionContext } from '../../context/blockPositionContext';
 import { PlayVideo } from '../../icons';
 import { useAnalytics } from '../../hooks';
 import './ReactPlayer.css';
 const b = block('ReactPlayer');
 const FPS = 60;
-const COMPONENT_NAME = 'react-player';
 // eslint-disable-next-line react/display-name
 export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
     const isMobile = useContext(MobileContext);
     const { metrika } = useContext(MetrikaContext);
-    const { src, previewImgUrl, loop = false, controls = MediaVideoControlsType.Default, muted: initiallyMuted = false, elapsedTime, playButton, className, customBarControlsClassName, showPreview, onClickPreview, metrika: videoMetrika, analyticsEvents, height, blockName = COMPONENT_NAME, } = props;
+    const { src, previewImgUrl, loop = false, controls = MediaVideoControlsType.Default, muted: initiallyMuted = false, elapsedTime, playButton, className, customBarControlsClassName, showPreview, onClickPreview, metrika: videoMetrika, analyticsEvents, height, } = props;
     const { type = PlayButtonType.Default, theme = PlayButtonThemes.Blue, text, className: buttonClassName, } = playButton || {};
     const autoPlay = Boolean(!isMobile && !previewImgUrl && props.autoplay);
     const mute = initiallyMuted || autoPlay;
@@ -39,11 +39,12 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
         }
         return [];
     }, [analyticsEvents]);
+    const context = useContext(BlockPositionContext);
     const defaultEvent = useMemo(() => ({
         name: 'react-player-controls-click',
         type: PredefinedEventTypes.Default,
-        blockName: blockName,
-    }), [blockName]);
+        context: context,
+    }), [context]);
     const handleAnalytics = useAnalytics(defaultEvent);
     useImperativeHandle(originRef, () => ({
         pause: () => setIsPlaying(false),

package/build/esm/components/YandexForm/YandexForm.d.ts

@@ -16,7 +16,7 @@ export interface YandexFormProps {
     metrikaGoals?: string | string[];
     pixelEvents?: string | string[] | PixelEvent | PixelEvent[];
     analyticsEvents?: AnalyticsEvent | AnalyticsEvent[];
-    blockName?: string;
+    context?: string;
 }
 declare const YandexForm: (props: YandexFormProps) => JSX.Element;
 export default YandexForm;

package/build/esm/components/YandexForm/YandexForm.js

@@ -6,21 +6,22 @@ import { block } from '../../utils';
 import { useMetrika } from '../../hooks/useMetrika';
 import { PredefinedEventTypes } from '../../models/common';
 import { useAnalytics } from '../../hooks';
+import { BlockPositionContext } from '../../context/blockPositionContext';
 export const YANDEX_FORM_ORIGIN = 'https://forms.yandex.ru';
 const CONTAINER_ID = 'pc-yandex-form-container';
-const COMPONENT_NAME = 'yandex-form';
 const b = block('yandex-form');
 const YandexForm = (props) => {
-    const { onLoad, id, params, className, theme, containerId = CONTAINER_ID, headerHeight = HEADER_HEIGHT, onSubmit, metrikaGoals, pixelEvents, analyticsEvents, customFormOrigin, blockName = COMPONENT_NAME, } = props;
+    const { onLoad, id, params, className, theme, containerId = CONTAINER_ID, headerHeight = HEADER_HEIGHT, onSubmit, metrikaGoals, pixelEvents, analyticsEvents, customFormOrigin, } = props;
     const formContainerRef = useRef(null);
     const iframeRef = useRef();
     const yaFormOrigin = customFormOrigin || YANDEX_FORM_ORIGIN;
     const handleMetrika = useMetrika();
+    const context = useContext(BlockPositionContext);
     const defaultEvent = useMemo(() => ({
         name: 'yndex-form-submit',
         type: PredefinedEventTypes.Default,
-        blockName: blockName,
-    }), [blockName]);
+        context: context,
+    }), [context]);
     const handleAnalytics = useAnalytics(defaultEvent);
     const isMobile = useContext(MobileContext);
     const locale = useContext(LocaleContext);

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

@@ -1,7 +1,7 @@
 export declare const blockMap: {
     "slider-block": (props: import("./models").WithChildren<import("./blocks/Slider/Slider").SliderProps>) => JSX.Element;
     "simple-block": (props: import("./models").WithChildren<import("./models").SimpleBlockProps>) => JSX.Element;
-    "extended-features-block": ({ title, description, items, colSizes, animated, blockName, }: import("./models").ExtendedFeaturesProps) => JSX.Element;
+    "extended-features-block": ({ title, description, items, colSizes, animated, }: import("./models").ExtendedFeaturesProps) => JSX.Element;
     "promo-features-block": (props: import("./models").PromoFeaturesProps) => JSX.Element;
     "questions-block": (props: import("./models").QuestionsProps) => JSX.Element;
     "banner-block": (props: import("./models").BannerBlockProps) => JSX.Element;
@@ -11,14 +11,14 @@ export declare const blockMap: {
     "info-block": (props: import("./models").InfoBlockProps) => JSX.Element;
     "security-block": (props: import("./models").SecurityBlockProps) => JSX.Element;
     "table-block": (props: import("./models").TableBlockProps) => JSX.Element;
-    "tabs-block": ({ items, title, description, animated, tabsColSizes, centered, direction, blockName, }: import("./models").TabsBlockProps) => JSX.Element;
+    "tabs-block": ({ items, title, description, animated, tabsColSizes, centered, direction, }: import("./models").TabsBlockProps) => JSX.Element;
     "link-table-block": ({ items, title, description, linkTheme }: import("./models").LinkTableBlockProps) => JSX.Element;
     "header-block": (props: import("./models").WithChildren<import("./models").HeaderBlockProps & import("./models").ClassNameProps>) => JSX.Element;
     "icons-block": ({ title, size, items }: import("./models").IconsBlockProps) => JSX.Element;
     "header-slider-block": ({ items, arrows, ...props }: import("./models").HeaderSliderBlockProps) => JSX.Element;
     "card-layout-block": ({ title, description, animated, colSizes, children, }: import("./blocks/CardLayout/CardLayout").CardLayoutBlockProps) => JSX.Element;
     "content-layout-block": (props: import("./models").ContentLayoutBlockProps) => JSX.Element;
-    "share-block": ({ items, title, blockName }: import("./models").ShareBlockProps) => JSX.Element;
+    "share-block": ({ items, title }: import("./models").ShareBlockProps) => JSX.Element;
 };
 export declare const subBlockMap: {
     divider: ({ size, border }: import("./models").DividerProps) => JSX.Element;
@@ -31,10 +31,10 @@ export declare const subBlockMap: {
      */
     partner: ({ text, logo, url, border }: import("./models").PartnerProps) => JSX.Element;
     "price-detailed": (props: import("./models").PriceDetailedProps) => JSX.Element;
-    "media-card": ({ border, blockName, ...mediaProps }: import("./models").MediaCardProps) => JSX.Element;
+    "media-card": ({ border, ...mediaProps }: import("./models").MediaCardProps) => JSX.Element;
     "banner-card": (props: import("./models").BannerCardProps) => JSX.Element;
     "news-card": (props: import("./models").NewsCardProps) => JSX.Element;
-    "card-with-image": ({ title, description, image, disableCompress, links, border, fullScreen, className, additionalInfo, buttons, blockName, }: import("./models").CardWithImageProps) => JSX.Element;
+    "card-with-image": ({ title, description, image, disableCompress, links, border, fullScreen, className, additionalInfo, buttons, }: import("./models").CardWithImageProps) => JSX.Element;
     "background-card": (props: import("./models").BackgroundCardProps) => JSX.Element;
     "basic-card": (props: import("./models").BasicCardProps) => JSX.Element;
     content: (props: import("./models").ContentBlockProps & import("./models").ClassNameProps) => JSX.Element;

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

@@ -3,5 +3,5 @@ export interface ConstructorItemProps {
     data: ConstructorItemType;
     context?: string;
 }
-export declare const ConstructorItem: ({ data, children, context, }: WithChildren<ConstructorItemProps>) => JSX.Element;
+export declare const ConstructorItem: ({ data, children, context }: WithChildren<ConstructorItemProps>) => JSX.Element;
 export declare const ConstructorHeader: ({ data }: Pick<ConstructorItemProps, 'data'>) => JSX.Element;

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

@@ -2,7 +2,7 @@ import { __rest } from "tslib";
 import React, { useContext } from 'react';
 import { InnerContext } from '../../../../context/innerContext';
 import { BlockPositionContext } from '../../../../context/blockPositionContext';
-export const ConstructorItem = ({ data, children, context = '', }) => {
+export const ConstructorItem = ({ data, children, context }) => {
     const { itemMap } = useContext(InnerContext);
     const { type } = data, rest = __rest(data, ["type"]);
     const Component = itemMap[type];

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

@@ -77,7 +77,7 @@ export type AnalyticsEvent<T = {}> = T & {
     name: string;
     type?: string;
     counters?: AnalyticsCounters;
-    blockName?: string;
+    context?: string;
     target?: string;
 };
 export {};