@doyourjob/gravity-ui-page-constructor 5.31.119 → 5.31.120-background-effect-for-header-2

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

@@ -0,0 +1,24 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-background-effect {
+  position: absolute;
+  inset: 0;
+}
+.pc-background-effect__left {
+  width: 100%;
+  height: 100%;
+}
+.pc-background-effect__right {
+  position: absolute;
+  inset: 0;
+  clip-path: inset(0 0 0 99.99%);
+  transition: clip-path 1.5s ease;
+}
+.pc-header-block:hover .pc-background-effect__right {
+  clip-path: inset(0 0 0 0.01%);
+}
+.pc-background-effect__video {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}

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

@@ -0,0 +1,6 @@
+type BackgroundEffectProps = {
+    firstSrc: string;
+    secondSrc: string;
+};
+export declare const BackgroundEffect: ({ firstSrc, secondSrc }: BackgroundEffectProps) => JSX.Element | null;
+export default BackgroundEffect;

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

@@ -0,0 +1,76 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BackgroundEffect = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const utils_1 = require("../../../components/Media/Video/utils");
+const utils_2 = require("../../../utils");
+const b = (0, utils_2.block)('background-effect');
+const SYNC_THRESHOLD = 0.03;
+const MAX_DESYNC = 0.5;
+const FAST_RATE = 1.05;
+const SLOW_RATE = 0.95;
+const BackgroundEffect = ({ firstSrc, secondSrc }) => {
+    const master = (0, react_1.useRef)(null);
+    const driven = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        const m = master.current;
+        const d = driven.current;
+        let rafId;
+        if (m && d) {
+            const syncMaster = () => {
+                if (m.paused) {
+                    m.play().catch(() => { });
+                }
+                const delta = m.currentTime - d.currentTime;
+                if (d.paused) {
+                    d.play().catch(() => { });
+                }
+                if (Math.abs(delta) > MAX_DESYNC) {
+                    d.currentTime = m.currentTime;
+                    d.playbackRate = 1;
+                }
+                else if (Math.abs(delta) > SYNC_THRESHOLD) {
+                    d.playbackRate = delta > 0 ? FAST_RATE : SLOW_RATE;
+                }
+                else {
+                    d.playbackRate = 1;
+                }
+                rafId = m.requestVideoFrameCallback(syncMaster);
+            };
+            rafId = m.requestVideoFrameCallback(syncMaster);
+        }
+        const handleVisibility = () => {
+            if (!document.hidden && m && d) {
+                m.play().catch(() => { });
+                d.play().catch(() => { });
+            }
+        };
+        document.addEventListener('visibilitychange', handleVisibility);
+        return () => {
+            var _a;
+            document.removeEventListener('visibilitychange', handleVisibility);
+            if (rafId && m) {
+                (_a = m.cancelVideoFrameCallback) === null || _a === void 0 ? void 0 : _a.call(m, rafId);
+            }
+        };
+    }, []);
+    if (!firstSrc || !secondSrc) {
+        return null;
+    }
+    return (react_1.default.createElement("div", { className: b() },
+        react_1.default.createElement("div", { className: b('left') },
+            react_1.default.createElement("video", { ref: master, disablePictureInPicture: true, playsInline: true, 
+                // @ts-ignore
+                // eslint-disable-next-line react/no-unknown-property
+                pip: "false", autoPlay: true, loop: true, preload: "auto", muted: true, className: b('video') },
+                react_1.default.createElement("source", { src: firstSrc, type: (0, utils_1.parseVideoType)(firstSrc) }))),
+        react_1.default.createElement("div", { className: b('right') },
+            react_1.default.createElement("video", { ref: driven, disablePictureInPicture: true, playsInline: true, 
+                // @ts-ignore
+                // eslint-disable-next-line react/no-unknown-property
+                pip: "false", autoPlay: true, loop: true, preload: "auto", muted: true, className: b('video') },
+                react_1.default.createElement("source", { src: secondSrc, type: (0, utils_1.parseVideoType)(secondSrc) })))));
+};
+exports.BackgroundEffect = BackgroundEffect;
+exports.default = exports.BackgroundEffect;

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

@@ -13,6 +13,10 @@ unpredictable css rules order in build */
   padding: 16px 0;
   margin: 0 0 16px;
 }
+.pc-header-block_header-space {
+  padding-top: var(--header-height);
+  margin-top: calc(var(--header-height) * -1);
+}
 .pc-header-block__content-wrapper {
   margin: 0 8px;
   height: 100%;

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

@@ -12,6 +12,7 @@ const theme_1 = require("../../context/theme");
 const grid_1 = require("../../grid");
 const utils_2 = require("../../utils");
 const BackButton_1 = tslib_1.__importDefault(require("./BackButton/BackButton"));
+const BackgroundEffect_1 = tslib_1.__importDefault(require("./BackgroundEffect/BackgroundEffect"));
 const Breadcrumbs_1 = tslib_1.__importDefault(require("./Breadcrumbs/Breadcrumbs"));
 const HeaderButtons_1 = tslib_1.__importDefault(require("./HeaderButtons/HeaderButtons"));
 const HeaderDescription_1 = tslib_1.__importDefault(require("./HeaderDescription/HeaderDescription"));
@@ -30,7 +31,7 @@ const Background = ({ background, isMobile }) => {
 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 } }));
 // eslint-disable-next-line complexity
 const HeaderBlock = (props) => {
-    const { title, switchingTitle, topTags, bottomTags, overtitle, description, buttons, stock, stockPrice, stockShares, image, video, width = 's', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, renderTitle, children, mediaView = 'full', } = props;
+    const { title, switchingTitle, topTags, bottomTags, overtitle, description, buttons, stock, stockPrice, stockShares, image, video, width = 's', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, renderTitle, children, mediaView = 'full', backgroundEffect, headerSpace, } = props;
     const isMobile = (0, react_1.useContext)(mobileContext_1.MobileContext);
     const { backButton, blockTag } = (0, react_1.useContext)(headerContext_1.HeaderContext);
     const theme = (0, theme_1.useTheme)();
@@ -48,9 +49,11 @@ const HeaderBlock = (props) => {
             ['full-width']: fullWidth,
             ['media-view']: mediaView,
             ['controls-view']: textTheme,
+            ['header-space']: headerSpace,
         }, className) },
         backgroundThemed && fullWidth && react_1.default.createElement(FullWidthBackground, { background: backgroundThemed }),
         backgroundThemed && react_1.default.createElement(Background, { background: backgroundThemed, isMobile: isMobile }),
+        backgroundEffect && backgroundEffect.firstSrc && backgroundEffect.secondSrc && (react_1.default.createElement(BackgroundEffect_1.default, Object.assign({}, backgroundEffect))),
         react_1.default.createElement(grid_1.Grid, { containerClass: b('container-fluid') },
             react_1.default.createElement(Breadcrumbs_1.default, { breadcrumbs: breadcrumbs, theme: textTheme }),
             react_1.default.createElement(BackButton_1.default, { backButton: verticalOffset !== '0' && !breadcrumbs ? backButton : undefined, theme: textTheme }),

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

@@ -979,6 +979,22 @@ export declare const HeaderProperties: {
             };
         };
     };
+    backgroundEffect: {
+        type: string;
+        additionalProperties: boolean;
+        required: boolean;
+        properties: {
+            firstSrc: {
+                type: string;
+            };
+            secondSrc: {
+                type: string;
+            };
+        };
+    };
+    headerSpace: {
+        type: string;
+    };
 };
 export declare const HeaderBlock: {
     'header-block': {
@@ -1648,6 +1664,22 @@ export declare const HeaderBlock: {
                     };
                 };
             };
+            backgroundEffect: {
+                type: string;
+                additionalProperties: boolean;
+                required: boolean;
+                properties: {
+                    firstSrc: {
+                        type: string;
+                    };
+                    secondSrc: {
+                        type: string;
+                    };
+                };
+            };
+            headerSpace: {
+                type: string;
+            };
             anchor: {
                 type: string;
                 additionalProperties: boolean;

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

@@ -190,6 +190,18 @@ exports.HeaderProperties = {
             },
         },
     },
+    backgroundEffect: {
+        type: 'object',
+        additionalProperties: false,
+        required: true,
+        properties: {
+            firstSrc: { type: 'string' },
+            secondSrc: { type: 'string' },
+        },
+    },
+    headerSpace: {
+        type: 'boolean',
+    },
 };
 exports.HeaderBlock = {
     'header-block': {

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

@@ -673,6 +673,22 @@ export declare const HeaderSliderBlock: {
                                 };
                             };
                         };
+                        backgroundEffect: {
+                            type: string;
+                            additionalProperties: boolean;
+                            required: boolean;
+                            properties: {
+                                firstSrc: {
+                                    type: string;
+                                };
+                                secondSrc: {
+                                    type: string;
+                                };
+                            };
+                        };
+                        headerSpace: {
+                            type: string;
+                        };
                     };
                 };
             };

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

@@ -1,3 +1,3 @@
 import { RelevantReportsBlockProps } from '../../models';
-export declare const RelevantReports: ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, }: RelevantReportsBlockProps) => JSX.Element;
+export declare const RelevantReports: ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, count, }: RelevantReportsBlockProps) => JSX.Element;
 export default RelevantReports;

package/build/cjs/blocks/RelevantReports/RelevantReports.js

@@ -16,7 +16,7 @@ const layoutColSizes = {
     lg: 4,
     md: 6,
 };
-const RelevantReports = ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, }) => {
+const RelevantReports = ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, count, }) => {
     const [now, setNow] = react_1.default.useState(null);
     const data = (0, react_1.useContext)(__1.ReportsContext);
     const { items = [] } = (0, react_1.useMemo)(() => data[typeKey] || {}, [data, typeKey]);
@@ -26,7 +26,7 @@ const RelevantReports = ({ typeKey, link, title, description, slider, date, date
     const filteredPosts = (0, react_1.useMemo)(() => {
         if (!now)
             return [];
-        return items.filter((item) => {
+        const filteredItems = items.filter((item) => {
             var _a;
             const itemDate = new Date(((_a = item.options) === null || _a === void 0 ? void 0 : _a.date) || '');
             let isDateMatch = true;
@@ -61,7 +61,11 @@ const RelevantReports = ({ typeKey, link, title, description, slider, date, date
             }
             return isDateMatch;
         });
-    }, [now, items, date, dateStart, dateEnd]);
+        if (count) {
+            return filteredItems.slice(0, count);
+        }
+        return filteredItems;
+    }, [now, items, count, date, dateStart, dateEnd]);
     const renderItems = (0, react_1.useMemo)(() => {
         if (slider) {
             return (react_1.default.createElement("div", { className: b('slider') },

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

@@ -136,6 +136,9 @@ export declare const RelevantReportsBlock: {
             dateEnd: {
                 type: string;
             };
+            count: {
+                type: string;
+            };
             title: {
                 oneOf: ({
                     type: string;

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

@@ -17,6 +17,8 @@ exports.RelevantReportsBlock = {
                 type: 'string',
             }, dateEnd: {
                 type: 'string',
+            }, count: {
+                type: 'number',
             } }),
     },
 };

package/build/cjs/components/Media/Video/utils.d.ts

@@ -13,4 +13,5 @@ export interface ParsedVideo {
     src: string;
     type: VideoType | undefined;
 }
+export declare function parseVideoType(src: string): VideoType | undefined;
 export declare const getVideoTypesWithPriority: (sources: string[]) => ParsedVideo[];

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

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getVideoTypesWithPriority = exports.VideoType = exports.VideoExt = void 0;
+exports.getVideoTypesWithPriority = exports.parseVideoType = exports.VideoType = exports.VideoExt = void 0;
 var VideoExt;
 (function (VideoExt) {
     VideoExt["Mp4"] = "mp4";
@@ -34,6 +34,7 @@ function parseVideoType(src) {
             return undefined;
     }
 }
+exports.parseVideoType = parseVideoType;
 const getVideoTypesWithPriority = (sources) => sources
     .map((src) => ({ src, type: parseVideoType(src) }))
     .sort(({ type: typeA }, { type: typeB }) => {

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

@@ -27,7 +27,7 @@ export declare const blockMap: {
     "blog-feed-block": ({ image, title }: import("./models").BlogFeedBlockProps) => JSX.Element;
     "relevant-posts-block": ({ title, description, slider, date, dateStart, dateEnd, tags, services, pinnedPost, }: import("./models").RelevantPostsBlockProps) => JSX.Element;
     "relevant-reports-cards-block": ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, }: import("./models").RelevantReportsCardsBlockProps) => JSX.Element;
-    "relevant-reports-block": ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, }: import("./models").RelevantReportsBlockProps) => JSX.Element;
+    "relevant-reports-block": ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, count, }: import("./models").RelevantReportsBlockProps) => JSX.Element;
     "press-releases-block": ({ title }: import("./models").PressReleasesBlockProps) => JSX.Element;
     "highlight-table-block": ({ title, description, table, legend, contentSize, legendPosition, legendAlign, }: import("./models").HighlightTableBlockProps) => JSX.Element;
     "mini-case-block": (props: import("./models").MiniCaseBlockProps) => JSX.Element;

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

@@ -199,6 +199,11 @@ export interface HeaderBlockProps {
     breadcrumbs?: HeaderBreadCrumbsProps;
     status?: JSX.Element;
     renderTitle?: (title: string) => React.ReactNode;
+    backgroundEffect?: {
+        firstSrc: string;
+        secondSrc: string;
+    };
+    headerSpace?: boolean;
 }
 export interface ExtendedFeaturesItem extends Omit<ContentBlockProps, 'theme' | 'centered' | 'colSizes' | 'size' | 'title'> {
     title: Pick<TitleItemProps, 'text' | 'textSize'> | string;
@@ -416,6 +421,7 @@ export interface RelevantReportsBlockProps {
     date?: 'today' | 'week' | 'month';
     dateStart?: string;
     dateEnd?: string;
+    count?: number;
 }
 export interface PressReleasesBlockProps {
     title?: string;

package/build/esm/blocks/Header/BackgroundEffect/BackgroundEffect.css

@@ -0,0 +1,24 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-background-effect {
+  position: absolute;
+  inset: 0;
+}
+.pc-background-effect__left {
+  width: 100%;
+  height: 100%;
+}
+.pc-background-effect__right {
+  position: absolute;
+  inset: 0;
+  clip-path: inset(0 0 0 99.99%);
+  transition: clip-path 1.5s ease;
+}
+.pc-header-block:hover .pc-background-effect__right {
+  clip-path: inset(0 0 0 0.01%);
+}
+.pc-background-effect__video {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}

package/build/esm/blocks/Header/BackgroundEffect/BackgroundEffect.d.ts

@@ -0,0 +1,7 @@
+import './BackgroundEffect.css';
+type BackgroundEffectProps = {
+    firstSrc: string;
+    secondSrc: string;
+};
+export declare const BackgroundEffect: ({ firstSrc, secondSrc }: BackgroundEffectProps) => JSX.Element | null;
+export default BackgroundEffect;

package/build/esm/blocks/Header/BackgroundEffect/BackgroundEffect.js

@@ -0,0 +1,72 @@
+import React, { useEffect, useRef } from 'react';
+import { parseVideoType } from '../../../components/Media/Video/utils';
+import { block } from '../../../utils';
+import './BackgroundEffect.css';
+const b = block('background-effect');
+const SYNC_THRESHOLD = 0.03;
+const MAX_DESYNC = 0.5;
+const FAST_RATE = 1.05;
+const SLOW_RATE = 0.95;
+export const BackgroundEffect = ({ firstSrc, secondSrc }) => {
+    const master = useRef(null);
+    const driven = useRef(null);
+    useEffect(() => {
+        const m = master.current;
+        const d = driven.current;
+        let rafId;
+        if (m && d) {
+            const syncMaster = () => {
+                if (m.paused) {
+                    m.play().catch(() => { });
+                }
+                const delta = m.currentTime - d.currentTime;
+                if (d.paused) {
+                    d.play().catch(() => { });
+                }
+                if (Math.abs(delta) > MAX_DESYNC) {
+                    d.currentTime = m.currentTime;
+                    d.playbackRate = 1;
+                }
+                else if (Math.abs(delta) > SYNC_THRESHOLD) {
+                    d.playbackRate = delta > 0 ? FAST_RATE : SLOW_RATE;
+                }
+                else {
+                    d.playbackRate = 1;
+                }
+                rafId = m.requestVideoFrameCallback(syncMaster);
+            };
+            rafId = m.requestVideoFrameCallback(syncMaster);
+        }
+        const handleVisibility = () => {
+            if (!document.hidden && m && d) {
+                m.play().catch(() => { });
+                d.play().catch(() => { });
+            }
+        };
+        document.addEventListener('visibilitychange', handleVisibility);
+        return () => {
+            var _a;
+            document.removeEventListener('visibilitychange', handleVisibility);
+            if (rafId && m) {
+                (_a = m.cancelVideoFrameCallback) === null || _a === void 0 ? void 0 : _a.call(m, rafId);
+            }
+        };
+    }, []);
+    if (!firstSrc || !secondSrc) {
+        return null;
+    }
+    return (React.createElement("div", { className: b() },
+        React.createElement("div", { className: b('left') },
+            React.createElement("video", { ref: master, disablePictureInPicture: true, playsInline: true, 
+                // @ts-ignore
+                // eslint-disable-next-line react/no-unknown-property
+                pip: "false", autoPlay: true, loop: true, preload: "auto", muted: true, className: b('video') },
+                React.createElement("source", { src: firstSrc, type: parseVideoType(firstSrc) }))),
+        React.createElement("div", { className: b('right') },
+            React.createElement("video", { ref: driven, disablePictureInPicture: true, playsInline: true, 
+                // @ts-ignore
+                // eslint-disable-next-line react/no-unknown-property
+                pip: "false", autoPlay: true, loop: true, preload: "auto", muted: true, className: b('video') },
+                React.createElement("source", { src: secondSrc, type: parseVideoType(secondSrc) })))));
+};
+export default BackgroundEffect;

package/build/esm/blocks/Header/Header.css

@@ -13,6 +13,10 @@ unpredictable css rules order in build */
   padding: 16px 0;
   margin: 0 0 16px;
 }
+.pc-header-block_header-space {
+  padding-top: var(--header-height);
+  margin-top: calc(var(--header-height) * -1);
+}
 .pc-header-block__content-wrapper {
   margin: 0 8px;
   height: 100%;

package/build/esm/blocks/Header/Header.js

@@ -8,6 +8,7 @@ import { useTheme } from '../../context/theme';
 import { Col, Grid, Row } from '../../grid';
 import { block, getThemedValue } from '../../utils';
 import BackButton from './BackButton/BackButton';
+import BackgroundEffect from './BackgroundEffect/BackgroundEffect';
 import Breadcrumbs from './Breadcrumbs/Breadcrumbs';
 import HeaderButtons from './HeaderButtons/HeaderButtons';
 import HeaderDescription from './HeaderDescription/HeaderDescription';
@@ -27,7 +28,7 @@ const Background = ({ background, isMobile }) => {
 const FullWidthBackground = ({ background }) => (React.createElement("div", { className: b('background', { ['full-width']: true }), style: { backgroundColor: background === null || background === void 0 ? void 0 : background.color } }));
 // eslint-disable-next-line complexity
 export const HeaderBlock = (props) => {
-    const { title, switchingTitle, topTags, bottomTags, overtitle, description, buttons, stock, stockPrice, stockShares, image, video, width = 's', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, renderTitle, children, mediaView = 'full', } = props;
+    const { title, switchingTitle, topTags, bottomTags, overtitle, description, buttons, stock, stockPrice, stockShares, image, video, width = 's', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, renderTitle, children, mediaView = 'full', backgroundEffect, headerSpace, } = props;
     const isMobile = useContext(MobileContext);
     const { backButton, blockTag } = useContext(HeaderContext);
     const theme = useTheme();
@@ -45,9 +46,11 @@ export const HeaderBlock = (props) => {
             ['full-width']: fullWidth,
             ['media-view']: mediaView,
             ['controls-view']: textTheme,
+            ['header-space']: headerSpace,
         }, className) },
         backgroundThemed && fullWidth && React.createElement(FullWidthBackground, { background: backgroundThemed }),
         backgroundThemed && React.createElement(Background, { background: backgroundThemed, isMobile: isMobile }),
+        backgroundEffect && backgroundEffect.firstSrc && backgroundEffect.secondSrc && (React.createElement(BackgroundEffect, Object.assign({}, backgroundEffect))),
         React.createElement(Grid, { containerClass: b('container-fluid') },
             React.createElement(Breadcrumbs, { breadcrumbs: breadcrumbs, theme: textTheme }),
             React.createElement(BackButton, { backButton: verticalOffset !== '0' && !breadcrumbs ? backButton : undefined, theme: textTheme }),

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

@@ -979,6 +979,22 @@ export declare const HeaderProperties: {
             };
         };
     };
+    backgroundEffect: {
+        type: string;
+        additionalProperties: boolean;
+        required: boolean;
+        properties: {
+            firstSrc: {
+                type: string;
+            };
+            secondSrc: {
+                type: string;
+            };
+        };
+    };
+    headerSpace: {
+        type: string;
+    };
 };
 export declare const HeaderBlock: {
     'header-block': {
@@ -1648,6 +1664,22 @@ export declare const HeaderBlock: {
                     };
                 };
             };
+            backgroundEffect: {
+                type: string;
+                additionalProperties: boolean;
+                required: boolean;
+                properties: {
+                    firstSrc: {
+                        type: string;
+                    };
+                    secondSrc: {
+                        type: string;
+                    };
+                };
+            };
+            headerSpace: {
+                type: string;
+            };
             anchor: {
                 type: string;
                 additionalProperties: boolean;

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

@@ -187,6 +187,18 @@ export const HeaderProperties = {
             },
         },
     },
+    backgroundEffect: {
+        type: 'object',
+        additionalProperties: false,
+        required: true,
+        properties: {
+            firstSrc: { type: 'string' },
+            secondSrc: { type: 'string' },
+        },
+    },
+    headerSpace: {
+        type: 'boolean',
+    },
 };
 export const HeaderBlock = {
     'header-block': {

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

@@ -673,6 +673,22 @@ export declare const HeaderSliderBlock: {
                                 };
                             };
                         };
+                        backgroundEffect: {
+                            type: string;
+                            additionalProperties: boolean;
+                            required: boolean;
+                            properties: {
+                                firstSrc: {
+                                    type: string;
+                                };
+                                secondSrc: {
+                                    type: string;
+                                };
+                            };
+                        };
+                        headerSpace: {
+                            type: string;
+                        };
                     };
                 };
             };

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

@@ -1,4 +1,4 @@
 import { RelevantReportsBlockProps } from '../../models';
 import './RelevantReports.css';
-export declare const RelevantReports: ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, }: RelevantReportsBlockProps) => JSX.Element;
+export declare const RelevantReports: ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, count, }: RelevantReportsBlockProps) => JSX.Element;
 export default RelevantReports;

package/build/esm/blocks/RelevantReports/RelevantReports.js

@@ -13,7 +13,7 @@ const layoutColSizes = {
     lg: 4,
     md: 6,
 };
-export const RelevantReports = ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, }) => {
+export const RelevantReports = ({ typeKey, link, title, description, slider, date, dateStart, dateEnd, count, }) => {
     const [now, setNow] = React.useState(null);
     const data = useContext(ReportsContext);
     const { items = [] } = useMemo(() => data[typeKey] || {}, [data, typeKey]);
@@ -23,7 +23,7 @@ export const RelevantReports = ({ typeKey, link, title, description, slider, dat
     const filteredPosts = useMemo(() => {
         if (!now)
             return [];
-        return items.filter((item) => {
+        const filteredItems = items.filter((item) => {
             var _a;
             const itemDate = new Date(((_a = item.options) === null || _a === void 0 ? void 0 : _a.date) || '');
             let isDateMatch = true;
@@ -58,7 +58,11 @@ export const RelevantReports = ({ typeKey, link, title, description, slider, dat
             }
             return isDateMatch;
         });
-    }, [now, items, date, dateStart, dateEnd]);
+        if (count) {
+            return filteredItems.slice(0, count);
+        }
+        return filteredItems;
+    }, [now, items, count, date, dateStart, dateEnd]);
     const renderItems = useMemo(() => {
         if (slider) {
             return (React.createElement("div", { className: b('slider') },

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

@@ -136,6 +136,9 @@ export declare const RelevantReportsBlock: {
             dateEnd: {
                 type: string;
             };
+            count: {
+                type: string;
+            };
             title: {
                 oneOf: ({
                     type: string;

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

@@ -14,6 +14,8 @@ export const RelevantReportsBlock = {
                 type: 'string',
             }, dateEnd: {
                 type: 'string',
+            }, count: {
+                type: 'number',
             } }),
     },
 };