@gravity-ui/page-constructor 1.15.0-alpha.9 → 1.15.0

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

@@ -414,9 +414,6 @@ export declare const ButtonProps: {
             };
         })[];
     };
-    /**
-     * @deprecated Metrika will be deleted
-     */
     metrikaGoals: {
         anyOf: ({
             type: string;
@@ -446,9 +443,6 @@ export declare const ButtonProps: {
             };
         })[];
     };
-    /**
-     * @deprecated Pixel will be deleted
-     */
     pixelEvents: {
         type: string;
         items: {
@@ -505,84 +499,6 @@ export declare const ButtonProps: {
             };
         };
     };
-    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;
-                            };
-                        };
-                    };
-                };
-                blockName: {
-                    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;
-                                };
-                            };
-                        };
-                    };
-                    blockName: {
-                        type: string;
-                    };
-                };
-            };
-        })[];
-    };
     target: {
         type: string;
         enum: string[];
@@ -642,9 +558,6 @@ export declare const BlockBaseProps: {
     resetPaddings: {
         type: string;
     };
-    blockName: {
-        type: string;
-    };
     type: {};
     when: {};
 };
@@ -716,9 +629,6 @@ export declare const ButtonBlock: {
                 };
             })[];
         };
-        /**
-         * @deprecated Metrika will be deleted
-         */
         metrikaGoals: {
             anyOf: ({
                 type: string;
@@ -748,9 +658,6 @@ export declare const ButtonBlock: {
                 };
             })[];
         };
-        /**
-         * @deprecated Pixel will be deleted
-         */
         pixelEvents: {
             type: string;
             items: {
@@ -807,84 +714,6 @@ export declare const ButtonBlock: {
                 };
             };
         };
-        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;
-                                };
-                            };
-                        };
-                    };
-                    blockName: {
-                        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;
-                                    };
-                                };
-                            };
-                        };
-                        blockName: {
-                            type: string;
-                        };
-                    };
-                };
-            })[];
-        };
         target: {
             type: string;
             enum: string[];

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

@@ -1,7 +1,6 @@
 import { pixelEvents } from './pixel';
 import { Theme } from '../../models';
 import { ImageProps, urlPattern } from '../../components/Image/schema';
-import { AnalyticsEventSchema } from './event';
 export const mediaDirection = ['media-content', 'content-media'];
 export const textSize = ['s', 'm', 'l'];
 export const containerSizesArray = ['sm', 'md', 'lg', 'xl', 'all'];
@@ -307,9 +306,6 @@ export const ButtonProps = {
             },
         ],
     },
-    /**
-     * @deprecated Metrika will be deleted
-     */
     metrikaGoals: {
         anyOf: [
             { type: 'string' },
@@ -332,13 +328,7 @@ export const ButtonProps = {
             },
         ],
     },
-    /**
-     * @deprecated Pixel will be deleted
-     */
     pixelEvents,
-    analyticsEvents: {
-        anyOf: [AnalyticsEventSchema, { type: 'array', items: AnalyticsEventSchema }],
-    },
     target: {
         type: 'string',
         enum: ['_self', '_blank', '_parent', '_top'],
@@ -386,8 +376,6 @@ export const BlockBaseProps = Object.assign(Object.assign({}, BaseProps), { anch
         enum: containerSizesArray,
     }, resetPaddings: {
         type: 'boolean',
-    }, blockName: {
-        type: 'string',
     } });
 export const TitleProps = {
     type: 'object',

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

@@ -6,6 +6,7 @@ export * from '../../sub-blocks/NewsCard/schema';
 export * from '../../sub-blocks/Partner/schema';
 export * from '../../sub-blocks/TutorialCard/schema';
 export * from '../../sub-blocks/CardWithImage/schema';
+export * from '../../sub-blocks/LayoutItem/schema';
 export * from '../../sub-blocks/Quote/schema';
 export * from '../../sub-blocks/Divider/schema';
 export * from '../../sub-blocks/BasicCard/schema';

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

@@ -6,6 +6,7 @@ export * from '../../sub-blocks/NewsCard/schema';
 export * from '../../sub-blocks/Partner/schema';
 export * from '../../sub-blocks/TutorialCard/schema';
 export * from '../../sub-blocks/CardWithImage/schema';
+export * from '../../sub-blocks/LayoutItem/schema';
 export * from '../../sub-blocks/Quote/schema';
 export * from '../../sub-blocks/Divider/schema';
 export * from '../../sub-blocks/BasicCard/schema';

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

@@ -1,13 +1,12 @@
 import React, { useContext } from 'react';
 import { block, getThemedValue } from '../../utils';
 import { CardBase, BackgroundImage } from '../../components/';
-import { SubBlockType } from '../../models';
 import Content from '../Content/Content';
 import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
 import './BackgroundCard.css';
 const b = block('background-card');
 const BackgroundCard = (props) => {
-    const { url, title, text, border, background, paddingBottom, backgroundColor, additionalInfo, theme: cardTheme = 'default', links, buttons, blockName = SubBlockType.BackgroundCard, } = props;
+    const { url, title, text, border, background, paddingBottom, backgroundColor, additionalInfo, theme: cardTheme = 'default', links, buttons, } = props;
     const { themeValue: theme } = useContext(ThemeValueContext);
     const hasBackgroundColor = backgroundColor || cardTheme !== 'default';
     const link = hasBackgroundColor || border === 'line' ? undefined : url;
@@ -15,6 +14,6 @@ const BackgroundCard = (props) => {
     return (React.createElement(CardBase, { className: b({ padding: paddingBottom, theme: cardTheme }), url: link, border: borderType },
         React.createElement(CardBase.Content, null,
             React.createElement(BackgroundImage, Object.assign({ className: b('image') }, getThemedValue(background, theme), { style: { backgroundColor } })),
-            React.createElement(Content, { title: title, text: text, additionalInfo: additionalInfo, size: "s", theme: cardTheme, links: links, buttons: buttons, colSizes: { all: 12, md: 12 }, blockName: blockName }))));
+            React.createElement(Content, { title: title, text: text, additionalInfo: additionalInfo, size: "s", theme: cardTheme, links: links, buttons: buttons, colSizes: { all: 12, md: 12 } }))));
 };
 export default BackgroundCard;

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

@@ -38,9 +38,6 @@ export declare const BackgroundCard: {
                 type: string;
                 enum: string[];
             };
-            blockName: {
-                type: string;
-            };
             title: {
                 oneOf: ({
                     type: string;

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

@@ -14,8 +14,6 @@ export const BackgroundCard = {
             }, paddingBottom: {
                 type: 'string',
                 enum: ['s', 'm', 'l', 'xl'],
-            }, blockName: {
-                type: 'string',
             } }),
     },
 };

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

@@ -1,12 +1,11 @@
 import React, { useContext } from 'react';
 import { block, getThemedValue } from '../../utils';
-import { SubBlockType } from '../../models';
 import { Button, YFMWrapper, BackgroundImage, HTML } from '../../components';
 import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
 import './BannerCard.css';
 const b = block('banner-card');
 export const BannerCard = (props) => {
-    const { title, subtitle, button: { url, text, target }, color, theme: textTheme = 'light', image, disableCompress, blockName = SubBlockType.BannerCard, } = props;
+    const { title, subtitle, button: { url, text, target }, color, theme: textTheme = 'light', image, disableCompress, } = props;
     const { themeValue: theme } = useContext(ThemeValueContext);
     const contentStyle = {};
     if (color) {
@@ -19,7 +18,7 @@ export const BannerCard = (props) => {
                     React.createElement("h2", { className: b('title') },
                         React.createElement(HTML, null, title)),
                     subtitle && (React.createElement(YFMWrapper, { className: b('subtitle'), content: subtitle, modifiers: { constructor: true } }))),
-                React.createElement(Button, { className: b('button'), theme: "raised", size: "xl", text: text, url: url, target: target, blockName: blockName })),
+                React.createElement(Button, { className: b('button'), theme: "raised", size: "xl", text: text, url: url, target: target })),
             React.createElement(BackgroundImage, { className: b('image'), src: getThemedValue(image, theme), disableCompress: disableCompress }))));
 };
 export default BannerCard;

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

@@ -1,18 +1,17 @@
 import React from 'react';
 import { block } from '../../utils';
 import CardBase from '../../components/CardBase/CardBase';
-import { SubBlockType } from '../../models';
 import Image from '../../components/Image/Image';
 import { Content } from '../';
 import { getMediaImage } from '../../components/Media/Image/utils';
 import './BasicCard.css';
 const b = block('basic-card');
 const BasicCard = (props) => {
-    const { url, title, text, border, icon, additionalInfo, links, buttons, blockName = SubBlockType.BasicCard, } = props;
+    const { url, title, text, border, icon, additionalInfo, links, buttons } = props;
     const iconProps = icon && getMediaImage(icon);
     return (React.createElement(CardBase, { className: b(), url: url, border: border },
         React.createElement(CardBase.Content, null,
             iconProps && React.createElement(Image, Object.assign({}, iconProps, { className: b('icon') })),
-            React.createElement(Content, { title: title, text: text, additionalInfo: additionalInfo, links: links, buttons: buttons, colSizes: { all: 12, md: 12 }, size: "s", blockName: blockName }))));
+            React.createElement(Content, { title: title, text: text, additionalInfo: additionalInfo, links: links, buttons: buttons, colSizes: { all: 12, md: 12 }, size: "s" }))));
 };
 export default BasicCard;

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

@@ -1,4 +1,4 @@
 import { CardWithImageProps } from '../../models';
 import './CardWithImage.css';
-declare const CardWithImage: ({ title, description, image, disableCompress, links, border, fullScreen, className, additionalInfo, buttons, blockName, }: CardWithImageProps) => JSX.Element;
+declare const CardWithImage: ({ title, description, image, disableCompress, links, border, fullScreen, className, additionalInfo, buttons, }: CardWithImageProps) => JSX.Element;
 export default CardWithImage;

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

@@ -1,15 +1,14 @@
 import React from 'react';
 import { block } from '../../utils';
-import { SubBlockType } from '../../models';
 import { Image, FullscreenImage } from '../../components';
 import { Content } from '../';
 import './CardWithImage.css';
 const b = block('card-with-image');
-const CardWithImage = ({ title, description, image, disableCompress, links, border, fullScreen, className, additionalInfo, buttons, blockName = SubBlockType.CardWithImage, }) => {
+const CardWithImage = ({ title, description, image, disableCompress, links, border, fullScreen, className, additionalInfo, buttons, }) => {
     const unifiedLinks = links === null || links === void 0 ? void 0 : links.map((link) => (Object.assign(Object.assign({ theme: 'normal' }, link), { text: link.title, url: link.link })));
     return (React.createElement("div", { className: b(null, className) },
         React.createElement("div", { className: b('image', { border }) }, fullScreen ? (React.createElement(FullscreenImage, { src: image, imageClassName: b('image-item'), disableCompress: disableCompress })) : (React.createElement(Image, { className: b('image-item'), src: image, alt: 'card-image', disableCompress: disableCompress }))),
         React.createElement("div", { className: b('content') },
-            React.createElement(Content, { title: title, text: description, links: unifiedLinks, additionalInfo: additionalInfo, buttons: buttons, size: "s", colSizes: { all: 12, md: 12 }, blockName: blockName }))));
+            React.createElement(Content, { title: title, text: description, links: unifiedLinks, additionalInfo: additionalInfo, buttons: buttons, size: "s", colSizes: { all: 12, md: 12 } }))));
 };
 export default CardWithImage;

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

@@ -1,7 +1,6 @@
 import { __rest } from "tslib";
 import React from 'react';
 import { block } from '../../utils';
-import { SubBlockType, } from '../../models';
 import { Title, YFMWrapper, Button } from '../../components';
 import LinkBlock from '../../components/Link/Link';
 import { Col } from '../../grid';
@@ -35,7 +34,7 @@ function getButtonSize(size) {
     }
 }
 const Content = (props) => {
-    const { title, text, additionalInfo, size = 'l', links, buttons, colSizes = { all: 12, sm: 8 }, centered, theme, className, blockName = SubBlockType.Content, } = props;
+    const { title, text, additionalInfo, size = 'l', links, buttons, colSizes = { all: 12, sm: 8 }, centered, theme, className, } = props;
     const titleProps = __rest(!title || typeof title === 'string'
         ? { text: title, textSize: getTextSize(size) }
         : title, []);
@@ -50,7 +49,7 @@ const Content = (props) => {
                     'constructor-notice': true,
                     [`constructor-size-${size}`]: true,
                 } }))),
-        links && (React.createElement("div", { className: b('links') }, links.map((link) => (React.createElement(LinkBlock, Object.assign({ className: b('link') }, link, { textSize: getLinkSize(size), key: link.url, blockName: blockName })))))),
-        buttons && (React.createElement("div", { className: b('buttons') }, buttons.map((item) => (React.createElement(Button, Object.assign({ className: b('button') }, item, { key: item.url, size: getButtonSize(size), blockName: blockName }))))))));
+        links && (React.createElement("div", { className: b('links') }, links.map((link) => (React.createElement(LinkBlock, Object.assign({ className: b('link') }, link, { textSize: getLinkSize(size), key: link.url })))))),
+        buttons && (React.createElement("div", { className: b('buttons') }, buttons.map((item) => (React.createElement(Button, Object.assign({ className: b('button') }, item, { key: item.url, size: getButtonSize(size) }))))))));
 };
 export default Content;

package/build/esm/sub-blocks/HubspotForm/HubspotForm.css

@@ -46,7 +46,7 @@ unpredictable css rules order in build */
   color: var(--yc-color-text-primary);
   background-color: transparent;
   border: 1px solid var(--yc-color-line-generic);
-  border-radius: 6px;
+  border-radius: var(--yc-border-radius-l);
 }
 .pc-hubspot-form .hs-form-field .input input[type=text]:hover,
 .pc-hubspot-form .hs-form-field .input input[type=number]:hover,
@@ -276,7 +276,7 @@ unpredictable css rules order in build */
   box-sizing: border-box;
   height: 44px;
   padding: 0 20px;
-  border-radius: 8px;
+  border-radius: var(--yc-border-radius-xl);
   background-color: var(--yc-color-base-special);
   color: var(--yc-my-color-brand-text-contrast);
   line-height: 44px;

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

@@ -3,21 +3,15 @@ import { block } from '../../utils';
 import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
 import { MobileContext } from '../../context/mobileContext';
 import { useMetrika } from '../../hooks/useMetrika';
-import { PredefinedEventTypes, SubBlockType } from '../../models';
-import { useHandleHubspotEvents, useAnalytics } from '../../hooks';
+import { useHandleHubspotEvents } from '../../hooks';
 import HubspotFormContainer from './HubspotFormContainer';
 import './HubspotForm.css';
 const b = block('hubspot-form');
 const HubspotForm = (props) => {
     const { className, theme: themeProp, isMobile: isMobileProp, formId, formInstanceId, portalId, region, formClassName, pixelEvents, 
     // hubspotEvents, // TODO: decide how to handle them
-    analyticsEvents, onBeforeSubmit, onSubmit, onBeforeLoad, onLoad, blockName = SubBlockType.HubspotForm, } = props;
+    onBeforeSubmit, onSubmit, onBeforeLoad, onLoad, onSubmitError, } = props;
     const handleMetrika = useMetrika();
-    const handleAnalytics = useAnalytics({
-        name: 'hubspot-form-submit',
-        type: PredefinedEventTypes.Default,
-        blockName: blockName,
-    });
     const { themeValue } = useContext(ThemeValueContext);
     const isMobileValue = useContext(MobileContext);
     const theme = themeProp !== null && themeProp !== void 0 ? themeProp : themeValue;
@@ -26,21 +20,12 @@ const HubspotForm = (props) => {
         onBeforeLoad,
         onBeforeSubmit,
         onLoad,
+        onSubmitError,
         onSubmit: (e) => {
             handleMetrika === null || handleMetrika === void 0 ? void 0 : handleMetrika({ pixelEvents });
-            handleAnalytics === null || handleAnalytics === void 0 ? void 0 : handleAnalytics(analyticsEvents);
             onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(e);
         },
-    }), [
-        onBeforeLoad,
-        onBeforeSubmit,
-        onLoad,
-        handleMetrika,
-        pixelEvents,
-        handleAnalytics,
-        analyticsEvents,
-        onSubmit,
-    ]);
+    }), [onBeforeLoad, onBeforeSubmit, onLoad, handleMetrika, pixelEvents, onSubmit, onSubmitError]);
     useHandleHubspotEvents(handlers, formId);
     return (React.createElement(HubspotFormContainer, { key: [formClassName, formId, formInstanceId, portalId, region].join(), className: b({ theme, mobile }, className), formClassName: formClassName, formId: formId, portalId: portalId, formInstanceId: formInstanceId, region: region }));
 };

package/build/esm/sub-blocks/LayoutItem/LayoutItem.css

@@ -0,0 +1,16 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-layout-item__media {
+  width: 100%;
+  display: block;
+  border-radius: var(--pc-border-radius);
+}
+.pc-layout-item__media_border {
+  border: 1px solid var(--yc-color-line-generic);
+}
+.pc-layout-item__meta-info {
+  margin: 16px 0 -8px 0;
+}
+.pc-layout-item__content {
+  margin: 16px 16px 0 0;
+}

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

@@ -0,0 +1,4 @@
+import { LayoutItemProps } from '../../models';
+import './LayoutItem.css';
+declare const LayoutItem: ({ content: { links, ...content }, metaInfo, media, border, fullScreen, className, }: LayoutItemProps) => JSX.Element;
+export default LayoutItem;

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

@@ -0,0 +1,20 @@
+import { __rest } from "tslib";
+import React from 'react';
+import { block } from '../../utils';
+import { FullScreenMedia, Media, MetaInfo } from '../../components';
+import { getLayoutItemLinks, hasFullScreen, showFullScreenIcon } from './utils';
+import { Content } from '..';
+import './LayoutItem.css';
+const b = block('layout-item');
+const LayoutItem = (_a) => {
+    var _b = _a.content, { links } = _b, content = __rest(_b, ["links"]), { metaInfo, media, border, fullScreen, className } = _a;
+    return (React.createElement("div", { className: b(null, className) },
+        fullScreen && hasFullScreen(media) ? (React.createElement(FullScreenMedia, { showFullScreenIcon: showFullScreenIcon(media) }, (_a = {}) => {
+            var { className: mediaClassName } = _a, fullScreenMediaProps = __rest(_a, ["className"]);
+            return (React.createElement(Media, Object.assign({}, media, fullScreenMediaProps, { className: b('media', { border }, mediaClassName) })));
+        })) : (React.createElement(Media, Object.assign({}, media, { className: b('media', { border }) }))),
+        metaInfo && React.createElement(MetaInfo, { items: metaInfo, className: b('meta-info') }),
+        React.createElement("div", { className: b('content') },
+            React.createElement(Content, Object.assign({}, content, { links: getLayoutItemLinks(links), size: "s", colSizes: { all: 12, md: 12 } })))));
+};
+export default LayoutItem;