@gravity-ui/page-constructor 8.0.0-beta.2 → 8.1.0

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

@@ -10,6 +10,7 @@ export declare const CompaniesBlock: {
             description: {
                 type: string;
                 contentType: string;
+                inputType: string;
             };
             images: {
                 oneOf: (({

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

@@ -15,7 +15,8 @@ exports.CompaniesBlock = {
             },
             description: {
                 type: 'string',
-                contentType: 'text',
+                contentType: 'yfm',
+                inputType: 'textarea',
             },
             images: (0, common_1.withTheme)({
                 type: 'object',

package/build/cjs/blocks/Companies/schema.js.map

@@ -1 +1 @@
-{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["blocks/Companies/schema.ts"],"names":[],"mappings":";;;AAAA,8DAAqF;AAExE,QAAA,cAAc,GAAG;IAC1B,iBAAiB,EAAE;QACf,oBAAoB,EAAE,KAAK;QAC3B,QAAQ,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC;QAC7B,UAAU,EAAE;YACR,GAAG,kBAAS;YACZ,GAAG,wBAAe;YAClB,KAAK,EAAE;gBACH,IAAI,EAAE,QAAQ;gBACd,WAAW,EAAE,MAAM;aACtB;YACD,WAAW,EAAE;gBACT,IAAI,EAAE,QAAQ;gBACd,WAAW,EAAE,MAAM;aACtB;YACD,MAAM,EAAE,IAAA,kBAAS,EAAC;gBACd,IAAI,EAAE,QAAQ;gBACd,QAAQ,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,QAAQ,CAAC;gBACzC,UAAU,EAAE;oBACR,OAAO,EAAE;wBACL,IAAI,EAAE,QAAQ;qBACjB;oBACD,MAAM,EAAE;wBACJ,IAAI,EAAE,QAAQ;qBACjB;oBACD,MAAM,EAAE;wBACJ,IAAI,EAAE,QAAQ;qBACjB;oBACD,GAAG,EAAE;wBACD,IAAI,EAAE,QAAQ;wBACd,WAAW,EAAE,MAAM;qBACtB;iBACJ;aACJ,CAAC;SACL;KACJ;CACJ,CAAC","sourcesContent":["import {AnimatableProps, BaseProps, withTheme} from '../../schema/validators/common';\n\nexport const CompaniesBlock = {\n    'companies-block': {\n        additionalProperties: false,\n        required: ['title', 'images'],\n        properties: {\n            ...BaseProps,\n            ...AnimatableProps,\n            title: {\n                type: 'string',\n                contentType: 'text',\n            },\n            description: {\n                type: 'string',\n                contentType: 'text',\n            },\n            images: withTheme({\n                type: 'object',\n                required: ['desktop', 'tablet', 'mobile'],\n                properties: {\n                    desktop: {\n                        type: 'string',\n                    },\n                    tablet: {\n                        type: 'string',\n                    },\n                    mobile: {\n                        type: 'string',\n                    },\n                    alt: {\n                        type: 'string',\n                        contentType: 'text',\n                    },\n                },\n            }),\n        },\n    },\n};\n"]}
+{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["blocks/Companies/schema.ts"],"names":[],"mappings":";;;AAAA,8DAAqF;AAExE,QAAA,cAAc,GAAG;IAC1B,iBAAiB,EAAE;QACf,oBAAoB,EAAE,KAAK;QAC3B,QAAQ,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC;QAC7B,UAAU,EAAE;YACR,GAAG,kBAAS;YACZ,GAAG,wBAAe;YAClB,KAAK,EAAE;gBACH,IAAI,EAAE,QAAQ;gBACd,WAAW,EAAE,MAAM;aACtB;YACD,WAAW,EAAE;gBACT,IAAI,EAAE,QAAQ;gBACd,WAAW,EAAE,KAAK;gBAClB,SAAS,EAAE,UAAU;aACxB;YACD,MAAM,EAAE,IAAA,kBAAS,EAAC;gBACd,IAAI,EAAE,QAAQ;gBACd,QAAQ,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,QAAQ,CAAC;gBACzC,UAAU,EAAE;oBACR,OAAO,EAAE;wBACL,IAAI,EAAE,QAAQ;qBACjB;oBACD,MAAM,EAAE;wBACJ,IAAI,EAAE,QAAQ;qBACjB;oBACD,MAAM,EAAE;wBACJ,IAAI,EAAE,QAAQ;qBACjB;oBACD,GAAG,EAAE;wBACD,IAAI,EAAE,QAAQ;wBACd,WAAW,EAAE,MAAM;qBACtB;iBACJ;aACJ,CAAC;SACL;KACJ;CACJ,CAAC","sourcesContent":["import {AnimatableProps, BaseProps, withTheme} from '../../schema/validators/common';\n\nexport const CompaniesBlock = {\n    'companies-block': {\n        additionalProperties: false,\n        required: ['title', 'images'],\n        properties: {\n            ...BaseProps,\n            ...AnimatableProps,\n            title: {\n                type: 'string',\n                contentType: 'text',\n            },\n            description: {\n                type: 'string',\n                contentType: 'yfm',\n                inputType: 'textarea',\n            },\n            images: withTheme({\n                type: 'object',\n                required: ['desktop', 'tablet', 'mobile'],\n                properties: {\n                    desktop: {\n                        type: 'string',\n                    },\n                    tablet: {\n                        type: 'string',\n                    },\n                    mobile: {\n                        type: 'string',\n                    },\n                    alt: {\n                        type: 'string',\n                        contentType: 'text',\n                    },\n                },\n            }),\n        },\n    },\n};\n"]}

package/build/cjs/blocks/ContentLayout/ContentLayout.js

@@ -6,8 +6,9 @@ const react_1 = require("react");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const components_1 = require("../../components/index.js");
-const mobileContext_1 = require("../../context/mobileContext/index.js");
+const constants_1 = require("../../constants.js");
 const theme_1 = require("../../context/theme/index.js");
+const windowWidthContext_1 = require("../../context/windowWidthContext/index.js");
 const grid_1 = require("../../grid/index.js");
 const sub_blocks_1 = require("../../sub-blocks/index.js");
 const utils_1 = require("../../utils/index.js");
@@ -33,7 +34,8 @@ function getTextWidth(size) {
     }
 }
 const ContentLayoutBlock = (props) => {
-    const isMobile = React.useContext(mobileContext_1.MobileContext);
+    const windowWidth = (0, windowWidthContext_1.useWindowWidth)();
+    const isMobile = windowWidth <= constants_1.BREAKPOINTS.sm;
     const { textContent, fileContent, size = 'l', background, centered, theme = 'default', textWidth = 'm', } = props;
     const colSizes = React.useMemo(() => getTextWidth(textWidth), [textWidth]);
     const globalTheme = (0, theme_1.useTheme)();

package/build/cjs/blocks/ContentLayout/ContentLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContentLayout.js","sourceRoot":"../../../../src","sources":["blocks/ContentLayout/ContentLayout.tsx"],"names":[],"mappings":";;;;;;AAAA,qDAA+B;AAE/B,0DAA2D;AAC3D,wEAA0D;AAC1D,wDAA6C;AAC7C,8CAA+B;AAE/B,0DAAyC;AACzC,gDAAkD;AAIlD,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,sBAAsB,CAAC,CAAC;AAExC,SAAS,eAAe,CAAC,IAAiB;IACtC,QAAQ,IAAI,EAAE,CAAC;QACX,KAAK,GAAG;YACJ,OAAO,GAAG,CAAC;QACf,KAAK,GAAG,CAAC;QACT;YACI,OAAO,GAAG,CAAC;IACnB,CAAC;AACL,CAAC;AAED,SAAS,YAAY,CAAC,IAAqB;IACvC,QAAQ,IAAI,EAAE,CAAC;QACX,KAAK,GAAG;YACJ,OAAO,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,CAAC;QAC5B,KAAK,GAAG;YACJ,OAAO,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAC,CAAC;QAC7B,KAAK,GAAG,CAAC;QACT;YACI,OAAO,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,CAAC;IAChC,CAAC;AACL,CAAC;AAEM,MAAM,kBAAkB,GAAG,CAAC,KAA8B,EAAE,EAAE;IACjE,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IACjD,MAAM,EACF,WAAW,EACX,WAAW,EACX,IAAI,GAAG,GAAG,EACV,UAAU,EACV,QAAQ,EACR,KAAK,GAAG,SAAS,EACjB,SAAS,GAAG,GAAG,GAClB,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAC3E,MAAM,WAAW,GAAG,IAAA,gBAAQ,GAAE,CAAC;IAC/B,MAAM,gBAAgB,GAAG,IAAA,sBAAc,EAAC,UAAU,EAAE,WAAW,CAAC,CAAC;IAEjE,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,OAAO,CAAC,UAAU,CAAC,EAAC,CAAC,aAC7D,uBAAC,oBAAO,IACJ,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,KACnB,WAAW,EACf,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,GACd,EACD,WAAW,IAAI,CACZ,uBAAC,UAAG,IAAC,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,EAAC,IAAI,EAAE,QAAQ,EAAC,CAAC,EAAE,KAAK,QAAC,KAAK,EAAE,QAAQ,YAC9D,WAAW,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACvB,2BAAC,qBAAQ,IACL,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,KAChB,IAAI,EACR,GAAG,EAAE,IAAI,CAAC,IAAI,EACd,IAAI,EAAC,YAAY,EACjB,QAAQ,EAAE,eAAe,CAAC,IAAI,CAAC,EAC/B,KAAK,EAAE,KAAK,GACd,CACL,CAAC,GACA,CACT,EACA,UAAU,IAAI,CACX,gCAAK,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,YAC3B,uBAAC,4BAAe,IACZ,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,KAC3B,gBAAgB,EACpB,IAAI,EAAE,QAAQ,GAChB,GACA,CACT,IACC,CACT,CAAC;AACN,CAAC,CAAC;AAnDW,QAAA,kBAAkB,sBAmD7B;AACF,kBAAe,0BAAkB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {BackgroundImage, FileLink} from '../../components';\nimport {MobileContext} from '../../context/mobileContext';\nimport {useTheme} from '../../context/theme';\nimport {Col} from '../../grid';\nimport {ContentLayoutBlockProps, ContentSize, ContentTextSize} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block, getThemedValue} from '../../utils';\n\nimport './ContentLayout.scss';\n\nconst b = block('content-layout-block');\n\nfunction getFileTextSize(size: ContentSize) {\n    switch (size) {\n        case 's':\n            return 's';\n        case 'l':\n        default:\n            return 'l';\n    }\n}\n\nfunction getTextWidth(size: ContentTextSize) {\n    switch (size) {\n        case 's':\n            return {all: 12, md: 6};\n        case 'l':\n            return {all: 12, md: 12};\n        case 'm':\n        default:\n            return {all: 12, md: 8};\n    }\n}\n\nexport const ContentLayoutBlock = (props: ContentLayoutBlockProps) => {\n    const isMobile = React.useContext(MobileContext);\n    const {\n        textContent,\n        fileContent,\n        size = 'l',\n        background,\n        centered,\n        theme = 'default',\n        textWidth = 'm',\n    } = props;\n\n    const colSizes = React.useMemo(() => getTextWidth(textWidth), [textWidth]);\n    const globalTheme = useTheme();\n    const themedBackground = getThemedValue(background, globalTheme);\n\n    return (\n        <div className={b({size, theme, background: Boolean(background)})}>\n            <Content\n                className={b('content')}\n                {...textContent}\n                size={size}\n                centered={centered}\n                colSizes={colSizes}\n                theme={theme}\n            />\n            {fileContent && (\n                <Col className={b('files', {size, centered})} reset sizes={colSizes}>\n                    {fileContent.map((file) => (\n                        <FileLink\n                            className={b('file')}\n                            {...file}\n                            key={file.href}\n                            type=\"horizontal\"\n                            textSize={getFileTextSize(size)}\n                            theme={theme}\n                        />\n                    ))}\n                </Col>\n            )}\n            {background && (\n                <div className={b('background')}>\n                    <BackgroundImage\n                        className={b('background-item')}\n                        {...themedBackground}\n                        hide={isMobile}\n                    />\n                </div>\n            )}\n        </div>\n    );\n};\nexport default ContentLayoutBlock;\n"]}
+{"version":3,"file":"ContentLayout.js","sourceRoot":"../../../../src","sources":["blocks/ContentLayout/ContentLayout.tsx"],"names":[],"mappings":";;;;;;AAAA,qDAA+B;AAE/B,0DAA2D;AAC3D,kDAA4C;AAC5C,wDAA6C;AAC7C,kFAAgE;AAChE,8CAA+B;AAE/B,0DAAyC;AACzC,gDAAkD;AAIlD,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,sBAAsB,CAAC,CAAC;AAExC,SAAS,eAAe,CAAC,IAAiB;IACtC,QAAQ,IAAI,EAAE,CAAC;QACX,KAAK,GAAG;YACJ,OAAO,GAAG,CAAC;QACf,KAAK,GAAG,CAAC;QACT;YACI,OAAO,GAAG,CAAC;IACnB,CAAC;AACL,CAAC;AAED,SAAS,YAAY,CAAC,IAAqB;IACvC,QAAQ,IAAI,EAAE,CAAC;QACX,KAAK,GAAG;YACJ,OAAO,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,CAAC;QAC5B,KAAK,GAAG;YACJ,OAAO,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAC,CAAC;QAC7B,KAAK,GAAG,CAAC;QACT;YACI,OAAO,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,CAAC;IAChC,CAAC;AACL,CAAC;AAEM,MAAM,kBAAkB,GAAG,CAAC,KAA8B,EAAE,EAAE;IACjE,MAAM,WAAW,GAAG,IAAA,mCAAc,GAAE,CAAC;IACrC,MAAM,QAAQ,GAAG,WAAW,IAAI,uBAAW,CAAC,EAAE,CAAC;IAE/C,MAAM,EACF,WAAW,EACX,WAAW,EACX,IAAI,GAAG,GAAG,EACV,UAAU,EACV,QAAQ,EACR,KAAK,GAAG,SAAS,EACjB,SAAS,GAAG,GAAG,GAClB,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAC3E,MAAM,WAAW,GAAG,IAAA,gBAAQ,GAAE,CAAC;IAC/B,MAAM,gBAAgB,GAAG,IAAA,sBAAc,EAAC,UAAU,EAAE,WAAW,CAAC,CAAC;IAEjE,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,OAAO,CAAC,UAAU,CAAC,EAAC,CAAC,aAC7D,uBAAC,oBAAO,IACJ,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,KACnB,WAAW,EACf,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,GACd,EACD,WAAW,IAAI,CACZ,uBAAC,UAAG,IAAC,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,EAAC,IAAI,EAAE,QAAQ,EAAC,CAAC,EAAE,KAAK,QAAC,KAAK,EAAE,QAAQ,YAC9D,WAAW,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACvB,2BAAC,qBAAQ,IACL,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,KAChB,IAAI,EACR,GAAG,EAAE,IAAI,CAAC,IAAI,EACd,IAAI,EAAC,YAAY,EACjB,QAAQ,EAAE,eAAe,CAAC,IAAI,CAAC,EAC/B,KAAK,EAAE,KAAK,GACd,CACL,CAAC,GACA,CACT,EACA,UAAU,IAAI,CACX,gCAAK,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,YAC3B,uBAAC,4BAAe,IACZ,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,KAC3B,gBAAgB,EACpB,IAAI,EAAE,QAAQ,GAChB,GACA,CACT,IACC,CACT,CAAC;AACN,CAAC,CAAC;AArDW,QAAA,kBAAkB,sBAqD7B;AACF,kBAAe,0BAAkB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {BackgroundImage, FileLink} from '../../components';\nimport {BREAKPOINTS} from '../../constants';\nimport {useTheme} from '../../context/theme';\nimport {useWindowWidth} from '../../context/windowWidthContext';\nimport {Col} from '../../grid';\nimport {ContentLayoutBlockProps, ContentSize, ContentTextSize} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block, getThemedValue} from '../../utils';\n\nimport './ContentLayout.scss';\n\nconst b = block('content-layout-block');\n\nfunction getFileTextSize(size: ContentSize) {\n    switch (size) {\n        case 's':\n            return 's';\n        case 'l':\n        default:\n            return 'l';\n    }\n}\n\nfunction getTextWidth(size: ContentTextSize) {\n    switch (size) {\n        case 's':\n            return {all: 12, md: 6};\n        case 'l':\n            return {all: 12, md: 12};\n        case 'm':\n        default:\n            return {all: 12, md: 8};\n    }\n}\n\nexport const ContentLayoutBlock = (props: ContentLayoutBlockProps) => {\n    const windowWidth = useWindowWidth();\n    const isMobile = windowWidth <= BREAKPOINTS.sm;\n\n    const {\n        textContent,\n        fileContent,\n        size = 'l',\n        background,\n        centered,\n        theme = 'default',\n        textWidth = 'm',\n    } = props;\n\n    const colSizes = React.useMemo(() => getTextWidth(textWidth), [textWidth]);\n    const globalTheme = useTheme();\n    const themedBackground = getThemedValue(background, globalTheme);\n\n    return (\n        <div className={b({size, theme, background: Boolean(background)})}>\n            <Content\n                className={b('content')}\n                {...textContent}\n                size={size}\n                centered={centered}\n                colSizes={colSizes}\n                theme={theme}\n            />\n            {fileContent && (\n                <Col className={b('files', {size, centered})} reset sizes={colSizes}>\n                    {fileContent.map((file) => (\n                        <FileLink\n                            className={b('file')}\n                            {...file}\n                            key={file.href}\n                            type=\"horizontal\"\n                            textSize={getFileTextSize(size)}\n                            theme={theme}\n                        />\n                    ))}\n                </Col>\n            )}\n            {background && (\n                <div className={b('background')}>\n                    <BackgroundImage\n                        className={b('background-item')}\n                        {...themedBackground}\n                        hide={isMobile}\n                    />\n                </div>\n            )}\n        </div>\n    );\n};\nexport default ContentLayoutBlock;\n"]}

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

@@ -225,6 +225,17 @@ export declare const ContentLayoutBlock: {
                             };
                         };
                     };
+                    labels: {
+                        type: string;
+                        items: {
+                            type: string;
+                            properties: {
+                                when: {
+                                    type: string;
+                                };
+                            };
+                        };
+                    };
                     controlPosition: {
                         type: string;
                         enum: string[];

package/build/cjs/blocks/ExtendedFeatures/ExtendedFeatures.css

@@ -1,4 +1,4 @@
-.pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title {
+.pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title, .pc-ExtendedFeaturesBlock__item-title-container {
   margin: 0;
 }
 
@@ -20,6 +20,10 @@ unpredictable css rules order in build */
   margin: inherit;
   display: block;
   margin-block: 0 8px;
+  font-size: var(--g-text-header-1-font-size);
+  line-height: var(--g-text-header-1-line-height);
+  color: var(--pc-text-header-color);
+  font-weight: var(--g-text-accent-font-weight);
 }
 .pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title {
   font-size: var(--g-text-header-1-font-size);
@@ -28,7 +32,6 @@ unpredictable css rules order in build */
   font-weight: var(--g-text-accent-font-weight);
   position: relative;
   margin-bottom: 8px;
-  display: inline;
 }
 .pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title a {
   outline: none;
@@ -43,9 +46,6 @@ unpredictable css rules order in build */
   --pc-text-header-color: var(--g-color-text-link-hover);
   color: var(--g-color-text-link-hover);
 }
-.pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title p {
-  display: inline;
-}
 
 .pc-ExtendedFeaturesBlock__item-label {
   font-size: var(--g-text-caption-2-font-size);

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { FilterBlockProps } from "../../models/index.js";
-declare const FilterBlock: React.FC<FilterBlockProps>;
+declare const FilterBlock: ({ title, description, tags, tagButtonSize, allTag, items, colSizes, centered, animated, }: FilterBlockProps) => import("react/jsx-runtime").JSX.Element;
 export default FilterBlock;

package/build/cjs/blocks/FilterBlock/FilterBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterBlock.js","sourceRoot":"../../../../src","sources":["blocks/FilterBlock/FilterBlock.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {CardLayoutBlock} from '..';\nimport {AnimateBlock, Title} from '../../components';\nimport ButtonTabs, {ButtonTabsItemProps} from '../../components/ButtonTabs/ButtonTabs';\nimport {ConstructorItem} from '../../containers/PageConstructor/components/ConstructorItem';\nimport {Col, Row} from '../../grid';\nimport {FilterBlockProps, FilterItem} from '../../models';\nimport {block, getBlockKey} from '../../utils';\n\nimport {i18n} from './i18n';\nimport './FilterBlock.scss';\n\nconst b = block('filter-block');\n\nconst FilterBlock: React.FC<FilterBlockProps> = ({\n    title,\n    description,\n    tags,\n    tagButtonSize,\n    allTag,\n    items,\n    colSizes,\n    centered,\n    animated,\n}) => {\n    const tabButtons = React.useMemo(() => {\n        const allButton: ButtonTabsItemProps | undefined = allTag\n            ? {id: null, title: typeof allTag === 'boolean' ? i18n('label-all-tag') : allTag}\n            : undefined;\n        const otherButtons: ButtonTabsItemProps[] | undefined =\n            tags && tags.map((tag) => ({id: tag.id, title: tag.label}));\n        return [...(allButton ? [allButton] : []), ...(otherButtons ? otherButtons : [])];\n    }, [allTag, tags]);\n\n    const [selectedTag, setSelectedTag] = React.useState(\n        tabButtons.length ? tabButtons[0].id : null,\n    );\n\n    const actualTag: string | null = React.useMemo(() => {\n        return tabButtons.length && !tabButtons.find((tab) => tab.id === selectedTag)\n            ? tabButtons[0].id\n            : selectedTag;\n    }, [tabButtons, selectedTag]);\n\n    const cards = React.useMemo(() => {\n        const itemsToShow: FilterItem[] = actualTag\n            ? items.filter((item) => item.tags.includes(actualTag))\n            : items;\n\n        return itemsToShow.map((item) => item.card);\n    }, [actualTag, items]);\n\n    return (\n        <AnimateBlock className={b()} animate={animated}>\n            {title && (\n                <Title\n                    className={b('title', {centered: centered})}\n                    title={title}\n                    subtitle={description}\n                />\n            )}\n            {tabButtons.length && (\n                <Row>\n                    <Col>\n                        <ButtonTabs\n                            className={b('tabs', {centered: centered})}\n                            items={tabButtons}\n                            activeTab={selectedTag}\n                            onSelectTab={setSelectedTag}\n                            tabSize={tagButtonSize}\n                        />\n                    </Col>\n                </Row>\n            )}\n            <Row className={b('block-container')}>\n                <CardLayoutBlock title=\"\" colSizes={colSizes} className={b('cards-container')}>\n                    {cards.map((card, index) => {\n                        const key = getBlockKey(card, index);\n\n                        return <ConstructorItem data={card} blockKey={key} key={key} />;\n                    })}\n                </CardLayoutBlock>\n            </Row>\n        </AnimateBlock>\n    );\n};\nexport default FilterBlock;\n"]}
+{"version":3,"file":"FilterBlock.js","sourceRoot":"../../../../src","sources":["blocks/FilterBlock/FilterBlock.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,mCAAmC;AACnC,0DAAqD;AACrD,mGAAuF;AACvF,0GAA4F;AAC5F,8CAAoC;AAEpC,gDAA+C;AAE/C,0CAA4B;AAI5B,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,cAAc,CAAC,CAAC;AAEhC,MAAM,WAAW,GAAG,CAAC,EACjB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,aAAa,EACb,MAAM,EACN,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,QAAQ,GACO,EAAE,EAAE;IACnB,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAClC,MAAM,SAAS,GAAoC,MAAM;YACrD,CAAC,CAAC,EAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,IAAA,WAAI,EAAC,eAAe,CAAC,CAAC,CAAC,CAAC,MAAM,EAAC;YACjF,CAAC,CAAC,SAAS,CAAC;QAChB,MAAM,YAAY,GACd,IAAI,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,EAAC,EAAE,EAAE,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,CAAC,KAAK,EAAC,CAAC,CAAC,CAAC;QAChE,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACtF,CAAC,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC;IAEnB,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,QAAQ,CAChD,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAC9C,CAAC;IAEF,MAAM,SAAS,GAAkB,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAChD,OAAO,UAAU,CAAC,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,WAAW,CAAC;YACzE,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE;YAClB,CAAC,CAAC,WAAW,CAAC;IACtB,CAAC,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,CAAC;IAE9B,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC7B,MAAM,WAAW,GAAiB,SAAS;YACvC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;YACvD,CAAC,CAAC,KAAK,CAAC;QAEZ,OAAO,WAAW,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAChD,CAAC,EAAE,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC;IAEvB,OAAO,CACH,wBAAC,yBAAY,IAAC,SAAS,EAAE,CAAC,EAAE,EAAE,OAAO,EAAE,QAAQ,aAC1C,KAAK,IAAI,CACN,uBAAC,kBAAK,IACF,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,EAAC,QAAQ,EAAE,QAAQ,EAAC,CAAC,EAC3C,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,WAAW,GACvB,CACL,EACA,UAAU,CAAC,MAAM,IAAI,CAClB,uBAAC,UAAG,cACA,uBAAC,UAAG,cACA,uBAAC,oBAAU,IACP,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,QAAQ,EAAE,QAAQ,EAAC,CAAC,EAC1C,KAAK,EAAE,UAAU,EACjB,SAAS,EAAE,WAAW,EACtB,WAAW,EAAE,cAAc,EAC3B,OAAO,EAAE,aAAa,GACxB,GACA,GACJ,CACT,EACD,uBAAC,UAAG,IAAC,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,YAChC,uBAAC,mBAAe,IAAC,KAAK,EAAC,EAAE,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,YACxE,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;wBACvB,MAAM,GAAG,GAAG,IAAA,mBAAW,EAAC,IAAI,EAAE,KAAK,CAAC,CAAC;wBAErC,OAAO,uBAAC,iCAAe,IAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAO,GAAG,CAAI,CAAC;oBACpE,CAAC,CAAC,GACY,GAChB,IACK,CAClB,CAAC;AACN,CAAC,CAAC;AACF,kBAAe,WAAW,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {CardLayoutBlock} from '..';\nimport {AnimateBlock, Title} from '../../components';\nimport ButtonTabs, {ButtonTabsItemProps} from '../../components/ButtonTabs/ButtonTabs';\nimport {ConstructorItem} from '../../containers/PageConstructor/components/ConstructorItem';\nimport {Col, Row} from '../../grid';\nimport {FilterBlockProps, FilterItem} from '../../models';\nimport {block, getBlockKey} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './FilterBlock.scss';\n\nconst b = block('filter-block');\n\nconst FilterBlock = ({\n    title,\n    description,\n    tags,\n    tagButtonSize,\n    allTag,\n    items,\n    colSizes,\n    centered,\n    animated,\n}: FilterBlockProps) => {\n    const tabButtons = React.useMemo(() => {\n        const allButton: ButtonTabsItemProps | undefined = allTag\n            ? {id: null, title: typeof allTag === 'boolean' ? i18n('label-all-tag') : allTag}\n            : undefined;\n        const otherButtons: ButtonTabsItemProps[] | undefined =\n            tags && tags.map((tag) => ({id: tag.id, title: tag.label}));\n        return [...(allButton ? [allButton] : []), ...(otherButtons ? otherButtons : [])];\n    }, [allTag, tags]);\n\n    const [selectedTag, setSelectedTag] = React.useState(\n        tabButtons.length ? tabButtons[0].id : null,\n    );\n\n    const actualTag: string | null = React.useMemo(() => {\n        return tabButtons.length && !tabButtons.find((tab) => tab.id === selectedTag)\n            ? tabButtons[0].id\n            : selectedTag;\n    }, [tabButtons, selectedTag]);\n\n    const cards = React.useMemo(() => {\n        const itemsToShow: FilterItem[] = actualTag\n            ? items.filter((item) => item.tags.includes(actualTag))\n            : items;\n\n        return itemsToShow.map((item) => item.card);\n    }, [actualTag, items]);\n\n    return (\n        <AnimateBlock className={b()} animate={animated}>\n            {title && (\n                <Title\n                    className={b('title', {centered: centered})}\n                    title={title}\n                    subtitle={description}\n                />\n            )}\n            {tabButtons.length && (\n                <Row>\n                    <Col>\n                        <ButtonTabs\n                            className={b('tabs', {centered: centered})}\n                            items={tabButtons}\n                            activeTab={selectedTag}\n                            onSelectTab={setSelectedTag}\n                            tabSize={tagButtonSize}\n                        />\n                    </Col>\n                </Row>\n            )}\n            <Row className={b('block-container')}>\n                <CardLayoutBlock title=\"\" colSizes={colSizes} className={b('cards-container')}>\n                    {cards.map((card, index) => {\n                        const key = getBlockKey(card, index);\n\n                        return <ConstructorItem data={card} blockKey={key} key={key} />;\n                    })}\n                </CardLayoutBlock>\n            </Row>\n        </AnimateBlock>\n    );\n};\nexport default FilterBlock;\n"]}

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

@@ -51,6 +51,17 @@ export declare const FoldableListBlock: {
                 contentType: string;
                 inputType: string;
             };
+            labels: {
+                type: string;
+                items: {
+                    type: string;
+                    properties: {
+                        when: {
+                            type: string;
+                        };
+                    };
+                };
+            };
             additionalInfo: {
                 type: string;
                 contentType: string;

package/build/cjs/blocks/Form/Form.css

@@ -69,7 +69,7 @@ unpredictable css rules order in build */
     width: fit-content;
   }
 }
-@media (max-width: 1081px) and (min-width: 769px) {
+@media (max-width: 1080px) and (min-width: 769px) {
   .pc-form-block__row {
     flex-direction: column;
   }
@@ -94,11 +94,14 @@ unpredictable css rules order in build */
     text-align: center;
     padding-bottom: 32px;
   }
+  .pc-form-block_with-background .pc-form-block__row .pc-form-block__content-wrapper .pc-content-labels, .pc-form-block:not(.pc-form-block_with-background) .pc-form-block__row .pc-form-block__content-wrapper .pc-content-labels {
+    justify-content: center;
+  }
   .pc-form-block:not(.pc-form-block_with-background) .pc-form-block__row .pc-form-block__content-wrapper {
     padding: 0 0 32px 0;
   }
 }
-@media (max-width: 769px) {
+@media (max-width: 768px) {
   .pc-form-block__full-form {
     padding: 32px;
   }

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import type { FormBlockProps } from "../../models/index.js";
-declare const FormBlock: React.FC<FormBlockProps>;
-export default FormBlock;
+declare const Form: (props: FormBlockProps) => import("react/jsx-runtime").JSX.Element | null;
+export default Form;

package/build/cjs/blocks/Form/Form.js

@@ -8,25 +8,28 @@ const InnerForm_1 = tslib_1.__importDefault(require("../../components/InnerForm/
 const mobileContext_1 = require("../../context/mobileContext/index.js");
 const theme_1 = require("../../context/theme/index.js");
 const grid_1 = require("../../grid/index.js");
+const useDeviceValue_1 = require("../../hooks/useDeviceValue.js");
 const models_1 = require("../../models/index.js");
 const sub_blocks_1 = require("../../sub-blocks/index.js");
 const utils_1 = require("../../utils/index.js");
+const utils_2 = require("./utils.js");
 const b = (0, utils_1.block)('form-block');
 const colSizes = { [grid_1.GridColumnSize.Lg]: 6, [grid_1.GridColumnSize.All]: 12 };
-const FormBlock = (props) => {
-    const { formData, title, textContent, direction = models_1.FormBlockDirection.Center, background } = props;
+const Form = (props) => {
+    const { formData, title, textContent, direction = models_1.FormBlockDirection.Center, background, customFormNode, } = props;
     const [contentLoaded, setContentLoaded] = React.useState(false);
     const isMobile = React.useContext(mobileContext_1.MobileContext);
     const theme = (0, theme_1.useTheme)();
     const themedBackground = (0, utils_1.getThemedValue)(background, theme) || undefined;
+    const themedBackgroundStyle = (0, useDeviceValue_1.useDeviceValue)(themedBackground?.style) || undefined;
     const withBackground = Boolean(themedBackground &&
         (themedBackground.src ||
             themedBackground.desktop ||
-            themedBackground.style?.backgroundColor));
+            (0, utils_2.hasBackgroundCSS)(themedBackgroundStyle ?? {})));
     const onContentLoad = React.useCallback(() => {
         setContentLoaded(true);
     }, []);
-    if (!formData) {
+    if (!formData && !customFormNode) {
         return null;
     }
     let formType;
@@ -39,16 +42,16 @@ const FormBlock = (props) => {
     return ((0, jsx_runtime_1.jsxs)("div", { className: b({
             'with-background': withBackground,
             'form-type': formType,
-        }), children: [themedBackground && ((0, jsx_runtime_1.jsx)(components_1.BackgroundImage, { ...themedBackground, className: b('media'), imageClassName: b('image') })), (0, jsx_runtime_1.jsx)(grid_1.Grid, { children: (0, jsx_runtime_1.jsxs)(grid_1.Row, { alignItems: direction === models_1.FormBlockDirection.Center
+        }), children: [themedBackground && ((0, jsx_runtime_1.jsx)(components_1.BackgroundImage, { ...themedBackground, style: themedBackgroundStyle, className: b('media'), imageClassName: b('image') })), (0, jsx_runtime_1.jsx)(grid_1.Grid, { children: (0, jsx_runtime_1.jsxs)(grid_1.Row, { alignItems: direction === models_1.FormBlockDirection.Center
                         ? grid_1.GridAlignItems.Center
                         : grid_1.GridAlignItems.Start, className: b('row', {
                         direction,
-                    }), children: [(0, jsx_runtime_1.jsx)(grid_1.Col, { sizes: colSizes, className: b('content-col'), children: textContent && ((0, jsx_runtime_1.jsx)("div", { className: b('content-wrapper'), children: (0, jsx_runtime_1.jsx)(sub_blocks_1.Content, { theme: "default", ...textContent, centered: direction === models_1.FormBlockDirection.Center, colSizes: { all: 12 }, className: b('content') }) })) }), (0, jsx_runtime_1.jsx)(grid_1.Col, { sizes: colSizes, className: b('form-col'), children: (0, jsx_runtime_1.jsx)("div", { className: b('form-wrapper'), children: (0, jsx_runtime_1.jsxs)("div", { className: b('full-form', {
+                    }), children: [(0, jsx_runtime_1.jsx)(grid_1.Col, { sizes: colSizes, className: b('content-col'), children: textContent && ((0, jsx_runtime_1.jsx)("div", { className: b('content-wrapper'), children: (0, jsx_runtime_1.jsx)(sub_blocks_1.Content, { theme: "default", ...textContent, centered: direction === models_1.FormBlockDirection.Center, colSizes: { all: 12 }, className: b('content') }) })) }), (0, jsx_runtime_1.jsx)(grid_1.Col, { sizes: colSizes, className: b('form-col'), children: (0, jsx_runtime_1.jsx)("div", { className: b('form-wrapper'), children: (0, jsx_runtime_1.jsx)("div", { className: b('full-form', {
                                         hidden: !contentLoaded,
-                                    }), children: [title && ((0, jsx_runtime_1.jsx)(components_1.Title, { title: {
-                                                text: title,
-                                                textSize: 's',
-                                            }, className: b('title', { mobile: isMobile }), colSizes: { all: 12 } })), (0, jsx_runtime_1.jsx)(InnerForm_1.default, { className: b('form'), formData: formData, onContentLoad: onContentLoad })] }) }) })] }) })] }));
+                                    }), children: customFormNode || ((0, jsx_runtime_1.jsxs)(React.Fragment, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.Title, { title: {
+                                                    text: title,
+                                                    textSize: 's',
+                                                }, className: b('title', { mobile: isMobile }), colSizes: { all: 12 } })), (0, jsx_runtime_1.jsx)(InnerForm_1.default, { className: b('form'), formData: formData, onContentLoad: onContentLoad })] })) }) }) })] }) })] }));
 };
-exports.default = FormBlock;
+exports.default = Form;
 //# sourceMappingURL=Form.js.map

package/build/cjs/blocks/Form/Form.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.js","sourceRoot":"../../../../src","sources":["blocks/Form/Form.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {BackgroundImage, Title} from '../../components';\nimport InnerForm from '../../components/InnerForm/InnerForm';\nimport {MobileContext} from '../../context/mobileContext';\nimport {useTheme} from '../../context/theme';\nimport {Col, Grid, GridAlignItems, GridColumnSize, Row} from '../../grid';\nimport type {FormBlockProps} from '../../models';\nimport {\n    FormBlockDataTypes,\n    FormBlockDirection,\n    isHubspotDataForm,\n    isYandexDataForm,\n} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block, getThemedValue} from '../../utils';\n\nimport './Form.scss';\n\nconst b = block('form-block');\n\nconst colSizes = {[GridColumnSize.Lg]: 6, [GridColumnSize.All]: 12};\n\nconst FormBlock: React.FC<FormBlockProps> = (props) => {\n    const {formData, title, textContent, direction = FormBlockDirection.Center, background} = props;\n    const [contentLoaded, setContentLoaded] = React.useState(false);\n    const isMobile = React.useContext(MobileContext);\n    const theme = useTheme();\n\n    const themedBackground = getThemedValue(background, theme) || undefined;\n\n    const withBackground = Boolean(\n        themedBackground &&\n            (themedBackground.src ||\n                themedBackground.desktop ||\n                themedBackground.style?.backgroundColor),\n    );\n    const onContentLoad = React.useCallback(() => {\n        setContentLoaded(true);\n    }, []);\n\n    if (!formData) {\n        return null;\n    }\n\n    let formType;\n\n    if (isYandexDataForm(formData)) {\n        formType = FormBlockDataTypes.YANDEX;\n    } else if (isHubspotDataForm(formData)) {\n        formType = FormBlockDataTypes.HUBSPOT;\n    }\n\n    return (\n        <div\n            className={b({\n                'with-background': withBackground,\n                'form-type': formType,\n            })}\n        >\n            {themedBackground && (\n                <BackgroundImage\n                    {...themedBackground}\n                    className={b('media')}\n                    imageClassName={b('image')}\n                />\n            )}\n            <Grid>\n                <Row\n                    alignItems={\n                        direction === FormBlockDirection.Center\n                            ? GridAlignItems.Center\n                            : GridAlignItems.Start\n                    }\n                    className={b('row', {\n                        direction,\n                    })}\n                >\n                    <Col sizes={colSizes} className={b('content-col')}>\n                        {textContent && (\n                            <div className={b('content-wrapper')}>\n                                <Content\n                                    theme=\"default\"\n                                    {...textContent}\n                                    centered={direction === FormBlockDirection.Center}\n                                    colSizes={{all: 12}}\n                                    className={b('content')}\n                                />\n                            </div>\n                        )}\n                    </Col>\n                    <Col sizes={colSizes} className={b('form-col')}>\n                        <div className={b('form-wrapper')}>\n                            <div\n                                className={b('full-form', {\n                                    hidden: !contentLoaded,\n                                })}\n                            >\n                                {title && (\n                                    <Title\n                                        title={{\n                                            text: title,\n                                            textSize: 's',\n                                        }}\n                                        className={b('title', {mobile: isMobile})}\n                                        colSizes={{all: 12}}\n                                    />\n                                )}\n                                <InnerForm\n                                    className={b('form')}\n                                    formData={formData}\n                                    onContentLoad={onContentLoad}\n                                />\n                            </div>\n                        </div>\n                    </Col>\n                </Row>\n            </Grid>\n        </div>\n    );\n};\n\nexport default FormBlock;\n"]}
+{"version":3,"file":"Form.js","sourceRoot":"../../../../src","sources":["blocks/Form/Form.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {BackgroundImage, Title} from '../../components';\nimport InnerForm from '../../components/InnerForm/InnerForm';\nimport {MobileContext} from '../../context/mobileContext';\nimport {useTheme} from '../../context/theme';\nimport {Col, Grid, GridAlignItems, GridColumnSize, Row} from '../../grid';\nimport {useDeviceValue} from '../../hooks/useDeviceValue';\nimport type {FormBlockProps} from '../../models';\nimport {\n    FormBlockDataTypes,\n    FormBlockDirection,\n    isHubspotDataForm,\n    isYandexDataForm,\n} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block, getThemedValue} from '../../utils';\n\nimport {hasBackgroundCSS} from './utils';\n\nimport './Form.scss';\n\nconst b = block('form-block');\n\nconst colSizes = {[GridColumnSize.Lg]: 6, [GridColumnSize.All]: 12};\n\nconst Form = (props: FormBlockProps) => {\n    const {\n        formData,\n        title,\n        textContent,\n        direction = FormBlockDirection.Center,\n        background,\n        customFormNode,\n    } = props;\n    const [contentLoaded, setContentLoaded] = React.useState(false);\n    const isMobile = React.useContext(MobileContext);\n    const theme = useTheme();\n\n    const themedBackground = getThemedValue(background, theme) || undefined;\n    const themedBackgroundStyle = useDeviceValue(themedBackground?.style) || undefined;\n\n    const withBackground = Boolean(\n        themedBackground &&\n            (themedBackground.src ||\n                themedBackground.desktop ||\n                hasBackgroundCSS(themedBackgroundStyle ?? {})),\n    );\n\n    const onContentLoad = React.useCallback(() => {\n        setContentLoaded(true);\n    }, []);\n\n    if (!formData && !customFormNode) {\n        return null;\n    }\n\n    let formType;\n\n    if (isYandexDataForm(formData)) {\n        formType = FormBlockDataTypes.YANDEX;\n    } else if (isHubspotDataForm(formData)) {\n        formType = FormBlockDataTypes.HUBSPOT;\n    }\n\n    return (\n        <div\n            className={b({\n                'with-background': withBackground,\n                'form-type': formType,\n            })}\n        >\n            {themedBackground && (\n                <BackgroundImage\n                    {...themedBackground}\n                    style={themedBackgroundStyle}\n                    className={b('media')}\n                    imageClassName={b('image')}\n                />\n            )}\n            <Grid>\n                <Row\n                    alignItems={\n                        direction === FormBlockDirection.Center\n                            ? GridAlignItems.Center\n                            : GridAlignItems.Start\n                    }\n                    className={b('row', {\n                        direction,\n                    })}\n                >\n                    <Col sizes={colSizes} className={b('content-col')}>\n                        {textContent && (\n                            <div className={b('content-wrapper')}>\n                                <Content\n                                    theme=\"default\"\n                                    {...textContent}\n                                    centered={direction === FormBlockDirection.Center}\n                                    colSizes={{all: 12}}\n                                    className={b('content')}\n                                />\n                            </div>\n                        )}\n                    </Col>\n                    <Col sizes={colSizes} className={b('form-col')}>\n                        <div className={b('form-wrapper')}>\n                            <div\n                                className={b('full-form', {\n                                    hidden: !contentLoaded,\n                                })}\n                            >\n                                {customFormNode || (\n                                    <React.Fragment>\n                                        {title && (\n                                            <Title\n                                                title={{\n                                                    text: title,\n                                                    textSize: 's',\n                                                }}\n                                                className={b('title', {mobile: isMobile})}\n                                                colSizes={{all: 12}}\n                                            />\n                                        )}\n                                        <InnerForm\n                                            className={b('form')}\n                                            formData={formData}\n                                            onContentLoad={onContentLoad}\n                                        />\n                                    </React.Fragment>\n                                )}\n                            </div>\n                        </div>\n                    </Col>\n                </Row>\n            </Grid>\n        </div>\n    );\n};\n\nexport default Form;\n"]}

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

@@ -164,6 +164,17 @@ export declare const FormBlock: {
                             };
                         };
                     };
+                    labels: {
+                        type: string;
+                        items: {
+                            type: string;
+                            properties: {
+                                when: {
+                                    type: string;
+                                };
+                            };
+                        };
+                    };
                     controlPosition: {
                         type: string;
                         enum: string[];
@@ -173,7 +184,7 @@ export declare const FormBlock: {
             direction: {
                 enum: string[];
             };
-            image: {
+            background: {
                 oneOf: ({
                     type: string;
                     properties: {
@@ -200,9 +211,6 @@ export declare const FormBlock: {
                     pattern?: undefined;
                 })[];
             };
-            backgroundColor: {
-                type: string;
-            };
             anchor: {
                 type: string;
                 additionalProperties: boolean;

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

@@ -43,10 +43,7 @@ exports.FormBlock = {
             direction: {
                 enum: ['content-form', 'form-content', 'center'],
             },
-            image: schema_1.ImageProps,
-            backgroundColor: {
-                type: 'string',
-            },
+            background: schema_1.ImageProps,
         },
     },
 };

package/build/cjs/blocks/Form/schema.js.map

@@ -1 +1 @@
-{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["blocks/Form/schema.ts"],"names":[],"mappings":";;;;AAAA,kEAA+B;AAE/B,6DAAyD;AACzD,kEAAmE;AACnE,8DAAyE;AACzE,+DAA4D;AAC5D,mEAAqE;AAErE,MAAM,qBAAqB,GAAG,IAAA,cAAI,EAAC,oBAAW,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAC;AAErE,QAAA,SAAS,GAAG;IACrB,YAAY,EAAE;QACV,oBAAoB,EAAE,KAAK;QAC3B,QAAQ,EAAE,CAAC,UAAU,CAAC;QACtB,UAAU,EAAE;YACR,GAAG,uBAAc;YACjB,KAAK,EAAE;gBACH,IAAI,EAAE,QAAQ;aACjB;YACD,QAAQ,EAAE;gBACN,KAAK,EAAE;oBACH;wBACI,IAAI,EAAE,QAAQ;wBACd,UAAU,EAAE,QAAQ;wBACpB,UAAU,EAAE;4BACR,MAAM,EAAE,IAAA,kBAAS,EAAC,wBAAe,CAAC;yBACrC;qBACJ;oBACD;wBACI,IAAI,EAAE,QAAQ;wBACd,UAAU,EAAE,SAAS;wBACrB,UAAU,EAAE;4BACR,OAAO,EAAE,IAAA,kBAAS,EAAC,yBAAgB,CAAC;yBACvC;qBACJ;iBACJ;aACJ;YACD,WAAW,EAAE;gBACT,oBAAoB,EAAE,KAAK;gBAC3B,UAAU,EAAE,qBAAqB;aACpC;YACD,SAAS,EAAE;gBACP,IAAI,EAAE,CAAC,cAAc,EAAE,cAAc,EAAE,QAAQ,CAAC;aACnD;YACD,KAAK,EAAE,mBAAU;YACjB,eAAe,EAAE;gBACb,IAAI,EAAE,QAAQ;aACjB;SACJ;KACJ;CACJ,CAAC","sourcesContent":["import omit from 'lodash/omit';\n\nimport {ImageProps} from '../../components/Image/schema';\nimport {YandexFormProps} from '../../components/YandexForm/schema';\nimport {BlockBaseProps, withTheme} from '../../schema/validators/common';\nimport {ContentBase} from '../../sub-blocks/Content/schema';\nimport {HubspotFormProps} from '../../sub-blocks/HubspotForm/schema';\n\nconst FormBlockContentProps = omit(ContentBase, ['size', 'centered', 'colSizes']);\n\nexport const FormBlock = {\n    'form-block': {\n        additionalProperties: false,\n        required: ['formData'],\n        properties: {\n            ...BlockBaseProps,\n            title: {\n                type: 'string',\n            },\n            formData: {\n                oneOf: [\n                    {\n                        type: 'object',\n                        optionName: 'yandex',\n                        properties: {\n                            yandex: withTheme(YandexFormProps),\n                        },\n                    },\n                    {\n                        type: 'object',\n                        optionName: 'hubspot',\n                        properties: {\n                            hubspot: withTheme(HubspotFormProps),\n                        },\n                    },\n                ],\n            },\n            textContent: {\n                additionalProperties: false,\n                properties: FormBlockContentProps,\n            },\n            direction: {\n                enum: ['content-form', 'form-content', 'center'],\n            },\n            image: ImageProps,\n            backgroundColor: {\n                type: 'string',\n            },\n        },\n    },\n};\n"]}
+{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["blocks/Form/schema.ts"],"names":[],"mappings":";;;;AAAA,kEAA+B;AAE/B,6DAAyD;AACzD,kEAAmE;AACnE,8DAAyE;AACzE,+DAA4D;AAC5D,mEAAqE;AAErE,MAAM,qBAAqB,GAAG,IAAA,cAAI,EAAC,oBAAW,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAC;AAErE,QAAA,SAAS,GAAG;IACrB,YAAY,EAAE;QACV,oBAAoB,EAAE,KAAK;QAC3B,QAAQ,EAAE,CAAC,UAAU,CAAC;QACtB,UAAU,EAAE;YACR,GAAG,uBAAc;YACjB,KAAK,EAAE;gBACH,IAAI,EAAE,QAAQ;aACjB;YACD,QAAQ,EAAE;gBACN,KAAK,EAAE;oBACH;wBACI,IAAI,EAAE,QAAQ;wBACd,UAAU,EAAE,QAAQ;wBACpB,UAAU,EAAE;4BACR,MAAM,EAAE,IAAA,kBAAS,EAAC,wBAAe,CAAC;yBACrC;qBACJ;oBACD;wBACI,IAAI,EAAE,QAAQ;wBACd,UAAU,EAAE,SAAS;wBACrB,UAAU,EAAE;4BACR,OAAO,EAAE,IAAA,kBAAS,EAAC,yBAAgB,CAAC;yBACvC;qBACJ;iBACJ;aACJ;YACD,WAAW,EAAE;gBACT,oBAAoB,EAAE,KAAK;gBAC3B,UAAU,EAAE,qBAAqB;aACpC;YACD,SAAS,EAAE;gBACP,IAAI,EAAE,CAAC,cAAc,EAAE,cAAc,EAAE,QAAQ,CAAC;aACnD;YACD,UAAU,EAAE,mBAAU;SACzB;KACJ;CACJ,CAAC","sourcesContent":["import omit from 'lodash/omit';\n\nimport {ImageProps} from '../../components/Image/schema';\nimport {YandexFormProps} from '../../components/YandexForm/schema';\nimport {BlockBaseProps, withTheme} from '../../schema/validators/common';\nimport {ContentBase} from '../../sub-blocks/Content/schema';\nimport {HubspotFormProps} from '../../sub-blocks/HubspotForm/schema';\n\nconst FormBlockContentProps = omit(ContentBase, ['size', 'centered', 'colSizes']);\n\nexport const FormBlock = {\n    'form-block': {\n        additionalProperties: false,\n        required: ['formData'],\n        properties: {\n            ...BlockBaseProps,\n            title: {\n                type: 'string',\n            },\n            formData: {\n                oneOf: [\n                    {\n                        type: 'object',\n                        optionName: 'yandex',\n                        properties: {\n                            yandex: withTheme(YandexFormProps),\n                        },\n                    },\n                    {\n                        type: 'object',\n                        optionName: 'hubspot',\n                        properties: {\n                            hubspot: withTheme(HubspotFormProps),\n                        },\n                    },\n                ],\n            },\n            textContent: {\n                additionalProperties: false,\n                properties: FormBlockContentProps,\n            },\n            direction: {\n                enum: ['content-form', 'form-content', 'center'],\n            },\n            background: ImageProps,\n        },\n    },\n};\n"]}

package/build/cjs/blocks/Form/utils.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const BACKGROUND_STYLE_PROPS: readonly ["background", "backgroundAttachment", "backgroundBlendMode", "backgroundClip", "backgroundColor", "backgroundImage", "backgroundOrigin", "backgroundPositionX", "backgroundPositionY", "backgroundRepeat", "backgroundSize", "backgroundPosition"];
+export declare const hasBackgroundCSS: (style: React.CSSProperties) => boolean;

package/build/cjs/blocks/Form/utils.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.hasBackgroundCSS = exports.BACKGROUND_STYLE_PROPS = void 0;
+exports.BACKGROUND_STYLE_PROPS = [
+    'background',
+    'backgroundAttachment',
+    'backgroundBlendMode',
+    'backgroundClip',
+    'backgroundColor',
+    'backgroundImage',
+    'backgroundOrigin',
+    'backgroundPositionX',
+    'backgroundPositionY',
+    'backgroundRepeat',
+    'backgroundSize',
+    'backgroundPosition',
+];
+const hasBackgroundCSS = (style) => exports.BACKGROUND_STYLE_PROPS.some((backgroundStyleProp) => backgroundStyleProp in style);
+exports.hasBackgroundCSS = hasBackgroundCSS;
+//# sourceMappingURL=utils.js.map

package/build/cjs/blocks/Form/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"../../../../src","sources":["blocks/Form/utils.ts"],"names":[],"mappings":";;;AAEa,QAAA,sBAAsB,GAAG;IAClC,YAAY;IACZ,sBAAsB;IACtB,qBAAqB;IACrB,gBAAgB;IAChB,iBAAiB;IACjB,iBAAiB;IACjB,kBAAkB;IAClB,qBAAqB;IACrB,qBAAqB;IACrB,kBAAkB;IAClB,gBAAgB;IAChB,oBAAoB;CACd,CAAC;AAEJ,MAAM,gBAAgB,GAAG,CAAC,KAA0B,EAAE,EAAE,CAC3D,8BAAsB,CAAC,IAAI,CAAC,CAAC,mBAAmB,EAAE,EAAE,CAAC,mBAAmB,IAAI,KAAK,CAAC,CAAC;AAD1E,QAAA,gBAAgB,oBAC0D","sourcesContent":["import * as React from 'react';\n\nexport const BACKGROUND_STYLE_PROPS = [\n    'background',\n    'backgroundAttachment',\n    'backgroundBlendMode',\n    'backgroundClip',\n    'backgroundColor',\n    'backgroundImage',\n    'backgroundOrigin',\n    'backgroundPositionX',\n    'backgroundPositionY',\n    'backgroundRepeat',\n    'backgroundSize',\n    'backgroundPosition',\n] as const;\n\nexport const hasBackgroundCSS = (style: React.CSSProperties) =>\n    BACKGROUND_STYLE_PROPS.some((backgroundStyleProp) => backgroundStyleProp in style);\n"]}

package/build/cjs/blocks/Header/Header.css

@@ -145,6 +145,13 @@ unpredictable css rules order in build */
   object-fit: cover;
   border-radius: var(--pc-border-radius);
 }
+.pc-header-block__video-iframe {
+  position: absolute;
+  top: 50%;
+  right: 0;
+  left: 0;
+  transform: translateY(-50%);
+}
 .pc-header-block__breadcrumbs {
   position: absolute;
   top: 16px;
@@ -220,6 +227,12 @@ unpredictable css rules order in build */
   left: 50%;
   transform: translate(-50%, -50%);
 }
+.pc-header-block_media-view_full .pc-header-block__video-iframe {
+  top: 0;
+  bottom: 0;
+  height: auto !important; /* stylelint-disable-line declaration-no-important */
+  transform: none;
+}
 @media (max-width: 1440px) {
   .pc-header-block__background, .pc-header-block__background.pc-header-block__background_media {
     left: 0;

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

@@ -1,5 +1,11 @@
 import * as React from 'react';
 import { ClassNameProps, HeaderBlockProps } from "../../models/index.js";
-type HeaderBlockFullProps = HeaderBlockProps & ClassNameProps;
+type ElementsClassName = {
+    gridClassName?: string;
+    mediaClassName?: string;
+    contentWrapperClassName?: string;
+    contentInnerClassName?: string;
+};
+export type HeaderBlockFullProps = HeaderBlockProps & ClassNameProps & ElementsClassName;
 export declare const HeaderBlock: (props: React.PropsWithChildren<HeaderBlockFullProps>) => import("react/jsx-runtime").JSX.Element;
 export default HeaderBlock;

package/build/cjs/blocks/Header/Header.js

@@ -3,15 +3,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.HeaderBlock = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-/* eslint-disable complexity */
 const uikit_1 = require("@gravity-ui/uikit");
-const React = tslib_1.__importStar(require("react"));
 const components_1 = require("../../components/index.js");
 const HeaderBreadcrumbs_1 = tslib_1.__importDefault(require("../../components/HeaderBreadcrumbs/HeaderBreadcrumbs.js"));
 const utils_1 = require("../../components/Media/Image/utils.js");
 const YFMWrapper_1 = tslib_1.__importDefault(require("../../components/YFMWrapper/YFMWrapper.js"));
-const mobileContext_1 = require("../../context/mobileContext/index.js");
+const constants_1 = require("../../constants.js");
 const theme_1 = require("../../context/theme/index.js");
+const windowWidthContext_1 = require("../../context/windowWidthContext/index.js");
 const grid_1 = require("../../grid/index.js");
 const utils_2 = require("../../utils/index.js");
 const microdata_1 = require("../../utils/microdata.js");
@@ -25,10 +24,11 @@ const Background = ({ background, isMobile }) => {
 };
 const FullWidthBackground = ({ background }) => ((0, jsx_runtime_1.jsx)("div", { className: b('background', { ['full-width']: true }), style: { backgroundColor: background?.color } }));
 const HeaderBlock = (props) => {
-    const { title, overtitle, description, buttons, image, video, width = 'm', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, renderTitle, children, mediaView = 'full', centered, additionalInfo, } = props;
-    const isMobile = React.useContext(mobileContext_1.MobileContext);
+    const { title, overtitle, description, buttons, image, video, videoIframe, width = 'm', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, gridClassName, breadcrumbs, status, renderTitle, children, mediaView = 'full', centered, additionalInfo, mediaClassName, contentWrapperClassName, contentInnerClassName, } = props;
+    const windowWidth = (0, windowWidthContext_1.useWindowWidth)();
+    const isMobile = windowWidth <= constants_1.BREAKPOINTS.sm;
     const theme = (0, theme_1.useTheme)();
-    const hasRightSideImage = Boolean((image || video) && !centered);
+    const hasRightSideImage = Boolean((image || video || videoIframe) && !centered);
     const curImageSize = imageSize || (0, utils_3.getImageSize)(width);
     const titleSizes = hasRightSideImage ? (0, utils_3.titleWithImageSizes)(curImageSize) : (0, utils_3.getTitleSizes)(width);
     let curVerticalOffset = verticalOffset;
@@ -38,10 +38,8 @@ const HeaderBlock = (props) => {
     const backgroundThemed = background && (0, utils_2.getThemedValue)(background, theme);
     const imageThemed = image && (0, utils_2.getThemedValue)(image, theme);
     const videoThemed = video && (0, utils_2.getThemedValue)(video, theme);
-    const mediaWithMicrodata = (0, microdata_1.mergeVideoMicrodata)({ video: videoThemed, image: imageThemed }, {
-        name: title,
-        description,
-    });
+    const { src: videoIframeSrc, ...videoIframeProps } = videoIframe ?? {};
+    const mediaWithMicrodata = (0, microdata_1.mergeVideoMicrodata)({ video: videoThemed, image: imageThemed, videoIframe: videoIframeSrc, ...videoIframeProps }, { name: title, description });
     const fullWidth = backgroundThemed?.fullWidth || backgroundThemed?.fullWidthMedia;
     const titleId = (0, uikit_1.useUniqId)();
     return ((0, jsx_runtime_1.jsxs)("header", { className: b({
@@ -49,16 +47,11 @@ const HeaderBlock = (props) => {
             ['full-width']: fullWidth,
             ['media-view']: mediaView,
             ['controls-view']: textTheme,
-        }, className), children: [backgroundThemed && fullWidth && (0, jsx_runtime_1.jsx)(FullWidthBackground, { background: backgroundThemed }), backgroundThemed && (0, jsx_runtime_1.jsx)(Background, { background: backgroundThemed, isMobile: isMobile }), (0, jsx_runtime_1.jsxs)(grid_1.Grid, { containerClass: b('container-fluid'), children: [breadcrumbs && ((0, jsx_runtime_1.jsx)(grid_1.Row, { className: b('breadcrumbs'), children: (0, jsx_runtime_1.jsx)(grid_1.Col, { children: (0, jsx_runtime_1.jsx)(HeaderBreadcrumbs_1.default, { ...breadcrumbs, theme: textTheme }) }) })), (0, jsx_runtime_1.jsx)(grid_1.Row, { children: (0, jsx_runtime_1.jsxs)(grid_1.Col, { reset: true, className: b('content-wrapper'), children: [(0, jsx_runtime_1.jsx)(grid_1.Row, { children: (0, jsx_runtime_1.jsx)(grid_1.Col, { className: b('content', {
+        }, className), children: [backgroundThemed && fullWidth && (0, jsx_runtime_1.jsx)(FullWidthBackground, { background: backgroundThemed }), backgroundThemed && (0, jsx_runtime_1.jsx)(Background, { background: backgroundThemed, isMobile: isMobile }), (0, jsx_runtime_1.jsxs)(grid_1.Grid, { containerClass: b('container-fluid'), className: b(null, gridClassName), children: [breadcrumbs && ((0, jsx_runtime_1.jsx)(grid_1.Row, { className: b('breadcrumbs'), children: (0, jsx_runtime_1.jsx)(grid_1.Col, { children: (0, jsx_runtime_1.jsx)(HeaderBreadcrumbs_1.default, { ...breadcrumbs, theme: textTheme }) }) })), (0, jsx_runtime_1.jsx)(grid_1.Row, { children: (0, jsx_runtime_1.jsxs)(grid_1.Col, { reset: true, className: b('content-wrapper', contentWrapperClassName), children: [(0, jsx_runtime_1.jsx)(grid_1.Row, { children: (0, jsx_runtime_1.jsx)(grid_1.Col, { className: b('content', {
                                             offset,
                                             theme: textTheme,
                                             'vertical-offset': curVerticalOffset,
-                                        }), children: (0, jsx_runtime_1.jsxs)(grid_1.Col, { sizes: titleSizes, className: b('content-inner', { centered }), children: [overtitle && ((0, jsx_runtime_1.jsx)("div", { className: b('overtitle'), children: typeof overtitle === 'string' ? ((0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { tagName: "div", className: b('overtitle'), content: overtitle, modifiers: {
-                                                            constructor: true,
-                                                        } })) : (overtitle) })), (0, jsx_runtime_1.jsxs)(YFMWrapper_1.default, { content: title, contentClassName: b('title'), className: b('title-container'), modifiers: {
-                                                        constructor: true,
-                                                        constructorTheme: textTheme,
-                                                    }, tagName: "h1", contentPosition: "end", children: [status, renderTitle ? renderTitle(title) : null] }), description && ((0, jsx_runtime_1.jsx)("div", { className: b('description', { theme: textTheme }), children: (0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { content: description, modifiers: {
+                                        }), children: (0, jsx_runtime_1.jsxs)(grid_1.Col, { sizes: titleSizes, className: b('content-inner', { centered }, contentInnerClassName), children: [overtitle && ((0, jsx_runtime_1.jsx)("div", { className: b('overtitle'), children: typeof overtitle === 'string' ? ((0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { tagName: "div", className: b('overtitle'), content: overtitle, modifiers: { constructor: true } })) : (overtitle) })), (0, jsx_runtime_1.jsxs)(YFMWrapper_1.default, { content: title, contentClassName: b('title'), className: b('title-container'), modifiers: { constructor: true, constructorTheme: textTheme }, tagName: "h1", contentPosition: "end", children: [status, renderTitle ? renderTitle(title) : null] }), description && ((0, jsx_runtime_1.jsx)("div", { className: b('description', { theme: textTheme }), children: (0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { content: description, modifiers: {
                                                             constructor: true,
                                                             constructorTheme: textTheme,
                                                         } }) })), additionalInfo && ((0, jsx_runtime_1.jsx)("div", { className: b('additional-info', { theme: textTheme }), children: (0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { content: additionalInfo, modifiers: {
@@ -67,7 +60,7 @@ const HeaderBlock = (props) => {
                                                         } }) })), buttons && ((0, jsx_runtime_1.jsx)("div", { className: b('buttons'), "data-qa": "header-buttons", children: buttons.map((button, index) => ((0, jsx_runtime_1.jsx)(components_1.RouterLink, { href: button.url, children: (0, jsx_runtime_1.jsx)(components_1.Button, { className: b('button'), size: "xl", extraProps: {
                                                                 'aria-describedby': titleId,
                                                                 ...button.extraProps,
-                                                            }, ...button }, index) }, index))) })), children] }) }) }), hasRightSideImage && ((0, jsx_runtime_1.jsx)(components_1.Media, { className: b('media', { [curImageSize]: true }), videoClassName: b('video'), imageClassName: b('image'), ...mediaWithMicrodata }))] }) })] })] }));
+                                                            }, ...button }, index) }, index))) })), children] }) }) }), hasRightSideImage && ((0, jsx_runtime_1.jsx)(components_1.Media, { className: b('media', { [curImageSize]: true }, mediaClassName), videoClassName: b('video'), imageClassName: b('image'), youtubeClassName: b('video-iframe'), ...mediaWithMicrodata }))] }) })] })] }));
 };
 exports.HeaderBlock = HeaderBlock;
 exports.default = exports.HeaderBlock;