@gravity-ui/page-constructor 1.15.0-alpha.22 → 1.15.0-alpha.24

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

@@ -0,0 +1,218 @@
+export declare const LayoutItem: {
+    type: string;
+    additionalProperties: boolean;
+    required: string[];
+    properties: {
+        media: {
+            color: {
+                type: string;
+            };
+            image: {
+                anyOf: ({
+                    oneOf: ({
+                        type: string;
+                        properties: {
+                            when: {
+                                type: string;
+                            };
+                        };
+                    } | {
+                        type: string;
+                        pattern: string;
+                    })[];
+                } | {
+                    type: string;
+                    items: {
+                        oneOf: ({
+                            type: string;
+                            properties: {
+                                when: {
+                                    type: string;
+                                };
+                            };
+                        } | {
+                            type: string;
+                            pattern: string;
+                        })[];
+                    };
+                })[];
+            };
+            video: {
+                type: string;
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    src: {
+                        type: string;
+                        items: {
+                            type: string;
+                        };
+                    };
+                    loop: {
+                        anyOf: ({
+                            type: string;
+                            additionalProperties: boolean;
+                            required: string[];
+                            properties: {
+                                start: {
+                                    type: string;
+                                };
+                                end: {
+                                    type: string;
+                                };
+                            };
+                        } | {
+                            type: string;
+                        })[];
+                    };
+                    type: {
+                        type: string;
+                        enum: string[];
+                    };
+                    muted: {
+                        type: string;
+                    };
+                    playing: {
+                        type: string;
+                    };
+                    elapsedTime: {
+                        type: string;
+                    };
+                    playIcon: {
+                        type: string;
+                        additionalProperties: boolean;
+                        properties: {
+                            type: {
+                                type: string;
+                                enum: string[];
+                            };
+                            theme: {
+                                type: string;
+                                enum: string[];
+                            };
+                            text: {
+                                type: string;
+                                contentType: string;
+                            };
+                        };
+                    };
+                    controls: {
+                        type: string;
+                        enum: string[];
+                    };
+                };
+            };
+            youtube: {
+                type: string;
+            };
+            parallax: {
+                type: string;
+            };
+            height: {
+                type: string;
+            };
+            previewImg: {
+                type: string;
+            };
+            dataLens: {
+                oneOf: ({
+                    type: string;
+                    additionalProperties: boolean;
+                    required: string[];
+                    properties: {
+                        id: {
+                            type: string;
+                        };
+                        theme: {
+                            type: string;
+                            enum: string[];
+                        };
+                    };
+                } | {
+                    type: string;
+                })[];
+            };
+        };
+        content: Partial<{
+            title: {
+                oneOf: ({
+                    type: string;
+                    additionalProperties: boolean;
+                    required: string[];
+                    properties: {
+                        text: {
+                            type: string;
+                            contentType: string;
+                        };
+                        textSize: {
+                            type: string;
+                            enum: string[];
+                        };
+                        url: {
+                            type: string;
+                        };
+                        resetMargin: {
+                            type: string;
+                        };
+                    };
+                } | {
+                    type: string;
+                    contentType: string;
+                })[];
+            };
+            text: {
+                type: string;
+                contentType: string;
+            };
+            additionalInfo: {
+                type: string;
+                contentType: string;
+            };
+            size: {
+                type: string;
+                enum: string[];
+            };
+            links: {
+                type: string;
+                items: {
+                    type: string;
+                    properties: {
+                        when: {
+                            type: string;
+                        };
+                    };
+                };
+            };
+            buttons: {
+                type: string;
+                items: {
+                    type: string;
+                    properties: {
+                        when: {
+                            type: string;
+                        };
+                    };
+                };
+            };
+            theme: {
+                type: string;
+                enum: string[];
+            };
+        }>;
+        metaInfo: {
+            type: string;
+            items: {
+                type: string;
+                contentType: string;
+            };
+        };
+        border: {
+            type: string;
+        };
+        fullScreen: {
+            type: string;
+        };
+        type: {};
+        when: {};
+    };
+};

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

@@ -0,0 +1,14 @@
+import { omit } from 'lodash';
+import { BaseProps, MediaProps } from '../../schema/validators/common';
+import { ContentBase } from '../../sub-blocks/Content/schema';
+import metaInfo from '../../components/MetaInfo/schema';
+export const LayoutItem = {
+    type: 'object',
+    additionalProperties: false,
+    required: ['content', 'media'],
+    properties: Object.assign(Object.assign({}, BaseProps), { media: MediaProps, content: omit(ContentBase, ['colSize', 'size', 'centered']), metaInfo: metaInfo, border: {
+            type: 'boolean',
+        }, fullScreen: {
+            type: 'boolean',
+        } }),
+};

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

@@ -0,0 +1,28 @@
+import { LayoutItemProps, LinkTheme, MediaProps } from '../../models';
+export declare const getLayoutItemLinks: (links: LayoutItemProps['content']['links']) => {
+    url: string;
+    text?: string | undefined;
+    textSize?: import("../../models").TextSize | undefined;
+    theme: LinkTheme;
+    colorTheme?: import("../../models").TextTheme | undefined;
+    arrow?: boolean | undefined;
+    target?: string | undefined;
+    metrikaGoals?: import("../../models").MetrikaGoal | undefined;
+    pixelEvents?: import("../../models").ButtonPixel | undefined;
+    analyticsEvents?: {
+        name: string;
+        type?: string | undefined;
+        counters?: import("../../models").AnalyticsCounters | undefined;
+        context?: string | undefined;
+        target?: string | undefined;
+    } | {
+        name: string;
+        type?: string | undefined;
+        counters?: import("../../models").AnalyticsCounters | undefined;
+        context?: string | undefined;
+        target?: string | undefined;
+    }[] | undefined;
+    className?: string | undefined;
+}[] | undefined;
+export declare const hasFullScreen: ({ dataLens, image }: MediaProps) => boolean;
+export declare const showFullScreenIcon: ({ youtube }: MediaProps) => boolean;

package/build/esm/sub-blocks/LayoutItem/utils.js

@@ -0,0 +1,6 @@
+export const getLayoutItemLinks = (links) => links === null || links === void 0 ? void 0 : links.map((link) => (Object.assign({ theme: 'normal' }, link)));
+export const hasFullScreen = ({ dataLens, image }) => {
+    // datalens and slider media card don't support fullScreen mode
+    return !(dataLens || Array.isArray(image));
+};
+export const showFullScreenIcon = ({ youtube }) => !youtube;

package/build/esm/sub-blocks/Quote/Quote.js

@@ -1,26 +1,19 @@
-import React, { useCallback, useContext, useMemo } from 'react';
+import React, { useCallback, useContext } from 'react';
 import { Button } from '@gravity-ui/uikit';
 import { block, getThemedValue } from '../../utils';
-import { AuthorType, PredefinedEventTypes } from '../../models';
+import { AuthorType, DefaultEventNames } from '../../models';
 import { Author, Image, HTML } from '../../components';
 import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
-import { BlockPositionContext } from '../../context/blockPositionContext';
 import { getMediaImage } from '../../components/Media/Image/utils';
-import { useAnalytics } from '../../hooks';
+import { useAnalytics, useAnalyticsEvent } from '../../hooks';
 import './Quote.css';
 const b = block('quote');
 const Quote = (props) => {
     const { theme: textTheme = 'light', color, image, border = 'shadow', text, logo, author, url, buttonText, } = props;
     const { themeValue: theme } = useContext(ThemeValueContext);
-    const context = useContext(BlockPositionContext);
     const imageThemed = getThemedValue(image, theme);
     const imageData = getMediaImage(imageThemed);
-    const defaultEvent = useMemo(() => ({
-        name: 'quote-button-click',
-        type: PredefinedEventTypes.Default,
-        context,
-        target: url,
-    }), [context, url]);
+    const defaultEvent = useAnalyticsEvent(DefaultEventNames.QuoteButton, url);
     const handleAnalytics = useAnalytics(defaultEvent);
     const handleButtonClick = useCallback(() => handleAnalytics(), [handleAnalytics]);
     const renderFooter = Boolean(author || url) && (React.createElement("div", { className: b('author-wrapper') },

package/build/esm/sub-blocks/index.d.ts

@@ -7,6 +7,7 @@ export { default as MediaCard } from './MediaCard/MediaCard';
 export { default as BannerCard } from './BannerCard/BannerCard';
 export { default as TutorialCard } from './TutorialCard/TutorialCard';
 export { default as CardWithImage } from './CardWithImage/CardWithImage';
+export { default as LayoutItem } from './LayoutItem/LayoutItem';
 export { default as BackgroundCard } from './BackgroundCard/BackgroundCard';
 export { default as BasicCard } from './BasicCard/BasicCard';
 export { default as Content } from './Content/Content';

package/build/esm/sub-blocks/index.js

@@ -7,6 +7,7 @@ export { default as MediaCard } from './MediaCard/MediaCard';
 export { default as BannerCard } from './BannerCard/BannerCard';
 export { default as TutorialCard } from './TutorialCard/TutorialCard';
 export { default as CardWithImage } from './CardWithImage/CardWithImage';
+export { default as LayoutItem } from './LayoutItem/LayoutItem';
 export { default as BackgroundCard } from './BackgroundCard/BackgroundCard';
 export { default as BasicCard } from './BasicCard/BasicCard';
 export { default as Content } from './Content/Content';

package/build/esm/text-transform/blocks.js

@@ -138,6 +138,23 @@ const config = {
             transformer: typografTransformer,
         },
     ],
+    [SubBlockType.LayoutItem]: [
+        {
+            fields: ['content'],
+            parser: parseContentLayout,
+            transformer: yfmTransformer,
+        },
+        {
+            fields: ['content'],
+            parser: parseContentLayoutTitle,
+            transformer: typografTransformer,
+        },
+        {
+            fields: ['metaInfo'],
+            parser: createItemsParser([]),
+            transformer: typografTransformer,
+        },
+    ],
     [SubBlockType.Quote]: {
         fields: ['text'],
         transformer: typografTransformer,

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

@@ -0,0 +1,2 @@
+import { AnalyticsCounters } from '../models';
+export declare const isCounterAllowed: (counter: string, counters?: AnalyticsCounters) => boolean;

package/build/esm/utils/analytics.js

@@ -0,0 +1,13 @@
+export const isCounterAllowed = (counter, counters) => {
+    var _a, _b;
+    if (!counters) {
+        return true;
+    }
+    if ((_a = counters.exclude) === null || _a === void 0 ? void 0 : _a.includes(counter)) {
+        return false;
+    }
+    else if ((_b = counters.include) === null || _b === void 0 ? void 0 : _b.includes(counter)) {
+        return true;
+    }
+    return false;
+};

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

@@ -2,16 +2,9 @@ import { ConstructorBlock } from '../models/constructor';
 import { TextSize, CustomConfig, PCShareSocialNetwork } from '../models';
 export declare function getHeaderTag(size: TextSize): "h1" | "h4" | "h2";
 export declare function getBlockKey(block: ConstructorBlock, index: number): string;
-type GetBlockContextArgs = {
-    block: ConstructorBlock;
-    index: number;
-    parentContext?: string;
-};
-export declare function getBlockContext({ parentContext, block, index }: GetBlockContextArgs): string;
 export declare const getCustomBlockTypes: ({ blocks, headers }?: CustomConfig) => string[];
 export declare const getCustomItems: ({ blocks, headers, subBlocks }?: CustomConfig) => {
     [x: string]: any;
 };
 export declare const getCustomHeaderTypes: (customBlocks?: CustomConfig) => string[];
 export declare const getShareLink: (url: string, type: PCShareSocialNetwork, title?: string, text?: string) => string | undefined;
-export {};

package/build/esm/utils/blocks.js

@@ -13,9 +13,6 @@ export function getHeaderTag(size) {
 export function getBlockKey(block, index) {
     return `${block.type}-${index}`;
 }
-export function getBlockContext({ parentContext = '', block, index }) {
-    return `${parentContext}${parentContext ? '_' : ''}${block.type}-${index}`;
-}
 export const getCustomBlockTypes = ({ blocks = {}, headers = {} } = {}) => [
     ...Object.keys(blocks),
     ...Object.keys(headers),

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

@@ -1,4 +1,4 @@
-export type HubspotEventName = 'onBeforeFormInit' | 'onFormReady' | 'onFormSubmit' | 'onFormSubmitted' | `_${string}`;
+export type HubspotEventName = 'onBeforeFormInit' | 'onFormReady' | 'onFormSubmit' | 'onFormSubmitted' | 'onFormError' | `_${string}`;
 export interface HubspotEventData {
     type: HubspotEventName | string;
     eventName: HubspotEventName;
@@ -11,6 +11,7 @@ export interface HubspotEventHandlers {
     onBeforeSubmit?: (arg: HubspotEventData) => void;
     onSubmit?: (arg: HubspotEventData) => void;
     onLoad?: (arg: HubspotEventData) => void;
+    onSubmitError?: (arg: HubspotEventData) => void;
 }
 export declare function loopBackHabspotEvents(formId: string): ({ data, source, origin }: MessageEvent) => void;
 export declare function handleHubspotEvents(handlers: HubspotEventHandlers, formId: string): ({ data }: MessageEvent) => void;

package/build/esm/utils/hubspot.js

@@ -20,7 +20,7 @@ export function loopBackHabspotEvents(formId) {
 }
 export function handleHubspotEvents(handlers, formId) {
     return ({ data }) => {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e;
         if (!isHubspotEventData(data)) {
             return;
         }
@@ -44,6 +44,10 @@ export function handleHubspotEvents(handlers, formId) {
                 (_d = handlers.onSubmit) === null || _d === void 0 ? void 0 : _d.call(handlers, data);
                 break;
             }
+            case 'onFormError': {
+                (_e = handlers.onSubmitError) === null || _e === void 0 ? void 0 : _e.call(handlers, data);
+                break;
+            }
             default:
                 break;
         }

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

@@ -1,3 +1,4 @@
+export * from './analytics';
 export * from './blocks';
 export * from './scroll';
 export * from './url';

package/build/esm/utils/index.js

@@ -1,3 +1,4 @@
+export * from './analytics';
 export * from './blocks';
 export * from './scroll';
 export * from './url';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "1.15.0-alpha.22",
+  "version": "1.15.0-alpha.24",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {
@@ -56,7 +56,8 @@
     "react-waypoint": "^10.1.0",
     "sanitize-html": "^2.6.1",
     "snakecase-keys": "^5.1.0",
-    "typograf": "^6.14.0"
+    "typograf": "^6.14.0",
+    "uuid": "^9.0.0"
   },
   "peerDependencies": {
     "react": "^16.0.0 || ^17.0.0",
@@ -87,6 +88,8 @@
     "@types/react-slick": "^0.23.7",
     "@types/react-transition-group": "^4.4.4",
     "@types/sanitize-html": "^2.6.0",
+    "@types/uuid": "^9.0.0",
+    "es5-ext": "0.10.53",
     "eslint": "^7.32.0",
     "eslint-plugin-local": "./eslint-plugin-local",
     "eslint-plugin-testing-library": "^5.9.1",

package/server/models/common.d.ts

@@ -69,6 +69,17 @@ export declare enum PredefinedEventTypes {
     Play = "play",
     Stop = "stop"
 }
+export declare enum DefaultEventNames {
+    ShareButton = "share-button-click",
+    Button = "button-click",
+    CardBase = "card-base-click",
+    Link = "link-click",
+    ReactPlayerControls = "react-player-controls-click",
+    YandexFormSubmit = "yandex-form-submit",
+    HubspotFormSubmit = "hubspot-form-submit",
+    QuoteButton = "quote-button-click",
+    BackLink = "back-link-click"
+}
 export type AnalyticsCounters = {
     include?: string[];
     exclude?: string[];

package/server/models/common.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PredefinedEventTypes = exports.PixelEventType = exports.Theme = void 0;
+exports.DefaultEventNames = exports.PredefinedEventTypes = exports.PixelEventType = exports.Theme = void 0;
 var Theme;
 (function (Theme) {
     Theme["Light"] = "light";
@@ -36,3 +36,15 @@ var PredefinedEventTypes;
     PredefinedEventTypes["Play"] = "play";
     PredefinedEventTypes["Stop"] = "stop";
 })(PredefinedEventTypes = exports.PredefinedEventTypes || (exports.PredefinedEventTypes = {}));
+var DefaultEventNames;
+(function (DefaultEventNames) {
+    DefaultEventNames["ShareButton"] = "share-button-click";
+    DefaultEventNames["Button"] = "button-click";
+    DefaultEventNames["CardBase"] = "card-base-click";
+    DefaultEventNames["Link"] = "link-click";
+    DefaultEventNames["ReactPlayerControls"] = "react-player-controls-click";
+    DefaultEventNames["YandexFormSubmit"] = "yandex-form-submit";
+    DefaultEventNames["HubspotFormSubmit"] = "hubspot-form-submit";
+    DefaultEventNames["QuoteButton"] = "quote-button-click";
+    DefaultEventNames["BackLink"] = "back-link-click";
+})(DefaultEventNames = exports.DefaultEventNames || (exports.DefaultEventNames = {}));

package/server/models/constructor-items/common.d.ts

@@ -121,7 +121,6 @@ export interface LinkProps extends AnalyticsEventsBase, Stylable {
     target?: string;
     metrikaGoals?: MetrikaGoal;
     pixelEvents?: ButtonPixel;
-    context?: string;
 }
 export interface FileLinkProps extends ClassNameProps {
     href: string;
@@ -141,7 +140,6 @@ export interface ButtonProps extends AnalyticsEventsBase {
     metrikaGoals?: MetrikaGoal;
     pixelEvents?: ButtonPixel;
     target?: string;
-    context?: string;
 }
 export interface ButtonImageProps {
     url: string;
@@ -174,6 +172,7 @@ export interface MediaComponentVideoProps extends AnalyticsEventsBase {
 export interface MediaComponentYoutubeProps {
     youtube: string;
     previewImg?: string;
+    fullScreen?: boolean;
 }
 export interface MediaComponentImageProps {
     image: ImageProps | ImageProps[] | ImageDeviceProps;
@@ -245,27 +244,10 @@ export interface TitleBaseProps {
     custom?: string | ReactNode;
     onClick?: () => void;
 }
-export interface CardData {
-    header?: CardHeader;
-    text?: string;
-    title?: string;
-    link?: LinkProps;
-    footer?: string;
-    url?: string;
-    service?: {
-        slug: string;
-        name: string;
-    };
-    links?: LinkProps[];
-}
 export type CardBorder = 'shadow' | 'line' | 'none';
 export interface CardBaseProps {
     border?: CardBorder;
 }
-export interface CardHeader {
-    title?: string;
-    image?: ImageProps;
-}
 export interface PriceDescriptionProps {
     title: string;
     detailedTitle?: string;

package/server/models/constructor-items/sub-blocks.d.ts

@@ -19,7 +19,11 @@ export declare enum SubBlockType {
      * @deprecated Will be moved to params use BasicCard instead
      */
     TutorialCard = "tutoral-card",
+    /**
+     * @deprecated Use LayoutItem
+     */
     CardWithImage = "card-with-image",
+    LayoutItem = "layout-item",
     BackgroundCard = "background-card",
     BasicCard = "basic-card",
     Content = "content",
@@ -61,6 +65,7 @@ export interface HubspotFormProps extends HubspotEventHandlers, AnalyticsEventsB
     onLoad?: (arg: HubspotEventData) => void;
     pixelEvents?: string | string[] | PixelEvent | PixelEvent[] | ButtonPixel;
     hubspotEvents?: string[];
+    createDOMElement?: boolean;
 }
 export interface PartnerProps extends CardBaseProps {
     text: string;
@@ -125,6 +130,13 @@ export interface CardWithImageProps extends ClassNameProps, Pick<ContentBlockPro
     fullScreen?: boolean;
     links?: CardWithImageLinkProps[];
 }
+export interface LayoutItemProps extends ClassNameProps {
+    content: Omit<ContentBlockProps, 'colSizes' | 'centered' | 'size'>;
+    media: MediaProps;
+    metaInfo?: string[];
+    border?: boolean;
+    fullScreen?: boolean;
+}
 export type DividerModel = {
     type: SubBlockType.Divider;
 } & DividerProps;
@@ -137,6 +149,9 @@ export type NewsCardModel = {
 export type CardWithImageModel = {
     type: SubBlockType.CardWithImage;
 } & CardWithImageProps;
+export type LayoutItemModel = {
+    type: SubBlockType.CardWithImage;
+} & LayoutItemProps;
 export type TutorialCardModel = {
     type: SubBlockType.TutorialCard;
 } & TutorialCardProps;

package/server/models/constructor-items/sub-blocks.js

@@ -17,7 +17,11 @@ var SubBlockType;
      * @deprecated Will be moved to params use BasicCard instead
      */
     SubBlockType["TutorialCard"] = "tutoral-card";
+    /**
+     * @deprecated Use LayoutItem
+     */
     SubBlockType["CardWithImage"] = "card-with-image";
+    SubBlockType["LayoutItem"] = "layout-item";
     SubBlockType["BackgroundCard"] = "background-card";
     SubBlockType["BasicCard"] = "basic-card";
     SubBlockType["Content"] = "content";

package/server/text-transform/blocks.js

@@ -157,6 +157,23 @@ const config = {
             transformer: typografTransformer,
         },
     ],
+    [models_1.SubBlockType.LayoutItem]: [
+        {
+            fields: ['content'],
+            parser: parseContentLayout,
+            transformer: yfmTransformer,
+        },
+        {
+            fields: ['content'],
+            parser: parseContentLayoutTitle,
+            transformer: typografTransformer,
+        },
+        {
+            fields: ['metaInfo'],
+            parser: (0, exports.createItemsParser)([]),
+            transformer: typografTransformer,
+        },
+    ],
     [models_1.SubBlockType.Quote]: {
         fields: ['text'],
         transformer: typografTransformer,

package/server/utils/analytics.d.ts

@@ -0,0 +1,2 @@
+import { AnalyticsCounters } from '../models';
+export declare const isCounterAllowed: (counter: string, counters?: AnalyticsCounters) => boolean;

package/server/utils/analytics.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isCounterAllowed = void 0;
+const isCounterAllowed = (counter, counters) => {
+    var _a, _b;
+    if (!counters) {
+        return true;
+    }
+    if ((_a = counters.exclude) === null || _a === void 0 ? void 0 : _a.includes(counter)) {
+        return false;
+    }
+    else if ((_b = counters.include) === null || _b === void 0 ? void 0 : _b.includes(counter)) {
+        return true;
+    }
+    return false;
+};
+exports.isCounterAllowed = isCounterAllowed;