@gravity-ui/page-constructor 1.9.0 → 1.9.1-alpha.1

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [1.9.1](https://github.com/gravity-ui/page-constructor/compare/v1.9.0...v1.9.1) (2022-12-05)
+
+
+### Bug Fixes
+
+* **Tabs:** player video height ([a372ddb](https://github.com/gravity-ui/page-constructor/commit/a372ddbbde003ef82818ba167adbff0e8bf57905))
+
 ## [1.9.0](https://github.com/gravity-ui/page-constructor/compare/v1.8.2...v1.9.0) (2022-12-05)
 
 

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

@@ -0,0 +1,3 @@
+import { ShareBlockProps } from '../../models';
+declare const Share: ({ items, title }: ShareBlockProps) => JSX.Element;
+export default Share;

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

@@ -0,0 +1,24 @@
+export declare const ShareBlock: {
+    'share-block': {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            title: {
+                type: string;
+            };
+            items: {
+                type: string;
+                items: {
+                    type: string;
+                    properties: {
+                        when: {
+                            type: string;
+                        };
+                    };
+                };
+            };
+            type: {};
+            when: {};
+        };
+    };
+};

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

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ShareBlock = void 0;
+const utils_1 = require("../../schema/validators/utils");
+const common_1 = require("../../schema/validators/common");
+exports.ShareBlock = {
+    'share-block': {
+        additionalProperties: false,
+        required: ['items'],
+        properties: Object.assign(Object.assign({}, common_1.BaseProps), { title: {
+                type: 'string',
+            }, items: (0, utils_1.filteredArray)({
+                properties: {
+                    type: 'string',
+                    enum: ['telegram', 'facebook', 'twitter', 'vk'],
+                },
+            }) }),
+    },
+};

package/build/cjs/blocks/Tabs/Tabs.js

@@ -13,14 +13,19 @@ const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
 const utils_2 = require("../../components/Media/Image/utils");
 const ButtonTabs_1 = (0, tslib_1.__importDefault)(require("../../components/ButtonTabs/ButtonTabs"));
 const sub_blocks_1 = require("../../sub-blocks");
+const VideoBlock_1 = require("../../components/VideoBlock/VideoBlock");
 const b = (0, utils_1.block)('tabs-block');
 const TabsBlock = ({ items, title, description, animated, tabsColSizes, centered, direction = 'media-content', }) => {
+    var _a;
     const [activeTab, setActiveTab] = (0, react_1.useState)(items[0].tabName);
     const [play, setPlay] = (0, react_1.useState)(false);
     const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
     const tabs = items.map(({ tabName }) => ({ title: tabName, id: tabName }));
     const activeTabData = items.find(({ tabName }) => tabName === activeTab);
     const isReverse = direction === 'content-media';
+    const ref = (0, react_1.useRef)(null);
+    const mediaWidth = (_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.offsetWidth;
+    const mediaHeight = mediaWidth && (0, VideoBlock_1.getHeight)(mediaWidth);
     let imageProps;
     if (activeTabData) {
         const themedImage = (0, utils_1.getThemedValue)(activeTabData.image, theme);
@@ -40,7 +45,7 @@ const TabsBlock = ({ items, title, description, animated, tabsColSizes, centered
             all: grid_1.GridColumnOrderClasses.Last,
             md: grid_1.GridColumnOrderClasses.First,
         }, className: b('col', { centered: centered }) },
-        (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (react_1.default.createElement(Media_1.default, Object.assign({}, (0, utils_1.getThemedValue)(activeTabData.media, theme), { key: activeTab, className: b('media'), playVideo: play }))),
+        react_1.default.createElement("div", { ref: ref }, (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (react_1.default.createElement(Media_1.default, Object.assign({}, (0, utils_1.getThemedValue)(activeTabData.media, theme), { key: activeTab, className: b('media'), playVideo: play, height: mediaHeight })))),
         imageProps && (react_1.default.createElement(react_1.Fragment, null,
             react_1.default.createElement(FullscreenImage_1.default, Object.assign({}, imageProps, { imageClassName: b('image') })),
             (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.caption) && (react_1.default.createElement("p", { className: b('caption') }, activeTabData.caption))))));

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

@@ -17,3 +17,4 @@ export { default as IconsBlock } from './Icons/Icons';
 export { default as HeaderSliderBlock } from './HeaderSlider/HeaderSlider';
 export { default as CardLayoutBlock } from './CardLayout/CardLayout';
 export { default as ContentLayoutBlock } from './ContentLayout/ContentLayout';
+export { default as ShareBlock } from './Share/Share';

package/build/cjs/blocks/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-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.MediaBlock = exports.InfoBlock = exports.SimpleBlock = exports.CompaniesBlock = exports.BannerBlock = void 0;
+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.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");
@@ -42,3 +42,5 @@ var CardLayout_1 = require("./CardLayout/CardLayout");
 Object.defineProperty(exports, "CardLayoutBlock", { enumerable: true, get: function () { return __importDefault(CardLayout_1).default; } });
 var ContentLayout_1 = require("./ContentLayout/ContentLayout");
 Object.defineProperty(exports, "ContentLayoutBlock", { enumerable: true, get: function () { return __importDefault(ContentLayout_1).default; } });
+var Share_1 = require("./Share/Share");
+Object.defineProperty(exports, "ShareBlock", { enumerable: true, get: function () { return __importDefault(Share_1).default; } });

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

@@ -16,3 +16,4 @@ 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

@@ -19,3 +19,4 @@ const tslib_1 = require("tslib");
 (0, tslib_1.__exportStar)(require("./Simple/schema"), exports);
 (0, tslib_1.__exportStar)(require("./Slider/schema"), exports);
 (0, tslib_1.__exportStar)(require("./Table/schema"), exports);
+(0, tslib_1.__exportStar)(require("./Share/schema"), exports);

package/build/cjs/components/Media/Media.js

@@ -22,7 +22,7 @@ const Media = (props) => {
             result.push(react_1.default.createElement(Video_1.default, { key: "video", video: video, videoClassName: videoClassName, height: height, metrika: metrika, playVideo: playVideo, previewImg: previewImg, playButton: playButton, customBarControlsClassName: customBarControlsClassName, hasVideoFallback: hasVideoFallback, setHasVideoFallback: setHasVideoFallback }));
         }
         if (youtube) {
-            result = (react_1.default.createElement(VideoBlock_1.default, { className: b('youtube', youtubeClassName), record: youtube, attributes: { color: 'white', rel: '0' }, previewImg: previewImg }));
+            result = (react_1.default.createElement(VideoBlock_1.default, { className: b('youtube', youtubeClassName), record: youtube, attributes: { color: 'white', rel: '0' }, previewImg: previewImg, height: height }));
         }
         if (dataLens) {
             result = react_1.default.createElement(DataLens_1.default, { dataLens: dataLens });

package/build/cjs/components/Media/Video/Video.js

@@ -31,15 +31,16 @@ const Video = (props) => {
     }, [playVideo, video, setHasVideoFallback]);
     const reactPlayerBlock = (0, react_1.useMemo)(() => {
         const { src, loop, controls, muted, autoplay = true, elapsedTime, playButton } = video;
-        return (react_1.default.createElement(ReactPlayer_1.default, { className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: Boolean(loop), controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, metrika: metrika }));
+        return (react_1.default.createElement(ReactPlayer_1.default, { className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: Boolean(loop), controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, metrika: metrika, height: height }));
     }, [
         video,
-        metrika,
+        height,
+        videoClassName,
         previewImg,
         playVideo,
-        videoClassName,
         commonPlayButton,
         customBarControlsClassName,
+        metrika,
     ]);
     const defaultVideoBlock = (0, react_1.useMemo)(() => {
         return video.src.length && !hasVideoFallback ? (react_1.default.createElement("div", { className: b('wrap', videoClassName), style: { height } },

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

@@ -7,6 +7,7 @@ export interface ReactPlayerBlockProps extends Omit<MediaVideoProps, 'loop' | 's
     customBarControlsClassName?: string;
     showPreview?: boolean;
     onClickPreview?: () => void;
+    height?: number;
     children?: React.ReactNode;
 }
 export declare const ReactPlayerBlock: React.ForwardRefExoticComponent<ReactPlayerBlockProps & React.RefAttributes<ReactPlayerBlockHandler>>;

package/build/cjs/components/ReactPlayer/ReactPlayer.js

@@ -19,7 +19,7 @@ const FPS = 60;
 exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
     const isMobile = (0, react_1.useContext)(mobileContext_1.MobileContext);
     const { metrika } = (0, react_1.useContext)(metrikaContext_1.MetrikaContext);
-    const { src, previewImgUrl, loop = false, controls = models_1.MediaVideoControlsType.Default, muted: initiallyMuted = false, elapsedTime, playButton, className, customBarControlsClassName, showPreview, onClickPreview, metrika: videoMetrika, } = props;
+    const { src, previewImgUrl, loop = false, controls = models_1.MediaVideoControlsType.Default, muted: initiallyMuted = false, elapsedTime, playButton, className, customBarControlsClassName, showPreview, onClickPreview, metrika: videoMetrika, height, } = props;
     const { type = models_1.PlayButtonType.Default, theme = models_1.PlayButtonThemes.Blue, text, className: buttonClassName, } = playButton || {};
     const autoPlay = Boolean(!isMobile && !previewImgUrl && props.autoplay);
     const mute = initiallyMuted || autoPlay;
@@ -28,7 +28,7 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
     const [playerRef, setPlayerRef] = (0, react_1.useState)();
     const [isPlaying, setIsPlaying] = (0, react_1.useState)(autoPlay);
     const [playedPercent, setPlayedPercent] = (0, react_1.useState)(0);
-    const [height, setHeight] = (0, react_1.useState)(0);
+    const [currentHeight, setCurrentHeight] = (0, react_1.useState)(height);
     const [width, setWidth] = (0, react_1.useState)(0);
     const [muted, setMuted] = (0, react_1.useState)(mute);
     const [started, setStarted] = (0, react_1.useState)(autoPlay);
@@ -73,7 +73,7 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
                     parseFloat(paddingLeft) -
                     parseFloat(paddingRight);
                 setWidth(newWidth);
-                setHeight(Math.floor(getHeight(newWidth)));
+                setCurrentHeight(Math.floor(getHeight(newWidth)));
             }
         }, 200);
         updateSize();
@@ -179,8 +179,8 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
                 },
             }, elapsedTimePercent: elapsedTimePercent }));
     }, [controls, isPlaying, customBarControlsClassName, changeMute]);
-    return (react_1.default.createElement("div", { className: b({ wrapper: !height }, className), ref: ref, onClick: handleClick },
-        react_1.default.createElement(react_player_1.default, { className: b('player'), url: src, muted: muted, controls: controls === models_1.MediaVideoControlsType.Default, height: height || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: setPlayerRef, onPlay: onPlay, onPause: onPause, onProgress: onProgress, onEnded: onEnded }),
+    return (react_1.default.createElement("div", { className: b({ wrapper: !currentHeight }, className), ref: ref, onClick: handleClick },
+        react_1.default.createElement(react_player_1.default, { className: b('player'), url: src, muted: muted, controls: controls === models_1.MediaVideoControlsType.Default, height: currentHeight || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: setPlayerRef, onPlay: onPlay, onPause: onPause, onProgress: onProgress, onEnded: onEnded }),
         renderCustomBarControls(muted, playedPercent)));
 });
 function getHeight(width) {

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

@@ -3,6 +3,7 @@ export declare const AUTOPLAY_ATTRIBUTES: {
     autoplay: number;
     mute: number;
 };
+export declare function getHeight(width: number): number;
 export interface VideoBlockProps {
     id?: string;
     stream?: string;
@@ -11,6 +12,7 @@ export interface VideoBlockProps {
     className?: string;
     previewImg?: string;
     playButton?: React.ReactNode;
+    height?: number;
 }
 declare const VideoBlock: (props: VideoBlockProps) => JSX.Element | null;
 export default VideoBlock;

package/build/cjs/components/VideoBlock/VideoBlock.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.AUTOPLAY_ATTRIBUTES = void 0;
+exports.getHeight = exports.AUTOPLAY_ATTRIBUTES = void 0;
 const tslib_1 = require("tslib");
 const react_1 = (0, tslib_1.__importStar)(require("react"));
 const lodash_1 = (0, tslib_1.__importDefault)(require("lodash"));
@@ -36,14 +36,15 @@ function getVideoSrc(stream, record) {
 function getHeight(width) {
     return (width / 16) * 9;
 }
+exports.getHeight = getHeight;
 const VideoBlock = (props) => {
-    const { stream, record, attributes, className, id, previewImg, playButton } = props;
+    const { stream, record, attributes, className, id, previewImg, playButton, height } = props;
     const src = getVideoSrc(stream, record);
     const ref = (0, react_1.useRef)(null);
     const iframeRef = (0, react_1.useRef)();
     const [hidePreview, setHidePreview] = (0, react_1.useState)(false);
     const norender = (!stream && !record) || !src;
-    const [height, setHeight] = (0, react_1.useState)();
+    const [currentHeight, setCurrentHeight] = (0, react_1.useState)(height || undefined);
     const fullId = `${iframeId}-${id || src}`;
     const onPreviewClick = (0, react_1.useCallback)(() => {
         if (iframeRef.current) {
@@ -53,14 +54,14 @@ const VideoBlock = (props) => {
     }, [src, attributes]);
     (0, react_1.useEffect)(() => {
         const updateSize = lodash_1.default.debounce(() => {
-            setHeight(ref.current ? Math.round(getHeight(ref.current.offsetWidth)) : undefined);
+            setCurrentHeight(ref.current ? Math.round(getHeight(ref.current.offsetWidth)) : undefined);
         }, 100);
         updateSize();
         window.addEventListener('resize', updateSize);
         return () => {
             window.removeEventListener('resize', updateSize);
         };
-    }, []);
+    }, [height]);
     (0, react_1.useEffect)(() => {
         if (norender) {
             return;
@@ -89,7 +90,7 @@ const VideoBlock = (props) => {
     if (norender) {
         return null;
     }
-    return (react_1.default.createElement("div", { className: b(null, className), ref: ref, style: { height } }, previewImg && !hidePreview && (react_1.default.createElement("div", { className: b('preview'), onClick: onPreviewClick },
+    return (react_1.default.createElement("div", { className: b(null, className), ref: ref, style: { height: currentHeight } }, previewImg && !hidePreview && (react_1.default.createElement("div", { className: b('preview'), onClick: onPreviewClick },
         react_1.default.createElement(Image_1.default, { src: previewImg, className: b('image') }),
         playButton || (react_1.default.createElement("button", { className: b('button') },
             react_1.default.createElement(uikit_1.Icon, { className: b('icon'), data: icons_1.PlayVideo, size: 24 })))))));

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

@@ -18,6 +18,7 @@ export declare const blockMap: {
     "header-slider-block": ({ items, arrows, ...props }: import("./models").HeaderSliderBlockProps) => JSX.Element;
     "card-layout-block": ({ title, description, animated, colSizes, children, }: import("./blocks/CardLayout/CardLayout").CardLayoutBlockProps) => JSX.Element;
     "content-layout-block": (props: import("./models").ContentLayoutBlockProps) => JSX.Element;
+    "share-block": ({ items, title }: import("./models").ShareBlockProps) => JSX.Element;
 };
 export declare const subBlockMap: {
     divider: ({ size, border }: import("./models").DividerProps) => JSX.Element;

package/build/cjs/constructor-items.js

@@ -24,6 +24,7 @@ exports.blockMap = {
     [models_1.BlockType.HeaderSliderBlock]: blocks_1.HeaderSliderBlock,
     [models_1.BlockType.CardLayoutBlock]: blocks_1.CardLayoutBlock,
     [models_1.BlockType.ContentLayoutBlock]: blocks_1.ContentLayoutBlock,
+    [models_1.BlockType.ShareBlock]: blocks_1.ShareBlock,
 };
 exports.subBlockMap = {
     [models_1.SubBlockType.Divider]: sub_blocks_1.Divider,

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

@@ -2,9 +2,3 @@ export declare type ArrowDirection = 'left' | 'right';
 export interface ReactPlayerBlockHandler {
     pause: () => void;
 }
-export declare enum PCShareSocialNetwork {
-    Vk = "vk",
-    Telegram = "telegram",
-    Twitter = "twitter",
-    Facebook = "facebook"
-}

package/build/cjs/models/components.js

@@ -1,10 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PCShareSocialNetwork = void 0;
-var PCShareSocialNetwork;
-(function (PCShareSocialNetwork) {
-    PCShareSocialNetwork["Vk"] = "vk";
-    PCShareSocialNetwork["Telegram"] = "telegram";
-    PCShareSocialNetwork["Twitter"] = "twitter";
-    PCShareSocialNetwork["Facebook"] = "facebook";
-})(PCShareSocialNetwork = exports.PCShareSocialNetwork || (exports.PCShareSocialNetwork = {}));

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

@@ -24,7 +24,8 @@ export declare enum BlockType {
     HeaderBlock = "header-block",
     IconsBlock = "icons-block",
     CardLayoutBlock = "card-layout-block",
-    ContentLayoutBlock = "content-layout-block"
+    ContentLayoutBlock = "content-layout-block",
+    ShareBlock = "share-block"
 }
 export declare const BlockTypes: BlockType[];
 export declare const HeaderBlockTypes: BlockType[];
@@ -275,6 +276,16 @@ export interface ContentBlockProps {
     centered?: boolean;
     theme?: ContentTheme;
 }
+export declare enum PCShareSocialNetwork {
+    Vk = "vk",
+    Telegram = "telegram",
+    Twitter = "twitter",
+    Facebook = "facebook"
+}
+export interface ShareBlockProps {
+    items: PCShareSocialNetwork[];
+    title?: string;
+}
 export declare type HeaderBlockModel = {
     type: BlockType.HeaderBlock;
 } & HeaderBlockProps;
@@ -338,6 +349,9 @@ export declare type HeaderSliderBlockModel = {
 export declare type ContentLayoutBlockModel = {
     type: BlockType.ContentLayoutBlock;
 } & ContentLayoutBlockProps;
-declare type BlockModels = SliderBlockModel | ServiceDemoBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | CalculatorBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | InfoBlockModel | SecurityBlockModel | TableBlockModel | TabsBlockModel | SimpleBlockModel | LinkTableBlockModel | HeaderBlockModel | PreviewBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel;
+export declare type ShareBLockModel = {
+    type: BlockType.ShareBlock;
+} & ShareBlockProps;
+declare type BlockModels = SliderBlockModel | ServiceDemoBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | CalculatorBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | InfoBlockModel | SecurityBlockModel | TableBlockModel | TabsBlockModel | SimpleBlockModel | LinkTableBlockModel | HeaderBlockModel | PreviewBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel | ShareBLockModel;
 export declare type Block = BlockModels & BlockBaseProps;
 export {};

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

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SliderType = exports.SliderBreakpointNames = exports.HeaderBlockTypes = exports.BlockTypes = exports.BlockType = void 0;
+exports.PCShareSocialNetwork = exports.SliderType = exports.SliderBreakpointNames = exports.HeaderBlockTypes = exports.BlockTypes = exports.BlockType = void 0;
 var BlockType;
 (function (BlockType) {
     BlockType["PromoFeaturesBlock"] = "promo-features-block";
@@ -24,6 +24,7 @@ var BlockType;
     BlockType["IconsBlock"] = "icons-block";
     BlockType["CardLayoutBlock"] = "card-layout-block";
     BlockType["ContentLayoutBlock"] = "content-layout-block";
+    BlockType["ShareBlock"] = "share-block";
 })(BlockType = exports.BlockType || (exports.BlockType = {}));
 exports.BlockTypes = Object.values(BlockType);
 exports.HeaderBlockTypes = [BlockType.HeaderBlock, BlockType.HeaderSliderBlock];
@@ -39,3 +40,10 @@ var SliderType;
     SliderType["MediaCard"] = "media-card";
     SliderType["HeaderCard"] = "header-card";
 })(SliderType = exports.SliderType || (exports.SliderType = {}));
+var PCShareSocialNetwork;
+(function (PCShareSocialNetwork) {
+    PCShareSocialNetwork["Vk"] = "vk";
+    PCShareSocialNetwork["Telegram"] = "telegram";
+    PCShareSocialNetwork["Twitter"] = "twitter";
+    PCShareSocialNetwork["Facebook"] = "facebook";
+})(PCShareSocialNetwork = exports.PCShareSocialNetwork || (exports.PCShareSocialNetwork = {}));

package/build/cjs/schema/index.js

@@ -53,7 +53,7 @@ function generateDefaultSchema(config) {
                     },
                 },
                 select: { $data: '0/type' },
-                selectCases: 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({}, blocks_1.TabsBlock), blocks_1.SliderBlock), blocks_1.ExtendedFeaturesBlock), blocks_1.PromoFeaturesBlock), blocks_1.HeaderBlock), blocks_1.BannerBlock), blocks_1.CompaniesBlock), blocks_1.MediaBlock), blocks_1.InfoBlock), blocks_1.QuestionsBlock), blocks_1.SecurityBlock), blocks_1.TableBlock), blocks_1.SimpleBlock), blocks_1.LinkTableBlock), blocks_1.PreviewBlock), blocks_1.HeaderSliderBlock), blocks_1.IconsBlock), blocks_1.CardLayoutBlock), blocks_1.ContentLayoutBlock), sub_blocks_1.Divider), (0, exports.getBlocksCases)(blocks)),
+                selectCases: 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({}, blocks_1.TabsBlock), blocks_1.SliderBlock), blocks_1.ExtendedFeaturesBlock), blocks_1.PromoFeaturesBlock), blocks_1.HeaderBlock), blocks_1.BannerBlock), blocks_1.CompaniesBlock), blocks_1.MediaBlock), blocks_1.InfoBlock), blocks_1.QuestionsBlock), blocks_1.SecurityBlock), blocks_1.TableBlock), blocks_1.SimpleBlock), blocks_1.LinkTableBlock), blocks_1.PreviewBlock), blocks_1.HeaderSliderBlock), blocks_1.IconsBlock), blocks_1.CardLayoutBlock), blocks_1.ContentLayoutBlock), sub_blocks_1.Divider), blocks_1.ShareBlock), (0, exports.getBlocksCases)(blocks)),
             }),
             cards: (0, utils_1.filteredItem)({
                 type: 'object',

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

@@ -17,3 +17,4 @@ export * from '../../blocks/HeaderSlider/schema';
 export * from '../../blocks/Icons/schema';
 export * from '../../blocks/CardLayout/schema';
 export * from '../../blocks/ContentLayout/schema';
+export * from '../../blocks/Share/schema';

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

@@ -20,3 +20,4 @@ const tslib_1 = require("tslib");
 (0, tslib_1.__exportStar)(require("../../blocks/Icons/schema"), exports);
 (0, tslib_1.__exportStar)(require("../../blocks/CardLayout/schema"), exports);
 (0, tslib_1.__exportStar)(require("../../blocks/ContentLayout/schema"), exports);
+(0, tslib_1.__exportStar)(require("../../blocks/Share/schema"), exports);

package/build/cjs/text-transform/blocks.js

@@ -314,6 +314,12 @@ const config = {
             parser: parseContentLayoutTitle,
         },
     ],
+    [models_1.BlockType.ShareBlock]: [
+        {
+            fields: ['title'],
+            transformer: typografTransformer,
+        },
+    ],
 };
 function addRandomOrder(block) {
     if (block) {

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

@@ -0,0 +1,4 @@
+import { ShareBlockProps } from '../../models';
+import './Share.css';
+declare const Share: ({ items, title }: ShareBlockProps) => JSX.Element;
+export default Share;

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

@@ -0,0 +1,24 @@
+export declare const ShareBlock: {
+    'share-block': {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            title: {
+                type: string;
+            };
+            items: {
+                type: string;
+                items: {
+                    type: string;
+                    properties: {
+                        when: {
+                            type: string;
+                        };
+                    };
+                };
+            };
+            type: {};
+            when: {};
+        };
+    };
+};

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

@@ -0,0 +1,16 @@
+import { filteredArray } from '../../schema/validators/utils';
+import { BaseProps } from '../../schema/validators/common';
+export const ShareBlock = {
+    'share-block': {
+        additionalProperties: false,
+        required: ['items'],
+        properties: Object.assign(Object.assign({}, BaseProps), { title: {
+                type: 'string',
+            }, items: filteredArray({
+                properties: {
+                    type: 'string',
+                    enum: ['telegram', 'facebook', 'twitter', 'vk'],
+                },
+            }) }),
+    },
+};

package/build/esm/blocks/Tabs/Tabs.js

@@ -1,4 +1,4 @@
-import React, { Fragment, useContext, useState } from 'react';
+import React, { Fragment, useContext, useRef, useState } from 'react';
 import { block, getThemedValue } from '../../utils';
 import { Row, Col, GridColumnOrderClasses } from '../../grid';
 import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
@@ -9,15 +9,20 @@ import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
 import { getMediaImage } from '../../components/Media/Image/utils';
 import ButtonTabs from '../../components/ButtonTabs/ButtonTabs';
 import { Content } from '../../sub-blocks';
+import { getHeight } from '../../components/VideoBlock/VideoBlock';
 import './Tabs.css';
 const b = block('tabs-block');
 export const TabsBlock = ({ items, title, description, animated, tabsColSizes, centered, direction = 'media-content', }) => {
+    var _a;
     const [activeTab, setActiveTab] = useState(items[0].tabName);
     const [play, setPlay] = useState(false);
     const { themeValue: theme } = useContext(ThemeValueContext);
     const tabs = items.map(({ tabName }) => ({ title: tabName, id: tabName }));
     const activeTabData = items.find(({ tabName }) => tabName === activeTab);
     const isReverse = direction === 'content-media';
+    const ref = useRef(null);
+    const mediaWidth = (_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.offsetWidth;
+    const mediaHeight = mediaWidth && getHeight(mediaWidth);
     let imageProps;
     if (activeTabData) {
         const themedImage = getThemedValue(activeTabData.image, theme);
@@ -37,7 +42,7 @@ export const TabsBlock = ({ items, title, description, animated, tabsColSizes, c
             all: GridColumnOrderClasses.Last,
             md: GridColumnOrderClasses.First,
         }, className: b('col', { centered: centered }) },
-        (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (React.createElement(Media, Object.assign({}, getThemedValue(activeTabData.media, theme), { key: activeTab, className: b('media'), playVideo: play }))),
+        React.createElement("div", { ref: ref }, (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (React.createElement(Media, Object.assign({}, getThemedValue(activeTabData.media, theme), { key: activeTab, className: b('media'), playVideo: play, height: mediaHeight })))),
         imageProps && (React.createElement(Fragment, null,
             React.createElement(FullScreenImage, Object.assign({}, imageProps, { imageClassName: b('image') })),
             (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.caption) && (React.createElement("p", { className: b('caption') }, activeTabData.caption))))));

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

@@ -17,3 +17,4 @@ export { default as IconsBlock } from './Icons/Icons';
 export { default as HeaderSliderBlock } from './HeaderSlider/HeaderSlider';
 export { default as CardLayoutBlock } from './CardLayout/CardLayout';
 export { default as ContentLayoutBlock } from './ContentLayout/ContentLayout';
+export { default as ShareBlock } from './Share/Share';

package/build/esm/blocks/index.js

@@ -17,3 +17,4 @@ export { default as IconsBlock } from './Icons/Icons';
 export { default as HeaderSliderBlock } from './HeaderSlider/HeaderSlider';
 export { default as CardLayoutBlock } from './CardLayout/CardLayout';
 export { default as ContentLayoutBlock } from './ContentLayout/ContentLayout';
+export { default as ShareBlock } from './Share/Share';

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

@@ -16,3 +16,4 @@ 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

@@ -16,3 +16,4 @@ export * from './Security/schema';
 export * from './Simple/schema';
 export * from './Slider/schema';
 export * from './Table/schema';
+export * from './Share/schema';

package/build/esm/components/Media/Media.js

@@ -19,7 +19,7 @@ export const Media = (props) => {
             result.push(React.createElement(Video, { key: "video", video: video, videoClassName: videoClassName, height: height, metrika: metrika, playVideo: playVideo, previewImg: previewImg, playButton: playButton, customBarControlsClassName: customBarControlsClassName, hasVideoFallback: hasVideoFallback, setHasVideoFallback: setHasVideoFallback }));
         }
         if (youtube) {
-            result = (React.createElement(YoutubeBlock, { className: b('youtube', youtubeClassName), record: youtube, attributes: { color: 'white', rel: '0' }, previewImg: previewImg }));
+            result = (React.createElement(YoutubeBlock, { className: b('youtube', youtubeClassName), record: youtube, attributes: { color: 'white', rel: '0' }, previewImg: previewImg, height: height }));
         }
         if (dataLens) {
             result = React.createElement(DataLens, { dataLens: dataLens });

package/build/esm/components/Media/Video/Video.js

@@ -29,15 +29,16 @@ const Video = (props) => {
     }, [playVideo, video, setHasVideoFallback]);
     const reactPlayerBlock = useMemo(() => {
         const { src, loop, controls, muted, autoplay = true, elapsedTime, playButton } = video;
-        return (React.createElement(ReactPlayerBlock, { className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: Boolean(loop), controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, metrika: metrika }));
+        return (React.createElement(ReactPlayerBlock, { className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: Boolean(loop), controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, metrika: metrika, height: height }));
     }, [
         video,
-        metrika,
+        height,
+        videoClassName,
         previewImg,
         playVideo,
-        videoClassName,
         commonPlayButton,
         customBarControlsClassName,
+        metrika,
     ]);
     const defaultVideoBlock = useMemo(() => {
         return video.src.length && !hasVideoFallback ? (React.createElement("div", { className: b('wrap', videoClassName), style: { height } },

package/build/esm/components/ReactPlayer/ReactPlayer.d.ts

@@ -8,6 +8,7 @@ export interface ReactPlayerBlockProps extends Omit<MediaVideoProps, 'loop' | 's
     customBarControlsClassName?: string;
     showPreview?: boolean;
     onClickPreview?: () => void;
+    height?: number;
     children?: React.ReactNode;
 }
 export declare const ReactPlayerBlock: React.ForwardRefExoticComponent<ReactPlayerBlockProps & React.RefAttributes<ReactPlayerBlockHandler>>;

package/build/esm/components/ReactPlayer/ReactPlayer.js

@@ -16,7 +16,7 @@ const FPS = 60;
 export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
     const isMobile = useContext(MobileContext);
     const { metrika } = useContext(MetrikaContext);
-    const { src, previewImgUrl, loop = false, controls = MediaVideoControlsType.Default, muted: initiallyMuted = false, elapsedTime, playButton, className, customBarControlsClassName, showPreview, onClickPreview, metrika: videoMetrika, } = props;
+    const { src, previewImgUrl, loop = false, controls = MediaVideoControlsType.Default, muted: initiallyMuted = false, elapsedTime, playButton, className, customBarControlsClassName, showPreview, onClickPreview, metrika: videoMetrika, height, } = props;
     const { type = PlayButtonType.Default, theme = PlayButtonThemes.Blue, text, className: buttonClassName, } = playButton || {};
     const autoPlay = Boolean(!isMobile && !previewImgUrl && props.autoplay);
     const mute = initiallyMuted || autoPlay;
@@ -25,7 +25,7 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
     const [playerRef, setPlayerRef] = useState();
     const [isPlaying, setIsPlaying] = useState(autoPlay);
     const [playedPercent, setPlayedPercent] = useState(0);
-    const [height, setHeight] = useState(0);
+    const [currentHeight, setCurrentHeight] = useState(height);
     const [width, setWidth] = useState(0);
     const [muted, setMuted] = useState(mute);
     const [started, setStarted] = useState(autoPlay);
@@ -70,7 +70,7 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
                     parseFloat(paddingLeft) -
                     parseFloat(paddingRight);
                 setWidth(newWidth);
-                setHeight(Math.floor(getHeight(newWidth)));
+                setCurrentHeight(Math.floor(getHeight(newWidth)));
             }
         }, 200);
         updateSize();
@@ -176,8 +176,8 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
                 },
             }, elapsedTimePercent: elapsedTimePercent }));
     }, [controls, isPlaying, customBarControlsClassName, changeMute]);
-    return (React.createElement("div", { className: b({ wrapper: !height }, className), ref: ref, onClick: handleClick },
-        React.createElement(ReactPlayer, { className: b('player'), url: src, muted: muted, controls: controls === MediaVideoControlsType.Default, height: height || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: setPlayerRef, onPlay: onPlay, onPause: onPause, onProgress: onProgress, onEnded: onEnded }),
+    return (React.createElement("div", { className: b({ wrapper: !currentHeight }, className), ref: ref, onClick: handleClick },
+        React.createElement(ReactPlayer, { className: b('player'), url: src, muted: muted, controls: controls === MediaVideoControlsType.Default, height: currentHeight || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: setPlayerRef, onPlay: onPlay, onPause: onPause, onProgress: onProgress, onEnded: onEnded }),
         renderCustomBarControls(muted, playedPercent)));
 });
 function getHeight(width) {

package/build/esm/components/VideoBlock/VideoBlock.d.ts

@@ -4,6 +4,7 @@ export declare const AUTOPLAY_ATTRIBUTES: {
     autoplay: number;
     mute: number;
 };
+export declare function getHeight(width: number): number;
 export interface VideoBlockProps {
     id?: string;
     stream?: string;
@@ -12,6 +13,7 @@ export interface VideoBlockProps {
     className?: string;
     previewImg?: string;
     playButton?: React.ReactNode;
+    height?: number;
 }
 declare const VideoBlock: (props: VideoBlockProps) => JSX.Element | null;
 export default VideoBlock;

package/build/esm/components/VideoBlock/VideoBlock.js

@@ -30,17 +30,17 @@ function getVideoSrc(stream, record) {
     }
     return src;
 }
-function getHeight(width) {
+export function getHeight(width) {
     return (width / 16) * 9;
 }
 const VideoBlock = (props) => {
-    const { stream, record, attributes, className, id, previewImg, playButton } = props;
+    const { stream, record, attributes, className, id, previewImg, playButton, height } = props;
     const src = getVideoSrc(stream, record);
     const ref = useRef(null);
     const iframeRef = useRef();
     const [hidePreview, setHidePreview] = useState(false);
     const norender = (!stream && !record) || !src;
-    const [height, setHeight] = useState();
+    const [currentHeight, setCurrentHeight] = useState(height || undefined);
     const fullId = `${iframeId}-${id || src}`;
     const onPreviewClick = useCallback(() => {
         if (iframeRef.current) {
@@ -50,14 +50,14 @@ const VideoBlock = (props) => {
     }, [src, attributes]);
     useEffect(() => {
         const updateSize = _.debounce(() => {
-            setHeight(ref.current ? Math.round(getHeight(ref.current.offsetWidth)) : undefined);
+            setCurrentHeight(ref.current ? Math.round(getHeight(ref.current.offsetWidth)) : undefined);
         }, 100);
         updateSize();
         window.addEventListener('resize', updateSize);
         return () => {
             window.removeEventListener('resize', updateSize);
         };
-    }, []);
+    }, [height]);
     useEffect(() => {
         if (norender) {
             return;
@@ -86,7 +86,7 @@ const VideoBlock = (props) => {
     if (norender) {
         return null;
     }
-    return (React.createElement("div", { className: b(null, className), ref: ref, style: { height } }, previewImg && !hidePreview && (React.createElement("div", { className: b('preview'), onClick: onPreviewClick },
+    return (React.createElement("div", { className: b(null, className), ref: ref, style: { height: currentHeight } }, previewImg && !hidePreview && (React.createElement("div", { className: b('preview'), onClick: onPreviewClick },
         React.createElement(Image, { src: previewImg, className: b('image') }),
         playButton || (React.createElement("button", { className: b('button') },
             React.createElement(Icon, { className: b('icon'), data: PlayVideo, size: 24 })))))));

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

@@ -18,6 +18,7 @@ export declare const blockMap: {
     "header-slider-block": ({ items, arrows, ...props }: import("./models").HeaderSliderBlockProps) => JSX.Element;
     "card-layout-block": ({ title, description, animated, colSizes, children, }: import("./blocks/CardLayout/CardLayout").CardLayoutBlockProps) => JSX.Element;
     "content-layout-block": (props: import("./models").ContentLayoutBlockProps) => JSX.Element;
+    "share-block": ({ items, title }: import("./models").ShareBlockProps) => JSX.Element;
 };
 export declare const subBlockMap: {
     divider: ({ size, border }: import("./models").DividerProps) => JSX.Element;

package/build/esm/constructor-items.js

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

package/build/esm/models/components.d.ts

@@ -2,9 +2,3 @@ export declare type ArrowDirection = 'left' | 'right';
 export interface ReactPlayerBlockHandler {
     pause: () => void;
 }
-export declare enum PCShareSocialNetwork {
-    Vk = "vk",
-    Telegram = "telegram",
-    Twitter = "twitter",
-    Facebook = "facebook"
-}

package/build/esm/models/components.js

@@ -1,7 +1 @@
-export var PCShareSocialNetwork;
-(function (PCShareSocialNetwork) {
-    PCShareSocialNetwork["Vk"] = "vk";
-    PCShareSocialNetwork["Telegram"] = "telegram";
-    PCShareSocialNetwork["Twitter"] = "twitter";
-    PCShareSocialNetwork["Facebook"] = "facebook";
-})(PCShareSocialNetwork || (PCShareSocialNetwork = {}));
+export {};

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

@@ -24,7 +24,8 @@ export declare enum BlockType {
     HeaderBlock = "header-block",
     IconsBlock = "icons-block",
     CardLayoutBlock = "card-layout-block",
-    ContentLayoutBlock = "content-layout-block"
+    ContentLayoutBlock = "content-layout-block",
+    ShareBlock = "share-block"
 }
 export declare const BlockTypes: BlockType[];
 export declare const HeaderBlockTypes: BlockType[];
@@ -275,6 +276,16 @@ export interface ContentBlockProps {
     centered?: boolean;
     theme?: ContentTheme;
 }
+export declare enum PCShareSocialNetwork {
+    Vk = "vk",
+    Telegram = "telegram",
+    Twitter = "twitter",
+    Facebook = "facebook"
+}
+export interface ShareBlockProps {
+    items: PCShareSocialNetwork[];
+    title?: string;
+}
 export declare type HeaderBlockModel = {
     type: BlockType.HeaderBlock;
 } & HeaderBlockProps;
@@ -338,6 +349,9 @@ export declare type HeaderSliderBlockModel = {
 export declare type ContentLayoutBlockModel = {
     type: BlockType.ContentLayoutBlock;
 } & ContentLayoutBlockProps;
-declare type BlockModels = SliderBlockModel | ServiceDemoBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | CalculatorBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | InfoBlockModel | SecurityBlockModel | TableBlockModel | TabsBlockModel | SimpleBlockModel | LinkTableBlockModel | HeaderBlockModel | PreviewBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel;
+export declare type ShareBLockModel = {
+    type: BlockType.ShareBlock;
+} & ShareBlockProps;
+declare type BlockModels = SliderBlockModel | ServiceDemoBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | CalculatorBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | InfoBlockModel | SecurityBlockModel | TableBlockModel | TabsBlockModel | SimpleBlockModel | LinkTableBlockModel | HeaderBlockModel | PreviewBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel | ShareBLockModel;
 export declare type Block = BlockModels & BlockBaseProps;
 export {};

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

@@ -21,6 +21,7 @@ export var BlockType;
     BlockType["IconsBlock"] = "icons-block";
     BlockType["CardLayoutBlock"] = "card-layout-block";
     BlockType["ContentLayoutBlock"] = "content-layout-block";
+    BlockType["ShareBlock"] = "share-block";
 })(BlockType || (BlockType = {}));
 export const BlockTypes = Object.values(BlockType);
 export const HeaderBlockTypes = [BlockType.HeaderBlock, BlockType.HeaderSliderBlock];
@@ -36,3 +37,10 @@ export var SliderType;
     SliderType["MediaCard"] = "media-card";
     SliderType["HeaderCard"] = "header-card";
 })(SliderType || (SliderType = {}));
+export var PCShareSocialNetwork;
+(function (PCShareSocialNetwork) {
+    PCShareSocialNetwork["Vk"] = "vk";
+    PCShareSocialNetwork["Telegram"] = "telegram";
+    PCShareSocialNetwork["Twitter"] = "twitter";
+    PCShareSocialNetwork["Facebook"] = "facebook";
+})(PCShareSocialNetwork || (PCShareSocialNetwork = {}));

package/build/esm/schema/index.js

@@ -1,5 +1,5 @@
 export { validators } from './validators';
-import { TabsBlock, BannerCard, SliderBlock, ExtendedFeaturesBlock, HeaderBlock, BannerBlock, CompaniesBlock, MediaBlock, InfoBlock, QuestionsBlock, SecurityBlock, TableBlock, SimpleBlock, LinkTableBlock, PromoFeaturesBlock, PreviewBlock, ContentLayoutBlock, HeaderSliderBlock, IconsBlock, CardLayoutBlock, } from './validators/blocks';
+import { TabsBlock, BannerCard, SliderBlock, ExtendedFeaturesBlock, HeaderBlock, BannerBlock, CompaniesBlock, MediaBlock, InfoBlock, QuestionsBlock, SecurityBlock, TableBlock, SimpleBlock, LinkTableBlock, PromoFeaturesBlock, PreviewBlock, ContentLayoutBlock, HeaderSliderBlock, IconsBlock, CardLayoutBlock, ShareBlock, } from './validators/blocks';
 import { PartnerBlock, MediaCardBlock, TutorialCard, BackgroundCard, NewsCard, CardWithImage, PriceDetailedBlock, Quote, Divider, } from './validators/sub-blocks';
 import { AnimatableProps, BackgroundProps, MenuProps, withTheme } from './validators/common';
 import { filteredItem } from './validators/utils';
@@ -48,7 +48,7 @@ export function generateDefaultSchema(config) {
                     },
                 },
                 select: { $data: '0/type' },
-                selectCases: 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({}, TabsBlock), SliderBlock), ExtendedFeaturesBlock), PromoFeaturesBlock), HeaderBlock), BannerBlock), CompaniesBlock), MediaBlock), InfoBlock), QuestionsBlock), SecurityBlock), TableBlock), SimpleBlock), LinkTableBlock), PreviewBlock), HeaderSliderBlock), IconsBlock), CardLayoutBlock), ContentLayoutBlock), Divider), getBlocksCases(blocks)),
+                selectCases: 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({}, TabsBlock), SliderBlock), ExtendedFeaturesBlock), PromoFeaturesBlock), HeaderBlock), BannerBlock), CompaniesBlock), MediaBlock), InfoBlock), QuestionsBlock), SecurityBlock), TableBlock), SimpleBlock), LinkTableBlock), PreviewBlock), HeaderSliderBlock), IconsBlock), CardLayoutBlock), ContentLayoutBlock), Divider), ShareBlock), getBlocksCases(blocks)),
             }),
             cards: filteredItem({
                 type: 'object',

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

@@ -17,3 +17,4 @@ export * from '../../blocks/HeaderSlider/schema';
 export * from '../../blocks/Icons/schema';
 export * from '../../blocks/CardLayout/schema';
 export * from '../../blocks/ContentLayout/schema';
+export * from '../../blocks/Share/schema';

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

@@ -17,3 +17,4 @@ export * from '../../blocks/HeaderSlider/schema';
 export * from '../../blocks/Icons/schema';
 export * from '../../blocks/CardLayout/schema';
 export * from '../../blocks/ContentLayout/schema';
+export * from '../../blocks/Share/schema';

package/build/esm/text-transform/blocks.js

@@ -308,6 +308,12 @@ const config = {
             parser: parseContentLayoutTitle,
         },
     ],
+    [BlockType.ShareBlock]: [
+        {
+            fields: ['title'],
+            transformer: typografTransformer,
+        },
+    ],
 };
 function addRandomOrder(block) {
     if (block) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "1.9.0",
+  "version": "1.9.1-alpha.1",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {
@@ -121,5 +121,8 @@
     "*.{json,yaml,yml,md}": [
       "prettier --write"
     ]
+  },
+  "publishConfig": {
+    "tag": "alpha"
   }
 }

package/server/models/components.d.ts

@@ -2,9 +2,3 @@ export declare type ArrowDirection = 'left' | 'right';
 export interface ReactPlayerBlockHandler {
     pause: () => void;
 }
-export declare enum PCShareSocialNetwork {
-    Vk = "vk",
-    Telegram = "telegram",
-    Twitter = "twitter",
-    Facebook = "facebook"
-}

package/server/models/components.js

@@ -1,10 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PCShareSocialNetwork = void 0;
-var PCShareSocialNetwork;
-(function (PCShareSocialNetwork) {
-    PCShareSocialNetwork["Vk"] = "vk";
-    PCShareSocialNetwork["Telegram"] = "telegram";
-    PCShareSocialNetwork["Twitter"] = "twitter";
-    PCShareSocialNetwork["Facebook"] = "facebook";
-})(PCShareSocialNetwork = exports.PCShareSocialNetwork || (exports.PCShareSocialNetwork = {}));

package/server/models/constructor-items/blocks.d.ts

@@ -24,7 +24,8 @@ export declare enum BlockType {
     HeaderBlock = "header-block",
     IconsBlock = "icons-block",
     CardLayoutBlock = "card-layout-block",
-    ContentLayoutBlock = "content-layout-block"
+    ContentLayoutBlock = "content-layout-block",
+    ShareBlock = "share-block"
 }
 export declare const BlockTypes: BlockType[];
 export declare const HeaderBlockTypes: BlockType[];
@@ -275,6 +276,16 @@ export interface ContentBlockProps {
     centered?: boolean;
     theme?: ContentTheme;
 }
+export declare enum PCShareSocialNetwork {
+    Vk = "vk",
+    Telegram = "telegram",
+    Twitter = "twitter",
+    Facebook = "facebook"
+}
+export interface ShareBlockProps {
+    items: PCShareSocialNetwork[];
+    title?: string;
+}
 export declare type HeaderBlockModel = {
     type: BlockType.HeaderBlock;
 } & HeaderBlockProps;
@@ -338,6 +349,9 @@ export declare type HeaderSliderBlockModel = {
 export declare type ContentLayoutBlockModel = {
     type: BlockType.ContentLayoutBlock;
 } & ContentLayoutBlockProps;
-declare type BlockModels = SliderBlockModel | ServiceDemoBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | CalculatorBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | InfoBlockModel | SecurityBlockModel | TableBlockModel | TabsBlockModel | SimpleBlockModel | LinkTableBlockModel | HeaderBlockModel | PreviewBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel;
+export declare type ShareBLockModel = {
+    type: BlockType.ShareBlock;
+} & ShareBlockProps;
+declare type BlockModels = SliderBlockModel | ServiceDemoBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | CalculatorBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | InfoBlockModel | SecurityBlockModel | TableBlockModel | TabsBlockModel | SimpleBlockModel | LinkTableBlockModel | HeaderBlockModel | PreviewBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel | ShareBLockModel;
 export declare type Block = BlockModels & BlockBaseProps;
 export {};

package/server/models/constructor-items/blocks.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SliderType = exports.SliderBreakpointNames = exports.HeaderBlockTypes = exports.BlockTypes = exports.BlockType = void 0;
+exports.PCShareSocialNetwork = exports.SliderType = exports.SliderBreakpointNames = exports.HeaderBlockTypes = exports.BlockTypes = exports.BlockType = void 0;
 var BlockType;
 (function (BlockType) {
     BlockType["PromoFeaturesBlock"] = "promo-features-block";
@@ -24,6 +24,7 @@ var BlockType;
     BlockType["IconsBlock"] = "icons-block";
     BlockType["CardLayoutBlock"] = "card-layout-block";
     BlockType["ContentLayoutBlock"] = "content-layout-block";
+    BlockType["ShareBlock"] = "share-block";
 })(BlockType = exports.BlockType || (exports.BlockType = {}));
 exports.BlockTypes = Object.values(BlockType);
 exports.HeaderBlockTypes = [BlockType.HeaderBlock, BlockType.HeaderSliderBlock];
@@ -39,3 +40,10 @@ var SliderType;
     SliderType["MediaCard"] = "media-card";
     SliderType["HeaderCard"] = "header-card";
 })(SliderType = exports.SliderType || (exports.SliderType = {}));
+var PCShareSocialNetwork;
+(function (PCShareSocialNetwork) {
+    PCShareSocialNetwork["Vk"] = "vk";
+    PCShareSocialNetwork["Telegram"] = "telegram";
+    PCShareSocialNetwork["Twitter"] = "twitter";
+    PCShareSocialNetwork["Facebook"] = "facebook";
+})(PCShareSocialNetwork = exports.PCShareSocialNetwork || (exports.PCShareSocialNetwork = {}));

package/server/text-transform/blocks.js

@@ -327,6 +327,12 @@ const config = {
             parser: parseContentLayoutTitle,
         },
     ],
+    [models_1.BlockType.ShareBlock]: [
+        {
+            fields: ['title'],
+            transformer: typografTransformer,
+        },
+    ],
 };
 function addRandomOrder(block) {
     if (block) {

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

@@ -1,7 +0,0 @@
-import { PCShareSocialNetwork } from '../../models';
-export interface ShareProps {
-    items: PCShareSocialNetwork[];
-    title?: string;
-}
-declare const Share: ({ items, title }: ShareProps) => JSX.Element;
-export default Share;

package/build/esm/components/Share/Share.d.ts

@@ -1,8 +0,0 @@
-import { PCShareSocialNetwork } from '../../models';
-import './Share.css';
-export interface ShareProps {
-    items: PCShareSocialNetwork[];
-    title?: string;
-}
-declare const Share: ({ items, title }: ShareProps) => JSX.Element;
-export default Share;