@gravity-ui/page-constructor 2.23.0-alpha.0 → 2.23.0-alpha.1

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

@@ -148,6 +148,84 @@ export declare const tabsItem: {
                     fullscreen: {
                         type: string;
                     };
+                    analyticsEvents: {
+                        anyOf: ({
+                            type: string;
+                            additionalProperties: {
+                                type: string;
+                            };
+                            required: string[];
+                            properties: {
+                                name: {
+                                    type: string;
+                                };
+                                type: {
+                                    type: string;
+                                };
+                                counters: {
+                                    type: string;
+                                    additionalProperties: boolean;
+                                    required: never[];
+                                    properties: {
+                                        include: {
+                                            type: string;
+                                            items: {
+                                                type: string;
+                                            };
+                                        };
+                                        exclude: {
+                                            type: string;
+                                            items: {
+                                                type: string;
+                                            };
+                                        };
+                                    };
+                                };
+                                context: {
+                                    type: string;
+                                };
+                            };
+                        } | {
+                            type: string;
+                            items: {
+                                type: string;
+                                additionalProperties: {
+                                    type: string;
+                                };
+                                required: string[];
+                                properties: {
+                                    name: {
+                                        type: string;
+                                    };
+                                    type: {
+                                        type: string;
+                                    };
+                                    counters: {
+                                        type: string;
+                                        additionalProperties: boolean;
+                                        required: never[];
+                                        properties: {
+                                            include: {
+                                                type: string;
+                                                items: {
+                                                    type: string;
+                                                };
+                                            };
+                                            exclude: {
+                                                type: string;
+                                                items: {
+                                                    type: string;
+                                                };
+                                            };
+                                        };
+                                    };
+                                    context: {
+                                        type: string;
+                                    };
+                                };
+                            };
+                        })[];
+                    };
                 };
             } | {
                 type: string;

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

@@ -41,7 +41,7 @@ export const Media = (props) => {
             }
         }
         if (youtube) {
-            result = (React.createElement(YoutubeBlock, { className: b('youtube', youtubeClassName), record: youtube, attributes: { color: 'white', rel: '0' }, previewImg: previewImg, height: height, fullscreen: getFullscreen({ fullScreen, fullscreen }) }));
+            result = (React.createElement(YoutubeBlock, { className: b('youtube', youtubeClassName), record: youtube, attributes: { color: 'white', rel: '0' }, previewImg: previewImg, height: height, fullscreen: getFullscreen({ fullScreen, fullscreen }), analyticsEvents: analyticsEvents }));
         }
         if (dataLens) {
             result = React.createElement(DataLens, { dataLens: dataLens });

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

@@ -1,11 +1,12 @@
 import React from 'react';
+import { AnalyticsEventsBase } from '../../models/common';
 import './VideoBlock.css';
 export declare const AUTOPLAY_ATTRIBUTES: {
     autoplay: number;
     mute: number;
 };
 export declare function getHeight(width: number): number;
-export interface VideoBlockProps {
+export interface VideoBlockProps extends AnalyticsEventsBase {
     id?: string;
     stream?: string;
     record?: string;

package/build/esm/components/VideoBlock/VideoBlock.js

@@ -2,7 +2,9 @@ import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { Icon } from '@gravity-ui/uikit';
 import _ from 'lodash';
 import { v4 as uuidv4 } from 'uuid';
+import { useAnalytics } from '../../hooks/useAnalytics';
 import { PlayVideo } from '../../icons';
+import { DefaultEventNames } from '../../models/common';
 import { block, getPageSearchParams } from '../../utils';
 import Image from '../Image/Image';
 import i18n from './i18n';
@@ -35,7 +37,8 @@ export function getHeight(width) {
     return (width / 16) * 9;
 }
 const VideoBlock = (props) => {
-    const { stream, record, attributes, className, id, previewImg, playButton, height, fullScreen, fullscreen, } = props;
+    const { stream, record, attributes, className, id, previewImg, playButton, height, fullScreen, fullscreen, analyticsEvents, } = props;
+    const handleAnalytics = useAnalytics(DefaultEventNames.VideoPreview);
     const src = getVideoSrc(stream, record);
     const ref = useRef(null);
     const iframeRef = useRef();
@@ -44,11 +47,12 @@ const VideoBlock = (props) => {
     const [currentHeight, setCurrentHeight] = useState(height || undefined);
     const fullId = id || uuidv4();
     const onPreviewClick = useCallback(() => {
+        handleAnalytics(analyticsEvents);
         if (iframeRef.current) {
             iframeRef.current.src = `${src}?${getPageSearchParams(Object.assign(Object.assign({}, AUTOPLAY_ATTRIBUTES), (attributes || {})))}`;
         }
         setTimeout(() => setHidePreview(true), AUTOPLAY_DELAY);
-    }, [src, attributes]);
+    }, [handleAnalytics, analyticsEvents, src, attributes]);
     useEffect(() => {
         const updateSize = _.debounce(() => {
             setCurrentHeight(ref.current ? Math.round(getHeight(ref.current.offsetWidth)) : undefined);

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

@@ -79,7 +79,8 @@ export declare enum DefaultEventNames {
     HubspotFormSubmit = "hubspot-form-submit",
     QuoteButton = "quote-button-click",
     BackLink = "back-link-click",
-    Breadcrumb = "breadcrumb-click"
+    Breadcrumb = "breadcrumb-click",
+    VideoPreview = "video-preview-click"
 }
 export type AnalyticsCounters = {
     include?: string[];

package/build/esm/models/common.js

@@ -45,4 +45,5 @@ export var DefaultEventNames;
     DefaultEventNames["QuoteButton"] = "quote-button-click";
     DefaultEventNames["BackLink"] = "back-link-click";
     DefaultEventNames["Breadcrumb"] = "breadcrumb-click";
+    DefaultEventNames["VideoPreview"] = "video-preview-click";
 })(DefaultEventNames || (DefaultEventNames = {}));

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

@@ -63,7 +63,6 @@ export interface HeaderData {
     leftItems: NavigationItemModel[];
     rightItems?: NavigationItemModel[];
     iconSize?: number;
-    withBorder?: boolean;
 }
 export interface FooterColumn {
     title: string;

package/build/esm/navigation/components/Header/Header.css

@@ -9,8 +9,6 @@ unpredictable css rules order in build */
   align-items: center;
   height: var(--header-height);
   background-color: var(--yc-color-base-background);
-}
-.pc-header_with-border {
   box-shadow: inset 0 -1px 0 var(--yc-color-line-generic);
 }
 .pc-header__wrapper {

package/build/esm/navigation/components/Header/Header.js

@@ -1,5 +1,4 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import _ from 'lodash';
+import React, { useCallback, useMemo, useState } from 'react';
 import Control from '../../../components/Control/Control';
 import OutsideClick from '../../../components/OutsideClick/OutsideClick';
 import { Col, Grid, Row } from '../../../grid';
@@ -25,10 +24,9 @@ const MobileMenuButton = ({ isSidebarOpened, onSidebarOpenedChange, }) => {
 };
 const iconSizeKey = 'iconSize';
 export const Header = ({ data, logo }) => {
-    const { leftItems, rightItems, iconSize = 20, withBorder = false } = data;
+    const { leftItems, rightItems, iconSize = 20 } = data;
     const [isSidebarOpened, setIsSidebarOpened] = useState(false);
     const [activeItemId, setactiveItemId] = useState(undefined);
-    const [withHeaderBorder, setWithHeaderBorder] = useState(withBorder);
     const getNavigationItemWithIconSize = useCallback((item) => {
         if (!(iconSizeKey in item)) {
             return Object.assign(Object.assign({}, item), { iconSize });
@@ -49,19 +47,7 @@ export const Header = ({ data, logo }) => {
     const hideSidebar = useCallback(() => {
         setIsSidebarOpened(false);
     }, []);
-    useEffect(() => {
-        const handleScroll = () => {
-            if (window.scrollY > 0 && !withBorder) {
-                setWithHeaderBorder(true);
-            }
-            else if (window.scrollY === 0 && !withBorder) {
-                setWithHeaderBorder(false);
-            }
-        };
-        window.addEventListener('scroll', _.debounce(handleScroll, 5), { passive: true });
-        return () => window.removeEventListener('scroll', _.debounce(handleScroll, 5));
-    });
-    return (React.createElement(Grid, { className: b({ 'with-border': withHeaderBorder }) },
+    return (React.createElement(Grid, { className: b() },
         React.createElement(Row, null,
             React.createElement(Col, null,
                 React.createElement("header", { className: b('wrapper') },

package/build/esm/schema/validators/common.d.ts

@@ -1120,6 +1120,84 @@ export declare const MediaProps: {
     fullscreen: {
         type: string;
     };
+    analyticsEvents: {
+        anyOf: ({
+            type: string;
+            additionalProperties: {
+                type: string;
+            };
+            required: string[];
+            properties: {
+                name: {
+                    type: string;
+                };
+                type: {
+                    type: string;
+                };
+                counters: {
+                    type: string;
+                    additionalProperties: boolean;
+                    required: never[];
+                    properties: {
+                        include: {
+                            type: string;
+                            items: {
+                                type: string;
+                            };
+                        };
+                        exclude: {
+                            type: string;
+                            items: {
+                                type: string;
+                            };
+                        };
+                    };
+                };
+                context: {
+                    type: string;
+                };
+            };
+        } | {
+            type: string;
+            items: {
+                type: string;
+                additionalProperties: {
+                    type: string;
+                };
+                required: string[];
+                properties: {
+                    name: {
+                        type: string;
+                    };
+                    type: {
+                        type: string;
+                    };
+                    counters: {
+                        type: string;
+                        additionalProperties: boolean;
+                        required: never[];
+                        properties: {
+                            include: {
+                                type: string;
+                                items: {
+                                    type: string;
+                                };
+                            };
+                            exclude: {
+                                type: string;
+                                items: {
+                                    type: string;
+                                };
+                            };
+                        };
+                    };
+                    context: {
+                        type: string;
+                    };
+                };
+            };
+        })[];
+    };
 };
 export declare const YMapMarkerLabel: {
     type: string;

package/build/esm/schema/validators/common.js

@@ -459,6 +459,9 @@ export const MediaProps = {
     fullscreen: {
         type: 'boolean',
     },
+    analyticsEvents: {
+        anyOf: [AnalyticsEventSchema, { type: 'array', items: AnalyticsEventSchema }],
+    },
 };
 export const YMapMarkerLabel = {
     type: 'object',

package/build/esm/sub-blocks/LayoutItem/schema.d.ts

@@ -138,6 +138,84 @@ export declare const LayoutItem: {
             fullscreen: {
                 type: string;
             };
+            analyticsEvents: {
+                anyOf: ({
+                    type: string;
+                    additionalProperties: {
+                        type: string;
+                    };
+                    required: string[];
+                    properties: {
+                        name: {
+                            type: string;
+                        };
+                        type: {
+                            type: string;
+                        };
+                        counters: {
+                            type: string;
+                            additionalProperties: boolean;
+                            required: never[];
+                            properties: {
+                                include: {
+                                    type: string;
+                                    items: {
+                                        type: string;
+                                    };
+                                };
+                                exclude: {
+                                    type: string;
+                                    items: {
+                                        type: string;
+                                    };
+                                };
+                            };
+                        };
+                        context: {
+                            type: string;
+                        };
+                    };
+                } | {
+                    type: string;
+                    items: {
+                        type: string;
+                        additionalProperties: {
+                            type: string;
+                        };
+                        required: string[];
+                        properties: {
+                            name: {
+                                type: string;
+                            };
+                            type: {
+                                type: string;
+                            };
+                            counters: {
+                                type: string;
+                                additionalProperties: boolean;
+                                required: never[];
+                                properties: {
+                                    include: {
+                                        type: string;
+                                        items: {
+                                            type: string;
+                                        };
+                                    };
+                                    exclude: {
+                                        type: string;
+                                        items: {
+                                            type: string;
+                                        };
+                                    };
+                                };
+                            };
+                            context: {
+                                type: string;
+                            };
+                        };
+                    };
+                })[];
+            };
         };
         content: Partial<{
             title: {

package/build/esm/sub-blocks/MediaCard/schema.d.ts

@@ -140,6 +140,88 @@ export declare const MediaCardBlock: {
             fullscreen: {
                 type: string;
             };
+            analyticsEvents: {
+                anyOf: ({
+                    type: string;
+                    additionalProperties: {
+                        type: string;
+                    };
+                    required: string[];
+                    properties: {
+                        name: {
+                            type: string;
+                        };
+                        type: {
+                            type: string;
+                        };
+                        counters: {
+                            type: string;
+                            additionalProperties: boolean;
+                            required: never[];
+                            properties: {
+                                include: {
+                                    type: string;
+                                    items: {
+                                        type: string;
+                                    };
+                                };
+                                exclude: {
+                                    type: string;
+                                    items: {
+                                        type: string;
+                                    };
+                                };
+                            };
+                        };
+                        context: {
+                            type: string;
+                        };
+                    };
+                } | {
+                    type: string;
+                    items: {
+                        type: string;
+                        additionalProperties: {
+                            type: string;
+                        };
+                        required: string[];
+                        properties: {
+                            name: {
+                                type: string;
+                            };
+                            type: {
+                                type: string;
+                            };
+                            counters: {
+                                type: string;
+                                additionalProperties: boolean;
+                                required: never[];
+                                properties: {
+                                    include: {
+                                        type: string;
+                                        items: {
+                                            type: string;
+                                        };
+                                    };
+                                    exclude: {
+                                        type: string;
+                                        items: {
+                                            type: string;
+                                        };
+                                    };
+                                };
+                            };
+                            context: {
+                                type: string;
+                            };
+                        };
+                    };
+                })[];
+            };
+            border: {
+                type: string;
+                enum: string[];
+            };
             type: {};
             when: {};
         };

package/build/esm/sub-blocks/MediaCard/schema.js

@@ -1,8 +1,8 @@
-import { AnimatableProps, BaseProps, MediaProps } from '../../schema/validators/common';
+import { AnimatableProps, BaseProps, CardBase, MediaProps } from '../../schema/validators/common';
 export const MediaCardBlock = {
     'media-card': {
         additionalProperties: false,
         required: [],
-        properties: Object.assign(Object.assign(Object.assign({}, BaseProps), MediaProps), AnimatableProps),
+        properties: Object.assign(Object.assign(Object.assign(Object.assign({}, BaseProps), CardBase), MediaProps), AnimatableProps),
     },
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "2.23.0-alpha.0",
+  "version": "2.23.0-alpha.1",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {

package/server/models/common.d.ts

@@ -79,7 +79,8 @@ export declare enum DefaultEventNames {
     HubspotFormSubmit = "hubspot-form-submit",
     QuoteButton = "quote-button-click",
     BackLink = "back-link-click",
-    Breadcrumb = "breadcrumb-click"
+    Breadcrumb = "breadcrumb-click",
+    VideoPreview = "video-preview-click"
 }
 export type AnalyticsCounters = {
     include?: string[];

package/server/models/common.js

@@ -48,4 +48,5 @@ var DefaultEventNames;
     DefaultEventNames["QuoteButton"] = "quote-button-click";
     DefaultEventNames["BackLink"] = "back-link-click";
     DefaultEventNames["Breadcrumb"] = "breadcrumb-click";
+    DefaultEventNames["VideoPreview"] = "video-preview-click";
 })(DefaultEventNames = exports.DefaultEventNames || (exports.DefaultEventNames = {}));

package/server/models/navigation.d.ts

@@ -63,7 +63,6 @@ export interface HeaderData {
     leftItems: NavigationItemModel[];
     rightItems?: NavigationItemModel[];
     iconSize?: number;
-    withBorder?: boolean;
 }
 export interface FooterColumn {
     title: string;