@gravity-ui/page-constructor 2.2.1-alpha.0 → 2.3.0

package/build/cjs/blocks/Simple/Simple.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SimpleBlock = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const utils_1 = require("../../utils");
+const AnimateBlock_1 = tslib_1.__importDefault(require("../../components/AnimateBlock/AnimateBlock"));
+const BlockHeader_1 = tslib_1.__importDefault(require("../../components/BlockHeader/BlockHeader"));
+const YFMWrapper_1 = tslib_1.__importDefault(require("../../components/YFMWrapper/YFMWrapper"));
+const b = (0, utils_1.block)('simple-block');
+const SimpleBlock = (props) => {
+    const { title, description, animated = true, children } = props;
+    const blockHeader = title && react_1.default.createElement(BlockHeader_1.default, { title: title });
+    return (react_1.default.createElement(AnimateBlock_1.default, { className: b(), animate: animated },
+        react_1.default.createElement("div", null,
+            blockHeader,
+            react_1.default.createElement("div", { className: b('description') },
+                react_1.default.createElement(YFMWrapper_1.default, { content: description, modifiers: { constructor: true } })),
+            react_1.default.createElement("div", { className: b('animate-block') }, children))));
+};
+exports.SimpleBlock = SimpleBlock;
+exports.default = exports.SimpleBlock;

package/build/cjs/blocks/Simple/schema.d.ts

@@ -0,0 +1,68 @@
+export declare const SimpleBlock: {
+    'simple-block': {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            children: {
+                type: string;
+                items: {
+                    $ref: string;
+                };
+            };
+            animated: {
+                type: string;
+            };
+            anchor: {
+                type: string;
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    text: {
+                        type: string;
+                        contentType: string;
+                    };
+                    url: {
+                        type: string;
+                    };
+                };
+            };
+            visible: {
+                type: string;
+                enum: string[];
+            };
+            resetPaddings: {
+                type: string;
+            };
+            context: {
+                type: string;
+            };
+            type: {};
+            when: {};
+            title: {
+                type: string;
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    text: {
+                        type: string;
+                        contentType: string;
+                    };
+                    textSize: {
+                        type: string;
+                        enum: string[];
+                    };
+                    url: {
+                        type: string;
+                    };
+                    resetMargin: {
+                        type: string;
+                    };
+                };
+            };
+            description: {
+                type: string;
+                contentType: string;
+            };
+        };
+    };
+};

package/build/cjs/blocks/Simple/schema.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SimpleBlock = void 0;
+const common_1 = require("../../schema/validators/common");
+exports.SimpleBlock = {
+    'simple-block': {
+        additionalProperties: false,
+        required: ['title', 'description'],
+        properties: Object.assign(Object.assign(Object.assign({ title: common_1.TitleProps, description: {
+                type: 'string',
+                contentType: 'yfm',
+            } }, common_1.BlockBaseProps), common_1.AnimatableProps), { children: common_1.ChildrenProps }),
+    },
+};

package/build/cjs/blocks/index.d.ts

@@ -1,8 +1,10 @@
 export { default as BannerBlock } from './Banner/Banner';
 export { default as CompaniesBlock } from './Companies/Companies';
+export { default as SimpleBlock } from './Simple/Simple';
 export { default as InfoBlock } from './Info/Info';
 export { default as MediaBlock } from './Media/Media';
 export { default as MapBlock } from './Map/Map';
+export { default as PreviewBlock } from './Preview/Preview';
 export { default as SecurityBlock } from './Security/Security';
 export { default as SliderBlock } from './Slider/Slider';
 export { default as ExtendedFeaturesBlock } from './ExtendedFeatures/ExtendedFeatures';

package/build/cjs/blocks/index.js

@@ -3,17 +3,21 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.FilterBlock = exports.ShareBlock = exports.ContentLayoutBlock = exports.CardLayoutBlock = exports.HeaderSliderBlock = exports.IconsBlock = exports.HeaderBlock = exports.LinkTableBlock = exports.TabsBlock = exports.TableBlock = exports.QuestionsBlock = exports.PromoFeaturesBlock = exports.ExtendedFeaturesBlock = exports.SliderBlock = exports.SecurityBlock = exports.MapBlock = exports.MediaBlock = exports.InfoBlock = exports.CompaniesBlock = exports.BannerBlock = void 0;
+exports.FilterBlock = exports.ShareBlock = exports.ContentLayoutBlock = exports.CardLayoutBlock = exports.HeaderSliderBlock = exports.IconsBlock = exports.HeaderBlock = exports.LinkTableBlock = exports.TabsBlock = exports.TableBlock = exports.QuestionsBlock = exports.PromoFeaturesBlock = exports.ExtendedFeaturesBlock = exports.SliderBlock = exports.SecurityBlock = exports.PreviewBlock = exports.MapBlock = exports.MediaBlock = exports.InfoBlock = exports.SimpleBlock = exports.CompaniesBlock = exports.BannerBlock = void 0;
 var Banner_1 = require("./Banner/Banner");
 Object.defineProperty(exports, "BannerBlock", { enumerable: true, get: function () { return __importDefault(Banner_1).default; } });
 var Companies_1 = require("./Companies/Companies");
 Object.defineProperty(exports, "CompaniesBlock", { enumerable: true, get: function () { return __importDefault(Companies_1).default; } });
+var Simple_1 = require("./Simple/Simple");
+Object.defineProperty(exports, "SimpleBlock", { enumerable: true, get: function () { return __importDefault(Simple_1).default; } });
 var Info_1 = require("./Info/Info");
 Object.defineProperty(exports, "InfoBlock", { enumerable: true, get: function () { return __importDefault(Info_1).default; } });
 var Media_1 = require("./Media/Media");
 Object.defineProperty(exports, "MediaBlock", { enumerable: true, get: function () { return __importDefault(Media_1).default; } });
 var Map_1 = require("./Map/Map");
 Object.defineProperty(exports, "MapBlock", { enumerable: true, get: function () { return __importDefault(Map_1).default; } });
+var Preview_1 = require("./Preview/Preview");
+Object.defineProperty(exports, "PreviewBlock", { enumerable: true, get: function () { return __importDefault(Preview_1).default; } });
 var Security_1 = require("./Security/Security");
 Object.defineProperty(exports, "SecurityBlock", { enumerable: true, get: function () { return __importDefault(Security_1).default; } });
 var Slider_1 = require("./Slider/Slider");

package/build/cjs/blocks/validators.d.ts

@@ -9,9 +9,11 @@ export * from './Icons/schema';
 export * from './Info/schema';
 export * from './LinkTable/schema';
 export * from './Media/schema';
+export * from './Preview/schema';
 export * from './PromoFeaturesBlock/schema';
 export * from './Questions/schema';
 export * from './Security/schema';
+export * from './Simple/schema';
 export * from './Slider/schema';
 export * from './Table/schema';
 export * from './Share/schema';

package/build/cjs/blocks/validators.js

@@ -12,9 +12,11 @@ tslib_1.__exportStar(require("./Icons/schema"), exports);
 tslib_1.__exportStar(require("./Info/schema"), exports);
 tslib_1.__exportStar(require("./LinkTable/schema"), exports);
 tslib_1.__exportStar(require("./Media/schema"), exports);
+tslib_1.__exportStar(require("./Preview/schema"), exports);
 tslib_1.__exportStar(require("./PromoFeaturesBlock/schema"), exports);
 tslib_1.__exportStar(require("./Questions/schema"), exports);
 tslib_1.__exportStar(require("./Security/schema"), exports);
+tslib_1.__exportStar(require("./Simple/schema"), exports);
 tslib_1.__exportStar(require("./Slider/schema"), exports);
 tslib_1.__exportStar(require("./Table/schema"), exports);
 tslib_1.__exportStar(require("./Share/schema"), exports);

package/build/cjs/components/HTML/HTML.d.ts

@@ -7,7 +7,7 @@ export interface HTMLProps {
 }
 declare const HTML: ({ children, block, className }: WithChildren<HTMLProps>) => React.DetailedReactHTMLElement<{
     dangerouslySetInnerHTML: {
-        __html: string & (boolean | React.ReactChild | React.ReactFragment | React.ReactPortal | null);
+        __html: string | (string & React.ReactElement<any, string | React.JSXElementConstructor<any>>) | (string & React.ReactFragment) | (string & React.ReactPortal);
     };
     className: string | undefined;
 }, HTMLElement> | null;

package/build/cjs/components/Image/Image.js

@@ -4,6 +4,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const projectSettingsContext_1 = require("../../context/projectSettingsContext");
 const constants_1 = require("../../constants");
+const imageCompress_1 = require("../../utils/imageCompress");
 const checkWebP = (src) => {
     return src.endsWith('.webp') ? src : src + '.webp';
 };
@@ -15,10 +16,9 @@ const Image = (props) => {
     if (!imageSrc) {
         return null;
     }
-    // TODO: Temporary solution for .svg images
     const disableWebp = projectSettings.disableCompress ||
         disableCompress ||
-        imageSrc.endsWith('.svg') ||
+        !(0, imageCompress_1.isCompressible)(imageSrc) ||
         imgLoadingError;
     return (react_1.default.createElement("picture", { className: containerClassName },
         mobile && (react_1.default.createElement(react_1.Fragment, null,

package/build/cjs/constructor-items.d.ts

@@ -1,11 +1,13 @@
 export declare const blockMap: {
     "slider-block": (props: import("./models").WithChildren<import("./blocks/Slider/Slider").SliderProps>) => JSX.Element;
+    "simple-block": (props: import("./models").WithChildren<import("./models").SimpleBlockProps>) => JSX.Element;
     "extended-features-block": ({ title, description, items, colSizes, animated, }: import("./models").ExtendedFeaturesProps) => JSX.Element;
     "promo-features-block": (props: import("./models").PromoFeaturesProps) => JSX.Element;
     "questions-block": (props: import("./models").QuestionsProps) => JSX.Element;
     "banner-block": (props: import("./models").BannerBlockProps) => JSX.Element;
     "companies-block": ({ title, images, animated }: import("./models").CompaniesBlockProps) => JSX.Element;
     "media-block": (props: import("./models").MediaBlockProps) => JSX.Element;
+    "preview-block": (props: import("./models").PreviewBlockProps) => JSX.Element;
     "info-block": (props: import("./models").InfoBlockProps) => JSX.Element;
     "security-block": (props: import("./models").SecurityBlockProps) => JSX.Element;
     "table-block": (props: import("./models").TableBlockProps) => JSX.Element;
@@ -35,6 +37,10 @@ export declare const subBlockMap: {
     "banner-card": (props: import("./models").BannerCardProps) => JSX.Element;
     "news-card": (props: import("./models").NewsCardProps) => JSX.Element;
     "layout-item": ({ content: { links, ...content }, metaInfo, media, border, fullScreen, className, }: import("./models").LayoutItemProps) => JSX.Element;
+    /**
+     * @deprecated Use LayoutItem
+     */
+    "card-with-image": ({ title, description, image, disableCompress, links, border, fullScreen, className, additionalInfo, buttons, }: import("./models").CardWithImageProps) => JSX.Element;
     "background-card": (props: import("./models").BackgroundCardProps) => JSX.Element;
     "basic-card": (props: import("./models").BasicCardProps) => JSX.Element;
     content: (props: import("./models").ContentBlockProps & import("./models").ClassNameProps) => JSX.Element;

package/build/cjs/constructor-items.js

@@ -6,12 +6,14 @@ const sub_blocks_1 = require("./sub-blocks");
 const blocks_1 = require("./blocks");
 exports.blockMap = {
     [models_1.BlockType.SliderBlock]: blocks_1.SliderBlock,
+    [models_1.BlockType.SimpleBlock]: blocks_1.SimpleBlock,
     [models_1.BlockType.ExtendedFeaturesBlock]: blocks_1.ExtendedFeaturesBlock,
     [models_1.BlockType.PromoFeaturesBlock]: blocks_1.PromoFeaturesBlock,
     [models_1.BlockType.QuestionsBlock]: blocks_1.QuestionsBlock,
     [models_1.BlockType.BannerBlock]: blocks_1.BannerBlock,
     [models_1.BlockType.CompaniesBlock]: blocks_1.CompaniesBlock,
     [models_1.BlockType.MediaBlock]: blocks_1.MediaBlock,
+    [models_1.BlockType.PreviewBlock]: blocks_1.PreviewBlock,
     [models_1.BlockType.InfoBlock]: blocks_1.InfoBlock,
     [models_1.BlockType.SecurityBlock]: blocks_1.SecurityBlock,
     [models_1.BlockType.TableBlock]: blocks_1.TableBlock,
@@ -41,6 +43,10 @@ exports.subBlockMap = {
     [models_1.SubBlockType.BannerCard]: sub_blocks_1.BannerCard,
     [models_1.SubBlockType.NewsCard]: sub_blocks_1.NewsCard,
     [models_1.SubBlockType.LayoutItem]: sub_blocks_1.LayoutItem,
+    /**
+     * @deprecated Use LayoutItem
+     */
+    [models_1.SubBlockType.CardWithImage]: sub_blocks_1.CardWithImage,
     [models_1.SubBlockType.BackgroundCard]: sub_blocks_1.BackgroundCard,
     [models_1.SubBlockType.BasicCard]: sub_blocks_1.BasicCard,
     [models_1.SubBlockType.Content]: sub_blocks_1.Content,

package/build/cjs/context/breakpointContext/breakpointContext.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const BreakpointContext: React.Context<number>;

package/build/cjs/context/breakpointContext/breakpointContext.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BreakpointContext = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const constants_1 = require("../../constants");
+exports.BreakpointContext = react_1.default.createContext(constants_1.BREAKPOINTS.sm);

package/build/cjs/context/breakpointContext/index.d.ts

@@ -0,0 +1 @@
+export * from './breakpointContext';

package/build/cjs/context/breakpointContext/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./breakpointContext"), exports);

package/build/cjs/hooks/index.d.ts

@@ -1,5 +1,6 @@
 export { default as useFocus } from './useFocus';
 export { default as useWindowBreakpoint } from './useWindowBreakpoint';
+export { useIntersection } from './useIntersection';
 export { default as useMount } from './useMount';
 export * from './useAnalytics';
 export * from './hubspot';

package/build/cjs/hooks/index.js

@@ -1,11 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMount = exports.useWindowBreakpoint = exports.useFocus = void 0;
+exports.useMount = exports.useIntersection = exports.useWindowBreakpoint = exports.useFocus = void 0;
 const tslib_1 = require("tslib");
 var useFocus_1 = require("./useFocus");
 Object.defineProperty(exports, "useFocus", { enumerable: true, get: function () { return tslib_1.__importDefault(useFocus_1).default; } });
 var useWindowBreakpoint_1 = require("./useWindowBreakpoint");
 Object.defineProperty(exports, "useWindowBreakpoint", { enumerable: true, get: function () { return tslib_1.__importDefault(useWindowBreakpoint_1).default; } });
+var useIntersection_1 = require("./useIntersection");
+Object.defineProperty(exports, "useIntersection", { enumerable: true, get: function () { return useIntersection_1.useIntersection; } });
 var useMount_1 = require("./useMount");
 Object.defineProperty(exports, "useMount", { enumerable: true, get: function () { return tslib_1.__importDefault(useMount_1).default; } });
 tslib_1.__exportStar(require("./useAnalytics"), exports);

package/build/cjs/hooks/useIntersection.d.ts

@@ -0,0 +1 @@
+export declare const useIntersection: (element?: Element, startMargin?: string, threshold?: number) => boolean;

package/build/cjs/hooks/useIntersection.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useIntersection = void 0;
+const react_1 = require("react");
+const useIntersection = (element, startMargin = '0px', threshold = 0.2) => {
+    const [isVisible, setState] = (0, react_1.useState)(false);
+    (0, react_1.useEffect)(() => {
+        const observer = new IntersectionObserver(([entry]) => {
+            setState(entry.isIntersecting);
+        }, {
+            rootMargin: startMargin,
+            threshold,
+        });
+        if (element) {
+            observer.observe(element);
+        }
+        return () => element && observer.unobserve(element);
+    }, [element, startMargin, threshold]);
+    return isVisible;
+};
+exports.useIntersection = useIntersection;

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { ButtonSize } from '@gravity-ui/uikit';
-import { BackgroundImageProps, ButtonProps, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, Justify, LinkProps, LinkTheme, MediaDirection, MediaProps, MapProps, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleProps, LegendTableMarkerType, AnchorProps, TitleBaseProps, Animatable, BlockHeaderProps, ImageDeviceProps } from './common';
+import { BackgroundImageProps, ButtonProps, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, Justify, LinkProps, LinkTheme, MediaDirection, MediaProps, MapProps, PreviewItemProps, PreviewRatioMediaContent, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleProps, LegendTableMarkerType, AnchorProps, TitleBaseProps, Animatable, BlockHeaderProps, ImageDeviceProps } from './common';
 import { ThemeSupporting } from '../../utils';
 import { GridColumnSize, GridColumnSizesType } from '../../grid/types';
 import { BannerCardProps, SubBlock, SubBlockModels } from './sub-blocks';
@@ -14,10 +14,12 @@ export declare enum BlockType {
     BannerBlock = "banner-block",
     CompaniesBlock = "companies-block",
     MediaBlock = "media-block",
+    PreviewBlock = "preview-block",
     InfoBlock = "info-block",
     SecurityBlock = "security-block",
     TableBlock = "table-block",
     TabsBlock = "tabs-block",
+    SimpleBlock = "simple-block",
     HeaderSliderBlock = "header-slider-block",
     LinkTableBlock = "link-table-block",
     HeaderBlock = "header-block",
@@ -112,6 +114,10 @@ export interface HeaderBlockProps {
     status?: JSX.Element;
 }
 export type CalculatorProps = Animatable;
+export interface SimpleBlockProps extends Animatable, Childable {
+    title: TitleBaseProps;
+    description: string;
+}
 export interface ExtendedFeaturesItem extends Omit<ContentBlockProps, 'theme' | 'centered' | 'colSizes' | 'size' | 'title'> {
     title: string;
     label?: string;
@@ -174,6 +180,15 @@ export interface MediaBlockProps extends MediaBaseBlockProps {
 export interface MapBlockProps extends MediaBaseBlockProps {
     map: MapProps;
 }
+export interface PreviewBlockProps extends Animatable {
+    title: string;
+    items: PreviewItemProps[];
+    description?: string;
+    direction?: MediaDirection;
+    ratioMediaContent?: PreviewRatioMediaContent;
+    stopVideo?: boolean;
+    showImmediately?: boolean;
+}
 export interface InfoBlockProps {
     theme?: TextTheme;
     backgroundColor?: ThemeSupporting<string>;
@@ -331,6 +346,9 @@ export type MediaBlockModel = {
 export type MapBlockModel = {
     type: BlockType.MapBlock;
 } & MapBlockProps;
+export type PreviewBlockModel = {
+    type: BlockType.PreviewBlock;
+} & PreviewBlockProps;
 export type InfoBlockModel = {
     type: BlockType.InfoBlock;
 } & InfoBlockProps;
@@ -343,6 +361,9 @@ export type TableBlockModel = {
 export type TabsBlockModel = {
     type: BlockType.TabsBlock;
 } & TabsBlockProps;
+export type SimpleBlockModel = {
+    type: BlockType.SimpleBlock;
+} & SimpleBlockProps;
 export type LinkTableBlockModel = {
     type: BlockType.LinkTableBlock;
 } & LinkTableBlockProps;
@@ -364,6 +385,6 @@ export type ContentLayoutBlockModel = {
 export type ShareBLockModel = {
     type: BlockType.ShareBlock;
 } & ShareBlockProps;
-type BlockModels = SliderBlockModel | ServiceDemoBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | CalculatorBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | MapBlockModel | InfoBlockModel | SecurityBlockModel | TableBlockModel | TabsBlockModel | LinkTableBlockModel | HeaderBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel | ShareBLockModel | FilterBlockModel;
+type BlockModels = SliderBlockModel | ServiceDemoBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | CalculatorBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | MapBlockModel | InfoBlockModel | SecurityBlockModel | TableBlockModel | TabsBlockModel | SimpleBlockModel | LinkTableBlockModel | HeaderBlockModel | PreviewBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel | ShareBLockModel | FilterBlockModel;
 export type Block = BlockModels & BlockBaseProps;
 export {};

package/build/cjs/models/constructor-items/blocks.js

@@ -12,10 +12,12 @@ var BlockType;
     BlockType["BannerBlock"] = "banner-block";
     BlockType["CompaniesBlock"] = "companies-block";
     BlockType["MediaBlock"] = "media-block";
+    BlockType["PreviewBlock"] = "preview-block";
     BlockType["InfoBlock"] = "info-block";
     BlockType["SecurityBlock"] = "security-block";
     BlockType["TableBlock"] = "table-block";
     BlockType["TabsBlock"] = "tabs-block";
+    BlockType["SimpleBlock"] = "simple-block";
     BlockType["HeaderSliderBlock"] = "header-slider-block";
     BlockType["LinkTableBlock"] = "link-table-block";
     BlockType["HeaderBlock"] = "header-block";

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

@@ -17,6 +17,10 @@ export declare enum PriceLabelColor {
     PURPLE = "purple",
     RED = "red"
 }
+export declare enum PreviewItemType {
+    Video = "video",
+    Image = "image"
+}
 export declare enum PlayButtonType {
     Default = "default",
     Text = "text"
@@ -45,6 +49,7 @@ export type LegendTableMarkerType = 'disk';
 export type LinkTheme = 'file-link' | 'normal' | 'back' | 'underline';
 export type MediaDirection = 'media-content' | 'content-media';
 export type PriceDescriptionColor = 'cornflower' | 'black';
+export type PreviewRatioMediaContent = '2-1' | '1-1';
 export type ContentSize = 's' | 'l';
 export type ContentTextSize = 's' | 'm' | 'l';
 export type ContentTheme = 'default' | 'dark' | 'light';
@@ -244,6 +249,15 @@ export interface HeaderBreadCrumbsProps extends ClassNameProps {
     metrikaGoals?: MetrikaGoal;
     pixelEvents?: ButtonPixel;
 }
+export interface PreviewContentItemProps {
+    title: string;
+    description?: string;
+}
+export interface PreviewItemProps {
+    type: PreviewItemType;
+    media: ThemedMediaProps;
+    content: PreviewContentItemProps;
+}
 export interface TitleProps extends Justifyable, TitleBaseProps {
     navTitle?: string;
     anchor?: string;

package/build/cjs/models/constructor-items/common.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MediaVideoControlsType = exports.MediaVideoType = exports.PlayButtonThemes = exports.PlayButtonType = exports.PriceLabelColor = exports.PriceDetailsType = exports.AuthorType = void 0;
+exports.MediaVideoControlsType = exports.MediaVideoType = exports.PlayButtonThemes = exports.PlayButtonType = exports.PreviewItemType = exports.PriceLabelColor = exports.PriceDetailsType = exports.AuthorType = void 0;
 // enums
 var AuthorType;
 (function (AuthorType) {
@@ -20,6 +20,11 @@ var PriceLabelColor;
     PriceLabelColor["PURPLE"] = "purple";
     PriceLabelColor["RED"] = "red";
 })(PriceLabelColor = exports.PriceLabelColor || (exports.PriceLabelColor = {}));
+var PreviewItemType;
+(function (PreviewItemType) {
+    PreviewItemType["Video"] = "video";
+    PreviewItemType["Image"] = "image";
+})(PreviewItemType = exports.PreviewItemType || (exports.PreviewItemType = {}));
 var PlayButtonType;
 (function (PlayButtonType) {
     PlayButtonType["Default"] = "default";

package/build/cjs/models/constructor-items/sub-blocks.d.ts

@@ -1,7 +1,7 @@
 import { ClassNameProps } from '../../models';
 import { ThemeSupporting } from '../../utils';
 import { HubspotEventData, HubspotEventHandlers } from '../../utils/hubspot';
-import { AuthorItem, ButtonPixel, ButtonProps, CardBaseProps, ContentTheme, DividerSize, ImageObjectProps, ImageProps, MediaProps, PriceDetailedProps, TextTheme, Themable, ThemedImage } from './common';
+import { AuthorItem, ButtonPixel, ButtonProps, CardBaseProps, ContentTheme, DividerSize, ImageObjectProps, ImageProps, LinkProps, MediaProps, PriceDetailedProps, TextTheme, Themable, ThemedImage } from './common';
 import { ContentBlockProps } from './blocks';
 import { AnalyticsEventsBase, PixelEvent } from '../common';
 export declare enum SubBlockType {
@@ -9,26 +9,27 @@ export declare enum SubBlockType {
     Quote = "quote",
     NewsCard = "news-card",
     /**
-     * @deprecated Will be removed, use BasicCard instead
+     * @deprecated Will be moved to params use BasicCard instead
      */
     Partner = "partner",
-    /**
-     * @deprecated Will be removed
-     */
     PriceDetailed = "price-detailed",
     MediaCard = "media-card",
     BannerCard = "banner-card",
     /**
-     * @deprecated Will be removed, use BasicCard instead
+     * @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",
     HubspotForm = "hubspot-form",
     /**
-     * @deprecated Will be removed, use BasicCard instead
+     * @deprecated Will be moved to params use BasicCard instead
      */
     Card = "card"
 }
@@ -118,6 +119,18 @@ export interface BannerCardProps {
 }
 export interface MediaCardProps extends MediaProps, CardBaseProps {
 }
+export interface CardWithImageLinkProps extends Omit<LinkProps, 'text' | 'url'> {
+    title: string;
+    link: string;
+}
+export interface CardWithImageProps extends ClassNameProps, Pick<ContentBlockProps, 'title' | 'additionalInfo' | 'buttons' | 'theme'> {
+    image: string;
+    description?: string;
+    disableCompress?: boolean;
+    border?: boolean;
+    fullScreen?: boolean;
+    links?: CardWithImageLinkProps[];
+}
 export interface LayoutItemProps extends ClassNameProps {
     content: Omit<ContentBlockProps, 'colSizes' | 'centered' | 'size'>;
     media: MediaProps;
@@ -134,8 +147,11 @@ export type QuoteModel = {
 export type NewsCardModel = {
     type: SubBlockType.NewsCard;
 } & NewsCardProps;
+export type CardWithImageModel = {
+    type: SubBlockType.CardWithImage;
+} & CardWithImageProps;
 export type LayoutItemModel = {
-    type: SubBlockType.LayoutItem;
+    type: SubBlockType.CardWithImage;
 } & LayoutItemProps;
 export type TutorialCardModel = {
     type: SubBlockType.TutorialCard;
@@ -161,5 +177,5 @@ export type BannerCardModel = {
 export type BasicCardModel = {
     type: SubBlockType.BasicCard;
 } & BasicCardProps;
-export type SubBlockModels = DividerModel | QuoteModel | NewsCardModel | PartnerModel | PriceDetailedModel | MediaCardModel | TutorialCardModel | BackgroundCardModel | HubspotFormModel | BannerCardModel | BasicCardModel | LayoutItemModel;
+export type SubBlockModels = DividerModel | QuoteModel | NewsCardModel | PartnerModel | PriceDetailedModel | MediaCardModel | TutorialCardModel | CardWithImageModel | BackgroundCardModel | HubspotFormModel | BannerCardModel | BasicCardModel;
 export type SubBlock = SubBlockModels;

package/build/cjs/models/constructor-items/sub-blocks.js

@@ -7,26 +7,27 @@ var SubBlockType;
     SubBlockType["Quote"] = "quote";
     SubBlockType["NewsCard"] = "news-card";
     /**
-     * @deprecated Will be removed, use BasicCard instead
+     * @deprecated Will be moved to params use BasicCard instead
      */
     SubBlockType["Partner"] = "partner";
-    /**
-     * @deprecated Will be removed
-     */
     SubBlockType["PriceDetailed"] = "price-detailed";
     SubBlockType["MediaCard"] = "media-card";
     SubBlockType["BannerCard"] = "banner-card";
     /**
-     * @deprecated Will be removed, use BasicCard instead
+     * @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";
     SubBlockType["HubspotForm"] = "hubspot-form";
     /**
-     * @deprecated Will be removed, use BasicCard instead
+     * @deprecated Will be moved to params use BasicCard instead
      */
     SubBlockType["Card"] = "card";
 })(SubBlockType = exports.SubBlockType || (exports.SubBlockType = {}));

package/build/cjs/schema/index.js

@@ -14,8 +14,8 @@ const getBlocksCases = (blocks) => {
 exports.getBlocksCases = getBlocksCases;
 function generateDefaultSchema(config) {
     const { cards = {}, blocks = {}, extensions = {} } = config !== null && config !== void 0 ? config : {};
-    const blockValidators = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, sub_blocks_1.Divider), blocks_1.ExtendedFeaturesBlock), blocks_1.PromoFeaturesBlock), blocks_1.SliderBlock), blocks_1.QuestionsBlock), blocks_1.HeaderBlock), blocks_1.BannerBlock), blocks_1.CompaniesBlock), blocks_1.MediaBlock), blocks_1.MapBlock), blocks_1.InfoBlock), blocks_1.SecurityBlock), blocks_1.TableBlock), blocks_1.TabsBlock), blocks_1.LinkTableBlock), blocks_1.HeaderSliderBlock), blocks_1.IconsBlock), blocks_1.CardLayoutBlock), blocks_1.ContentLayoutBlock), blocks_1.ShareBlock);
-    const cardValidators = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, sub_blocks_1.PartnerBlock), sub_blocks_1.MediaCardBlock), blocks_1.BannerCard), sub_blocks_1.PriceDetailedBlock), sub_blocks_1.TutorialCard), sub_blocks_1.BackgroundCard), sub_blocks_1.NewsCard), sub_blocks_1.Quote), sub_blocks_1.BasicCard);
+    const blockValidators = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, sub_blocks_1.Divider), blocks_1.ExtendedFeaturesBlock), blocks_1.PromoFeaturesBlock), blocks_1.SliderBlock), blocks_1.QuestionsBlock), blocks_1.HeaderBlock), blocks_1.BannerBlock), blocks_1.CompaniesBlock), blocks_1.MediaBlock), blocks_1.MapBlock), blocks_1.InfoBlock), blocks_1.SecurityBlock), blocks_1.TableBlock), blocks_1.TabsBlock), blocks_1.SimpleBlock), blocks_1.LinkTableBlock), blocks_1.PreviewBlock), blocks_1.HeaderSliderBlock), blocks_1.IconsBlock), blocks_1.CardLayoutBlock), blocks_1.ContentLayoutBlock), blocks_1.ShareBlock);
+    const cardValidators = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, sub_blocks_1.PartnerBlock), sub_blocks_1.MediaCardBlock), blocks_1.BannerCard), sub_blocks_1.PriceDetailedBlock), sub_blocks_1.TutorialCard), sub_blocks_1.BackgroundCard), sub_blocks_1.NewsCard), sub_blocks_1.CardWithImage), sub_blocks_1.Quote), sub_blocks_1.BasicCard);
     const constructorBlockSchemaNames = [
         'divider',
         'quote',
@@ -34,6 +34,7 @@ function generateDefaultSchema(config) {
         'security-block',
         'table-block',
         'tabs-block',
+        'simple-block',
         'link-table-block',
         'preview-block',
         'price-detailed',
@@ -52,6 +53,7 @@ function generateDefaultSchema(config) {
         'tutoral-card',
         'background-card',
         'news-card',
+        'card-with-image',
         'quote',
         'basic-card',
         'layout-item',

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

@@ -2,6 +2,7 @@ export * from '../../blocks/Banner/schema';
 export * from '../../blocks/Companies/schema';
 export * from '../../blocks/ExtendedFeatures/schema';
 export * from '../../blocks/PromoFeaturesBlock/schema';
+export * from '../../blocks/Simple/schema';
 export * from '../../blocks/Header/schema';
 export * from '../../blocks/Info/schema';
 export * from '../../blocks/Media/schema';
@@ -12,6 +13,7 @@ export * from '../../blocks/Slider/schema';
 export * from '../../blocks/Table/schema';
 export * from '../../blocks/LinkTable/schema';
 export * from '../../blocks/Tabs/schema';
+export * from '../../blocks/Preview/schema';
 export * from '../../blocks/HeaderSlider/schema';
 export * from '../../blocks/Icons/schema';
 export * from '../../blocks/CardLayout/schema';