@gravity-ui/page-constructor 6.0.0-beta.0 → 6.0.0-beta.10

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

@@ -1,9 +1,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FilterBlock = exports.FilterProps = exports.FilterItemProps = exports.FilterTagProps = void 0;
-const common_1 = require("../../schema/validators/common.js");
-const utils_1 = require("../../schema/validators/utils.js");
-exports.FilterTagProps = {
+import { AnimatableProps, BlockBaseProps, BlockHeaderProps, containerSizesObject, } from '../../schema/validators/common';
+import { filteredArray } from '../../schema/validators/utils';
+export const FilterTagProps = {
     additionalProperties: false,
     required: ['id', 'label'],
     properties: {
@@ -15,7 +12,7 @@ exports.FilterTagProps = {
         },
     },
 };
-exports.FilterItemProps = {
+export const FilterItemProps = {
     additionalProperties: false,
     required: ['tags', 'card'],
     properties: {
@@ -28,10 +25,10 @@ exports.FilterItemProps = {
         card: { $ref: 'self#/definitions/cards' },
     },
 };
-exports.FilterProps = {
+export const FilterProps = {
     additionalProperties: false,
     required: ['tags', 'items'],
-    properties: Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BlockBaseProps), common_1.AnimatableProps), common_1.BlockHeaderProps), { allTag: {
+    properties: Object.assign(Object.assign(Object.assign(Object.assign({}, BlockBaseProps), AnimatableProps), BlockHeaderProps), { allTag: {
             oneOf: [
                 {
                     type: 'boolean',
@@ -42,12 +39,11 @@ exports.FilterProps = {
                     optionName: 'cutom',
                 },
             ],
-        }, colSizes: common_1.containerSizesObject, tags: (0, utils_1.filteredArray)(exports.FilterTagProps), items: (0, utils_1.filteredArray)(exports.FilterItemProps), tagButtonSize: {
+        }, colSizes: containerSizesObject, tags: filteredArray(FilterTagProps), items: filteredArray(FilterItemProps), tagButtonSize: {
             type: 'string',
             enum: ['s', 'm', 'l', 'xl'],
         }, centered: { type: 'boolean' } }),
 };
-exports.FilterBlock = {
-    'filter-block': exports.FilterProps,
+export const FilterBlock = {
+    'filter-block': FilterProps,
 };
-//# sourceMappingURL=schema.js.map

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

@@ -1,4 +1,4 @@
 import * as React from 'react';
-import type { FormBlockProps } from "../../models/index.js";
+import type { FormBlockProps } from '../../models';
 declare const FormBlock: React.FC<FormBlockProps>;
 export default FormBlock;

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

@@ -1,25 +1,22 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
-const components_1 = require("../../components/index.js");
-const InnerForm_1 = tslib_1.__importDefault(require("../../components/InnerForm/InnerForm.js"));
-const mobileContext_1 = require("../../context/mobileContext/index.js");
-const theme_1 = require("../../context/theme/index.js");
-const grid_1 = require("../../grid/index.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 b = (0, utils_1.block)('form-block');
-const colSizes = { [grid_1.GridColumnSize.Lg]: 6, [grid_1.GridColumnSize.All]: 12 };
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { BackgroundImage, Title } from '../../components';
+import InnerForm from '../../components/InnerForm/InnerForm';
+import { MobileContext } from '../../context/mobileContext';
+import { useTheme } from '../../context/theme';
+import { Col, Grid, GridAlignItems, GridColumnSize, Row } from '../../grid';
+import { FormBlockDataTypes, FormBlockDirection, isHubspotDataForm, isYandexDataForm, } from '../../models';
+import { Content } from '../../sub-blocks';
+import { block, getThemedValue } from '../../utils';
+const b = block('form-block');
+const colSizes = { [GridColumnSize.Lg]: 6, [GridColumnSize.All]: 12 };
 const FormBlock = (props) => {
     var _a;
-    const { formData, title, textContent, direction = models_1.FormBlockDirection.Center, background } = props;
+    const { formData, title, textContent, direction = FormBlockDirection.Center, background } = 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 isMobile = React.useContext(MobileContext);
+    const theme = useTheme();
+    const themedBackground = getThemedValue(background, theme) || undefined;
     const withBackground = Boolean(themedBackground &&
         (themedBackground.src ||
             themedBackground.desktop ||
@@ -31,25 +28,24 @@ const FormBlock = (props) => {
         return null;
     }
     let formType;
-    if ((0, models_1.isYandexDataForm)(formData)) {
-        formType = models_1.FormBlockDataTypes.YANDEX;
+    if (isYandexDataForm(formData)) {
+        formType = FormBlockDataTypes.YANDEX;
     }
-    else if ((0, models_1.isHubspotDataForm)(formData)) {
-        formType = models_1.FormBlockDataTypes.HUBSPOT;
+    else if (isHubspotDataForm(formData)) {
+        formType = FormBlockDataTypes.HUBSPOT;
     }
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b({
+    return (_jsxs("div", { className: b({
             'with-background': withBackground,
             'form-type': formType,
-        }), children: [themedBackground && ((0, jsx_runtime_1.jsx)(components_1.BackgroundImage, Object.assign({}, 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
-                        ? grid_1.GridAlignItems.Center
-                        : grid_1.GridAlignItems.Start, className: b('row', {
+        }), children: [themedBackground && (_jsx(BackgroundImage, Object.assign({}, themedBackground, { className: b('media'), imageClassName: b('image') }))), _jsx(Grid, { children: _jsxs(Row, { alignItems: direction === FormBlockDirection.Center
+                        ? GridAlignItems.Center
+                        : 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, Object.assign({ 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: [_jsx(Col, { sizes: colSizes, className: b('content-col'), children: textContent && (_jsx("div", { className: b('content-wrapper'), children: _jsx(Content, Object.assign({ theme: "default" }, textContent, { centered: direction === FormBlockDirection.Center, colSizes: { all: 12 }, className: b('content') })) })) }), _jsx(Col, { sizes: colSizes, className: b('form-col'), children: _jsx("div", { className: b('form-wrapper'), children: _jsxs("div", { className: b('full-form', {
                                         hidden: !contentLoaded,
-                                    }), children: [title && ((0, jsx_runtime_1.jsx)(components_1.Title, { title: {
+                                    }), children: [title && (_jsx(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 })] }) }) })] }) })] }));
+                                            }, className: b('title', { mobile: isMobile }), colSizes: { all: 12 } })), _jsx(InnerForm, { className: b('form'), formData: formData, onContentLoad: onContentLoad })] }) }) })] }) })] }));
 };
-exports.default = FormBlock;
-//# sourceMappingURL=Form.js.map
+export default FormBlock;

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

@@ -32,7 +32,7 @@ export declare const FormBlock: {
                             }) | {
                                 type: string;
                                 additionalProperties: boolean;
-                                required: import("../../index.js").Theme[];
+                                required: import("../..").Theme[];
                                 properties: {};
                                 optionName: string;
                             })[];
@@ -70,7 +70,7 @@ export declare const FormBlock: {
                             }) | {
                                 type: string;
                                 additionalProperties: boolean;
-                                required: import("../../index.js").Theme[];
+                                required: import("../..").Theme[];
                                 properties: {};
                                 optionName: string;
                             })[];

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

@@ -1,19 +1,15 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FormBlock = void 0;
-const tslib_1 = require("tslib");
-const omit_1 = tslib_1.__importDefault(require("lodash/omit"));
-const schema_1 = require("../../components/Image/schema.js");
-const schema_2 = require("../../components/YandexForm/schema.js");
-const common_1 = require("../../schema/validators/common.js");
-const schema_3 = require("../../sub-blocks/Content/schema.js");
-const schema_4 = require("../../sub-blocks/HubspotForm/schema.js");
-const FormBlockContentProps = (0, omit_1.default)(schema_3.ContentBase, ['size', 'centered', 'colSizes']);
-exports.FormBlock = {
+import omit from 'lodash/omit';
+import { ImageProps } from '../../components/Image/schema';
+import { YandexFormProps } from '../../components/YandexForm/schema';
+import { BlockBaseProps, withTheme } from '../../schema/validators/common';
+import { ContentBase } from '../../sub-blocks/Content/schema';
+import { HubspotFormProps } from '../../sub-blocks/HubspotForm/schema';
+const FormBlockContentProps = omit(ContentBase, ['size', 'centered', 'colSizes']);
+export const FormBlock = {
     'form-block': {
         additionalProperties: false,
         required: ['formData'],
-        properties: Object.assign(Object.assign({}, common_1.BlockBaseProps), { title: {
+        properties: Object.assign(Object.assign({}, BlockBaseProps), { title: {
                 type: 'string',
             }, formData: {
                 oneOf: [
@@ -21,14 +17,14 @@ exports.FormBlock = {
                         type: 'object',
                         optionName: 'yandex',
                         properties: {
-                            yandex: (0, common_1.withTheme)(schema_2.YandexFormProps),
+                            yandex: withTheme(YandexFormProps),
                         },
                     },
                     {
                         type: 'object',
                         optionName: 'hubspot',
                         properties: {
-                            hubspot: (0, common_1.withTheme)(schema_4.HubspotFormProps),
+                            hubspot: withTheme(HubspotFormProps),
                         },
                     },
                 ],
@@ -37,9 +33,8 @@ exports.FormBlock = {
                 properties: FormBlockContentProps,
             }, direction: {
                 enum: ['content-form', 'form-content', 'center'],
-            }, image: schema_1.ImageProps, backgroundColor: {
+            }, image: ImageProps, backgroundColor: {
                 type: 'string',
             } }),
     },
 };
-//# sourceMappingURL=schema.js.map

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

@@ -52,6 +52,10 @@ unpredictable css rules order in build */
   position: relative;
   z-index: 10;
 }
+.pc-header-block__content-inner_centered {
+  margin-inline: auto;
+  text-align: center;
+}
 .pc-header-block__title {
   font-size: var(--g-text-display-4-font-size);
   line-height: var(--g-text-display-4-line-height);
@@ -91,6 +95,8 @@ unpredictable css rules order in build */
 }
 .pc-header-block__button.pc-header-block__button {
   margin-top: 16px;
+}
+.pc-header-block__button.pc-header-block__button:not(:last-child) {
   margin-right: 16px;
 }
 

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

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

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

@@ -1,57 +1,57 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.HeaderBlock = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-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 theme_1 = require("../../context/theme/index.js");
-const grid_1 = require("../../grid/index.js");
-const utils_2 = require("../../utils/index.js");
-const utils_3 = require("./utils.js");
-const b = (0, utils_2.block)('header-block');
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint-disable complexity */
+import { useUniqId } from '@gravity-ui/uikit';
+import * as React from 'react';
+import { Button, HTML, Media, RouterLink } from '../../components';
+import HeaderBreadcrumbs from '../../components/HeaderBreadcrumbs/HeaderBreadcrumbs';
+import { getMediaImage } from '../../components/Media/Image/utils';
+import YFMWrapper from '../../components/YFMWrapper/YFMWrapper';
+import { MobileContext } from '../../context/mobileContext';
+import { useTheme } from '../../context/theme';
+import { Col, Grid, Row } from '../../grid';
+import { block, getThemedValue } from '../../utils';
+import { mergeVideoMicrodata } from '../../utils/microdata';
+import { getImageSize, getTitleSizes, titleWithImageSizes } from './utils';
+const b = block('header-block');
 const Background = ({ background, isMobile }) => {
     const { url, image, fullWidthMedia, video, color } = background;
-    const imageObject = url ? (0, utils_1.getMediaImage)(url) : image;
+    const imageObject = url ? getMediaImage(url) : image;
     const renderMedia = !isMobile || (typeof image === 'object' && 'mobile' in image);
-    return ((0, jsx_runtime_1.jsx)("div", { className: b('background', { media: true, 'full-width-media': fullWidthMedia }), style: { backgroundColor: color }, children: renderMedia && ((0, jsx_runtime_1.jsx)(components_1.Media, Object.assign({}, background, { className: b('background-media'), imageClassName: b('image'), videoClassName: b('video'), isBackground: true, parallax: false, video: isMobile ? undefined : video, image: imageObject }))) }));
+    return (_jsx("div", { className: b('background', { media: true, 'full-width-media': fullWidthMedia }), style: { backgroundColor: color }, children: renderMedia && (_jsx(Media, Object.assign({}, background, { className: b('background-media'), imageClassName: b('image'), videoClassName: b('video'), isBackground: true, parallax: false, video: isMobile ? undefined : video, image: imageObject }))) }));
 };
-const FullWidthBackground = ({ background }) => ((0, jsx_runtime_1.jsx)("div", { className: b('background', { ['full-width']: true }), style: { backgroundColor: background === null || background === void 0 ? void 0 : 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', } = props;
-    const isMobile = React.useContext(mobileContext_1.MobileContext);
-    const theme = (0, theme_1.useTheme)();
-    const hasRightSideImage = Boolean(image || video);
-    const curImageSize = imageSize || (0, utils_3.getImageSize)(width);
-    const titleSizes = hasRightSideImage ? (0, utils_3.titleWithImageSizes)(curImageSize) : (0, utils_3.getTitleSizes)(width);
+const FullWidthBackground = ({ background }) => (_jsx("div", { className: b('background', { ['full-width']: true }), style: { backgroundColor: background === null || background === void 0 ? void 0 : background.color } }));
+export 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, } = props;
+    const isMobile = React.useContext(MobileContext);
+    const theme = useTheme();
+    const hasRightSideImage = Boolean((image || video) && !centered);
+    const curImageSize = imageSize || getImageSize(width);
+    const titleSizes = hasRightSideImage ? titleWithImageSizes(curImageSize) : getTitleSizes(width);
     let curVerticalOffset = verticalOffset;
     if (hasRightSideImage && !verticalOffset) {
         curVerticalOffset = 'm';
     }
-    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 backgroundThemed = background && getThemedValue(background, theme);
+    const imageThemed = image && getThemedValue(image, theme);
+    const videoThemed = video && getThemedValue(video, theme);
+    const mediaWithMicrodata = mergeVideoMicrodata({ video: videoThemed, image: imageThemed }, {
+        name: title,
+        description,
+    });
     const fullWidth = (backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidth) || (backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidthMedia);
-    const titleId = (0, uikit_1.useUniqId)();
-    return ((0, jsx_runtime_1.jsxs)("header", { className: b({
+    const titleId = useUniqId();
+    return (_jsxs("header", { className: b({
             ['has-media']: hasRightSideImage,
             ['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, Object.assign({}, 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 && _jsx(FullWidthBackground, { background: backgroundThemed }), backgroundThemed && _jsx(Background, { background: backgroundThemed, isMobile: isMobile }), _jsxs(Grid, { containerClass: b('container-fluid'), children: [breadcrumbs && (_jsx(Row, { className: b('breadcrumbs'), children: _jsx(Col, { children: _jsx(HeaderBreadcrumbs, Object.assign({}, breadcrumbs, { theme: textTheme })) }) })), _jsx(Row, { children: _jsxs(Col, { reset: true, className: b('content-wrapper'), children: [_jsx(Row, { children: _jsx(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'), children: [overtitle && ((0, jsx_runtime_1.jsx)("div", { className: b('overtitle'), children: (0, jsx_runtime_1.jsx)(components_1.HTML, { children: overtitle }) })), (0, jsx_runtime_1.jsxs)("h1", { className: b('title'), id: titleId, children: [status, renderTitle ? renderTitle(title) : (0, jsx_runtime_1.jsx)(components_1.HTML, { children: title })] }), 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: _jsxs(Col, { sizes: titleSizes, className: b('content-inner', { centered }), children: [overtitle && (_jsx("div", { className: b('overtitle'), children: typeof overtitle === 'string' ? (_jsx(HTML, { children: overtitle })) : (overtitle) })), _jsxs("h1", { className: b('title'), id: titleId, children: [status, renderTitle ? renderTitle(title) : _jsx(HTML, { children: title })] }), description && (_jsx("div", { className: b('description', { theme: textTheme }), children: _jsx(YFMWrapper, { content: description, modifiers: {
                                                             constructor: true,
                                                             constructorTheme: textTheme,
-                                                        } }) })), 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, Object.assign({ className: b('button'), size: "xl", extraProps: Object.assign({ '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'), video: videoThemed, image: imageThemed }))] }) })] })] }));
+                                                        } }) })), buttons && (_jsx("div", { className: b('buttons'), "data-qa": "header-buttons", children: buttons.map((button, index) => (_jsx(RouterLink, { href: button.url, children: _jsx(Button, Object.assign({ className: b('button'), size: "xl", extraProps: Object.assign({ 'aria-describedby': titleId }, button.extraProps) }, button), index) }, index))) })), children] }) }) }), hasRightSideImage && (_jsx(Media, Object.assign({ className: b('media', { [curImageSize]: true }), videoClassName: b('video'), imageClassName: b('image') }, mediaWithMicrodata)))] }) })] })] }));
 };
-exports.HeaderBlock = HeaderBlock;
-exports.default = exports.HeaderBlock;
-//# sourceMappingURL=Header.js.map
+export default HeaderBlock;

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

@@ -140,7 +140,7 @@ export declare const HeaderBackgroundProps: {
                 };
                 controls: {
                     type: string;
-                    enum: import("../../index.js").MediaVideoControlsType[];
+                    enum: import("../..").MediaVideoControlsType[];
                 };
                 customControlsOptions: {
                     type: string;
@@ -148,14 +148,14 @@ export declare const HeaderBackgroundProps: {
                     properties: {
                         type: {
                             type: string;
-                            enum: import("../../index.js").CustomControlsType[];
+                            enum: import("../..").CustomControlsType[];
                         };
                         muteButtonShown: {
                             type: string;
                         };
                         positioning: {
                             type: string;
-                            enum: import("../../index.js").CustomControlsButtonPositioning[];
+                            enum: import("../..").CustomControlsButtonPositioning[];
                         };
                     };
                 };
@@ -382,7 +382,7 @@ export declare const HeaderProperties: {
         }) | {
             type: string;
             additionalProperties: boolean;
-            required: import("../../index.js").Theme[];
+            required: import("../..").Theme[];
             properties: {};
             optionName: string;
         })[];
@@ -451,7 +451,7 @@ export declare const HeaderProperties: {
                 };
                 controls: {
                     type: string;
-                    enum: import("../../index.js").MediaVideoControlsType[];
+                    enum: import("../..").MediaVideoControlsType[];
                 };
                 customControlsOptions: {
                     type: string;
@@ -459,14 +459,14 @@ export declare const HeaderProperties: {
                     properties: {
                         type: {
                             type: string;
-                            enum: import("../../index.js").CustomControlsType[];
+                            enum: import("../..").CustomControlsType[];
                         };
                         muteButtonShown: {
                             type: string;
                         };
                         positioning: {
                             type: string;
-                            enum: import("../../index.js").CustomControlsButtonPositioning[];
+                            enum: import("../..").CustomControlsButtonPositioning[];
                         };
                     };
                 };
@@ -482,7 +482,7 @@ export declare const HeaderProperties: {
         }) | {
             type: string;
             additionalProperties: boolean;
-            required: import("../../index.js").Theme[];
+            required: import("../..").Theme[];
             properties: {};
             optionName: string;
         })[];
@@ -655,7 +655,7 @@ export declare const HeaderProperties: {
                         };
                         controls: {
                             type: string;
-                            enum: import("../../index.js").MediaVideoControlsType[];
+                            enum: import("../..").MediaVideoControlsType[];
                         };
                         customControlsOptions: {
                             type: string;
@@ -663,14 +663,14 @@ export declare const HeaderProperties: {
                             properties: {
                                 type: {
                                     type: string;
-                                    enum: import("../../index.js").CustomControlsType[];
+                                    enum: import("../..").CustomControlsType[];
                                 };
                                 muteButtonShown: {
                                     type: string;
                                 };
                                 positioning: {
                                     type: string;
-                                    enum: import("../../index.js").CustomControlsButtonPositioning[];
+                                    enum: import("../..").CustomControlsButtonPositioning[];
                                 };
                             };
                         };
@@ -836,7 +836,7 @@ export declare const HeaderProperties: {
         }) | {
             type: string;
             additionalProperties: boolean;
-            required: import("../../index.js").Theme[];
+            required: import("../..").Theme[];
             properties: {};
             optionName: string;
         })[];
@@ -876,6 +876,9 @@ export declare const HeaderProperties: {
     status: {
         type: string;
     };
+    centered: {
+        type: string;
+    };
 };
 export declare const HeaderBlock: {
     'header-block': {
@@ -946,7 +949,7 @@ export declare const HeaderBlock: {
                 }) | {
                     type: string;
                     additionalProperties: boolean;
-                    required: import("../../index.js").Theme[];
+                    required: import("../..").Theme[];
                     properties: {};
                     optionName: string;
                 })[];
@@ -1015,7 +1018,7 @@ export declare const HeaderBlock: {
                         };
                         controls: {
                             type: string;
-                            enum: import("../../index.js").MediaVideoControlsType[];
+                            enum: import("../..").MediaVideoControlsType[];
                         };
                         customControlsOptions: {
                             type: string;
@@ -1023,14 +1026,14 @@ export declare const HeaderBlock: {
                             properties: {
                                 type: {
                                     type: string;
-                                    enum: import("../../index.js").CustomControlsType[];
+                                    enum: import("../..").CustomControlsType[];
                                 };
                                 muteButtonShown: {
                                     type: string;
                                 };
                                 positioning: {
                                     type: string;
-                                    enum: import("../../index.js").CustomControlsButtonPositioning[];
+                                    enum: import("../..").CustomControlsButtonPositioning[];
                                 };
                             };
                         };
@@ -1046,7 +1049,7 @@ export declare const HeaderBlock: {
                 }) | {
                     type: string;
                     additionalProperties: boolean;
-                    required: import("../../index.js").Theme[];
+                    required: import("../..").Theme[];
                     properties: {};
                     optionName: string;
                 })[];
@@ -1219,7 +1222,7 @@ export declare const HeaderBlock: {
                                 };
                                 controls: {
                                     type: string;
-                                    enum: import("../../index.js").MediaVideoControlsType[];
+                                    enum: import("../..").MediaVideoControlsType[];
                                 };
                                 customControlsOptions: {
                                     type: string;
@@ -1227,14 +1230,14 @@ export declare const HeaderBlock: {
                                     properties: {
                                         type: {
                                             type: string;
-                                            enum: import("../../index.js").CustomControlsType[];
+                                            enum: import("../..").CustomControlsType[];
                                         };
                                         muteButtonShown: {
                                             type: string;
                                         };
                                         positioning: {
                                             type: string;
-                                            enum: import("../../index.js").CustomControlsButtonPositioning[];
+                                            enum: import("../..").CustomControlsButtonPositioning[];
                                         };
                                     };
                                 };
@@ -1400,7 +1403,7 @@ export declare const HeaderBlock: {
                 }) | {
                     type: string;
                     additionalProperties: boolean;
-                    required: import("../../index.js").Theme[];
+                    required: import("../..").Theme[];
                     properties: {};
                     optionName: string;
                 })[];
@@ -1440,6 +1443,9 @@ export declare const HeaderBlock: {
             status: {
                 type: string;
             };
+            centered: {
+                type: string;
+            };
             anchor: {
                 type: string;
                 additionalProperties: boolean;

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

@@ -1,16 +1,13 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.HeaderBlock = exports.HeaderProperties = exports.HeaderBackgroundProps = void 0;
-const schema_1 = require("../../components/Image/schema.js");
-const common_1 = require("../../schema/validators/common.js");
-const utils_1 = require("../../schema/validators/utils.js");
-exports.HeaderBackgroundProps = {
+import { ImageProps } from '../../components/Image/schema';
+import { BlockBaseProps, ButtonBlock, MediaProps, VideoProps, mediaView, withTheme, } from '../../schema/validators/common';
+import { filteredArray } from '../../schema/validators/utils';
+export const HeaderBackgroundProps = {
     type: 'object',
     additionalProperties: false,
     required: [],
-    properties: Object.assign(Object.assign({}, common_1.MediaProps), { fullWidth: { type: 'boolean' }, fullWidthMedia: { type: 'boolean' } }),
+    properties: Object.assign(Object.assign({}, MediaProps), { fullWidth: { type: 'boolean' }, fullWidthMedia: { type: 'boolean' } }),
 };
-exports.HeaderProperties = {
+export const HeaderProperties = {
     title: {
         type: 'string',
         contentType: 'text',
@@ -28,16 +25,16 @@ exports.HeaderProperties = {
         type: 'string',
         enum: ['s', 'm', 'l'],
     },
-    buttons: (0, utils_1.filteredArray)(common_1.ButtonBlock),
+    buttons: filteredArray(ButtonBlock),
     offset: {
         type: 'string',
         enum: ['default', 'large'],
     },
-    image: (0, common_1.withTheme)(schema_1.ImageProps),
-    video: (0, common_1.withTheme)(common_1.VideoProps),
+    image: withTheme(ImageProps),
+    video: withTheme(VideoProps),
     mediaView: {
         type: 'string',
-        enum: common_1.mediaView,
+        enum: mediaView,
     },
     backLink: {
         type: 'object',
@@ -60,7 +57,7 @@ exports.HeaderProperties = {
         type: 'string',
         enum: ['0', 's', 'm', 'l', 'xl'],
     },
-    background: (0, common_1.withTheme)(exports.HeaderBackgroundProps),
+    background: withTheme(HeaderBackgroundProps),
     theme: {
         type: 'string',
         enum: ['default', 'dark'],
@@ -93,12 +90,14 @@ exports.HeaderProperties = {
     status: {
         type: 'string',
     },
+    centered: {
+        type: 'boolean',
+    },
 };
-exports.HeaderBlock = {
+export const HeaderBlock = {
     'header-block': {
         additionalProperties: false,
         required: ['title'],
-        properties: Object.assign(Object.assign({}, common_1.BlockBaseProps), exports.HeaderProperties),
+        properties: Object.assign(Object.assign({}, BlockBaseProps), HeaderProperties),
     },
 };
-//# sourceMappingURL=schema.js.map

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

@@ -1,4 +1,4 @@
-import { HeaderImageSize, HeaderWidth } from "../../models/index.js";
+import { HeaderImageSize, HeaderWidth } from '../../models';
 export declare function titleWithImageSizes(imageSize: HeaderImageSize): {
     md: number;
     all: number;