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

package/build/esm/blocks/Preview/MediaContent/PreviewContent.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import { block } from '../../../utils';
+import YFMWrapper from '../../../components/YFMWrapper/YFMWrapper';
+import './PreviewContent.css';
+const b = block('preview-content-block');
+const PreviewContent = (props) => {
+    const { id, title, description = '', switching, onClick, mods } = props;
+    return (React.createElement("div", { key: id, className: b('content-wrapper') },
+        React.createElement("div", { className: b('content', mods), onClick: onClick },
+            React.createElement("div", { className: b('loader-block', Object.assign(Object.assign({}, mods), { auto: switching })) }),
+            React.createElement("h2", { className: b('title') }, title),
+            description && (React.createElement("div", { className: b('description') },
+                React.createElement(YFMWrapper, { content: description, modifiers: { constructor: true } }))))));
+};
+export default PreviewContent;

package/build/esm/blocks/Preview/MediaContent/PreviewMedia.css

@@ -0,0 +1,54 @@
+.pc-preview-media-block__title {
+  margin: 0;
+}
+
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+@media (min-width: 769px) {
+  .pc-preview-media-block.pc-AnimateBlock .pc-preview-media-block __media, .pc-AnimateBlock .pc-preview-media-block .pc-preview-media-block __media {
+    position: relative;
+    top: 100px;
+    opacity: 0;
+  }
+  .pc-preview-media-block.pc-AnimateBlock.animate .pc-preview-media-block __media, .pc-AnimateBlock .pc-preview-media-block.animate .pc-preview-media-block __media {
+    top: 0;
+    opacity: 1;
+    transition: top 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    transition-delay: 0s;
+  }
+}
+.pc-preview-media-block__title {
+  font-size: var(--yc-text-display-2-font-size);
+  line-height: var(--yc-text-display-2-line-height);
+  color: var(--pc-text-header-color);
+  font-weight: var(--yc-text-accent-font-weight);
+}
+@media (max-width: 576px) {
+  .pc-preview-media-block__title {
+    font-size: var(--yc-text-display-1-font-size);
+    line-height: var(--yc-text-display-1-line-height);
+  }
+}
+.pc-preview-media-block__media {
+  box-shadow: 0 2px 8px var(--pc-color-sfx-shadow), 0 4px 24px var(--pc-color-sfx-shadow);
+  overflow-x: hidden;
+  border-radius: var(--pc-border-radius);
+  overflow: hidden;
+  display: none;
+}
+.pc-preview-media-block__media img {
+  width: 100%;
+}
+.pc-preview-media-block__media img,
+.pc-preview-media-block__media video,
+.pc-preview-media-block__media iframe {
+  border-radius: var(--pc-border-radius);
+}
+.pc-preview-media-block__media_active {
+  display: block;
+}
+@media (max-width: 769px) {
+  .pc-preview-media-block__media_active {
+    width: 100%;
+  }
+}

package/build/esm/blocks/Preview/MediaContent/PreviewMedia.d.ts

@@ -0,0 +1,10 @@
+import { MediaProps, Modifiers } from '../../../models';
+import './PreviewMedia.css';
+interface PreviewMediaProps {
+    id: number;
+    media: MediaProps;
+    play: boolean;
+    mods: Modifiers | null;
+}
+declare const PreviewMedia: (props: PreviewMediaProps) => JSX.Element;
+export default PreviewMedia;

package/build/esm/blocks/Preview/MediaContent/PreviewMedia.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { block } from '../../../utils';
+import Media from '../../../components/Media/Media';
+import './PreviewMedia.css';
+const b = block('preview-media-block');
+const PreviewMedia = (props) => {
+    const { id, media, play, mods } = props;
+    return (React.createElement("div", { key: id, className: b('media', mods) },
+        React.createElement(Media, Object.assign({}, media, { playVideo: play }))));
+};
+export default PreviewMedia;

package/build/esm/blocks/Preview/Preview.css

@@ -0,0 +1,50 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-preview-block__row > * {
+  height: fit-content;
+  margin: auto;
+}
+.pc-preview-block__row_reverse {
+  flex-direction: row-reverse;
+}
+.pc-preview-block__row > .col.pc-preview-media-content-block__media {
+  padding: 0 16px;
+}
+@media (min-width: 769px) {
+  .pc-preview-block__row {
+    display: flex;
+  }
+  .pc-preview-block__row > .col.pc-preview-media-content-block__content {
+    padding: 0 48px 0 16px;
+  }
+  .pc-preview-block__row_reverse > .col.pc-preview-media-content-block__content {
+    padding: 0 16px 0 48px;
+  }
+}
+@media (min-width: 577px) and (max-width: 769px) {
+  .pc-preview-block__row_reverse {
+    flex-direction: row;
+  }
+  .pc-preview-block__row > .col.pc-preview-media-content-block__content {
+    padding: 0;
+  }
+  .pc-preview-block__row > .col.pc-preview-media-content-block__media {
+    padding: 0 32px;
+  }
+  .pc-preview-block .pc-preview-block__row_reverse.row, .pc-preview-block .pc-preview-block__row.row {
+    margin-left: -32px;
+    margin-right: -32px;
+  }
+}
+@media (max-width: 577px) {
+  .pc-preview-block__row > .col.pc-preview-media-content-block__content {
+    padding: 0;
+  }
+  .pc-preview-block__row > .col.pc-preview-media-content-block__media {
+    padding: 0 20px;
+  }
+  .pc-preview-block .pc-preview-block__row_reverse.row, .pc-preview-block .pc-preview-block__row.row {
+    margin-left: -20px;
+    margin-right: -20px;
+  }
+}

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

@@ -0,0 +1,4 @@
+import { PreviewBlockProps } from '../../models';
+import './Preview.css';
+export declare const PreviewBlock: (props: PreviewBlockProps) => JSX.Element;
+export default PreviewBlock;

package/build/esm/blocks/Preview/Preview.js

@@ -0,0 +1,126 @@
+import { block, doSmoothScroll } from '../../utils';
+import React, { useCallback, useContext, useEffect, useState } from 'react';
+import { BreakpointContext } from '../../context/breakpointContext';
+import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
+import MediaContent from './MediaContent/MediaContent';
+import { Row } from '../../grid';
+import { BREAKPOINTS } from '../../constants';
+import { useIntersection } from '../../hooks/useIntersection';
+import './Preview.css';
+const b = block('preview-block');
+const SWITCHING_INTERVAL = 5 * 1000;
+const WIDTH_MENU_ITEM_MD_SIZE = 275;
+const INDENT_MENU_ITEM_MD_SIZE = 16;
+const SCROLL_ITEM_SECONDS = 1;
+const SCROLL_ITEM_SPEED = 2;
+const CLASSNAME_DESCRIPTION_YFM_BLOCK = 'yfm';
+const CLASSNAME_CONTENT_WRAPPER = 'preview-media-content-block__content-wrapper';
+const INDENT_BETWEEN_TITLE_DESCRIPTION = 16;
+export const PreviewBlock = (props) => {
+    const { direction = 'content-media', animated, items, title, description, ratioMediaContent = '1-1', stopVideo = false, 
+    // TODO YDB-server doesn't see previewRef.current and doesn't update the component CLOUDFRONT-9395
+    showImmediately = false, } = props;
+    const breakpoint = useContext(BreakpointContext);
+    const isDesktop = breakpoint >= BREAKPOINTS.md;
+    const menuRef = React.useRef(null);
+    const previewRef = React.useRef(null);
+    const inViewport = useIntersection(previewRef.current);
+    const [stopSwitching, setStopSwitching] = useState(stopVideo);
+    const [activeSlide, setActiveSlide] = useState(-1);
+    const [autoSwitchTimerId, setAutoSwitchTimerId] = useState(0);
+    const isActiveBlock = useCallback((id, isMediaBlock = false) => {
+        return isMediaBlock || inViewport ? activeSlide === id : false;
+    }, [inViewport, activeSlide]);
+    const changeActiveSlide = useCallback((params) => {
+        const { current, nextSlide, currentSlide, timerId } = params;
+        if (isDesktop) {
+            changeDescriptionHeight(current, nextSlide, currentSlide);
+        }
+        else {
+            changeMenuScroll(current, nextSlide, currentSlide);
+        }
+        setActiveSlide(nextSlide);
+        clearTimeout(timerId);
+    }, [isDesktop]);
+    useEffect(() => {
+        // TODO YDB-server doesn't see previewRef.current and doesn't update the component CLOUDFRONT-9395
+        if (!items[activeSlide] && (showImmediately || inViewport)) {
+            setActiveSlide(0);
+            if (isDesktop) {
+                changeDescriptionHeight(menuRef.current, 0);
+            }
+        }
+    }, [inViewport, activeSlide, isDesktop, items, showImmediately]);
+    useEffect(() => {
+        if (stopSwitching || !inViewport) {
+            return () => { };
+        }
+        const timerId = setTimeout(() => {
+            if (stopSwitching) {
+                clearTimeout(timerId);
+                return;
+            }
+            const nextSlide = activeSlide + 1 >= items.length ? 0 : activeSlide + 1;
+            changeActiveSlide({
+                current: menuRef.current,
+                nextSlide,
+                currentSlide: activeSlide,
+                timerId: timerId,
+            });
+        }, SWITCHING_INTERVAL);
+        setAutoSwitchTimerId(timerId);
+        return () => clearTimeout(timerId);
+    }, [changeActiveSlide, activeSlide, items.length, stopSwitching, inViewport]);
+    const showMediaContent = useCallback((nextSlide) => {
+        changeActiveSlide({
+            current: menuRef.current,
+            nextSlide,
+            currentSlide: activeSlide,
+            timerId: autoSwitchTimerId,
+        });
+        setStopSwitching(true);
+    }, [changeActiveSlide, activeSlide, autoSwitchTimerId]);
+    return (React.createElement(AnimateBlock, { className: b(), animate: animated },
+        React.createElement(Row, { ref: previewRef, className: b('row', { reverse: direction === 'media-content' }) },
+            React.createElement(MediaContent, { ref: menuRef, items: items, title: title, description: description, ratioMediaContent: ratioMediaContent, switching: !stopSwitching, isActiveBlock: isActiveBlock, showMediaContent: showMediaContent }))));
+};
+function changeMenuScroll(element, nextSlide, activeSlide) {
+    if (!element) {
+        return;
+    }
+    const scrollPosition = element.scrollLeft;
+    const endPosition = nextSlide === 0 ? 0 : nextSlide * WIDTH_MENU_ITEM_MD_SIZE + INDENT_MENU_ITEM_MD_SIZE;
+    const distance = Math.abs(scrollPosition - endPosition);
+    const isReverse = nextSlide === 0 || nextSlide < activeSlide;
+    const scrollOptions = {
+        distance,
+        timeSeconds: SCROLL_ITEM_SECONDS,
+        speed: SCROLL_ITEM_SPEED,
+        reverseParams: isReverse ? { distance } : undefined,
+    };
+    doSmoothScroll(element, scrollPosition, scrollOptions);
+}
+function changeDescriptionHeight(element, nextActiveSlide, prevActiveSlide = 0) {
+    const contentWrapper = element === null || element === void 0 ? void 0 : element.getElementsByClassName(CLASSNAME_CONTENT_WRAPPER);
+    if (!contentWrapper || contentWrapper.length === 0) {
+        return;
+    }
+    const menuItems = contentWrapper[0].children;
+    updateHeight(menuItems, nextActiveSlide);
+    if (nextActiveSlide !== prevActiveSlide) {
+        updateHeight(menuItems, prevActiveSlide, false);
+    }
+}
+function updateHeight(menuItems, slide, isExpand = true) {
+    const item = menuItems[slide];
+    const yfmBlock = item.getElementsByClassName(CLASSNAME_DESCRIPTION_YFM_BLOCK)[0];
+    if (yfmBlock) {
+        const yfmBlockElement = yfmBlock;
+        const yfmBlockHeight = yfmBlockElement.offsetHeight;
+        const yfmBlockOffsetParent = yfmBlockElement.offsetParent;
+        yfmBlockOffsetParent.style.height = isExpand
+            ? `${yfmBlockHeight + INDENT_BETWEEN_TITLE_DESCRIPTION}px`
+            : '0px';
+    }
+}
+export default PreviewBlock;

package/build/esm/blocks/Preview/schema.d.ts

@@ -0,0 +1,40 @@
+export declare const PreviewBlock: {
+    'preview-block': {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            title: {
+                type: string;
+                contentType: string;
+            };
+            description: {
+                type: string;
+                contentType: string;
+            };
+            direction: {
+                type: string;
+                enum: string[];
+            };
+            ratioMediaContent: {
+                type: string;
+                enum: string[];
+            };
+            items: {
+                type: string;
+                items: {
+                    type: string;
+                    properties: {
+                        when: {
+                            type: string;
+                        };
+                    };
+                };
+            };
+            animated: {
+                type: string;
+            };
+            type: {};
+            when: {};
+        };
+    };
+};

package/build/esm/blocks/Preview/schema.js

@@ -0,0 +1,50 @@
+import { filteredArray } from '../../schema/validators/utils';
+import { AnimatableProps, BaseProps, mediaDirection, withTheme, } from '../../schema/validators/common';
+import { Media } from '../Media/schema';
+const previewRatioMediaContent = ['2-1', '1-1'];
+const PreviewContentItem = {
+    additionalProperties: false,
+    required: ['title', 'description'],
+    properties: {
+        title: {
+            type: 'string',
+            contentType: 'text',
+        },
+        description: {
+            type: 'string',
+            contentType: 'yfm',
+        },
+    },
+};
+const PreviewItem = {
+    type: 'object',
+    additionalProperties: false,
+    required: ['type', 'media', 'content'],
+    properties: {
+        type: {
+            type: 'string',
+            enum: ['video', 'image'],
+        },
+        media: withTheme(Media),
+        content: PreviewContentItem,
+    },
+};
+export const PreviewBlock = {
+    'preview-block': {
+        additionalProperties: false,
+        required: ['title', 'items'],
+        properties: Object.assign(Object.assign(Object.assign({}, BaseProps), AnimatableProps), { title: {
+                type: 'string',
+                contentType: 'text',
+            }, description: {
+                type: 'string',
+                contentType: 'yfm',
+            }, direction: {
+                type: 'string',
+                enum: mediaDirection,
+            }, ratioMediaContent: {
+                type: 'string',
+                enum: previewRatioMediaContent,
+            }, items: filteredArray(PreviewItem) }),
+    },
+};

package/build/esm/blocks/Simple/Simple.css

@@ -0,0 +1,22 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+@media (min-width: 769px) {
+  .pc-simple-block.pc-AnimateBlock .pc-simple-block__animate-block, .pc-AnimateBlock .pc-simple-block .pc-simple-block__animate-block {
+    position: relative;
+    top: 100px;
+    opacity: 0;
+  }
+  .pc-simple-block.pc-AnimateBlock.animate .pc-simple-block__animate-block, .pc-AnimateBlock .pc-simple-block.animate .pc-simple-block__animate-block {
+    top: 0;
+    opacity: 1;
+    transition: top 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    transition-delay: 0.5s;
+  }
+}
+.pc-simple-block__animate-block {
+  margin-top: 20px;
+}
+.pc-simple-block__description {
+  margin-top: 16px;
+  font-size: var(--yc-text-body-2-font-size);
+}

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

@@ -0,0 +1,4 @@
+import { SimpleBlockProps, WithChildren } from '../../models';
+import './Simple.css';
+export declare const SimpleBlock: (props: WithChildren<SimpleBlockProps>) => JSX.Element;
+export default SimpleBlock;

package/build/esm/blocks/Simple/Simple.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import { block } from '../../utils';
+import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
+import BlockHeader from '../../components/BlockHeader/BlockHeader';
+import YFMWrapper from '../../components/YFMWrapper/YFMWrapper';
+import './Simple.css';
+const b = block('simple-block');
+export const SimpleBlock = (props) => {
+    const { title, description, animated = true, children } = props;
+    const blockHeader = title && React.createElement(BlockHeader, { title: title });
+    return (React.createElement(AnimateBlock, { className: b(), animate: animated },
+        React.createElement("div", null,
+            blockHeader,
+            React.createElement("div", { className: b('description') },
+                React.createElement(YFMWrapper, { content: description, modifiers: { constructor: true } })),
+            React.createElement("div", { className: b('animate-block') }, children))));
+};
+export default SimpleBlock;

package/build/esm/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/esm/blocks/Simple/schema.js

@@ -0,0 +1,11 @@
+import { BlockBaseProps, TitleProps, AnimatableProps, ChildrenProps, } from '../../schema/validators/common';
+export const SimpleBlock = {
+    'simple-block': {
+        additionalProperties: false,
+        required: ['title', 'description'],
+        properties: Object.assign(Object.assign(Object.assign({ title: TitleProps, description: {
+                type: 'string',
+                contentType: 'yfm',
+            } }, BlockBaseProps), AnimatableProps), { children: ChildrenProps }),
+    },
+};

package/build/esm/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/esm/blocks/index.js

@@ -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/esm/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/esm/blocks/validators.js

@@ -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/esm/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/esm/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/esm/constructor-items.js

@@ -1,14 +1,16 @@
 import { BlockType, SubBlockType } from './models';
-import { Partner, PriceDetailed, MediaCard, NewsCard, TutorialCard, LayoutItem, BackgroundCard, Content, Quote, Divider, BannerCard, BasicCard, } from './sub-blocks';
-import { BannerBlock, CompaniesBlock, MediaBlock, MapBlock, InfoBlock, SecurityBlock, SliderBlock, ExtendedFeaturesBlock, PromoFeaturesBlock, QuestionsBlock, TableBlock, TabsBlock, LinkTableBlock, HeaderBlock, IconsBlock, HeaderSliderBlock, CardLayoutBlock, ContentLayoutBlock, ShareBlock, FilterBlock, } from './blocks';
+import { Partner, PriceDetailed, MediaCard, NewsCard, TutorialCard, CardWithImage, LayoutItem, BackgroundCard, Content, Quote, Divider, BannerCard, BasicCard, } from './sub-blocks';
+import { BannerBlock, CompaniesBlock, SimpleBlock, MediaBlock, MapBlock, PreviewBlock, InfoBlock, SecurityBlock, SliderBlock, ExtendedFeaturesBlock, PromoFeaturesBlock, QuestionsBlock, TableBlock, TabsBlock, LinkTableBlock, HeaderBlock, IconsBlock, HeaderSliderBlock, CardLayoutBlock, ContentLayoutBlock, ShareBlock, FilterBlock, } from './blocks';
 export const blockMap = {
     [BlockType.SliderBlock]: SliderBlock,
+    [BlockType.SimpleBlock]: SimpleBlock,
     [BlockType.ExtendedFeaturesBlock]: ExtendedFeaturesBlock,
     [BlockType.PromoFeaturesBlock]: PromoFeaturesBlock,
     [BlockType.QuestionsBlock]: QuestionsBlock,
     [BlockType.BannerBlock]: BannerBlock,
     [BlockType.CompaniesBlock]: CompaniesBlock,
     [BlockType.MediaBlock]: MediaBlock,
+    [BlockType.PreviewBlock]: PreviewBlock,
     [BlockType.InfoBlock]: InfoBlock,
     [BlockType.SecurityBlock]: SecurityBlock,
     [BlockType.TableBlock]: TableBlock,
@@ -38,6 +40,10 @@ export const subBlockMap = {
     [SubBlockType.BannerCard]: BannerCard,
     [SubBlockType.NewsCard]: NewsCard,
     [SubBlockType.LayoutItem]: LayoutItem,
+    /**
+     * @deprecated Use LayoutItem
+     */
+    [SubBlockType.CardWithImage]: CardWithImage,
     [SubBlockType.BackgroundCard]: BackgroundCard,
     [SubBlockType.BasicCard]: BasicCard,
     [SubBlockType.Content]: Content,

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

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

package/build/esm/context/breakpointContext/breakpointContext.js

@@ -0,0 +1,3 @@
+import React from 'react';
+import { BREAKPOINTS } from '../../constants';
+export const BreakpointContext = React.createContext(BREAKPOINTS.sm);

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

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

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

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

package/build/esm/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/esm/hooks/index.js

@@ -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/esm/hooks/useIntersection.d.ts

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