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

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

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

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

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

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

@@ -160,6 +160,9 @@ export declare const SecurityBlock: {
                     };
                 };
             };
+            context: {
+                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']),
                 },
-            }) }),
+            }), context: {
+                type: 'string',
+            } }),
     },
 };

package/build/cjs/blocks/Share/Share.js

@@ -4,8 +4,11 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const locationContext_1 = require("../../context/locationContext");
+const blockPositionContext_1 = require("../../context/blockPositionContext");
 const i18n_1 = tslib_1.__importDefault(require("./i18n"));
+const hooks_1 = require("../../hooks");
 const Facebook_1 = require("../../icons/Facebook");
 const Twitter_1 = require("../../icons/Twitter");
 const Linkedin_1 = require("../../icons/Linkedin");
@@ -21,13 +24,21 @@ const icons = {
 const b = (0, utils_1.block)('share-block');
 const Share = ({ items, title }) => {
     const { pathname, hostname } = (0, react_1.useContext)(locationContext_1.LocationContext);
+    const context = (0, react_1.useContext)(blockPositionContext_1.BlockPositionContext);
+    const defaultEvent = (0, react_1.useMemo)(() => ({
+        name: 'share-button-click',
+        type: models_1.PredefinedEventTypes.Default,
+        context,
+    }), [context]);
+    const handleAnalytics = (0, hooks_1.useAnalytics)(defaultEvent);
+    const handleButtonClick = (0, react_1.useCallback)(() => handleAnalytics(), [handleAnalytics]);
     return (react_1.default.createElement("div", { className: b() },
         react_1.default.createElement("h5", { className: b('title') }, title || (0, i18n_1.default)('constructor-share')),
         react_1.default.createElement("div", { className: b('items') }, items.map((type) => {
             const url = (0, utils_1.getAbsolutePath)(hostname, pathname);
             const socialUrl = (0, utils_1.getShareLink)(url, type);
             const icon = icons[type];
-            return (react_1.default.createElement(uikit_1.Button, { key: type, view: "flat", size: "l", target: "_blank", href: socialUrl, className: b('item', { type: type.toLowerCase() }) }, icon && react_1.default.createElement(uikit_1.Icon, { data: icon, size: 24, className: b('icon', { type }) })));
+            return (react_1.default.createElement(uikit_1.Button, { key: type, view: "flat", size: "l", target: "_blank", href: socialUrl, className: b('item', { type: type.toLowerCase() }), onClick: handleButtonClick }, icon && react_1.default.createElement(uikit_1.Icon, { data: icon, size: 24, className: b('icon', { type }) })));
         }))));
 };
 exports.default = Share;

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

@@ -33,6 +33,9 @@ export declare const SimpleBlock: {
             resetPaddings: {
                 type: string;
             };
+            context: {
+                type: string;
+            };
             type: {};
             when: {};
             title: {

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

@@ -211,6 +211,9 @@ export declare const SliderBlock: {
             resetPaddings: {
                 type: string;
             };
+            context: {
+                type: string;
+            };
             type: {};
             when: {};
         };

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

@@ -64,6 +64,9 @@ export declare const TableBlock: {
             resetPaddings: {
                 type: string;
             };
+            context: {
+                type: string;
+            };
             type: {};
             when: {};
         };

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

@@ -341,6 +341,9 @@ export declare const TabsBlock: {
             resetPaddings: {
                 type: string;
             };
+            context: {
+                type: string;
+            };
             type: {};
             when: {};
         };

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

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

package/build/cjs/components/BackLink/BackLink.js

@@ -5,10 +5,20 @@ const react_1 = tslib_1.__importStar(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const icons_1 = require("../../icons");
 const locationContext_1 = require("../../context/locationContext");
+const hooks_1 = require("../../hooks");
+const models_1 = require("../../models");
+const COMPONENT_NAME = 'backlink';
 function BackLink(props) {
     const { history } = (0, react_1.useContext)(locationContext_1.LocationContext);
-    const { url, title, theme = 'default', size = 'l', className, shouldHandleBackAction = false, onClick, } = props;
+    const { url, title, theme = 'default', size = 'l', className, shouldHandleBackAction = false, onClick, context = COMPONENT_NAME, } = props;
+    const handleAnalytics = (0, hooks_1.useAnalytics)({
+        name: 'back-link-click',
+        type: models_1.PredefinedEventTypes.Default,
+        context: context,
+        target: url,
+    });
     const backActionHandler = (0, react_1.useCallback)(async () => {
+        handleAnalytics();
         if (!history) {
             return;
         }
@@ -21,7 +31,7 @@ function BackLink(props) {
         else {
             history.push({ pathname: url });
         }
-    }, [history, onClick, url]);
+    }, [handleAnalytics, history, onClick, url]);
     return (react_1.default.createElement(uikit_1.Button, { className: className, view: theme === 'special' ? 'flat-contrast' : 'flat-secondary', size: size, href: shouldHandleBackAction ? undefined : url, onClick: shouldHandleBackAction ? backActionHandler : undefined },
         react_1.default.createElement(uikit_1.Icon, { data: icons_1.ArrowSidebar, size: 24 }),
         react_1.default.createElement("span", null, title)));

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

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

package/build/cjs/components/Button/Button.js

@@ -4,21 +4,34 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const utils_2 = require("./utils");
 const localeContext_1 = require("../../context/localeContext/localeContext");
 const useMetrika_1 = require("../../hooks/useMetrika");
 const hooks_1 = require("../../hooks");
 const icons_1 = require("../../icons");
+const blockPositionContext_1 = require("../../context/blockPositionContext");
+const COMPONENT_NAME = 'button';
 const b = (0, utils_1.block)('button-block');
 const Button = (props) => {
     const handleMetrika = (0, useMetrika_1.useMetrika)();
-    const handleAnalytics = (0, hooks_1.useAnalytics)();
     const { lang, tld } = (0, react_1.useContext)(localeContext_1.LocaleContext);
     const { className, metrikaGoals, pixelEvents, analyticsEvents, size = 'l', theme = 'normal', url, img, onClick: onClickOrigin, text } = props, rest = tslib_1.__rest(props, ["className", "metrikaGoals", "pixelEvents", "analyticsEvents", "size", "theme", "url", "img", "onClick", "text"]);
+    const context = (0, react_1.useContext)(blockPositionContext_1.BlockPositionContext);
     const defaultImgPosition = 'left';
+    const defaultEvent = (0, react_1.useMemo)(() => ({
+        name: 'button-click',
+        type: models_1.PredefinedEventTypes.Default,
+        context: context || COMPONENT_NAME,
+        target: url,
+    }), [context, url]);
+    const handleAnalytics = (0, hooks_1.useAnalytics)(defaultEvent);
+    const blockPosition = (0, react_1.useContext)(blockPositionContext_1.BlockPositionContext);
+    // eslint-disable-next-line no-console
+    console.log({ blockPosition }, props);
     const onClick = (0, react_1.useCallback)(() => {
         handleMetrika({ metrikaGoals, pixelEvents });
-        handleAnalytics === null || handleAnalytics === void 0 ? void 0 : handleAnalytics(analyticsEvents);
+        handleAnalytics(analyticsEvents);
         if (onClickOrigin) {
             onClickOrigin();
         }

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

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

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

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

package/build/cjs/components/CardBase/CardBase.js

@@ -4,9 +4,11 @@ exports.Layout = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const utils_1 = require("../../utils");
+const blockPositionContext_1 = require("../../context/blockPositionContext");
 const BackgroundImage_1 = tslib_1.__importDefault(require("../BackgroundImage/BackgroundImage"));
 const RouterLink_1 = tslib_1.__importDefault(require("../RouterLink/RouterLink"));
 const useMetrika_1 = require("../../hooks/useMetrika");
+const common_1 = require("../../models/common");
 const hooks_1 = require("../../hooks");
 const b = (0, utils_1.block)('card-base-block');
 const Header = () => null;
@@ -15,7 +17,14 @@ const Footer = () => null;
 const Layout = (props) => {
     const { className, bodyClassName, metrikaGoals, pixelEvents, analyticsEvents, contentClassName, children, url, target, border = 'shadow', } = props;
     const handleMetrika = (0, useMetrika_1.useMetrika)();
-    const handleAnalytics = (0, hooks_1.useAnalytics)();
+    const context = (0, react_1.useContext)(blockPositionContext_1.BlockPositionContext);
+    const defaultEvent = (0, react_1.useMemo)(() => ({
+        name: 'card-base-click',
+        type: common_1.PredefinedEventTypes.Default,
+        context,
+        target: url,
+    }), [context, url]);
+    const handleAnalytics = (0, hooks_1.useAnalytics)(defaultEvent);
     let header, content, footer, image, headerClass, footerClass;
     function handleChild(child) {
         switch (child.type) {
@@ -48,7 +57,7 @@ const Layout = (props) => {
     const fullClassName = b({ border }, className);
     const onClick = () => {
         handleMetrika({ metrikaGoals, pixelEvents });
-        handleAnalytics === null || handleAnalytics === void 0 ? void 0 : handleAnalytics(analyticsEvents);
+        handleAnalytics(analyticsEvents);
     };
     return url ? (react_1.default.createElement(RouterLink_1.default, { href: url },
         react_1.default.createElement("a", { href: url, target: target, rel: target === '_blank' ? 'noopener noreferrer' : undefined, className: fullClassName, draggable: false, onDragStart: (e) => e.preventDefault(), onClick: onClick }, cardContent))) : (react_1.default.createElement("div", { className: fullClassName }, cardContent));

package/build/cjs/components/HeaderBreadcrumbs/HeaderBreadcrumbs.css

@@ -1,36 +1,6 @@
-@charset "UTF-8";
-/* use this for style redefinitions to awoid problems with
-unpredictable css rules order in build */
 .pc-header-breadcrumbs {
   z-index: 11;
 }
-.pc-header-breadcrumbs__item {
-  display: inline-block;
-}
-.pc-header-breadcrumbs__text {
-  font-size: var(--yc-text-body-2-font-size);
-  line-height: var(--yc-text-body-2-line-height);
-  outline: none;
-  color: var(--yc-color-text-link);
-  text-decoration: none;
-  cursor: pointer;
-  color: var(--yc-color-text-secondary);
-}
-.utilityfocus .pc-header-breadcrumbs__text:focus {
-  outline: 2px solid #ffdb4d;
-}
-.pc-header-breadcrumbs__text:hover, .pc-header-breadcrumbs__text:active {
-  --pc-text-header-color: var(--yc-color-text-link-hover);
-  color: var(--yc-color-text-link-hover);
-}
-.pc-header-breadcrumbs__text:after {
-  content: " / ";
-  margin: 0 8px 0 6px;
-  color: var(--yc-color-text-secondary);
-}
-.pc-header-breadcrumbs__text:hover {
-  color: var(--yc-color-text-primary);
-}
 .pc-header-breadcrumbs_theme_dark .pc-header-breadcrumbs__text {
   color: var(--yc-color-text-light-secondary);
 }

package/build/cjs/components/HeaderBreadcrumbs/HeaderBreadcrumbs.js

@@ -3,18 +3,10 @@ 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 useMetrika_1 = require("../../hooks/useMetrika");
-const hooks_1 = require("../../hooks");
+const HeaderBreadcrumbsItem_1 = tslib_1.__importDefault(require("./HeaderBreadcrumbsItem"));
 const b = (0, utils_1.block)('header-breadcrumbs');
 function HeaderBreadcrumbs(props) {
-    const { items, metrikaGoals, pixelEvents, analyticsEvents, theme = 'light', className } = props;
-    const handleMetrika = (0, useMetrika_1.useMetrika)();
-    const handleAnalytics = (0, hooks_1.useAnalytics)();
-    const onClick = () => {
-        handleMetrika({ metrikaGoals, pixelEvents });
-        handleAnalytics === null || handleAnalytics === void 0 ? void 0 : handleAnalytics(analyticsEvents);
-    };
-    return (react_1.default.createElement("div", { className: b({ theme }, className) }, items.map((item) => (react_1.default.createElement("div", { className: b('item'), key: item.url },
-        react_1.default.createElement("a", { href: item.url, className: b('text'), onClick: onClick }, item.text))))));
+    const { items, metrikaGoals, pixelEvents, theme = 'light', className } = props;
+    return (react_1.default.createElement("div", { className: b({ theme }, className) }, items.map((item) => (react_1.default.createElement(HeaderBreadcrumbsItem_1.default, { key: item.url, url: item.url, text: item.text, metrikaGoals: metrikaGoals, pixelEvents: pixelEvents, analyticsEvents: item.analyticsEvents })))));
 }
 exports.default = HeaderBreadcrumbs;

package/build/cjs/components/HeaderBreadcrumbs/HeaderBreadcrumbsItem.css

@@ -0,0 +1,30 @@
+@charset "UTF-8";
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-header-breadcrumbs-item__item {
+  display: inline-block;
+}
+.pc-header-breadcrumbs-item__text {
+  font-size: var(--yc-text-body-2-font-size);
+  line-height: var(--yc-text-body-2-line-height);
+  outline: none;
+  color: var(--yc-color-text-link);
+  text-decoration: none;
+  cursor: pointer;
+  color: var(--yc-color-text-secondary);
+}
+.utilityfocus .pc-header-breadcrumbs-item__text:focus {
+  outline: 2px solid #ffdb4d;
+}
+.pc-header-breadcrumbs-item__text:hover, .pc-header-breadcrumbs-item__text:active {
+  --pc-text-header-color: var(--yc-color-text-link-hover);
+  color: var(--yc-color-text-link-hover);
+}
+.pc-header-breadcrumbs-item__text:after {
+  content: " / ";
+  margin: 0 8px 0 6px;
+  color: var(--yc-color-text-secondary);
+}
+.pc-header-breadcrumbs-item__text:hover {
+  color: var(--yc-color-text-primary);
+}

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

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+import { AnalyticsEvent, ButtonPixel, MetrikaGoal } from '../../models';
+type HeaderBreadcrumbsItemProps = {
+    url: string;
+    text: ReactNode;
+    metrikaGoals?: MetrikaGoal;
+    pixelEvents?: ButtonPixel;
+    analyticsEvents?: AnalyticsEvent | AnalyticsEvent[];
+    context?: string;
+};
+export default function HeaderBreadcrumbsItem({ url, text, metrikaGoals, pixelEvents, analyticsEvents, }: HeaderBreadcrumbsItemProps): JSX.Element;
+export {};

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

@@ -0,0 +1,28 @@
+"use strict";
+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 useMetrika_1 = require("../../hooks/useMetrika");
+const hooks_1 = require("../../hooks");
+const blockPositionContext_1 = require("../../context/blockPositionContext");
+const b = (0, utils_1.block)('header-breadcrumbs-item');
+function HeaderBreadcrumbsItem({ url, text, metrikaGoals, pixelEvents, analyticsEvents, }) {
+    const handleMetrika = (0, useMetrika_1.useMetrika)();
+    const context = (0, react_1.useContext)(blockPositionContext_1.BlockPositionContext);
+    const defaultEvent = (0, react_1.useMemo)(() => ({
+        name: 'header-breadcrumbs-click',
+        type: models_1.PredefinedEventTypes.Default,
+        context: context,
+        target: url,
+    }), [context, url]);
+    const handleAnalytics = (0, hooks_1.useAnalytics)(defaultEvent);
+    const onClick = () => {
+        handleMetrika({ metrikaGoals, pixelEvents });
+        handleAnalytics(analyticsEvents);
+    };
+    return (react_1.default.createElement("div", { className: b('item'), key: url },
+        react_1.default.createElement("a", { href: url, className: b('text'), onClick: onClick }, text)));
+}
+exports.default = HeaderBreadcrumbsItem;

package/build/cjs/components/Link/Link.js

@@ -4,6 +4,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const utils_1 = require("../../utils");
+const models_1 = require("../../models");
 const icons_1 = require("../../icons");
 const FileLink_1 = tslib_1.__importDefault(require("../FileLink/FileLink"));
 const BackLink_1 = tslib_1.__importDefault(require("../BackLink/BackLink"));
@@ -11,6 +12,7 @@ const localeContext_1 = require("../../context/localeContext/localeContext");
 const locationContext_1 = require("../../context/locationContext/locationContext");
 const useMetrika_1 = require("../../hooks/useMetrika");
 const hooks_1 = require("../../hooks");
+const blockPositionContext_1 = require("../../context/blockPositionContext");
 const b = (0, utils_1.block)('link-block');
 const WORD_JOINER_SYM = '\u200b';
 function getArrowSize(size) {
@@ -28,14 +30,21 @@ function getArrowSize(size) {
 const LinkBlock = (props) => {
     const { text, url, arrow, metrikaGoals, pixelEvents, analyticsEvents, theme = 'file-link', colorTheme = 'light', textSize = 'm', className, target, children, } = props;
     const handleMetrika = (0, useMetrika_1.useMetrika)();
-    const handleAnalytics = (0, hooks_1.useAnalytics)();
+    const context = (0, react_1.useContext)(blockPositionContext_1.BlockPositionContext);
+    const defaultEvent = (0, react_1.useMemo)(() => ({
+        name: 'link-click',
+        type: models_1.PredefinedEventTypes.Default,
+        context,
+        target: url,
+    }), [context, url]);
+    const handleAnalytics = (0, hooks_1.useAnalytics)(defaultEvent);
     const { hostname } = (0, react_1.useContext)(locationContext_1.LocationContext);
     const { tld } = (0, react_1.useContext)(localeContext_1.LocaleContext);
     const href = (0, utils_1.setUrlTld)(props.url, tld);
     const defaultTextSize = theme === 'back' ? 'l' : 'm';
     const onClick = () => {
         handleMetrika({ metrikaGoals, pixelEvents });
-        handleAnalytics === null || handleAnalytics === void 0 ? void 0 : handleAnalytics(analyticsEvents);
+        handleAnalytics(analyticsEvents);
     };
     const getLinkByType = () => {
         switch (theme) {

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

@@ -34,6 +34,7 @@ const Video = (props) => {
         return (react_1.default.createElement(ReactPlayer_1.default, { 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,
         videoClassName,
         previewImg,
         playVideo,
@@ -41,7 +42,6 @@ const Video = (props) => {
         customBarControlsClassName,
         metrika,
         analyticsEvents,
-        height,
     ]);
     const defaultVideoBlock = (0, react_1.useMemo)(() => {
         return video.src.length && !hasVideoFallback ? (react_1.default.createElement("div", { className: b('wrap', videoClassName), style: { height } },

package/build/cjs/components/ReactPlayer/ReactPlayer.js

@@ -12,6 +12,7 @@ const CustomBarControls_1 = tslib_1.__importDefault(require("./CustomBarControls
 const videoContext_1 = require("../../context/videoContext");
 const metrikaContext_1 = require("../../context/metrikaContext");
 const mobileContext_1 = require("../../context/mobileContext");
+const blockPositionContext_1 = require("../../context/blockPositionContext");
 const icons_1 = require("../../icons");
 const hooks_1 = require("../../hooks");
 const b = (0, utils_1.block)('ReactPlayer');
@@ -35,7 +36,19 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
     const [started, setStarted] = (0, react_1.useState)(autoPlay);
     const [paused, setPaused] = (0, react_1.useState)(false);
     const [ended, setEnded] = (0, react_1.useState)(false);
-    const handleAnalytics = (0, hooks_1.useAnalytics)();
+    const eventsArray = (0, react_1.useMemo)(() => {
+        if (analyticsEvents) {
+            return Array.isArray(analyticsEvents) ? analyticsEvents : [analyticsEvents];
+        }
+        return [];
+    }, [analyticsEvents]);
+    const context = (0, react_1.useContext)(blockPositionContext_1.BlockPositionContext);
+    const defaultEvent = (0, react_1.useMemo)(() => ({
+        name: 'react-player-controls-click',
+        type: models_1.PredefinedEventTypes.Default,
+        context: context,
+    }), [context]);
+    const handleAnalytics = (0, hooks_1.useAnalytics)(defaultEvent);
     (0, react_1.useImperativeHandle)(originRef, () => ({
         pause: () => setIsPlaying(false),
     }));
@@ -84,8 +97,8 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
             window.removeEventListener('resize', updateSize);
         };
     }, []);
-    const playEvents = (0, react_1.useMemo)(() => analyticsEvents === null || analyticsEvents === void 0 ? void 0 : analyticsEvents.filter((e) => e.type === 'play'), [analyticsEvents]);
-    const stopEvents = (0, react_1.useMemo)(() => analyticsEvents === null || analyticsEvents === void 0 ? void 0 : analyticsEvents.filter((e) => e.type === 'stop'), [analyticsEvents]);
+    const playEvents = (0, react_1.useMemo)(() => eventsArray === null || eventsArray === void 0 ? void 0 : eventsArray.filter((e) => e.type === models_1.PredefinedEventTypes.Play), [eventsArray]);
+    const stopEvents = (0, react_1.useMemo)(() => eventsArray === null || eventsArray === void 0 ? void 0 : eventsArray.filter((e) => e.type === models_1.PredefinedEventTypes.Stop), [eventsArray]);
     const playIcon = (0, react_1.useMemo)(() => {
         let playButtonContent;
         switch (type) {
@@ -111,27 +124,14 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
                 metrika.reachGoals(goal, counterName);
             }
         }
-        if (handleAnalytics && analyticsEvents) {
-            const events = isMuted ? playEvents : stopEvents;
-            if (events) {
-                handleAnalytics(events);
-            }
-        }
+        const events = isMuted ? playEvents : stopEvents;
+        handleAnalytics(events);
         if (isMuted) {
             setProps({ playingVideoRef: ref.current });
         }
         // In order to the progress bar to update (equals 0) before displaying
         setTimeout(() => setMuted(!isMuted), 0);
-    }, [
-        playerRef,
-        metrika,
-        videoMetrika,
-        handleAnalytics,
-        analyticsEvents,
-        playEvents,
-        stopEvents,
-        setProps,
-    ]);
+    }, [playerRef, metrika, videoMetrika, handleAnalytics, playEvents, stopEvents, setProps]);
     const handleClick = (0, react_1.useCallback)(() => changeMute(muted), [changeMute, muted]);
     const handleClickPreview = (0, react_1.useCallback)(() => {
         setIsPlaying(true);
@@ -142,12 +142,8 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
                 metrika.reachGoals(play, counterName);
             }
         }
-        if (handleAnalytics && analyticsEvents) {
-            if (playEvents) {
-                handleAnalytics(playEvents);
-            }
-        }
-    }, [onClickPreview, metrika, videoMetrika, handleAnalytics, analyticsEvents, playEvents]);
+        handleAnalytics(playEvents);
+    }, [onClickPreview, metrika, videoMetrika, handleAnalytics, playEvents]);
     const onPause = (0, react_1.useCallback)(() => {
         // For support correct state for youtube
         setIsPlaying(false);

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

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

package/build/cjs/components/YandexForm/YandexForm.js

@@ -8,7 +8,9 @@ const localeContext_1 = require("../../context/localeContext");
 const mobileContext_1 = require("../../context/mobileContext");
 const utils_1 = require("../../utils");
 const useMetrika_1 = require("../../hooks/useMetrika");
-const hooks_1 = require("../..//hooks");
+const common_1 = require("../../models/common");
+const hooks_1 = require("../../hooks");
+const blockPositionContext_1 = require("../../context/blockPositionContext");
 exports.YANDEX_FORM_ORIGIN = 'https://forms.yandex.ru';
 const CONTAINER_ID = 'pc-yandex-form-container';
 const b = (0, utils_1.block)('yandex-form');
@@ -18,7 +20,13 @@ const YandexForm = (props) => {
     const iframeRef = (0, react_1.useRef)();
     const yaFormOrigin = customFormOrigin || exports.YANDEX_FORM_ORIGIN;
     const handleMetrika = (0, useMetrika_1.useMetrika)();
-    const handleAnalytics = (0, hooks_1.useAnalytics)();
+    const context = (0, react_1.useContext)(blockPositionContext_1.BlockPositionContext);
+    const defaultEvent = (0, react_1.useMemo)(() => ({
+        name: 'yndex-form-submit',
+        type: common_1.PredefinedEventTypes.Default,
+        context: context,
+    }), [context]);
+    const handleAnalytics = (0, hooks_1.useAnalytics)(defaultEvent);
     const isMobile = (0, react_1.useContext)(mobileContext_1.MobileContext);
     const locale = (0, react_1.useContext)(localeContext_1.LocaleContext);
     const updateFormIframe = (0, react_1.useCallback)((container) => {
@@ -59,7 +67,7 @@ const YandexForm = (props) => {
             window.scrollBy(0, top - headerHeight);
         }
         handleMetrika({ metrikaGoals, pixelEvents });
-        handleAnalytics === null || handleAnalytics === void 0 ? void 0 : handleAnalytics(analyticsEvents);
+        handleAnalytics(analyticsEvents);
         if (onSubmit) {
             onSubmit();
         }

package/build/cjs/containers/PageConstructor/components/ConstructorBlocks/ConstructorBlocks.js

@@ -11,13 +11,14 @@ const ConstructorItem_1 = require("../ConstructorItem");
 const ConstructorBlock_1 = require("../ConstructorBlock/ConstructorBlock");
 const ConstructorBlocks = ({ items, shouldRenderBlock }) => {
     const { blockTypes, loadables, itemMap } = (0, react_1.useContext)(innerContext_1.InnerContext);
-    const renderer = (item, index) => {
+    const renderer = (parentContext = '', item, index) => {
         if (!itemMap[item.type]) {
             return null;
         }
         let children;
         let itemElement;
         const key = (0, utils_1.getBlockKey)(item, index);
+        const context = (0, utils_1.getBlockContext)({ parentContext, block: item, index });
         if (shouldRenderBlock && !shouldRenderBlock(item, key)) {
             return null;
         }
@@ -31,12 +32,12 @@ const ConstructorBlocks = ({ items, shouldRenderBlock }) => {
         }
         else {
             if ('children' in item && item.children) {
-                children = item.children.map(renderer);
+                children = item.children.map(renderer.bind(null, context));
             }
-            itemElement = (react_1.default.createElement(ConstructorItem_1.ConstructorItem, { data: item, key: key }, children));
+            itemElement = (react_1.default.createElement(ConstructorItem_1.ConstructorItem, { data: item, key: key, context: context }, children));
         }
         return blockTypes.includes(item.type) ? (react_1.default.createElement(ConstructorBlock_1.ConstructorBlock, { data: item, key: key, Component: itemElement })) : (itemElement);
     };
-    return react_1.default.createElement(react_1.Fragment, null, items.map(renderer));
+    return react_1.default.createElement(react_1.Fragment, null, items.map(renderer.bind(null, '')));
 };
 exports.ConstructorBlocks = ConstructorBlocks;

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

@@ -1,6 +1,7 @@
 import { ConstructorItem as ConstructorItemType, WithChildren } from '../../../../models';
 export interface ConstructorItemProps {
     data: ConstructorItemType;
+    context?: string;
 }
-export declare const ConstructorItem: ({ data, children }: 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;