@gravity-ui/page-constructor 1.10.6 → 1.10.7-alpha.1

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [1.10.7](https://github.com/gravity-ui/page-constructor/compare/v1.10.6...v1.10.7) (2022-12-23)
+
+
+### Bug Fixes
+
+* **Share:** schema ([#94](https://github.com/gravity-ui/page-constructor/issues/94)) ([465e039](https://github.com/gravity-ui/page-constructor/commit/465e0395413df74af8ac8be83dfe4167ae378835))
+
 ## [1.10.6](https://github.com/gravity-ui/page-constructor/compare/v1.10.5...v1.10.6) (2022-12-23)
 
 
@@ -527,7 +534,7 @@ In the `Content`, if the `text` block has no `title`, the `margin-top` property
 
 ## 0.18.4
 
-- Fixed the `BlockHeader` margins.
+- Fixed the `HeaderComponent` margins.
 
 ## 0.18.3
 

package/build/cjs/blocks/CardLayout/CardLayout.js

@@ -12,7 +12,7 @@ const DEFAULT_SIZES = {
     md: 4,
 };
 const CardLayout = ({ title, description, animated, colSizes = DEFAULT_SIZES, children, }) => (react_1.default.createElement(components_1.AnimateBlock, { className: b(), animate: animated },
-    react_1.default.createElement(components_1.BlockHeader, { title: title, description: description }),
+    react_1.default.createElement(components_1.HeaderComponent, { title: title, description: description }),
     react_1.default.createElement("div", null,
         react_1.default.createElement(grid_1.Row, null, children &&
             react_1.default.Children.map(children, (child, i) => {

package/build/cjs/blocks/ExtendedFeatures/ExtendedFeatures.js

@@ -19,7 +19,7 @@ const DEFAULT_SIZES = {
 const ExtendedFeaturesBlock = ({ title, description, items, colSizes = DEFAULT_SIZES, animated, }) => {
     const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
     return (react_1.default.createElement(components_1.AnimateBlock, { className: b(), animate: animated },
-        react_1.default.createElement(components_1.BlockHeader, { title: title, description: description, className: b('header') }),
+        react_1.default.createElement(components_1.HeaderComponent, { title: title, description: description, className: b('header') }),
         react_1.default.createElement("div", { className: b('items') },
             react_1.default.createElement(grid_1.Row, null, items.map(({ title: itemTitle, text, link, links, label, icon, buttons, additionalInfo, }) => {
                 const itemLinks = links || [];

package/build/cjs/blocks/Icons/Icons.js

@@ -9,7 +9,7 @@ const b = (0, utils_1.block)('icons-block');
 const Icons = ({ title, size = 's', items }) => {
     const { hostname } = (0, react_1.useContext)(locationContext_1.LocationContext);
     return (react_1.default.createElement("div", { className: b({ size }) },
-        title && react_1.default.createElement(components_1.BlockHeader, { className: b('header'), title: title, colSizes: { all: 12 } }),
+        title && (react_1.default.createElement(components_1.HeaderComponent, { className: b('header'), title: title, colSizes: { all: 12 } })),
         items.map((item) => (react_1.default.createElement("a", Object.assign({ className: b('item'), key: item.url, href: item.url }, (0, utils_1.getLinkProps)(item.url, hostname)),
             react_1.default.createElement(components_1.Image, { className: b('image'), src: item.src }),
             react_1.default.createElement("p", { className: b('text') }, item.text))))));

package/build/cjs/blocks/LinkTable/LinkTable.js

@@ -5,11 +5,11 @@ const react_1 = (0, tslib_1.__importDefault)(require("react"));
 const utils_1 = require("../../utils");
 const grid_1 = require("../../grid");
 const Link_1 = (0, tslib_1.__importDefault)(require("../../components/Link/Link"));
-const BlockHeader_1 = (0, tslib_1.__importDefault)(require("../../components/BlockHeader/BlockHeader"));
+const HeaderComponent_1 = (0, tslib_1.__importDefault)(require("../../components/HeaderComponent/HeaderComponent"));
 const b = (0, utils_1.block)('LinkTable');
 const LinkTable = ({ items, title, description, linkTheme = 'normal' }) => {
     return (react_1.default.createElement("div", { className: b() },
-        react_1.default.createElement(BlockHeader_1.default, { title: title, description: description, className: b('block-title') }),
+        react_1.default.createElement(HeaderComponent_1.default, { title: title, description: description, className: b('block-title') }),
         react_1.default.createElement(grid_1.Row, { className: b('links') }, items.map((column, index) => (react_1.default.createElement(grid_1.Col, { key: (column.length && column[0].url) || index, sizes: {
                 [grid_1.GridColumnSize.Lg]: 4,
                 [grid_1.GridColumnSize.Md]: 6,

package/build/cjs/blocks/Media/Media.js

@@ -7,7 +7,7 @@ const utils_1 = require("../../utils");
 const grid_1 = require("../../grid");
 const Media_1 = (0, tslib_1.__importDefault)(require("../../components/Media/Media"));
 const AnimateBlock_1 = (0, tslib_1.__importDefault)(require("../../components/AnimateBlock/AnimateBlock"));
-const BlockHeader_1 = (0, tslib_1.__importDefault)(require("../../components/BlockHeader/BlockHeader"));
+const HeaderComponent_1 = (0, tslib_1.__importDefault)(require("../../components/HeaderComponent/HeaderComponent"));
 const MediaContent_1 = (0, tslib_1.__importDefault)(require("./MediaContent"));
 const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
 const b = (0, utils_1.block)('media-block');
@@ -27,7 +27,7 @@ const MediaBlock = (props) => {
     }, [largeMedia]);
     const mediaContent = !mediaOnly && react_1.default.createElement(MediaContent_1.default, Object.assign({}, mediaContentProps));
     return (react_1.default.createElement(AnimateBlock_1.default, { className: b(), onScroll: () => setPlay(true), animate: animated },
-        mediaOnly && (react_1.default.createElement(BlockHeader_1.default, { className: b('header'), title: title, description: description })),
+        mediaOnly && (react_1.default.createElement(HeaderComponent_1.default, { className: b('header'), title: title, description: description })),
         react_1.default.createElement(grid_1.Grid, null,
             react_1.default.createElement(grid_1.Row, { className: b('row', {
                     reverse: direction === 'media-content',

package/build/cjs/blocks/PromoFeaturesBlock/PromoFeaturesBlock.js

@@ -6,7 +6,7 @@ const utils_1 = require("../../utils");
 const constants_1 = require("../../constants");
 const YFMWrapper_1 = (0, tslib_1.__importDefault)(require("../../components/YFMWrapper/YFMWrapper"));
 const Media_1 = (0, tslib_1.__importDefault)(require("../../components/Media/Media"));
-const BlockHeader_1 = (0, tslib_1.__importDefault)(require("../../components/BlockHeader/BlockHeader"));
+const HeaderComponent_1 = (0, tslib_1.__importDefault)(require("../../components/HeaderComponent/HeaderComponent"));
 const AnimateBlock_1 = (0, tslib_1.__importDefault)(require("../../components/AnimateBlock/AnimateBlock"));
 const FullWidthBackground_1 = (0, tslib_1.__importDefault)(require("../../components/FullWidthBackground/FullWidthBackground"));
 const BalancedMasonry_1 = (0, tslib_1.__importDefault)(require("../../components/BalancedMasonry/BalancedMasonry"));
@@ -21,7 +21,7 @@ const PromoFeaturesBlock = (props) => {
     const backgroundTheme = theme || 'default';
     return (react_1.default.createElement(AnimateBlock_1.default, { className: b({ [backgroundTheme]: true }), animate: animated },
         react_1.default.createElement(FullWidthBackground_1.default, { className: b('background', { [backgroundTheme]: true }) }),
-        react_1.default.createElement(BlockHeader_1.default, { title: title, description: description, className: b('header') }),
+        react_1.default.createElement(HeaderComponent_1.default, { title: title, description: description, className: b('header') }),
         react_1.default.createElement(BalancedMasonry_1.default, { breakpointCols: breakpointColumns, className: b('card-container'), columnClassName: b('card-container-column') }, items.map(({ title: cardTitle, text, media, theme: cardTheme }, index) => {
             const blockModifier = backgroundTheme === 'default' ? 'default' : 'light';
             const themeMod = cardTheme || blockModifier || '';

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

@@ -12,7 +12,7 @@ exports.ShareBlock = {
                 type: 'array',
                 items: {
                     type: 'string',
-                    enum: ['telegram', 'facebook', 'twitter', 'vk'],
+                    enum: ['telegram', 'facebook', 'twitter', 'vk', 'linkedin'],
                 },
             } }),
     },

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

@@ -5,12 +5,12 @@ const tslib_1 = require("tslib");
 const react_1 = (0, tslib_1.__importDefault)(require("react"));
 const utils_1 = require("../../utils");
 const AnimateBlock_1 = (0, tslib_1.__importDefault)(require("../../components/AnimateBlock/AnimateBlock"));
-const BlockHeader_1 = (0, tslib_1.__importDefault)(require("../../components/BlockHeader/BlockHeader"));
+const HeaderComponent_1 = (0, tslib_1.__importDefault)(require("../../components/HeaderComponent/HeaderComponent"));
 const YFMWrapper_1 = (0, 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 });
+    const blockHeader = title && react_1.default.createElement(HeaderComponent_1.default, { title: title });
     return (react_1.default.createElement(AnimateBlock_1.default, { className: b(), animate: animated },
         react_1.default.createElement("div", null,
             blockHeader,

package/build/cjs/blocks/Slider/Slider.js

@@ -12,7 +12,7 @@ const AnimateBlock_1 = (0, tslib_1.__importDefault)(require("../../components/An
 const Anchor_1 = (0, tslib_1.__importDefault)(require("../../components/Anchor/Anchor"));
 const utils_2 = require("./utils");
 const constants_1 = require("../../constants");
-const BlockHeader_1 = (0, tslib_1.__importDefault)(require("../../components/BlockHeader/BlockHeader"));
+const HeaderComponent_1 = (0, tslib_1.__importDefault)(require("../../components/HeaderComponent/HeaderComponent"));
 const StylesContext_1 = require("../../context/stylesContext/StylesContext");
 const mobileContext_1 = require("../../context/mobileContext");
 const OutsideClick_1 = (0, tslib_1.__importDefault)(require("../../components/OutsideClick/OutsideClick"));
@@ -185,7 +185,7 @@ const SliderBlock = (props) => {
                 type,
             }, blockClassName) },
             anchorId && react_1.default.createElement(Anchor_1.default, { id: anchorId }),
-            react_1.default.createElement(BlockHeader_1.default, { title: title, description: description, className: b('header', { 'no-description': !description }) }),
+            react_1.default.createElement(HeaderComponent_1.default, { title: title, description: description, className: b('header', { 'no-description': !description }) }),
             react_1.default.createElement(AnimateBlock_1.default, { className: b('animate-slides'), animate: animated }, renderSlider()))));
 };
 exports.SliderBlock = SliderBlock;

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

@@ -6,7 +6,7 @@ const react_1 = (0, tslib_1.__importStar)(require("react"));
 const utils_1 = require("../../utils");
 const grid_1 = require("../../grid");
 const AnimateBlock_1 = (0, tslib_1.__importDefault)(require("../../components/AnimateBlock/AnimateBlock"));
-const BlockHeader_1 = (0, tslib_1.__importDefault)(require("../../components/BlockHeader/BlockHeader"));
+const HeaderComponent_1 = (0, tslib_1.__importDefault)(require("../../components/HeaderComponent/HeaderComponent"));
 const FullscreenImage_1 = (0, tslib_1.__importDefault)(require("../../components/FullscreenImage/FullscreenImage"));
 const Media_1 = (0, tslib_1.__importDefault)(require("../../components/Media/Media"));
 const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
@@ -50,7 +50,7 @@ const TabsBlock = ({ items, title, description, animated, tabsColSizes, centered
             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))))));
     return (react_1.default.createElement(AnimateBlock_1.default, { className: b(), onScroll: () => setPlay(true), animate: animated },
-        react_1.default.createElement(BlockHeader_1.default, { title: title, description: description, className: b('block-title', { centered: centered }) }),
+        react_1.default.createElement(HeaderComponent_1.default, { title: title, description: description, className: b('block-title', { centered: centered }) }),
         react_1.default.createElement(grid_1.Row, null,
             react_1.default.createElement(grid_1.Col, { sizes: tabsColSizes },
                 react_1.default.createElement(ButtonTabs_1.default, { items: tabs, onSelectTab: setActiveTab, activeTab: activeTab, className: b('tabs', { centered: centered }) }))),

package/build/cjs/components/HeaderComponent/HeaderComponent.css

@@ -0,0 +1,16 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-header-component__description {
+  margin-top: 12px;
+}
+.pc-header-component__description .yfm {
+  font-size: var(--yc-text-body-3-font-size);
+  line-height: var(--yc-text-body-3-line-height);
+}
+.pc-header-component__description_titleSize_s {
+  margin-top: 8px;
+}
+.pc-header-component__description_titleSize_s .yfm {
+  font-size: var(--yc-text-body-2-font-size);
+  line-height: var(--yc-text-body-2-line-height);
+}

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

@@ -0,0 +1,7 @@
+import { HeaderComponentProps as HeaderComponentParams, ClassNameProps } from '../../models';
+import { GridColumnSizesType } from '../../grid';
+export interface HeaderComponentProps extends HeaderComponentParams {
+    colSizes?: GridColumnSizesType;
+}
+declare const HeaderComponent: ({ title, description, className, colSizes, }: HeaderComponentProps & ClassNameProps) => JSX.Element | null;
+export default HeaderComponent;

package/build/cjs/components/{BlockHeader/BlockHeader.js → HeaderComponent/HeaderComponent.js}

@@ -5,8 +5,9 @@ const react_1 = (0, tslib_1.__importDefault)(require("react"));
 const utils_1 = require("../../utils");
 const grid_1 = require("../../grid");
 const __1 = require("../");
-const b = (0, utils_1.block)('BlockHeader');
-const BlockHeader = ({ title, description, className, colSizes = { all: 12, sm: 8 }, }) => {
+const YFMWrapper_1 = (0, tslib_1.__importDefault)(require("../YFMWrapper/YFMWrapper"));
+const b = (0, utils_1.block)('header-component');
+const HeaderComponent = ({ title, description, className, colSizes = { all: 12, sm: 8 }, }) => {
     if (!title && !description) {
         return null;
     }
@@ -14,8 +15,8 @@ const BlockHeader = ({ title, description, className, colSizes = { all: 12, sm:
     return (react_1.default.createElement("div", { className: b(null, className) },
         text && (react_1.default.createElement(grid_1.Col, { reset: true, sizes: colSizes },
             react_1.default.createElement(__1.Title, Object.assign({ text: text }, titleProps)))),
-        description && (react_1.default.createElement(grid_1.Col, { reset: true, sizes: { all: 12, sm: 8 } },
+        description && (react_1.default.createElement(grid_1.Col, { reset: true, sizes: colSizes },
             react_1.default.createElement("div", { className: b('description', { titleSize: titleProps === null || titleProps === void 0 ? void 0 : titleProps.textSize }) },
-                react_1.default.createElement(__1.HTML, null, description))))));
+                react_1.default.createElement(YFMWrapper_1.default, { content: description, modifiers: { constructor: true } }))))));
 };
-exports.default = BlockHeader;
+exports.default = HeaderComponent;

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

@@ -5,7 +5,7 @@ export { default as BackgroundMedia } from './BackgroundMedia/BackgroundMedia';
 export { default as BackLink } from './BackLink/BackLink';
 export { default as BalancedMasonry } from './BalancedMasonry/BalancedMasonry';
 export { default as BlockBase } from './BlockBase/BlockBase';
-export { default as BlockHeader } from './BlockHeader/BlockHeader';
+export { default as HeaderComponent } from './HeaderComponent/HeaderComponent';
 export { default as Button } from './Button/Button';
 export { default as CardBase } from './CardBase/CardBase';
 export { default as ErrorWrapper } from './ErrorWrapper/ErrorWrapper';

package/build/cjs/components/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.HTML = exports.RouterLink = exports.Author = exports.OverflowScroller = exports.Control = exports.YandexForm = exports.YFMWrapper = exports.VideoBlock = exports.UnpublishedLabel = exports.ToggleArrow = exports.Title = exports.Table = exports.ReactPlayer = exports.OutsideClick = exports.Media = exports.Links = exports.Link = exports.Image = exports.HeightCalculator = exports.HeaderBreadcrumbs = exports.FullWidthBackground = exports.FullscreenImage = exports.Foldable = exports.FileLink = exports.ErrorWrapper = exports.CardBase = exports.Button = exports.BlockHeader = exports.BlockBase = exports.BalancedMasonry = exports.BackLink = exports.BackgroundMedia = exports.BackgroundImage = exports.AnimateBlock = exports.Anchor = void 0;
+exports.HTML = exports.RouterLink = exports.Author = exports.OverflowScroller = exports.Control = exports.YandexForm = exports.YFMWrapper = exports.VideoBlock = exports.UnpublishedLabel = exports.ToggleArrow = exports.Title = exports.Table = exports.ReactPlayer = exports.OutsideClick = exports.Media = exports.Links = exports.Link = exports.Image = exports.HeightCalculator = exports.HeaderBreadcrumbs = exports.FullWidthBackground = exports.FullscreenImage = exports.Foldable = exports.FileLink = exports.ErrorWrapper = exports.CardBase = exports.Button = exports.HeaderComponent = exports.BlockBase = exports.BalancedMasonry = exports.BackLink = exports.BackgroundMedia = exports.BackgroundImage = exports.AnimateBlock = exports.Anchor = void 0;
 var Anchor_1 = require("./Anchor/Anchor");
 Object.defineProperty(exports, "Anchor", { enumerable: true, get: function () { return __importDefault(Anchor_1).default; } });
 var AnimateBlock_1 = require("./AnimateBlock/AnimateBlock");
@@ -18,8 +18,8 @@ var BalancedMasonry_1 = require("./BalancedMasonry/BalancedMasonry");
 Object.defineProperty(exports, "BalancedMasonry", { enumerable: true, get: function () { return __importDefault(BalancedMasonry_1).default; } });
 var BlockBase_1 = require("./BlockBase/BlockBase");
 Object.defineProperty(exports, "BlockBase", { enumerable: true, get: function () { return __importDefault(BlockBase_1).default; } });
-var BlockHeader_1 = require("./BlockHeader/BlockHeader");
-Object.defineProperty(exports, "BlockHeader", { enumerable: true, get: function () { return __importDefault(BlockHeader_1).default; } });
+var HeaderComponent_1 = require("./HeaderComponent/HeaderComponent");
+Object.defineProperty(exports, "HeaderComponent", { enumerable: true, get: function () { return __importDefault(HeaderComponent_1).default; } });
 var Button_1 = require("./Button/Button");
 Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return __importDefault(Button_1).default; } });
 var CardBase_1 = require("./CardBase/CardBase");

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { BackgroundImageProps, ButtonProps, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, Justify, LinkProps, LinkTheme, MediaDirection, MediaProps, PreviewItemProps, PreviewRatioMediaContent, 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, PreviewItemProps, PreviewRatioMediaContent, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleProps, LegendTableMarkerType, AnchorProps, TitleBaseProps, Animatable, HeaderComponentProps, ImageDeviceProps } from './common';
 import { ThemeSupporting } from '../../utils';
 import { GridColumnSize, GridColumnSizesType } from '../../grid/types';
 import { BannerCardProps, SubBlock } from './sub-blocks';
@@ -230,13 +230,13 @@ export interface TabsBlockItem extends Omit<ContentBlockProps, 'size' | 'colSize
     caption?: string;
     media?: ThemedMediaProps;
 }
-export interface TabsBlockProps extends BlockHeaderProps, Animatable {
+export interface TabsBlockProps extends HeaderComponentProps, Animatable {
     tabsColSizes?: GridColumnSizesType;
     centered?: boolean;
     direction?: MediaDirection;
     items: TabsBlockItem[];
 }
-export interface LinkTableBlockProps extends BlockHeaderProps {
+export interface LinkTableBlockProps extends HeaderComponentProps {
     items: LinkProps[][];
     linkTheme?: LinkTheme;
 }

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

@@ -333,7 +333,7 @@ export interface AuthorProps {
     authorContainerClassName?: string;
     type?: AuthorType;
 }
-export interface BlockHeaderProps {
+export interface HeaderComponentProps {
     title?: TitleProps | string;
     description?: string;
 }

package/build/esm/blocks/CardLayout/CardLayout.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { block } from '../../utils';
 import { Row, Col } from '../../grid';
-import { BlockHeader, AnimateBlock } from '../../components';
+import { HeaderComponent, AnimateBlock } from '../../components';
 import './CardLayout.css';
 const b = block('card-layout-block');
 const DEFAULT_SIZES = {
@@ -10,7 +10,7 @@ const DEFAULT_SIZES = {
     md: 4,
 };
 const CardLayout = ({ title, description, animated, colSizes = DEFAULT_SIZES, children, }) => (React.createElement(AnimateBlock, { className: b(), animate: animated },
-    React.createElement(BlockHeader, { title: title, description: description }),
+    React.createElement(HeaderComponent, { title: title, description: description }),
     React.createElement("div", null,
         React.createElement(Row, null, children &&
             React.Children.map(children, (child, i) => {

package/build/esm/blocks/ExtendedFeatures/ExtendedFeatures.js

@@ -1,7 +1,7 @@
 import React, { useContext } from 'react';
 import { block, getThemedValue } from '../../utils';
 import { Row, Col } from '../../grid';
-import { AnimateBlock, BlockHeader, HTML } from '../../components/';
+import { AnimateBlock, HeaderComponent, HTML } from '../../components/';
 import { Content } from '../../sub-blocks';
 import Image from '../../components/Image/Image';
 import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
@@ -16,7 +16,7 @@ const DEFAULT_SIZES = {
 export const ExtendedFeaturesBlock = ({ title, description, items, colSizes = DEFAULT_SIZES, animated, }) => {
     const { themeValue: theme } = useContext(ThemeValueContext);
     return (React.createElement(AnimateBlock, { className: b(), animate: animated },
-        React.createElement(BlockHeader, { title: title, description: description, className: b('header') }),
+        React.createElement(HeaderComponent, { title: title, description: description, className: b('header') }),
         React.createElement("div", { className: b('items') },
             React.createElement(Row, null, items.map(({ title: itemTitle, text, link, links, label, icon, buttons, additionalInfo, }) => {
                 const itemLinks = links || [];

package/build/esm/blocks/Icons/Icons.js

@@ -1,13 +1,13 @@
 import React, { useContext } from 'react';
 import { block, getLinkProps } from '../../utils';
-import { BlockHeader, Image } from '../../components';
+import { HeaderComponent, Image } from '../../components';
 import { LocationContext } from '../../context/locationContext';
 import './Icons.css';
 const b = block('icons-block');
 const Icons = ({ title, size = 's', items }) => {
     const { hostname } = useContext(LocationContext);
     return (React.createElement("div", { className: b({ size }) },
-        title && React.createElement(BlockHeader, { className: b('header'), title: title, colSizes: { all: 12 } }),
+        title && (React.createElement(HeaderComponent, { className: b('header'), title: title, colSizes: { all: 12 } })),
         items.map((item) => (React.createElement("a", Object.assign({ className: b('item'), key: item.url, href: item.url }, getLinkProps(item.url, hostname)),
             React.createElement(Image, { className: b('image'), src: item.src }),
             React.createElement("p", { className: b('text') }, item.text))))));

package/build/esm/blocks/LinkTable/LinkTable.js

@@ -3,12 +3,12 @@ import React from 'react';
 import { block } from '../../utils';
 import { Row, Col, GridColumnSize } from '../../grid';
 import Link from '../../components/Link/Link';
-import BlockHeader from '../../components/BlockHeader/BlockHeader';
+import HeaderComponent from '../../components/HeaderComponent/HeaderComponent';
 import './LinkTable.css';
 const b = block('LinkTable');
 const LinkTable = ({ items, title, description, linkTheme = 'normal' }) => {
     return (React.createElement("div", { className: b() },
-        React.createElement(BlockHeader, { title: title, description: description, className: b('block-title') }),
+        React.createElement(HeaderComponent, { title: title, description: description, className: b('block-title') }),
         React.createElement(Row, { className: b('links') }, items.map((column, index) => (React.createElement(Col, { key: (column.length && column[0].url) || index, sizes: {
                 [GridColumnSize.Lg]: 4,
                 [GridColumnSize.Md]: 6,

package/build/esm/blocks/Media/Media.js

@@ -4,7 +4,7 @@ import { block, getThemedValue } from '../../utils';
 import { Grid, Row, Col, GridColumnSize } from '../../grid';
 import Media from '../../components/Media/Media';
 import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
-import BlockHeader from '../../components/BlockHeader/BlockHeader';
+import HeaderComponent from '../../components/HeaderComponent/HeaderComponent';
 import MediaContent from './MediaContent';
 import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
 import './Media.css';
@@ -25,7 +25,7 @@ export const MediaBlock = (props) => {
     }, [largeMedia]);
     const mediaContent = !mediaOnly && React.createElement(MediaContent, Object.assign({}, mediaContentProps));
     return (React.createElement(AnimateBlock, { className: b(), onScroll: () => setPlay(true), animate: animated },
-        mediaOnly && (React.createElement(BlockHeader, { className: b('header'), title: title, description: description })),
+        mediaOnly && (React.createElement(HeaderComponent, { className: b('header'), title: title, description: description })),
         React.createElement(Grid, null,
             React.createElement(Row, { className: b('row', {
                     reverse: direction === 'media-content',

package/build/esm/blocks/PromoFeaturesBlock/PromoFeaturesBlock.js

@@ -3,7 +3,7 @@ import { block } from '../../utils';
 import { BREAKPOINTS } from '../../constants';
 import YFMWrapper from '../../components/YFMWrapper/YFMWrapper';
 import Media from '../../components/Media/Media';
-import BlockHeader from '../../components/BlockHeader/BlockHeader';
+import HeaderComponent from '../../components/HeaderComponent/HeaderComponent';
 import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
 import FullWidthBackground from '../../components/FullWidthBackground/FullWidthBackground';
 import BalancedMasonry from '../../components/BalancedMasonry/BalancedMasonry';
@@ -19,7 +19,7 @@ const PromoFeaturesBlock = (props) => {
     const backgroundTheme = theme || 'default';
     return (React.createElement(AnimateBlock, { className: b({ [backgroundTheme]: true }), animate: animated },
         React.createElement(FullWidthBackground, { className: b('background', { [backgroundTheme]: true }) }),
-        React.createElement(BlockHeader, { title: title, description: description, className: b('header') }),
+        React.createElement(HeaderComponent, { title: title, description: description, className: b('header') }),
         React.createElement(BalancedMasonry, { breakpointCols: breakpointColumns, className: b('card-container'), columnClassName: b('card-container-column') }, items.map(({ title: cardTitle, text, media, theme: cardTheme }, index) => {
             const blockModifier = backgroundTheme === 'default' ? 'default' : 'light';
             const themeMod = cardTheme || blockModifier || '';

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

@@ -9,7 +9,7 @@ export const ShareBlock = {
                 type: 'array',
                 items: {
                     type: 'string',
-                    enum: ['telegram', 'facebook', 'twitter', 'vk'],
+                    enum: ['telegram', 'facebook', 'twitter', 'vk', 'linkedin'],
                 },
             } }),
     },

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

@@ -1,13 +1,13 @@
 import React from 'react';
 import { block } from '../../utils';
 import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
-import BlockHeader from '../../components/BlockHeader/BlockHeader';
+import HeaderComponent from '../../components/HeaderComponent/HeaderComponent';
 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 });
+    const blockHeader = title && React.createElement(HeaderComponent, { title: title });
     return (React.createElement(AnimateBlock, { className: b(), animate: animated },
         React.createElement("div", null,
             blockHeader,

package/build/esm/blocks/Slider/Slider.js

@@ -8,7 +8,7 @@ import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
 import Anchor from '../../components/Anchor/Anchor';
 import { getSliderResponsiveParams, getSlidesCountByBreakpoint, getSlidesToShowCount, getSlidesToShowWithDefaults, } from './utils';
 import { BREAKPOINTS } from '../../constants';
-import BlockHeader from '../../components/BlockHeader/BlockHeader';
+import HeaderComponent from '../../components/HeaderComponent/HeaderComponent';
 import { StylesContext } from '../../context/stylesContext/StylesContext';
 import { MobileContext } from '../../context/mobileContext';
 import OutsideClick from '../../components/OutsideClick/OutsideClick';
@@ -183,7 +183,7 @@ export const SliderBlock = (props) => {
                 type,
             }, blockClassName) },
             anchorId && React.createElement(Anchor, { id: anchorId }),
-            React.createElement(BlockHeader, { title: title, description: description, className: b('header', { 'no-description': !description }) }),
+            React.createElement(HeaderComponent, { title: title, description: description, className: b('header', { 'no-description': !description }) }),
             React.createElement(AnimateBlock, { className: b('animate-slides'), animate: animated }, renderSlider()))));
 };
 // TODO remove this and rework PriceDetailed CLOUDFRONT-12230

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

@@ -2,7 +2,7 @@ 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';
-import BlockHeader from '../../components/BlockHeader/BlockHeader';
+import HeaderComponent from '../../components/HeaderComponent/HeaderComponent';
 import FullScreenImage from '../../components/FullscreenImage/FullscreenImage';
 import Media from '../../components/Media/Media';
 import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
@@ -47,7 +47,7 @@ export const TabsBlock = ({ items, title, description, animated, tabsColSizes, c
             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))))));
     return (React.createElement(AnimateBlock, { className: b(), onScroll: () => setPlay(true), animate: animated },
-        React.createElement(BlockHeader, { title: title, description: description, className: b('block-title', { centered: centered }) }),
+        React.createElement(HeaderComponent, { title: title, description: description, className: b('block-title', { centered: centered }) }),
         React.createElement(Row, null,
             React.createElement(Col, { sizes: tabsColSizes },
                 React.createElement(ButtonTabs, { items: tabs, onSelectTab: setActiveTab, activeTab: activeTab, className: b('tabs', { centered: centered }) }))),

package/build/esm/components/HeaderComponent/HeaderComponent.css

@@ -0,0 +1,16 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-header-component__description {
+  margin-top: 12px;
+}
+.pc-header-component__description .yfm {
+  font-size: var(--yc-text-body-3-font-size);
+  line-height: var(--yc-text-body-3-line-height);
+}
+.pc-header-component__description_titleSize_s {
+  margin-top: 8px;
+}
+.pc-header-component__description_titleSize_s .yfm {
+  font-size: var(--yc-text-body-2-font-size);
+  line-height: var(--yc-text-body-2-line-height);
+}

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

@@ -0,0 +1,8 @@
+import { HeaderComponentProps as HeaderComponentParams, ClassNameProps } from '../../models';
+import { GridColumnSizesType } from '../../grid';
+import './HeaderComponent.css';
+export interface HeaderComponentProps extends HeaderComponentParams {
+    colSizes?: GridColumnSizesType;
+}
+declare const HeaderComponent: ({ title, description, className, colSizes, }: HeaderComponentProps & ClassNameProps) => JSX.Element | null;
+export default HeaderComponent;

package/build/esm/components/{BlockHeader/BlockHeader.js → HeaderComponent/HeaderComponent.js}

@@ -2,10 +2,11 @@ import { __rest } from "tslib";
 import React from 'react';
 import { block } from '../../utils';
 import { Col } from '../../grid';
-import { Title, HTML } from '../';
-import './BlockHeader.css';
-const b = block('BlockHeader');
-const BlockHeader = ({ title, description, className, colSizes = { all: 12, sm: 8 }, }) => {
+import { Title } from '../';
+import YFMWrapper from '../YFMWrapper/YFMWrapper';
+import './HeaderComponent.css';
+const b = block('header-component');
+const HeaderComponent = ({ title, description, className, colSizes = { all: 12, sm: 8 }, }) => {
     if (!title && !description) {
         return null;
     }
@@ -13,8 +14,8 @@ const BlockHeader = ({ title, description, className, colSizes = { all: 12, sm:
     return (React.createElement("div", { className: b(null, className) },
         text && (React.createElement(Col, { reset: true, sizes: colSizes },
             React.createElement(Title, Object.assign({ text: text }, titleProps)))),
-        description && (React.createElement(Col, { reset: true, sizes: { all: 12, sm: 8 } },
+        description && (React.createElement(Col, { reset: true, sizes: colSizes },
             React.createElement("div", { className: b('description', { titleSize: titleProps === null || titleProps === void 0 ? void 0 : titleProps.textSize }) },
-                React.createElement(HTML, null, description))))));
+                React.createElement(YFMWrapper, { content: description, modifiers: { constructor: true } }))))));
 };
-export default BlockHeader;
+export default HeaderComponent;

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

@@ -5,7 +5,7 @@ export { default as BackgroundMedia } from './BackgroundMedia/BackgroundMedia';
 export { default as BackLink } from './BackLink/BackLink';
 export { default as BalancedMasonry } from './BalancedMasonry/BalancedMasonry';
 export { default as BlockBase } from './BlockBase/BlockBase';
-export { default as BlockHeader } from './BlockHeader/BlockHeader';
+export { default as HeaderComponent } from './HeaderComponent/HeaderComponent';
 export { default as Button } from './Button/Button';
 export { default as CardBase } from './CardBase/CardBase';
 export { default as ErrorWrapper } from './ErrorWrapper/ErrorWrapper';

package/build/esm/components/index.js

@@ -5,7 +5,7 @@ export { default as BackgroundMedia } from './BackgroundMedia/BackgroundMedia';
 export { default as BackLink } from './BackLink/BackLink';
 export { default as BalancedMasonry } from './BalancedMasonry/BalancedMasonry';
 export { default as BlockBase } from './BlockBase/BlockBase';
-export { default as BlockHeader } from './BlockHeader/BlockHeader';
+export { default as HeaderComponent } from './HeaderComponent/HeaderComponent';
 export { default as Button } from './Button/Button';
 export { default as CardBase } from './CardBase/CardBase';
 export { default as ErrorWrapper } from './ErrorWrapper/ErrorWrapper';

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { BackgroundImageProps, ButtonProps, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, Justify, LinkProps, LinkTheme, MediaDirection, MediaProps, PreviewItemProps, PreviewRatioMediaContent, 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, PreviewItemProps, PreviewRatioMediaContent, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleProps, LegendTableMarkerType, AnchorProps, TitleBaseProps, Animatable, HeaderComponentProps, ImageDeviceProps } from './common';
 import { ThemeSupporting } from '../../utils';
 import { GridColumnSize, GridColumnSizesType } from '../../grid/types';
 import { BannerCardProps, SubBlock } from './sub-blocks';
@@ -230,13 +230,13 @@ export interface TabsBlockItem extends Omit<ContentBlockProps, 'size' | 'colSize
     caption?: string;
     media?: ThemedMediaProps;
 }
-export interface TabsBlockProps extends BlockHeaderProps, Animatable {
+export interface TabsBlockProps extends HeaderComponentProps, Animatable {
     tabsColSizes?: GridColumnSizesType;
     centered?: boolean;
     direction?: MediaDirection;
     items: TabsBlockItem[];
 }
-export interface LinkTableBlockProps extends BlockHeaderProps {
+export interface LinkTableBlockProps extends HeaderComponentProps {
     items: LinkProps[][];
     linkTheme?: LinkTheme;
 }

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

@@ -333,7 +333,7 @@ export interface AuthorProps {
     authorContainerClassName?: string;
     type?: AuthorType;
 }
-export interface BlockHeaderProps {
+export interface HeaderComponentProps {
     title?: TitleProps | string;
     description?: string;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "1.10.6",
+  "version": "1.10.7-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/constructor-items/blocks.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { BackgroundImageProps, ButtonProps, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, Justify, LinkProps, LinkTheme, MediaDirection, MediaProps, PreviewItemProps, PreviewRatioMediaContent, 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, PreviewItemProps, PreviewRatioMediaContent, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleProps, LegendTableMarkerType, AnchorProps, TitleBaseProps, Animatable, HeaderComponentProps, ImageDeviceProps } from './common';
 import { ThemeSupporting } from '../../utils';
 import { GridColumnSize, GridColumnSizesType } from '../../grid/types';
 import { BannerCardProps, SubBlock } from './sub-blocks';
@@ -230,13 +230,13 @@ export interface TabsBlockItem extends Omit<ContentBlockProps, 'size' | 'colSize
     caption?: string;
     media?: ThemedMediaProps;
 }
-export interface TabsBlockProps extends BlockHeaderProps, Animatable {
+export interface TabsBlockProps extends HeaderComponentProps, Animatable {
     tabsColSizes?: GridColumnSizesType;
     centered?: boolean;
     direction?: MediaDirection;
     items: TabsBlockItem[];
 }
-export interface LinkTableBlockProps extends BlockHeaderProps {
+export interface LinkTableBlockProps extends HeaderComponentProps {
     items: LinkProps[][];
     linkTheme?: LinkTheme;
 }

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

@@ -333,7 +333,7 @@ export interface AuthorProps {
     authorContainerClassName?: string;
     type?: AuthorType;
 }
-export interface BlockHeaderProps {
+export interface HeaderComponentProps {
     title?: TitleProps | string;
     description?: string;
 }

package/build/cjs/components/BlockHeader/BlockHeader.css

@@ -1,27 +0,0 @@
-/* use this for style redefinitions to awoid problems with
-unpredictable css rules order in build */
-.pc-BlockHeader__description {
-  font-size: var(--yc-text-body-2-font-size);
-  line-height: var(--yc-text-body-2-line-height);
-  margin-top: 16px;
-}
-.pc-BlockHeader__description_titleSize_s {
-  margin-top: 8px;
-}
-.pc-BlockHeader__description_titleSize_l {
-  font-size: var(--yc-text-body-3-font-size);
-  line-height: var(--yc-text-body-3-line-height);
-}
-.pc-BlockHeader__description a {
-  outline: none;
-  color: var(--yc-color-text-link);
-  text-decoration: none;
-  cursor: pointer;
-}
-.utilityfocus .pc-BlockHeader__description a:focus {
-  outline: 2px solid #ffdb4d;
-}
-.pc-BlockHeader__description a:hover, .pc-BlockHeader__description a:active {
-  --pc-text-header-color: var(--yc-color-text-link-hover);
-  color: var(--yc-color-text-link-hover);
-}

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

@@ -1,7 +0,0 @@
-import { BlockHeaderProps as BlockHeaderParams, ClassNameProps } from '../../models';
-import { GridColumnSizesType } from '../../grid';
-export interface BlockHeaderProps extends BlockHeaderParams {
-    colSizes?: GridColumnSizesType;
-}
-declare const BlockHeader: ({ title, description, className, colSizes, }: BlockHeaderProps & ClassNameProps) => JSX.Element | null;
-export default BlockHeader;

package/build/esm/components/BlockHeader/BlockHeader.css

@@ -1,27 +0,0 @@
-/* use this for style redefinitions to awoid problems with
-unpredictable css rules order in build */
-.pc-BlockHeader__description {
-  font-size: var(--yc-text-body-2-font-size);
-  line-height: var(--yc-text-body-2-line-height);
-  margin-top: 16px;
-}
-.pc-BlockHeader__description_titleSize_s {
-  margin-top: 8px;
-}
-.pc-BlockHeader__description_titleSize_l {
-  font-size: var(--yc-text-body-3-font-size);
-  line-height: var(--yc-text-body-3-line-height);
-}
-.pc-BlockHeader__description a {
-  outline: none;
-  color: var(--yc-color-text-link);
-  text-decoration: none;
-  cursor: pointer;
-}
-.utilityfocus .pc-BlockHeader__description a:focus {
-  outline: 2px solid #ffdb4d;
-}
-.pc-BlockHeader__description a:hover, .pc-BlockHeader__description a:active {
-  --pc-text-header-color: var(--yc-color-text-link-hover);
-  color: var(--yc-color-text-link-hover);
-}

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

@@ -1,8 +0,0 @@
-import { BlockHeaderProps as BlockHeaderParams, ClassNameProps } from '../../models';
-import { GridColumnSizesType } from '../../grid';
-import './BlockHeader.css';
-export interface BlockHeaderProps extends BlockHeaderParams {
-    colSizes?: GridColumnSizesType;
-}
-declare const BlockHeader: ({ title, description, className, colSizes, }: BlockHeaderProps & ClassNameProps) => JSX.Element | null;
-export default BlockHeader;