@gravity-ui/page-constructor 1.2.3-alpha.3 → 1.2.4

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## [1.2.4](https://github.com/gravity-ui/page-constructor/compare/v1.2.3...v1.2.4) (2022-10-19)
+
+### Bug Fixes
+
+* buttons specificities fixes ([96a4cf6](https://github.com/gravity-ui/page-constructor/commit/96a4cf6aee58d19b42e9e649ee3969c86d94be2a))
+
 ## [1.2.3](https://github.com/gravity-ui/page-constructor/compare/v1.2.2...v1.2.3) (2022-10-14)
 
 

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

@@ -5,17 +5,21 @@ const tslib_1 = require("tslib");
 const react_1 = (0, tslib_1.__importStar)(require("react"));
 const utils_1 = require("../../utils");
 const AnimateBlock_1 = (0, tslib_1.__importDefault)(require("../../components/AnimateBlock/AnimateBlock"));
+const constants_1 = require("../../constants");
 const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
-const components_1 = require("../../components");
 const b = (0, utils_1.block)('companies-block');
 const CompaniesBlock = ({ title, images, animated }) => {
     const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
     const themedImages = (0, utils_1.getThemedValue)(images, theme) || {};
+    const { desktop, mobile, tablet, alt } = themedImages;
     return (react_1.default.createElement(AnimateBlock_1.default, { className: b(), offset: 150, animate: animated },
         react_1.default.createElement("div", { className: b('content') },
             react_1.default.createElement("h2", { className: b('title') }, title),
             react_1.default.createElement("div", { className: b('images') },
-                react_1.default.createElement(components_1.Image, Object.assign({}, themedImages))))));
+                react_1.default.createElement("picture", null,
+                    react_1.default.createElement("source", { srcSet: desktop, media: `(min-width: ${constants_1.BREAKPOINTS.md}px)` }),
+                    react_1.default.createElement("source", { srcSet: tablet, media: `(min-width: ${constants_1.BREAKPOINTS.sm}px)` }),
+                    react_1.default.createElement("img", { className: b('image'), srcSet: mobile, alt: alt }))))));
 };
 exports.CompaniesBlock = CompaniesBlock;
 exports.default = exports.CompaniesBlock;

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

@@ -4,7 +4,6 @@ exports.ContentLayoutBlock = void 0;
 const schema_1 = require("../../sub-blocks/Content/schema");
 const utils_1 = require("../../schema/validators/utils");
 const common_1 = require("../../schema/validators/common");
-const schema_2 = require("../../components/Image/schema");
 exports.ContentLayoutBlock = {
     'content-layout-block': {
         additionalProperties: false,
@@ -13,7 +12,7 @@ exports.ContentLayoutBlock = {
                     type: 'string',
                     enum: common_1.contentSizes,
                 },
-                background: schema_2.ImageObjectProps,
+                background: common_1.ImageObjectProps,
                 centered: {
                     type: 'boolean',
                 },

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

@@ -9,7 +9,6 @@ unpredictable css rules order in build */
   margin: 16px 0;
 }
 .pc-header-block_full-width {
-  --pc-border-radius: 0;
   padding: 16px 0;
   margin: 0 0 16px;
 }
@@ -87,10 +86,11 @@ unpredictable css rules order in build */
 .pc-header-block__buttons {
   margin-top: 16px;
 }
-.pc-header-block__button {
+.pc-header-block__button.pc-header-block__button {
   margin-top: 16px;
   margin-right: 16px;
 }
+
 .pc-header-block__media {
   position: absolute;
   display: none;
@@ -150,7 +150,11 @@ unpredictable css rules order in build */
   width: 100%;
   object-fit: cover;
 }
+.pc-header-block__background_full-width-media {
+  --pc-border-radius: 0;
+}
 .pc-header-block__background_full-width {
+  --pc-border-radius: 0;
   left: 0;
   transform: none;
   max-width: none;
@@ -186,6 +190,9 @@ unpredictable css rules order in build */
   .pc-header-block_has-media .pc-header-block__content {
     padding-top: 48px;
   }
+  .pc-header-block_has-background .pc-header-block__background-img {
+    display: none;
+  }
   .pc-header-block .pc-header-block__content_vertical-offset_s, .pc-header-block .pc-header-block__content_vertical-offset_m, .pc-header-block .pc-header-block__content_vertical-offset_l, .pc-header-block .pc-header-block__content_vertical-offset_xl {
     padding: calc(96px - 16px) 0;
   }

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

@@ -4,18 +4,17 @@ exports.HeaderBlock = void 0;
 const tslib_1 = require("tslib");
 const react_1 = (0, tslib_1.__importStar)(require("react"));
 const utils_1 = require("../../utils");
+const guards_1 = require("../../models/guards");
 const components_1 = require("../../components");
 const grid_1 = require("../../grid");
 const utils_2 = require("./utils");
 const YFMWrapper_1 = (0, tslib_1.__importDefault)(require("../../components/YFMWrapper/YFMWrapper"));
 const HeaderBreadcrumbs_1 = (0, tslib_1.__importDefault)(require("../../components/HeaderBreadcrumbs/HeaderBreadcrumbs"));
 const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
-const utils_3 = require("../../components/Media/Image/utils");
 const b = (0, utils_1.block)('header-block');
 const Background = ({ background }) => {
-    const { url, image, fullWidthMedia } = background;
-    const imageObject = url ? (0, utils_3.getMediaImage)(url) : image;
-    return (react_1.default.createElement(components_1.BackgroundMedia, Object.assign({}, background, { image: imageObject, animated: false, parallax: false, mediaClassName: b('background-media'), className: b('background', { media: true, 'full-width-media': fullWidthMedia }) })));
+    const { url, color, disableCompress, fullWidth, fullWidthMedia } = background;
+    return (0, guards_1.headerHasMediaBackground)(background) ? (react_1.default.createElement(components_1.BackgroundMedia, Object.assign({}, background, { mediaClassName: b('background-media'), className: b('background', { media: true, 'full-width-media': fullWidthMedia }) }))) : (react_1.default.createElement(components_1.BackgroundImage, { src: url, className: b('background', { 'full-width-media': fullWidthMedia }), imageClassName: b('background-img'), style: { backgroundColor: fullWidth ? 'none' : color }, disableCompress: disableCompress }));
 };
 const FullWidthBackground = ({ background }) => (react_1.default.createElement("div", { className: b('background', { ['full-width']: true }), style: { backgroundColor: background === null || background === void 0 ? void 0 : background.color } }));
 const HeaderBlock = (props) => {
@@ -31,8 +30,12 @@ const HeaderBlock = (props) => {
     const backgroundThemed = background && (0, utils_1.getThemedValue)(background, theme);
     const imageThemed = image && (0, utils_1.getThemedValue)(image, theme);
     const videoThemed = video && (0, utils_1.getThemedValue)(video, theme);
-    const fullWidth = backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidth;
-    return (react_1.default.createElement("header", { className: b({ ['has-media']: hasMedia, ['full-width']: fullWidth }, className) },
+    const fullWidth = Boolean(backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidth);
+    return (react_1.default.createElement("header", { className: b({
+            ['has-media']: hasMedia,
+            ['has-background']: Boolean(background),
+            ['full-width']: fullWidth,
+        }, className) },
         backgroundThemed && fullWidth && react_1.default.createElement(FullWidthBackground, { background: backgroundThemed }),
         backgroundThemed && react_1.default.createElement(Background, { background: backgroundThemed }),
         react_1.default.createElement(grid_1.Grid, { containerClass: b('container-fluid') },

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

@@ -140,139 +140,163 @@ export declare const HeaderProperties: {
     };
     background: {
         oneOf: ({
-            fullWidth: {
-                type: string;
-            };
-            fullWidthMedia: {
-                type: string;
-            };
-            color: {
+            oneOf: ({
                 type: string;
-            };
-            image: {
-                anyOf: ({
-                    oneOf: ({
+                additionalProperties: boolean;
+                required: never[];
+                properties: {
+                    fullWidth: {
                         type: string;
-                        properties: {
-                            when: {
-                                type: string;
-                            };
-                        };
-                    } | {
+                    };
+                    color: {
                         type: string;
-                        pattern: string;
-                    })[];
-                } | {
-                    type: string;
-                    items: {
-                        oneOf: ({
-                            type: string;
-                            properties: {
-                                when: {
-                                    type: string;
+                    };
+                    image: {
+                        anyOf: ({
+                            oneOf: ({
+                                type: string;
+                                properties: {
+                                    when: {
+                                        type: string;
+                                    };
                                 };
-                            };
+                            } | {
+                                type: string;
+                                pattern: string;
+                            })[];
                         } | {
                             type: string;
-                            pattern: string;
+                            items: {
+                                oneOf: ({
+                                    type: string;
+                                    properties: {
+                                        when: {
+                                            type: string;
+                                        };
+                                    };
+                                } | {
+                                    type: string;
+                                    pattern: string;
+                                })[];
+                            };
                         })[];
                     };
-                })[];
-            };
-            video: {
-                type: string;
-                additionalProperties: boolean;
-                required: string[];
-                properties: {
-                    src: {
+                    video: {
                         type: string;
-                        items: {
-                            type: string;
+                        additionalProperties: boolean;
+                        required: string[];
+                        properties: {
+                            src: {
+                                type: string;
+                                items: {
+                                    type: string;
+                                };
+                            };
+                            loop: {
+                                anyOf: ({
+                                    type: string;
+                                    additionalProperties: boolean;
+                                    required: string[];
+                                    properties: {
+                                        start: {
+                                            type: string;
+                                        };
+                                        end: {
+                                            type: string;
+                                        };
+                                    };
+                                } | {
+                                    type: string;
+                                })[];
+                            };
+                            type: {
+                                type: string;
+                                enum: string[];
+                            };
+                            muted: {
+                                type: string;
+                            };
+                            playing: {
+                                type: string;
+                            };
+                            elapsedTime: {
+                                type: string;
+                            };
+                            playIcon: {
+                                type: string;
+                                additionalProperties: boolean;
+                                properties: {
+                                    type: {
+                                        type: string;
+                                        enum: string[];
+                                    };
+                                    theme: {
+                                        type: string;
+                                        enum: string[];
+                                    };
+                                    text: {
+                                        type: string;
+                                    };
+                                };
+                            };
+                            controls: {
+                                type: string;
+                                enum: string[];
+                            };
                         };
                     };
-                    loop: {
-                        anyOf: ({
+                    youtube: {
+                        type: string;
+                    };
+                    parallax: {
+                        type: string;
+                    };
+                    height: {
+                        type: string;
+                    };
+                    previewImg: {
+                        type: string;
+                    };
+                    dataLens: {
+                        oneOf: ({
                             type: string;
                             additionalProperties: boolean;
                             required: string[];
                             properties: {
-                                start: {
+                                id: {
                                     type: string;
                                 };
-                                end: {
+                                theme: {
                                     type: string;
+                                    enum: string[];
                                 };
                             };
                         } | {
                             type: string;
                         })[];
                     };
-                    type: {
-                        type: string;
-                        enum: string[];
-                    };
-                    muted: {
+                };
+            } | {
+                type: string;
+                additionalProperties: boolean;
+                properties: {
+                    color: {
                         type: string;
                     };
-                    playing: {
+                    url: {
                         type: string;
                     };
-                    elapsedTime: {
+                    disableCompress: {
                         type: string;
                     };
-                    playIcon: {
+                    fullWidth: {
                         type: string;
-                        additionalProperties: boolean;
-                        properties: {
-                            type: {
-                                type: string;
-                                enum: string[];
-                            };
-                            theme: {
-                                type: string;
-                                enum: string[];
-                            };
-                            text: {
-                                type: string;
-                            };
-                        };
                     };
-                    controls: {
+                    fullWidthMedia: {
                         type: string;
-                        enum: string[];
                     };
                 };
-            };
-            youtube: {
-                type: string;
-            };
-            parallax: {
-                type: string;
-            };
-            height: {
-                type: string;
-            };
-            previewImg: {
-                type: string;
-            };
-            dataLens: {
-                oneOf: ({
-                    type: string;
-                    additionalProperties: boolean;
-                    required: string[];
-                    properties: {
-                        id: {
-                            type: string;
-                        };
-                        theme: {
-                            type: string;
-                            enum: string[];
-                        };
-                    };
-                } | {
-                    type: string;
-                })[];
-            };
+            })[];
         } | {
             type: string;
             additionalProperties: boolean;
@@ -461,139 +485,163 @@ export declare const HeaderBlock: {
             };
             background: {
                 oneOf: ({
-                    fullWidth: {
-                        type: string;
-                    };
-                    fullWidthMedia: {
-                        type: string;
-                    };
-                    color: {
+                    oneOf: ({
                         type: string;
-                    };
-                    image: {
-                        anyOf: ({
-                            oneOf: ({
+                        additionalProperties: boolean;
+                        required: never[];
+                        properties: {
+                            fullWidth: {
                                 type: string;
-                                properties: {
-                                    when: {
-                                        type: string;
-                                    };
-                                };
-                            } | {
+                            };
+                            color: {
                                 type: string;
-                                pattern: string;
-                            })[];
-                        } | {
-                            type: string;
-                            items: {
-                                oneOf: ({
-                                    type: string;
-                                    properties: {
-                                        when: {
-                                            type: string;
+                            };
+                            image: {
+                                anyOf: ({
+                                    oneOf: ({
+                                        type: string;
+                                        properties: {
+                                            when: {
+                                                type: string;
+                                            };
                                         };
-                                    };
+                                    } | {
+                                        type: string;
+                                        pattern: string;
+                                    })[];
                                 } | {
                                     type: string;
-                                    pattern: string;
+                                    items: {
+                                        oneOf: ({
+                                            type: string;
+                                            properties: {
+                                                when: {
+                                                    type: string;
+                                                };
+                                            };
+                                        } | {
+                                            type: string;
+                                            pattern: string;
+                                        })[];
+                                    };
                                 })[];
                             };
-                        })[];
-                    };
-                    video: {
-                        type: string;
-                        additionalProperties: boolean;
-                        required: string[];
-                        properties: {
-                            src: {
+                            video: {
                                 type: string;
-                                items: {
-                                    type: string;
+                                additionalProperties: boolean;
+                                required: string[];
+                                properties: {
+                                    src: {
+                                        type: string;
+                                        items: {
+                                            type: string;
+                                        };
+                                    };
+                                    loop: {
+                                        anyOf: ({
+                                            type: string;
+                                            additionalProperties: boolean;
+                                            required: string[];
+                                            properties: {
+                                                start: {
+                                                    type: string;
+                                                };
+                                                end: {
+                                                    type: string;
+                                                };
+                                            };
+                                        } | {
+                                            type: string;
+                                        })[];
+                                    };
+                                    type: {
+                                        type: string;
+                                        enum: string[];
+                                    };
+                                    muted: {
+                                        type: string;
+                                    };
+                                    playing: {
+                                        type: string;
+                                    };
+                                    elapsedTime: {
+                                        type: string;
+                                    };
+                                    playIcon: {
+                                        type: string;
+                                        additionalProperties: boolean;
+                                        properties: {
+                                            type: {
+                                                type: string;
+                                                enum: string[];
+                                            };
+                                            theme: {
+                                                type: string;
+                                                enum: string[];
+                                            };
+                                            text: {
+                                                type: string;
+                                            };
+                                        };
+                                    };
+                                    controls: {
+                                        type: string;
+                                        enum: string[];
+                                    };
                                 };
                             };
-                            loop: {
-                                anyOf: ({
+                            youtube: {
+                                type: string;
+                            };
+                            parallax: {
+                                type: string;
+                            };
+                            height: {
+                                type: string;
+                            };
+                            previewImg: {
+                                type: string;
+                            };
+                            dataLens: {
+                                oneOf: ({
                                     type: string;
                                     additionalProperties: boolean;
                                     required: string[];
                                     properties: {
-                                        start: {
+                                        id: {
                                             type: string;
                                         };
-                                        end: {
+                                        theme: {
                                             type: string;
+                                            enum: string[];
                                         };
                                     };
                                 } | {
                                     type: string;
                                 })[];
                             };
-                            type: {
-                                type: string;
-                                enum: string[];
-                            };
-                            muted: {
+                        };
+                    } | {
+                        type: string;
+                        additionalProperties: boolean;
+                        properties: {
+                            color: {
                                 type: string;
                             };
-                            playing: {
+                            url: {
                                 type: string;
                             };
-                            elapsedTime: {
+                            disableCompress: {
                                 type: string;
                             };
-                            playIcon: {
+                            fullWidth: {
                                 type: string;
-                                additionalProperties: boolean;
-                                properties: {
-                                    type: {
-                                        type: string;
-                                        enum: string[];
-                                    };
-                                    theme: {
-                                        type: string;
-                                        enum: string[];
-                                    };
-                                    text: {
-                                        type: string;
-                                    };
-                                };
                             };
-                            controls: {
+                            fullWidthMedia: {
                                 type: string;
-                                enum: string[];
                             };
                         };
-                    };
-                    youtube: {
-                        type: string;
-                    };
-                    parallax: {
-                        type: string;
-                    };
-                    height: {
-                        type: string;
-                    };
-                    previewImg: {
-                        type: string;
-                    };
-                    dataLens: {
-                        oneOf: ({
-                            type: string;
-                            additionalProperties: boolean;
-                            required: string[];
-                            properties: {
-                                id: {
-                                    type: string;
-                                };
-                                theme: {
-                                    type: string;
-                                    enum: string[];
-                                };
-                            };
-                        } | {
-                            type: string;
-                        })[];
-                    };
+                    })[];
                 } | {
                     type: string;
                     additionalProperties: boolean;