@gravity-ui/page-constructor 4.51.2-alpha.0 → 4.53.0

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

@@ -590,6 +590,100 @@ export declare const ButtonProps: {
             optionName: string;
         })[];
     };
+    /**
+     * @deprecated Metrika will be deleted
+     */
+    metrikaGoals: {
+        oneOf: ({
+            type: string;
+            optionName: string;
+            items?: undefined;
+        } | {
+            type: string;
+            items: {
+                type: string;
+                additionalProperties?: undefined;
+                required?: undefined;
+                properties?: undefined;
+            };
+            optionName: string;
+        } | {
+            type: string;
+            items: {
+                type: string;
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    name: {
+                        type: string;
+                    };
+                    isCrossSite: {
+                        type: string;
+                    };
+                };
+            };
+            optionName: string;
+        })[];
+    };
+    /**
+     * @deprecated Pixel will be deleted
+     */
+    pixelEvents: {
+        type: string;
+        items: {
+            type: string;
+            required: string[];
+            additionalProperties: boolean;
+            properties: {
+                name: {
+                    type: string;
+                    enum: import("../../models").PixelEventType[];
+                };
+                data: {};
+            };
+            select: {
+                $data: string;
+            };
+            selectCases: {
+                SubmitApplication: {
+                    additionalProperties: boolean;
+                    properties: {
+                        name: {};
+                    };
+                };
+                Contact: {
+                    additionalProperties: boolean;
+                    properties: {
+                        name: {};
+                    };
+                };
+                Lead: {
+                    additionalProperties: boolean;
+                    properties: {
+                        name: {};
+                        data: {
+                            type: string;
+                            additionalProperties: boolean;
+                            properties: {
+                                content_category: {
+                                    type: string;
+                                };
+                                content_name: {
+                                    type: string;
+                                };
+                                currency: {
+                                    type: string;
+                                };
+                                value: {
+                                    type: string;
+                                };
+                            };
+                        };
+                    };
+                };
+            };
+        };
+    };
     analyticsEvents: {
         oneOf: ({
             optionName: string;
@@ -839,6 +933,100 @@ export declare const ButtonBlock: {
                 optionName: string;
             })[];
         };
+        /**
+         * @deprecated Metrika will be deleted
+         */
+        metrikaGoals: {
+            oneOf: ({
+                type: string;
+                optionName: string;
+                items?: undefined;
+            } | {
+                type: string;
+                items: {
+                    type: string;
+                    additionalProperties?: undefined;
+                    required?: undefined;
+                    properties?: undefined;
+                };
+                optionName: string;
+            } | {
+                type: string;
+                items: {
+                    type: string;
+                    additionalProperties: boolean;
+                    required: string[];
+                    properties: {
+                        name: {
+                            type: string;
+                        };
+                        isCrossSite: {
+                            type: string;
+                        };
+                    };
+                };
+                optionName: string;
+            })[];
+        };
+        /**
+         * @deprecated Pixel will be deleted
+         */
+        pixelEvents: {
+            type: string;
+            items: {
+                type: string;
+                required: string[];
+                additionalProperties: boolean;
+                properties: {
+                    name: {
+                        type: string;
+                        enum: import("../../models").PixelEventType[];
+                    };
+                    data: {};
+                };
+                select: {
+                    $data: string;
+                };
+                selectCases: {
+                    SubmitApplication: {
+                        additionalProperties: boolean;
+                        properties: {
+                            name: {};
+                        };
+                    };
+                    Contact: {
+                        additionalProperties: boolean;
+                        properties: {
+                            name: {};
+                        };
+                    };
+                    Lead: {
+                        additionalProperties: boolean;
+                        properties: {
+                            name: {};
+                            data: {
+                                type: string;
+                                additionalProperties: boolean;
+                                properties: {
+                                    content_category: {
+                                        type: string;
+                                    };
+                                    content_name: {
+                                        type: string;
+                                    };
+                                    currency: {
+                                        type: string;
+                                    };
+                                    value: {
+                                        type: string;
+                                    };
+                                };
+                            };
+                        };
+                    };
+                };
+            };
+        };
         analyticsEvents: {
             oneOf: ({
                 optionName: string;

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

@@ -4,6 +4,7 @@ exports.BlockHeaderProps = exports.CardBase = exports.BorderProps = exports.MapP
 const schema_1 = require("../../components/Image/schema");
 const models_1 = require("../../models");
 const event_1 = require("./event");
+const pixel_1 = require("./pixel");
 exports.mediaDirection = ['media-content', 'content-media'];
 exports.textSize = ['s', 'm', 'l'];
 exports.containerSizesArray = ['sm', 'md', 'lg', 'xl', 'all'];
@@ -367,6 +368,36 @@ exports.ButtonProps = {
             },
         ],
     },
+    /**
+     * @deprecated Metrika will be deleted
+     */
+    metrikaGoals: {
+        oneOf: [
+            { type: 'string', optionName: 'single' },
+            { type: 'array', items: { type: 'string' }, optionName: 'list' },
+            {
+                type: 'array',
+                items: {
+                    type: 'object',
+                    additionalProperties: false,
+                    required: ['name'],
+                    properties: {
+                        name: {
+                            type: 'string',
+                        },
+                        isCrossSite: {
+                            type: 'boolean',
+                        },
+                    },
+                },
+                optionName: 'list-extended',
+            },
+        ],
+    },
+    /**
+     * @deprecated Pixel will be deleted
+     */
+    pixelEvents: pixel_1.pixelEvents,
     analyticsEvents: {
         oneOf: [
             Object.assign(Object.assign({}, event_1.AnalyticsEventSchema), { optionName: 'single' }),

package/build/cjs/schema/validators/index.d.ts

@@ -2,6 +2,7 @@ import * as blocks from './blocks';
 import * as common from './common';
 import * as components from './components';
 import * as navigation from './navigation';
+import * as pixel from './pixel';
 import * as subBlocks from './sub-blocks';
 import * as utils from './utils';
 export declare const validators: {
@@ -9,6 +10,7 @@ export declare const validators: {
     common: typeof common;
     components: typeof components;
     subBlocks: typeof subBlocks;
+    pixel: typeof pixel;
     utils: typeof utils;
     navigation: typeof navigation;
 };

package/build/cjs/schema/validators/index.js

@@ -6,6 +6,7 @@ const blocks = tslib_1.__importStar(require("./blocks"));
 const common = tslib_1.__importStar(require("./common"));
 const components = tslib_1.__importStar(require("./components"));
 const navigation = tslib_1.__importStar(require("./navigation"));
+const pixel = tslib_1.__importStar(require("./pixel"));
 const subBlocks = tslib_1.__importStar(require("./sub-blocks"));
 const utils = tslib_1.__importStar(require("./utils"));
 exports.validators = {
@@ -13,6 +14,7 @@ exports.validators = {
     common,
     components,
     subBlocks,
+    pixel,
     utils,
     navigation,
 };

package/build/cjs/schema/validators/pixel.d.ts

@@ -0,0 +1,57 @@
+import { PixelEventType } from '../../models';
+export declare const pixelEvents: {
+    type: string;
+    items: {
+        type: string;
+        required: string[];
+        additionalProperties: boolean;
+        properties: {
+            name: {
+                type: string;
+                enum: PixelEventType[];
+            };
+            data: {};
+        };
+        select: {
+            $data: string;
+        };
+        selectCases: {
+            SubmitApplication: {
+                additionalProperties: boolean;
+                properties: {
+                    name: {};
+                };
+            };
+            Contact: {
+                additionalProperties: boolean;
+                properties: {
+                    name: {};
+                };
+            };
+            Lead: {
+                additionalProperties: boolean;
+                properties: {
+                    name: {};
+                    data: {
+                        type: string;
+                        additionalProperties: boolean;
+                        properties: {
+                            content_category: {
+                                type: string;
+                            };
+                            content_name: {
+                                type: string;
+                            };
+                            currency: {
+                                type: string;
+                            };
+                            value: {
+                                type: string;
+                            };
+                        };
+                    };
+                };
+            };
+        };
+    };
+};

package/build/cjs/schema/validators/pixel.js

@@ -0,0 +1,63 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.pixelEvents = void 0;
+const models_1 = require("../../models");
+const LeadData = {
+    Lead: {
+        additionalProperties: false,
+        properties: {
+            name: {},
+            data: {
+                type: 'object',
+                additionalProperties: false,
+                properties: {
+                    content_category: {
+                        type: 'string',
+                    },
+                    content_name: {
+                        type: 'string',
+                    },
+                    currency: {
+                        type: 'string',
+                    },
+                    value: {
+                        type: 'number',
+                    },
+                },
+            },
+        },
+    },
+};
+const ContactData = {
+    Contact: {
+        additionalProperties: false,
+        properties: {
+            name: {},
+        },
+    },
+};
+const SubmitApplicationData = {
+    SubmitApplication: {
+        additionalProperties: false,
+        properties: {
+            name: {},
+        },
+    },
+};
+exports.pixelEvents = {
+    type: 'array',
+    items: {
+        type: 'object',
+        required: ['name'],
+        additionalProperties: false,
+        properties: {
+            name: {
+                type: 'string',
+                enum: Object.values(models_1.PixelEventType),
+            },
+            data: {},
+        },
+        select: { $data: '0/name' },
+        selectCases: Object.assign(Object.assign(Object.assign({}, LeadData), ContactData), SubmitApplicationData),
+    },
+};

package/build/cjs/schema/validators/sub-blocks.d.ts

@@ -8,3 +8,4 @@ export * from '../../sub-blocks/Divider/schema';
 export * from '../../sub-blocks/BasicCard/schema';
 export * from '../../sub-blocks/PriceCard/schema';
 export * from '../../sub-blocks/HubspotForm/schema';
+export * from '../../sub-blocks/ImageCard/schema';

package/build/cjs/schema/validators/sub-blocks.js

@@ -11,3 +11,4 @@ tslib_1.__exportStar(require("../../sub-blocks/Divider/schema"), exports);
 tslib_1.__exportStar(require("../../sub-blocks/BasicCard/schema"), exports);
 tslib_1.__exportStar(require("../../sub-blocks/PriceCard/schema"), exports);
 tslib_1.__exportStar(require("../../sub-blocks/HubspotForm/schema"), exports);
+tslib_1.__exportStar(require("../../sub-blocks/ImageCard/schema"), exports);

package/build/cjs/sub-blocks/BasicCard/BasicCard.js

@@ -10,12 +10,12 @@ const utils_1 = require("../../utils");
 const Content_1 = tslib_1.__importDefault(require("../Content/Content"));
 const b = (0, utils_1.block)('basic-card');
 const BasicCard = (props) => {
-    const { title, text, icon, additionalInfo, links, buttons, iconPosition = sub_blocks_1.IconPosition.Top } = props, cardParams = tslib_1.__rest(props, ["title", "text", "icon", "additionalInfo", "links", "buttons", "iconPosition"]);
+    const { title, text, icon, additionalInfo, links, list, buttons, iconPosition = sub_blocks_1.IconPosition.Top } = props, cardParams = tslib_1.__rest(props, ["title", "text", "icon", "additionalInfo", "links", "list", "buttons", "iconPosition"]);
     const titleId = (0, uikit_1.useUniqId)();
     const descriptionId = (0, uikit_1.useUniqId)();
     return (react_1.default.createElement(CardBase_1.default, Object.assign({ className: b() }, cardParams, { extraProps: { 'aria-describedby': descriptionId, 'aria-labelledby': titleId } }),
         react_1.default.createElement(CardBase_1.default.Content, null,
             react_1.default.createElement(IconWrapper_1.default, { icon: icon ? { value: icon, position: iconPosition } : undefined },
-                react_1.default.createElement(Content_1.default, { title: title, titleId: titleId, text: text, textId: descriptionId, additionalInfo: additionalInfo, links: links, buttons: buttons, size: "s", colSizes: { all: 12, md: 12 } })))));
+                react_1.default.createElement(Content_1.default, { title: title, titleId: titleId, text: text, textId: descriptionId, additionalInfo: additionalInfo, links: links, list: list, buttons: buttons, size: "s", colSizes: { all: 12, md: 12 } })))));
 };
 exports.default = BasicCard;

package/build/cjs/sub-blocks/HubspotForm/index.js

@@ -5,14 +5,16 @@ const react_1 = tslib_1.__importStar(require("react"));
 const mobileContext_1 = require("../../context/mobileContext");
 const theme_1 = require("../../context/theme");
 const hooks_1 = require("../../hooks");
+const useMetrika_1 = require("../../hooks/useMetrika");
 const models_1 = require("../../models");
 const utils_1 = require("../../utils");
 const HubspotFormContainer_1 = tslib_1.__importDefault(require("./HubspotFormContainer"));
 const b = (0, utils_1.block)('hubspot-form');
 const HubspotForm = (0, react_1.forwardRef)((props, ref) => {
-    const { className, theme: themeProp, isMobile: isMobileProp, formId, formInstanceId, portalId, region, formClassName, 
+    const { className, theme: themeProp, isMobile: isMobileProp, formId, formInstanceId, portalId, region, formClassName, pixelEvents, 
     // hubspotEvents, // TODO: decide how to handle them
     analyticsEvents, onBeforeSubmit, onSubmit, onBeforeLoad, onLoad, createDOMElement, onSubmitError, } = props;
+    const handleMetrika = (0, useMetrika_1.useMetrika)();
     const themeValue = (0, theme_1.useTheme)();
     const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.HubspotFormSubmit);
     const isMobileValue = (0, react_1.useContext)(mobileContext_1.MobileContext);
@@ -24,6 +26,7 @@ const HubspotForm = (0, react_1.forwardRef)((props, ref) => {
         onLoad,
         onSubmitError,
         onSubmit: (event) => {
+            handleMetrika === null || handleMetrika === void 0 ? void 0 : handleMetrika({ pixelEvents });
             handleAnalytics(analyticsEvents);
             onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(event);
         },
@@ -31,6 +34,8 @@ const HubspotForm = (0, react_1.forwardRef)((props, ref) => {
         onBeforeLoad,
         onBeforeSubmit,
         onLoad,
+        handleMetrika,
+        pixelEvents,
         handleAnalytics,
         analyticsEvents,
         onSubmit,

package/build/cjs/sub-blocks/ImageCard/ImageCard.css

@@ -0,0 +1,59 @@
+.pc-image-card_border_shadow {
+  box-shadow: 0px 4px 24px var(--pc-color-sfx-shadow), 0px 2px 8px var(--pc-color-sfx-shadow);
+}
+
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-image-card {
+  min-height: 248px;
+  height: 100%;
+  overflow-x: hidden;
+  border-radius: var(--pc-border-radius);
+  background-color: var(--g-color-base-float);
+  transition: box-shadow 0.3s cubic-bezier(0.22, 0.61, 0.36, 1);
+  min-height: 1px;
+}
+.pc-image-card_border_line {
+  border: 1px solid var(--g-color-line-generic);
+}
+.pc-image-card .pc-image-card__content {
+  padding: 32px;
+}
+.pc-image-card .pc-image-card__image_inner {
+  width: 100%;
+  display: block;
+}
+.pc-image-card .pc-image-card__image_inner_radius {
+  border-radius: var(--pc-border-radius);
+}
+.pc-image-card .pc-image-card__image_margins_s {
+  padding: 4px;
+}
+.pc-image-card .pc-image-card__image_margins_s .pc-image-card__image_inner {
+  border-radius: calc(var(--pc-border-radius) - var(--pc-image-padding));
+}
+.pc-image-card .pc-image-card__image_margins_m {
+  padding: 32px;
+}
+.pc-image-card .pc-image-card__image_margins_m .pc-image-card__image_inner {
+  border-radius: initial;
+}
+.pc-image-card_with-content {
+  display: flex;
+  flex-direction: column;
+}
+.pc-image-card_with-content.pc-image-card_direction_direct .pc-image-card__image {
+  padding-bottom: 0;
+}
+.pc-image-card_with-content.pc-image-card_direction_direct .pc-image-card__content {
+  padding-top: 24px;
+}
+.pc-image-card_with-content.pc-image-card_direction_reverse {
+  flex-direction: column-reverse;
+}
+.pc-image-card_with-content.pc-image-card_direction_reverse .pc-image-card__image {
+  padding-top: 0;
+}
+.pc-image-card_with-content.pc-image-card_direction_reverse .pc-image-card__content {
+  padding-bottom: 24px;
+}

package/build/cjs/sub-blocks/ImageCard/ImageCard.d.ts

@@ -0,0 +1,3 @@
+import { ImageCardProps } from '../../models';
+declare const ImageCard: (props: ImageCardProps) => JSX.Element;
+export default ImageCard;

package/build/cjs/sub-blocks/ImageCard/ImageCard.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const components_1 = require("../../components");
+const utils_1 = require("../../components/Media/Image/utils");
+const models_1 = require("../../models");
+const utils_2 = require("../../utils");
+const Content_1 = tslib_1.__importDefault(require("../Content/Content"));
+const b = (0, utils_2.block)('image-card');
+const ImageCard = (props) => {
+    const { border = 'shadow', title, text, image, enableImageBorderRadius = false, direction = models_1.ImageCardDirection.Direct, margins, backgroundColor, } = props;
+    const hasContent = Boolean(text || title);
+    const imageProps = (0, utils_1.getMediaImage)(image);
+    return (react_1.default.createElement("div", { className: b({ border, 'with-content': hasContent, direction }), style: { backgroundColor } },
+        react_1.default.createElement("div", { className: b('image', { margins }) },
+            react_1.default.createElement(components_1.Image, Object.assign({ className: b('image_inner', { radius: enableImageBorderRadius }) }, imageProps))),
+        hasContent && (react_1.default.createElement("div", { className: b('content') },
+            react_1.default.createElement(Content_1.default, { title: title, text: text, colSizes: { all: 12, md: 12 }, size: "s" })))));
+};
+exports.default = ImageCard;

package/build/cjs/sub-blocks/ImageCard/schema.d.ts

@@ -0,0 +1,78 @@
+export declare const ImageCard: {
+    'image-card': {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            image: {
+                oneOf: ({
+                    type: string;
+                    properties: {
+                        when: {
+                            type: string;
+                        };
+                    };
+                } | {
+                    type: string;
+                    pattern: string;
+                    optionName: string;
+                })[];
+            };
+            direction: {
+                type: string;
+                enum: string[];
+            };
+            margins: {
+                type: string;
+                enum: string[];
+            };
+            backgroundColor: {
+                type: string;
+            };
+            title: {
+                oneOf: ({
+                    type: string;
+                    contentType: string;
+                    optionName: string;
+                } | {
+                    optionName: string;
+                    type: string;
+                    additionalProperties: boolean;
+                    required: string[];
+                    properties: {
+                        text: {
+                            type: string;
+                            contentType: string;
+                        };
+                        textSize: {
+                            type: string;
+                            enum: string[];
+                        };
+                        url: {
+                            type: string;
+                        };
+                        urlTitle: {
+                            type: string;
+                        };
+                        resetMargin: {
+                            type: string;
+                        };
+                    };
+                    contentType?: undefined;
+                })[];
+            };
+            text: {
+                type: string;
+                contentType: string;
+                inputType: string;
+            };
+            border: {
+                type: string;
+                enum: string[];
+            };
+            type: {};
+            when: {
+                type: string;
+            };
+        };
+    };
+};

package/build/cjs/sub-blocks/ImageCard/schema.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ImageCard = void 0;
+const tslib_1 = require("tslib");
+const pick_1 = tslib_1.__importDefault(require("lodash/pick"));
+const common_1 = require("../../schema/validators/common");
+const components_1 = require("../../schema/validators/components");
+const schema_1 = require("../Content/schema");
+const ImageCardBlockContentProps = (0, pick_1.default)(schema_1.ContentBase, ['title', 'text']);
+exports.ImageCard = {
+    'image-card': {
+        additionalProperties: false,
+        required: ['image'],
+        properties: Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), ImageCardBlockContentProps), { image: components_1.ImageProps, direction: {
+                type: 'string',
+                enum: ['direct', 'reverse'],
+            }, margins: {
+                type: 'string',
+                enum: ['s', 'm'],
+            }, backgroundColor: {
+                type: 'string',
+            } }),
+    },
+};

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

@@ -8,8 +8,22 @@ export declare const getLayoutItemLinks: (links: LayoutItemProps['content']['lin
     colorTheme?: import("../../models").TextTheme | undefined;
     arrow?: boolean | undefined;
     target?: string | undefined;
+    metrikaGoals?: import("../../models").MetrikaGoal | undefined;
+    pixelEvents?: import("../../models").ButtonPixel | undefined;
     extraProps?: import("react").HTMLProps<HTMLAnchorElement> | undefined;
-    analyticsEvents?: import("../../models").AnalyticsEventsProp | 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;
     tabIndex?: number | undefined;
 }[] | undefined;