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

package/build/esm/models/constructor-items/blocks.d.ts

@@ -109,7 +109,6 @@ export interface HeaderBlockProps {
     verticalOffset?: 's' | 'm' | 'l' | 'xl';
     breadcrumbs?: HeaderBreadCrumbsProps;
     status?: JSX.Element;
-    context?: string;
 }
 export type CalculatorProps = Animatable;
 export interface SimpleBlockProps extends Animatable, Childable {
@@ -128,7 +127,6 @@ export interface ExtendedFeaturesProps extends Animatable {
     title?: TitleProps | string;
     description?: string;
     colSizes?: GridColumnSizesType;
-    context?: string;
 }
 export interface PromoFeaturesItem {
     title: string;
@@ -141,7 +139,6 @@ export interface PromoFeaturesProps extends Animatable {
     title?: TitleProps | string;
     description?: string;
     theme?: 'grey' | 'default';
-    context?: string;
 }
 export interface QuestionItem {
     title: string;
@@ -166,7 +163,6 @@ export interface MediaContentProps {
     links?: LinkProps[];
     buttons?: ButtonProps[];
     size?: ContentSize;
-    context?: string;
 }
 export interface MediaBlockProps extends Animatable, MediaContentProps {
     media: ThemeSupporting<MediaProps>;
@@ -184,7 +180,6 @@ export interface PreviewBlockProps extends Animatable {
     ratioMediaContent?: PreviewRatioMediaContent;
     stopVideo?: boolean;
     showImmediately?: boolean;
-    context?: string;
 }
 export interface InfoBlockProps {
     theme?: TextTheme;
@@ -199,7 +194,6 @@ export interface InfoBlockProps {
     links?: Pick<LinkProps, 'text' | 'url'>[];
     leftContent?: Omit<ContentBlockProps, 'colSizes' | 'theme' | 'size'>;
     rightContent?: Omit<ContentBlockProps, 'colSizes' | 'theme' | 'size'>;
-    context?: string;
 }
 export interface SecurityBlockPoint {
     img: string;
@@ -215,7 +209,6 @@ export interface SecurityBlockProps extends Animatable {
     title: string;
     points?: SecurityBlockPoint[];
     media: MediaProps;
-    context?: string;
 }
 export interface TableProps {
     content: string[][];
@@ -242,7 +235,6 @@ export interface TabsBlockProps extends BlockHeaderProps, Animatable {
     centered?: boolean;
     direction?: MediaDirection;
     items: TabsBlockItem[];
-    context?: string;
 }
 export interface LinkTableBlockProps extends BlockHeaderProps {
     items: LinkProps[][];
@@ -272,7 +264,6 @@ export interface ContentLayoutBlockProps {
     };
     textContent: ContentBlockProps;
     fileContent?: FileLinkProps[];
-    context?: string;
 }
 export interface ContentBlockProps {
     title?: TitleBaseProps | string;
@@ -284,7 +275,6 @@ export interface ContentBlockProps {
     colSizes?: GridColumnSizesType;
     centered?: boolean;
     theme?: ContentTheme;
-    context?: string;
 }
 export declare enum PCShareSocialNetwork {
     Vk = "vk",

package/build/esm/models/constructor-items/common.d.ts

@@ -1,7 +1,7 @@
 import { CSSProperties, ReactNode } from 'react';
 import { ButtonSize, ButtonView } from '@gravity-ui/uikit';
 import { ThemeSupporting } from '../../utils/theme';
-import { AnalyticsEvent, ClassNameProps, PixelEventType } from '../common';
+import { AnalyticsEventsBase, ClassNameProps, PixelEventType } from '../common';
 export declare enum AuthorType {
     Column = "column",
     Line = "line"
@@ -100,7 +100,7 @@ export interface BackgroundImageProps extends React.HTMLProps<HTMLDivElement>, P
     imageClassName?: string;
     hide?: boolean;
 }
-export interface MediaVideoProps {
+export interface MediaVideoProps extends AnalyticsEventsBase {
     src: string[];
     type?: MediaVideoType;
     loop?: LoopProps | boolean;
@@ -110,10 +110,8 @@ export interface MediaVideoProps {
     playButton?: PlayButtonProps;
     controls?: MediaVideoControlsType;
     metrika?: MetrikaVideo;
-    analyticsEvents?: AnalyticsEvent | AnalyticsEvent[];
-    context?: string;
 }
-export interface LinkProps extends Stylable {
+export interface LinkProps extends AnalyticsEventsBase, Stylable {
     url: string;
     text?: string;
     textSize?: TextSize;
@@ -123,7 +121,6 @@ export interface LinkProps extends Stylable {
     target?: string;
     metrikaGoals?: MetrikaGoal;
     pixelEvents?: ButtonPixel;
-    analyticsEvents?: AnalyticsEvent | AnalyticsEvent[];
     context?: string;
 }
 export interface FileLinkProps extends ClassNameProps {
@@ -134,7 +131,7 @@ export interface FileLinkProps extends ClassNameProps {
     theme?: ContentTheme;
     onClick?: () => void;
 }
-export interface ButtonProps {
+export interface ButtonProps extends AnalyticsEventsBase {
     text: string;
     url: string;
     primary?: boolean;
@@ -143,7 +140,6 @@ export interface ButtonProps {
     img?: ButtonImageProps | string;
     metrikaGoals?: MetrikaGoal;
     pixelEvents?: ButtonPixel;
-    analyticsEvents?: AnalyticsEvent | AnalyticsEvent[];
     target?: string;
     context?: string;
 }
@@ -169,17 +165,16 @@ export interface MediaVideoProps {
     metrika?: MetrikaVideo;
 }
 export type ThemedMediaVideoProps = ThemeSupporting<MediaVideoProps>;
-export interface MediaComponentVideoProps {
+export interface MediaComponentVideoProps extends AnalyticsEventsBase {
     video: MediaVideoProps;
     height?: number;
     metrika?: MetrikaVideo;
-    analyticsEvents?: AnalyticsEvent | AnalyticsEvent[];
-    context?: string;
     previewImg?: string;
 }
 export interface MediaComponentYoutubeProps {
     youtube: string;
     previewImg?: string;
+    fullScreen?: boolean;
 }
 export interface MediaComponentImageProps {
     image: ImageProps | ImageProps[] | ImageDeviceProps;
@@ -226,12 +221,10 @@ export interface HeaderBreadCrumbsProps extends ClassNameProps {
     items: {
         url: string;
         text: ReactNode;
-        analyticsEvents?: AnalyticsEvent | AnalyticsEvent[];
     }[];
     theme?: TextTheme;
     metrikaGoals?: MetrikaGoal;
     pixelEvents?: ButtonPixel;
-    context?: string;
 }
 export interface PreviewContentItemProps {
     title: string;
@@ -253,27 +246,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/build/esm/models/constructor-items/sub-blocks.d.ts

@@ -3,7 +3,7 @@ import { ThemeSupporting } from '../../utils';
 import { HubspotEventData, HubspotEventHandlers } from '../../utils/hubspot';
 import { AuthorItem, ButtonPixel, ButtonProps, CardBaseProps, ContentTheme, DividerSize, ImageObjectProps, ImageProps, LinkProps, MediaProps, PriceDetailedProps, TextTheme, Themable, ThemedImage } from './common';
 import { ContentBlockProps } from './blocks';
-import { AnalyticsEvent, PixelEvent } from '../common';
+import { AnalyticsEventsBase, PixelEvent } from '../common';
 export declare enum SubBlockType {
     Divider = "divider",
     Quote = "quote",
@@ -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",
@@ -34,7 +38,7 @@ export interface DividerProps {
     size?: DividerSize;
     border?: boolean;
 }
-export interface HubspotFormProps extends HubspotEventHandlers {
+export interface HubspotFormProps extends HubspotEventHandlers, AnalyticsEventsBase {
     className?: string;
     theme?: ContentTheme;
     isMobile?: boolean;
@@ -61,8 +65,7 @@ export interface HubspotFormProps extends HubspotEventHandlers {
     onLoad?: (arg: HubspotEventData) => void;
     pixelEvents?: string | string[] | PixelEvent | PixelEvent[] | ButtonPixel;
     hubspotEvents?: string[];
-    analyticsEvents?: AnalyticsEvent | AnalyticsEvent[];
-    context?: string;
+    createDOMElement?: boolean;
 }
 export interface PartnerProps extends CardBaseProps {
     text: string;
@@ -78,7 +81,6 @@ export interface QuoteProps extends Themable, CardBaseProps {
     author?: AuthorItem;
     buttonText?: string;
     theme?: TextTheme;
-    context?: string;
 }
 export interface NewsCardData {
     id: number;
@@ -113,7 +115,6 @@ export interface BannerCardProps {
     color?: ThemeSupporting<string>;
     theme?: TextTheme;
     button: Pick<ButtonProps, 'text' | 'url' | 'target'>;
-    context?: string;
 }
 export interface MediaCardProps extends MediaProps, CardBaseProps {
 }
@@ -121,7 +122,7 @@ export interface CardWithImageLinkProps extends Omit<LinkProps, 'text' | 'url'>
     title: string;
     link: string;
 }
-export interface CardWithImageProps extends ClassNameProps, Pick<ContentBlockProps, 'title' | 'additionalInfo' | 'buttons' | 'theme' | 'context'> {
+export interface CardWithImageProps extends ClassNameProps, Pick<ContentBlockProps, 'title' | 'additionalInfo' | 'buttons' | 'theme'> {
     image: string;
     description?: string;
     disableCompress?: boolean;
@@ -129,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;
@@ -141,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/build/esm/models/constructor-items/sub-blocks.js

@@ -14,7 +14,11 @@ export 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/build/esm/navigation/components/NavigationItem/NavigationItem.js

@@ -9,7 +9,6 @@ import SocialIcon from '../SocialIcon/SocialIcon';
 import { getMediaImage } from '../../../components/Media/Image/utils';
 import './NavigationItem.css';
 const b = block('navigation-item');
-const BLOCK_NAME = 'navigation';
 const Content = ({ text, icon }) => (React.createElement(Fragment, null,
     icon && typeof icon !== 'string' && React.createElement(Image, Object.assign({ className: b('icon') }, icon)),
     React.createElement("span", { className: b('text') }, text)));
@@ -38,8 +37,11 @@ const NavigationLink = (props) => {
 };
 const NavigationButton = (props) => {
     const { url, target } = props;
-    return target ? (React.createElement(Button, Object.assign({}, props, { url: url, context: BLOCK_NAME }))) : (React.createElement(RouterLink, { href: url },
-        React.createElement(Button, Object.assign({}, props, { url: url, context: BLOCK_NAME }))));
+    return target ? (
+    // discuss how to be with this component
+    // <Button {...props} url={url} context={BLOCK_NAME} />
+    React.createElement(Button, Object.assign({}, props, { url: url }))) : (React.createElement(RouterLink, { href: url },
+        React.createElement(Button, Object.assign({}, props, { url: url }))));
 };
 //todo: add types support form component in map
 // eslint-disable-next-line @typescript-eslint/no-explicit-any

package/build/esm/schema/index.js

@@ -50,6 +50,7 @@ export function generateDefaultSchema(config) {
         'card-with-image',
         'quote',
         'basic-card',
+        'layout-item',
     ];
     const configBlockSchemaNames = Object.keys(blocks).filter((item) => !constructorBlockSchemaNames.includes(item));
     const configCardSchemaNames = Object.keys(cards).filter((item) => !constructorCardSchemaNames.includes(item));

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

@@ -318,6 +318,84 @@ export declare const LinkProps: {
             type: string;
             enum: 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: {};
         when: {};
     };

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

@@ -175,6 +175,8 @@ export const LinkProps = {
         }, target: {
             type: 'string',
             enum: ['_blank', '_parent', '_top', '_self'],
+        }, analyticsEvents: {
+            anyOf: [AnalyticsEventSchema, { type: 'array', items: AnalyticsEventSchema }],
         } }),
 };
 export const FileLinkProps = {

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/schema.d.ts

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

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

@@ -1,6 +1,6 @@
 import React, { useContext } from 'react';
 import { block, getThemedValue } from '../../utils';
-import { Button, YFMWrapper, BackgroundImage, HTML } from '../../components';
+import { Button, YFMWrapper, BackgroundImage, HTML, RouterLink } from '../../components';
 import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
 import './BannerCard.css';
 const b = block('banner-card');
@@ -18,7 +18,8 @@ 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 })),
+                React.createElement(RouterLink, { href: url },
+                    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/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,
@@ -126,9 +126,9 @@ unpredictable css rules order in build */
   opacity: 0;
   flex-shrink: 0;
 }
-.pc-hubspot-form .hs-form-field .hs-form-checkbox-display span,
-.pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span,
-.pc-hubspot-form .hs-form-field .hs-form-radio-display span {
+.pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:not(.hs-form-required),
+.pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:not(.hs-form-required),
+.pc-hubspot-form .hs-form-field .hs-form-radio-display span:not(.hs-form-required) {
   color: var(--yc-color-text-primary);
   font-size: var(--yc-text-body-2-font-size);
   line-height: 16px;
@@ -136,12 +136,17 @@ unpredictable css rules order in build */
   margin: 0;
   flex-grow: 1;
 }
+.pc-hubspot-form .hs-form-field .hs-form-checkbox-display .hs-form-required,
+.pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display .hs-form-required,
+.pc-hubspot-form .hs-form-field .hs-form-radio-display .hs-form-required {
+  top: 0;
+}
 .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display,
 .pc-hubspot-form .hs-form-field .hs-form-checkbox-display {
   position: relative;
 }
-.pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:before,
-.pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:before {
+.pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:not(.hs-form-required):before,
+.pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:not(.hs-form-required):before {
   content: "";
   position: absolute;
   top: 0;
@@ -153,8 +158,8 @@ unpredictable css rules order in build */
   border: 1px solid var(--yc-color-line-generic-accent);
   transition: background-color 0.1s linear;
 }
-.pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:after,
-.pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:after {
+.pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:not(.hs-form-required):after,
+.pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:not(.hs-form-required):after {
   content: "";
   position: absolute;
   top: -10px;
@@ -276,7 +281,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/HubspotFormContainer.d.ts

@@ -1,5 +1,5 @@
 import { HubspotFormProps } from '../../models';
-type HubspotFormContainerPropsKeys = 'className' | 'formId' | 'formInstanceId' | 'portalId' | 'region' | 'formClassName';
+type HubspotFormContainerPropsKeys = 'className' | 'formId' | 'formInstanceId' | 'portalId' | 'region' | 'formClassName' | 'createDOMElement';
 type HubspotFormContainerProps = Pick<HubspotFormProps, HubspotFormContainerPropsKeys>;
 declare const HubspotFormContainer: (props: HubspotFormContainerProps) => JSX.Element;
 export default HubspotFormContainer;

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

@@ -1,16 +1,21 @@
-import React from 'react';
+import React, { useRef } from 'react';
 import loadHubspotScript from './loadHubspotScript';
 import { useMount } from '../../hooks';
 const HubspotFormContainer = (props) => {
-    const { className, formId, formInstanceId, portalId, region, formClassName, } = props;
+    const { className, formId, formInstanceId, portalId, region, formClassName, createDOMElement, } = props;
+    const containerRef = useRef(null);
+    const hsContainerRef = useRef();
     const containerId = formInstanceId
         ? `hubspot-form-${formId}-${formInstanceId}`
         : `hubspot-form-${formId}`;
-    useMount(() => {
-        (async () => {
-            if (!window.hbspt) {
-                await loadHubspotScript();
-            }
+    const createForm = () => {
+        if (containerRef.current && !hsContainerRef.current && createDOMElement) {
+            hsContainerRef.current = document.createElement('div');
+            containerRef.current.id = '';
+            hsContainerRef.current.id = containerId;
+            containerRef.current.appendChild(hsContainerRef.current);
+        }
+        if (!createDOMElement || hsContainerRef.current) {
             if (window.hbspt) {
                 window.hbspt.forms.create({
                     region,
@@ -21,8 +26,21 @@ const HubspotFormContainer = (props) => {
                     formInstanceId,
                 });
             }
+        }
+    };
+    useMount(() => {
+        (async () => {
+            if (!window.hbspt) {
+                await loadHubspotScript();
+            }
+            createForm();
         })();
+        return () => {
+            if (createDOMElement && containerRef.current && containerRef.current.lastChild) {
+                containerRef.current.removeChild(containerRef.current.lastChild);
+            }
+        };
     });
-    return React.createElement("div", { className: className, id: containerId });
+    return React.createElement("div", { className: className, id: containerId, ref: containerRef });
 };
 export default HubspotFormContainer;

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

@@ -2,17 +2,17 @@ import React, { useContext, useMemo } from 'react';
 import { block } from '../../utils';
 import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
 import { MobileContext } from '../../context/mobileContext';
+import { BlockPositionContext } from '../../context/blockPositionContext';
 import { useMetrika } from '../../hooks/useMetrika';
 import { PredefinedEventTypes } from '../../models';
 import { useHandleHubspotEvents, useAnalytics } from '../../hooks';
 import HubspotFormContainer from './HubspotFormContainer';
-import { BlockPositionContext } from '../../context/blockPositionContext';
 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, } = props;
+    analyticsEvents, onBeforeSubmit, onSubmit, onBeforeLoad, onLoad, createDOMElement, onSubmitError, } = props;
     const handleMetrika = useMetrika();
     const context = useContext(BlockPositionContext);
     const defaultEvent = useMemo(() => ({
@@ -29,6 +29,7 @@ const HubspotForm = (props) => {
         onBeforeLoad,
         onBeforeSubmit,
         onLoad,
+        onSubmitError,
         onSubmit: (e) => {
             handleMetrika === null || handleMetrika === void 0 ? void 0 : handleMetrika({ pixelEvents });
             handleAnalytics(analyticsEvents);
@@ -43,8 +44,9 @@ const HubspotForm = (props) => {
         handleAnalytics,
         analyticsEvents,
         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 }));
+    return (React.createElement(HubspotFormContainer, { createDOMElement: createDOMElement, key: [formClassName, formId, formInstanceId, portalId, region].join(), className: b({ theme, mobile }, className), formClassName: formClassName, formId: formId, portalId: portalId, formInstanceId: formInstanceId, region: region }));
 };
 export default HubspotForm;

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;