@redneckz/wildless-cms-uni-blocks 0.11.0 → 0.11.2

package/mobile/bundle/bundle.umd.js

@@ -460,7 +460,6 @@
 
     const defaultDiscriminator = (_) => _;
     const maxBy = (discriminator = defaultDiscriminator) => (list) => list.reduceRight((a, b) => (discriminator(a) > discriminator(b) ? a : b));
-    const max = maxBy();
 
     const minBy = (discriminator = defaultDiscriminator) => maxBy((_) => -discriminator(_));
 
@@ -604,7 +603,7 @@
     const renderImg = (image, imageClassName = '', isMobile = false) => {
         const style = {
             width: image.size?.width ? `${image.size?.width}px` : '100%',
-            height: image.size?.height ? `${image.size?.height}px` : '100%',
+            height: image.size?.height ? `${image.size?.height}px` : 'auto',
         };
         const title = image.title || '';
         const alt = image.alt || image.title;
@@ -810,6 +809,30 @@
     const getAlignStyle = (isAlignCenter) => isAlignCenter ? 'flex justify-center' : '';
     const renderDots = (containerRef, dotsActiveIndex, itemCount) => (jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: dotsActiveIndex, dotCount: itemCount, listType: 'horizontal-list' }));
 
+    const mobileHeadingTagMap = {
+        h1: 'h1',
+        h2: 'h1',
+        h3: 'h2',
+        h4: 'h2',
+        h5: 'h3',
+        h6: 'h3',
+    };
+    const headingTag = (tag) => mobileHeadingTagMap[tag] || 'h3';
+
+    const styles = {
+        h0: 'text-h0',
+        h1: 'text-h1',
+        h2: 'text-h2',
+        h3: 'text-h3',
+        h4: 'text-h4',
+        h5: 'text-h5',
+        h6: 'text-h6', // 20
+    };
+    const Heading = JSX(({ className = '', headingType = 'h3', as = 'h3', title, children }) => {
+        const Tag = headingTag(as);
+        return (jsx(Tag, { className: `font-sans m-0 ${styles[headingType]} ${className}`, children: title || children }));
+    });
+
     const LinkWrapper = JSX(({ className = '', href, target, isRemote = false, children }) => {
         const link = useLink({ isRemote });
         const linkProps = link({ href, target });
@@ -817,6 +840,11 @@
         return (jsx(Tag, { className: style('block', className), ...(href ? linkProps : {}), children: children }));
     });
 
+    const CarouselProgramsCard = JSX(({ className = '', title, icon, list = [], href, target, ...rest }) => {
+        return (jsx(BlockWrapper, { className: style('border border-gray', className), ...rest, children: jsxs(LinkWrapper, { className: "flex", href: href, target: target, children: [jsxs("div", { className: "w-[200px] min-w-[200px] self-center", children: [icon?.icon ? jsx(Img, { image: icon }) : null, icon?.src ? jsx(Img, { image: icon }) : null] }), jsxs("div", { className: "p-8 pl-3 w-full", children: [title ? jsx(Heading, { className: "mb-3.5", headingType: "h5", title: title }) : null, list.length ? (jsx("div", { className: "flex flex-col gap-3", children: list?.map(renderList$1) })) : null] })] }) }));
+    });
+    const renderList$1 = (_, i) => (jsxs("div", { className: "break-words", children: [_.title ? jsx("div", { className: "text-h6", children: _.title }) : null, _.description ? jsx("span", { className: "text-l-light mt-1", children: _.description }) : null] }, String(i)));
+
     const DOT_SIZE_MAP = {
         L: 'w-1.5 h-1.5 mr-4',
         M: 'w-1.5 h-1.5 mr-3',
@@ -886,52 +914,38 @@
 
     const SocialMedia = JSX(({ className = '', media }) => (jsx("div", { className: `flex gap-2 items-start justify-start ${className}`, children: media?.map((_, index) => (jsx(MediaButton, { ..._ }, String(index)))) })));
 
-    const HeadingClass = {
-        h0: 'text-m-title',
-        h1: 'text-m-title',
-        h2: 'text-m-title',
-        h3: 'text-h6',
-        h4: 'text-m-title-xs',
-        h5: 'text-m-title-xs',
-        h6: 'text-m-title-xs',
-    };
-    const Heading = JSX((props) => {
-        const { className, headingType = 'h3', title, as: Tag = 'h3' } = props;
-        return (jsx(Tag, { className: `font-sans font-medium m-0 ${HeadingClass[headingType]} ${className || ''}`, children: title }));
-    });
-
     const Paragraph = JSX(({ children, ...style }) => (jsx("p", { className: ['font-sans', ...Object.values(style)].join(' '), children: children })));
 
     const headlineVersionStyles = {
         XXL: {
             title: { headingType: 'h0', as: 'h1' },
             descriptionSize: 'text-h5',
-            descriptionStyle: 'mt-5',
+            descriptionStyle: 'mt-headline-xxl',
         },
         XL: {
             title: { headingType: 'h1', as: 'h1' },
             descriptionSize: 'text-xl-light',
-            descriptionStyle: 'mt-4',
+            descriptionStyle: 'mt-headline-l',
         },
         L: {
             title: { headingType: 'h2', as: 'h2' },
             descriptionSize: 'text-xl-light',
-            descriptionStyle: 'mt-4',
+            descriptionStyle: 'mt-headline-l',
         },
         M: {
             title: { headingType: 'h3', as: 'h3' },
             descriptionSize: 'text-xl-light',
-            descriptionStyle: 'mt-3',
+            descriptionStyle: 'mt-headline-m',
         },
         S: {
             title: { headingType: 'h4', as: 'h4' },
             descriptionSize: 'text-xl-light',
-            descriptionStyle: 'mt-2',
+            descriptionStyle: 'mt-headline-s',
         },
         XS: {
             title: { headingType: 'h5', as: 'h5' },
             descriptionSize: 'text-l-light',
-            descriptionStyle: 'mt-2',
+            descriptionStyle: 'mt-headline-s',
         },
     };
 
@@ -1123,15 +1137,6 @@
         }
     }
 
-    async function fetchJSON(url, options) {
-        try {
-            return url ? await fetchJSONUnsafe(url, options) : null;
-        }
-        catch (err) {
-            console.error(err);
-        }
-        return null;
-    }
     async function fetchJSONUnsafe(url, options) {
         const response = await fetch(url, {
             ...options,
@@ -1242,7 +1247,7 @@
 
     const textInformationTextSize = 'text-s';
 
-    const TextInformation = JSX(({ className = '', links }) => (jsxs("div", { className: className, children: [jsx("div", { className: "pt-5 sm:py-4", children: jsx(Text, { size: textInformationTextSize, color: "text-secondary-text", children: `\u00a9\u00A02000-${new Date().getFullYear()}\u00A0АО \u00ABРоссельхозбанк\u00BB Генеральная лицензия Банка России \u2116\u00A03349 от\u00A012.08.2015\u00A0г.` }) }), links?.length ? (jsx("div", { className: "flex justify-start items-start gap-5 pt-2.5", children: links.map((_, i) => (jsx(TextInformationLink, { index: i, ..._ }, String(i)))) })) : null] })));
+    const TextInformation = JSX(({ className = '', links }) => (jsxs("div", { className: className, children: [jsx("div", { className: "pt-4 xl:pt-5", children: jsx(Text, { size: textInformationTextSize, color: "text-secondary-text", children: `\u00a9\u00A02000-${new Date().getFullYear()}\u00A0АО \u00ABРоссельхозбанк\u00BB Генеральная лицензия Банка России \u2116\u00A03349 от\u00A012.08.2015\u00A0г.` }) }), links?.length ? (jsx("div", { className: "flex justify-start items-start gap-5 pt-4", children: links.map((_, i) => (jsx(TextInformationLink, { index: i, ..._ }, String(i)))) })) : null] })));
 
     const Footer = JSX(({ className = '', ...rest }) => {
         const fallback = rest.options?.page?.fallback;
@@ -1251,371 +1256,6 @@
         return (jsxs(BlockWrapper, { tag: "footer", className: style('px-4 py-6', className), ...rest, children: [jsx("div", { className: "mb-4 pb-5 border-b border-main-divider", children: sitemap.topItems?.map((item, i) => (jsx(RollupItem, { label: item?.text, labelIcon: item?.icon, children: jsx(LinkList, { items: item.items, className: "my-3" }) }, String(i)))) }), jsx(Contacts, { className: "overflow-hidden", items: contacts }), jsx(SocialMedia, { className: "mb-4", media: socialMedia }), jsx(Button, { className: "w-full mb-4", text: "Google Play", version: "secondary", href: "/", target: "_blank" }), jsx(HorizontalNavigation, { className: "pt-4 pb-7 border-y border-main-divider", title: horizontalNavigationTitle, links: relatedEnterprises }), jsx(TextInformation, {})] }));
     });
 
-    const isHrefActive = (router) => ({ href }) => withoutQuery(isURL(href) ? router.href : router.pathname).startsWith(withoutQuery(href));
-
-    const findActiveSubItem = (router) => (items = []) => {
-        const possibleActiveSubItems = items?.filter(isHrefActive(router));
-        return possibleActiveSubItems?.length
-            ? maxBy((_) => _.href?.length || 0)(possibleActiveSubItems) // More specific item with max length
-            : undefined;
-    };
-
-    const isTopItemActive = (router) => isHrefActive(projectSettings.BASE_PATH ? { pathname: projectSettings.BASE_PATH } : router);
-
-    const HeaderItem = JSX(({ className = '', active, dataItemName, children, ...rest }) => {
-        const link = useLink();
-        const { href, target, text, onClick } = link(rest);
-        return (jsxs("a", { className: style('relative inline-block bg-transparent text-center no-underline', className), href: href, target: target, "data-item-name": dataItemName, onClick: onClick, children: [jsx("span", { className: getTextStyle(active), children: text || children }), active ? (jsx("div", { className: "absolute left-0 -bottom-3 w-full h-0.5 bg-primary-main group-data-transparent:bg-transparent" })) : null] }));
-    });
-    const getTextStyle = (active = false) => style('font-sans text-s', active ? 'text-primary-main' : 'text-secondary-text hover:text-primary-main', 'group-data-transparent:text-white group-data-transparent:hover:text-primary-hover');
-
-    const STORAGE_DEFAULT_TTL = 86400000; // 24 * 60 * 60 * 1000
-    function useCachedAsyncData(key, fetcher, storage = globalThis?.localStorage) {
-        const cachedFetcher = useCallback(async (...args) => {
-            const storageKey = `async:${key}`;
-            const storageData = storage.getItem(storageKey);
-            const cachedData = getParsedData(storageData);
-            if (cachedData) {
-                return cachedData;
-            }
-            const data = await fetcher(...args);
-            storage.setItem(storageKey, JSON.stringify({ data, timestamp: Date.now() }));
-            return data;
-        }, [key, fetcher]);
-        return useAsyncData(key, cachedFetcher);
-    }
-    function getParsedData(storageData) {
-        const { data = null, timestamp = null } = storageData ? JSON.parse(storageData) : {};
-        return data && Date.now() - timestamp < STORAGE_DEFAULT_TTL ? data : undefined;
-    }
-
-    const REGION_URL = '/api/v1/region';
-    function useLocation(defaultLocation = 'Москва') {
-        const currentLocation = getLocalStorageLocation();
-        const [location, setLocation] = useState(currentLocation?.region ?? { name: defaultLocation });
-        const { data } = useCachedAsyncData(REGION_URL, fetchJSONUnsafe);
-        useEffect(() => {
-            setLocation(currentLocation?.region && currentLocation?.manual
-                ? currentLocation.region
-                : data || { name: defaultLocation });
-        }, [data]);
-        const onChangeLocation = useCallback((region) => {
-            globalThis.localStorage?.setItem('location', JSON.stringify({ manual: true, region }));
-            setLocation(region);
-        }, []);
-        return [location, onChangeLocation];
-    }
-    const getLocalStorageLocation = () => {
-        const localStorageLocation = globalThis.localStorage?.getItem('location');
-        try {
-            return localStorageLocation ? JSON.parse(localStorageLocation) : null;
-        }
-        catch (_) {
-            return null;
-        }
-    };
-
-    const CloseButton = JSX(({ className, onClick }) => (jsx("button", { className: style('flex justify-center items-center w-12 h-12 p-1 bg-transparent border-none', className), onClick: onClick, title: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C", children: jsx(Img, { image: { icon: 'CloseIcon' }, width: "24", height: "24" }) })));
-
-    function assertUnreachable(x) {
-        throw new Error(x);
-    }
-
-    function useDialogHandlers({ onOpen, onClose } = {}) {
-        useEffect(() => defaultEventBus.subscribe('dialog', (action) => {
-            switch (action.type) {
-                case 'open':
-                    onOpen && onOpen(action);
-                    break;
-                case 'close':
-                    onClose && onClose();
-                    break;
-                default:
-                    assertUnreachable(action);
-            }
-        }), [onOpen, onClose]);
-    }
-
-    const useDebouncedEffect = (effect, deps, delay = 300) => useEffect(() => {
-        const timerId = setTimeout(effect, delay);
-        return () => {
-            clearTimeout(timerId);
-        };
-    }, deps);
-
-    const compareBy = (indexOf) => (a, b) => indexOf(a) - indexOf(b);
-    const desc = (cmp) => (a, b) => -cmp(a, b);
-
-    function zip(firstCol, ...restCols) {
-        return firstCol.map((firstEl, rowIndex) => [firstEl, ...restCols.map((col) => col[rowIndex])]);
-    }
-
-    const JARO_WINKLER_P = 0.1;
-    const JARO_WINKLER_MAX_L = 4;
-    const jaroWinklerDistance = (s1) => (s2) => {
-        if (s1 === s2) {
-            return 1;
-        }
-        if (!s1 || !s2) {
-            return 0;
-        }
-        const { m, s1Matches, s2Matches } = computeM(s1, s2);
-        if (m === 0) {
-            return 0;
-        }
-        const t = computeT(s1, s2, { s1Matches, s2Matches });
-        const jaroWeight = (m / s1.length + m / s2.length + (m - t / 2) / m) / 3;
-        const winklerWeight = jaroWeight > 0.7 ? computePrefixL(s1, s2) * JARO_WINKLER_P : 0;
-        return jaroWeight + winklerWeight * (1 - jaroWeight);
-    };
-    function computeM(s1, s2) {
-        const range = Math.max(0, Math.floor(Math.max(s1.length, s2.length) / 2) - 1);
-        const s1Matches = new Array(s1.length);
-        const s2Matches = new Array(s2.length);
-        let m = 0;
-        for (let i = 0; i < s1.length; i++) {
-            const low = Math.max(0, i - range);
-            const high = Math.min(i + range, s2.length - 1);
-            for (let j = low; j <= high; j++) {
-                if (s1Matches[i] || s2Matches[j] || s1[i] !== s2[j]) {
-                    continue;
-                }
-                m++;
-                s1Matches[i] = true;
-                s2Matches[j] = true;
-            }
-        }
-        return { m, s1Matches, s2Matches };
-    }
-    function computeT(s1, s2, { s1Matches, s2Matches }) {
-        let t = 0;
-        for (let i = 0, k = 0; i < s1.length; i++) {
-            if (!s1Matches[i]) {
-                continue;
-            }
-            let j = k;
-            for (; j < s2.length; j++) {
-                if (s2Matches[j]) {
-                    k = j + 1;
-                    break;
-                }
-            }
-            if (s1[i] !== s2[j]) {
-                t++;
-            }
-        }
-        return t;
-    }
-    function computePrefixL(s1, s2) {
-        let prefixL = 0;
-        while (s1[prefixL] === s2[prefixL] && prefixL < JARO_WINKLER_MAX_L) {
-            prefixL++;
-        }
-        return prefixL;
-    }
-
-    const joinMaps = (aggregate, emptyVal) => (acc, map) => {
-        for (const [key, b] of map) {
-            acc.set(key, aggregate(acc.get(key) || emptyVal, b));
-        }
-        return acc;
-    };
-
-    const sum = (list = []) => list.reduce((a, b) => a + b, 0);
-
-    const MIN_TERM_LEN = 3;
-    const tokenize = (text) => text
-        .toLowerCase()
-        .split(/[^0-9a-zа-я-]+/)
-        .filter((token) => token.length >= MIN_TERM_LEN && !/[0-9a-z]/.test(token));
-
-    const textRank = (queryTokens) => (text) => {
-        const textTokens = tokenize(text || '');
-        return textTokens.length
-            ? sum(queryTokens.map((qToken) => max(textTokens.map(jaroWinklerDistance(qToken)))))
-            : 0;
-    };
-
-    const JW_THRESHOLD = 0.8;
-    const RANK_EPS = 0.001;
-    const search = (query) => (searchIndex) => {
-        const { corpus, dictionary } = searchIndex || {};
-        if (!query || !corpus?.length || !dictionary || !Object.keys(dictionary).length) {
-            return [];
-        }
-        const queryTokens = tokenize(query);
-        if (!queryTokens.length) {
-            return [];
-        }
-        const dictEntries = Object.entries(dictionary);
-        const pagesRanking = queryTokens
-            .map(computePagesRankingPerToken(dictEntries))
-            .reduce(joinMaps((a, b) => a + b, 0), new Map());
-        const relevantPages = [...pagesRanking.entries()]
-            .filter(([, pageRank]) => pageRank >= (JW_THRESHOLD - RANK_EPS) * queryTokens.length) // Multiplication of query tokens
-            .map(([pageIndex]) => corpus[pageIndex]);
-        return sortResultsByRank(queryTokens)(relevantPages);
-    };
-    const computePagesRankingPerToken = (dictEntries) => (qToken) => dictEntries
-        .map(([stem, pageIndices]) => [jaroWinklerDistance(qToken)(stem), pageIndices])
-        .filter(([stemRank]) => stemRank >= JW_THRESHOLD)
-        .map(([stemRank, pageIndices]) => fillMapWith(pageIndices, stemRank))
-        .reduce(joinMaps(Math.max, 0), new Map());
-    const sortResultsByRank = (queryTokens) => (results) => zip(results, results.map(({ title }) => title).map(textRank(queryTokens)))
-        .sort(desc(compareBy(([, pageTitleRank]) => pageTitleRank)))
-        .map(([corpusItem]) => corpusItem);
-    const fillMapWith = (keys, value) => new Map(keys.map((_) => [_, value]));
-
-    const SEARCH_INDEX_FILENAME = 'search.index.json';
-    const DEFAULT_BASE_PATH = ['/'];
-    const useSearch = ({ basePathList = DEFAULT_BASE_PATH, initialQuery = '', wasOpened, }) => {
-        const [query, setQuery] = useState(initialQuery || '');
-        useEffect(() => {
-            if (initialQuery !== undefined && initialQuery !== null) {
-                setQuery(initialQuery);
-            }
-        }, [initialQuery]);
-        const key = useMemo(() => basePathList.map((_) => (wasOpened ? _ : null)), // Load search index on very first search
-        [wasOpened, basePathList]);
-        const { data } = useAsyncData(key, fetchSearchIndex);
-        const [result, setResult] = useState(null);
-        useDebouncedEffect(() => {
-            if (data) {
-                setResult(data.map(search(query)));
-            }
-        }, [data, query]);
-        return [result, { value: query, onChange: setQuery }];
-    };
-    const fetchSearchIndex = async (...basePathList) => (await Promise.allSettled(basePathList.map((basePath) => fetchJSON(joinPath(basePath, '/', SEARCH_INDEX_FILENAME))))).map((_) => (_.status === 'fulfilled' ? _.value : {}));
-
-    const Dialog = JSX(({ className, isOpened, head, children, onClose }) => {
-        useEffect(() => {
-            const handleEscape = ({ key }) => {
-                if (key === 'Escape') {
-                    onClose && onClose();
-                }
-            };
-            globalThis.document?.addEventListener('keydown', handleEscape);
-            return () => {
-                globalThis.document?.removeEventListener('keydown', handleEscape);
-            };
-        }, [onClose]);
-        return isOpened ? (jsx("div", { className: style('fixed inset-0 bg-white text-l-light z-50 overflow-x-hidden overflow-y-scroll no-scrollbar', className), role: "dialog", children: jsxs("div", { className: "relative container pb-12 min-h-full", children: [jsxs("div", { className: "sticky bg-white pt-6 top-0", children: [jsx(CloseButton, { className: "absolute top-10 -right-12", onClick: onClose }), head] }), children] }) })) : null;
-    });
-
-    function useBool(defaultValue = false) {
-        const [value, setValue] = useState(defaultValue);
-        const setTrue = useCallback(() => setValue(true), []);
-        const setFalse = useCallback(() => setValue(false), []);
-        const toggle = useCallback(() => setValue((_) => !_), []);
-        return [value, { setValue, setTrue, setFalse, toggle }];
-    }
-
-    function useDialogProps(id, initOpen = false) {
-        const [isOpened, { setTrue: open, setFalse: close }] = useBool(initOpen);
-        const [params, setParams] = useState({ id });
-        const wasOpened = useRef(isOpened);
-        wasOpened.current ||= isOpened;
-        const handleOpen = useCallback((_) => {
-            if (_.id === id) {
-                setParams(_);
-                open();
-            }
-            else {
-                close();
-            }
-        }, [id]);
-        useDialogHandlers({
-            onOpen: handleOpen,
-            onClose: close,
-        });
-        const handleCloseAsEventSource = useCallback(() => {
-            close();
-            defaultEventBus.fire('dialog', { type: 'close' });
-        }, []);
-        return {
-            ...params,
-            isOpened,
-            wasOpened: wasOpened.current,
-            onClose: handleCloseAsEventSource,
-        };
-    }
-
-    const Sitemap = JSX(({ className, topItems }) => {
-        const link = useLink({ isRemote: true });
-        return (jsx("div", { className: style('flex items-start justify-between', className), children: topItems?.map(link).map(renderColumn) }));
-    });
-    const renderColumn = (menuItem, index) => {
-        const { text, items, href, target, onClick } = menuItem;
-        return (jsxs("div", { className: "flex flex-col gap-3.5 w-1/4", children: [jsx("a", { className: "leading-5 text-l text-primary-text hover:text-primary-main no-underline", href: href, target: target || '_self', onClick: onClick, children: text || `Раздел ${index}` }), items?.map((_, i) => (jsx(ColumnItem, { ..._, basePath: appendSlash(href), index: i }, String(i))))] }, String(index)));
-    };
-    const ColumnItem = JSX(({ text, index, basePath, ...rest }) => {
-        const isAnotherPortal = projectSettings.BASE_PATH && basePath ? !projectSettings.BASE_PATH.startsWith(basePath) : false;
-        const link = useLink({ isRemote: isAnotherPortal, basePath });
-        const { href, target, onClick } = link(rest);
-        return (jsx("a", { className: style('text-l-light text-secondary-text hover:text-primary-main no-underline', 'overflow-x-hidden overflow-ellipsis whitespace-nowrap'), href: href, target: target || '_self', onClick: onClick, children: text || `Раздел ${index}` }));
-    });
-
-    const SearchInput = JSX(({ className, value, autoFocus, onChange, onFocus }) => {
-        const handleChange = useCallback((ev) => {
-            onChange && onChange(ev.target?.value || '');
-        }, [onChange]);
-        return (jsxs("div", { className: style('font-sans relative', className), role: "form", children: [jsx("div", { className: "absolute h-full flex items-center pl-4 pointer-events-none", children: jsx(Img, { image: { icon: 'LoupeIcon' }, width: "24", height: "24" }) }), jsx("input", { className: style('h-12 pl-12 w-full text-l text-black outline-none box-border', 'border border-solid rounded-md border-gray hover:border-primary-hover active:border-primary-text focus:border-primary-text'), value: value, type: "text", name: "search-bar-input", placeholder: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443", autoFocus: autoFocus, onChange: handleChange, onFocus: onFocus })] }));
-    });
-
-    const SEARCH_DIALOG_ID = 'search';
-    JSX(({ topItems }) => {
-        const dialogProps = useDialogProps(SEARCH_DIALOG_ID);
-        const basePathList = useMemo(() => topItems?.map((_) => _.href || '/'), [topItems]);
-        const [searchResult, searchInputProps] = useSearch({
-            basePathList,
-            initialQuery: dialogProps.message,
-            wasOpened: dialogProps.wasOpened,
-        });
-        const searchItems = useMemo(() => combineTopItemsAndSearchResult(topItems)(searchResult), [topItems, searchResult]);
-        useEffect(() => printSearchItems(searchItems), [searchItems]); // Temp
-        return (jsx(Dialog, { ...dialogProps, head: jsx(SearchInput, { className: "my-5", autoFocus: true, ...searchInputProps }), children: jsx(Sitemap, { topItems: searchItems }) }));
-    });
-    const combineTopItemsAndSearchResult = (topItems) => (searchResult) => topItems?.length && searchResult?.length
-        ? zip(topItems, searchResult).map(([_, portalSearchResult]) => ({
-            ..._,
-            items: portalSearchResult?.map(({ title, uri }) => ({ text: title, href: joinPath('/', uri) })),
-        }))
-        : [];
-    // Temp
-    function printSearchItems(topItems) {
-        for (const _ of topItems.filter(({ items }) => items?.length)) {
-            console.group(_.text);
-            console.table(_.items, ['text', 'href']);
-            console.groupEnd();
-        }
-    }
-
-    const MIN_QUERY_LEN = 3;
-    const SearchBar = JSX(({ className }) => {
-        const [value, setValue] = useState('');
-        const resetQueryOnDialogClose = useCallback(() => setValue(''), []);
-        useDialogHandlers({ onClose: resetQueryOnDialogClose });
-        const { open } = useDialog(SEARCH_DIALOG_ID);
-        const handleInitialInputChange = useCallback((_) => {
-            setValue(_);
-            if (isQueryLongEnough(_)) {
-                open(_);
-            }
-        }, []);
-        return (jsxs("div", { className: className, children: [jsx(SearchInput, { value: value, onChange: handleInitialInputChange }), jsx(CloseButton, { className: "absolute top-2 right-3 sm:hidden", onClick: resetQueryOnDialogClose })] }));
-    });
-    const isQueryLongEnough = (_) => _ && _.length >= MIN_QUERY_LEN;
-
-    const HeaderBurger = JSX(({ burgerSubMenu, onClick, defaultLocation = '', children }) => {
-        const [location] = useLocation(defaultLocation);
-        return (jsxs("div", { className: "absolute top-0 left-0 w-full h-full bg-white p-4 box-border z-20", children: [jsx("button", { className: "absolute top-4 right-4 border-none bg-transparent cursor-pointer", onClick: onClick, children: jsx(Img, { image: { icon: 'CloseIcon' }, width: "24", height: "24" }) }), jsxs("button", { className: "flex items-center text-s p-0 mb-4 bg-transparent cursor-pointer", children: [jsx(Img, { image: { icon: 'GeolocationIcon' }, width: "20", height: "20", className: "text-primary-main box-border mr-2" }), jsx(Text, { color: "text-secondary-text", children: location.name })] }), children, jsx("div", { className: "mb-7", children: burgerSubMenu?.map(renderBurgerSubMenuItem) }), jsx(SearchBar, { className: "grow" })] }));
-    });
-    const renderBurgerSubMenuItem = (menu, i) => {
-        const { icon, href, text } = menu;
-        return (jsxs("a", { href: href, className: "flex text-s mb-4 hover:text-primary-main", children: [icon ? jsx(Img, { className: "text-primary-main pr-1", image: icon, width: "24", height: "24" }) : null, jsx("span", { className: "font-medium pl-0.5", children: text })] }, `headerSubMenu-${i}`));
-    };
-
     const ICON_VERSION_MAP = {
         'bg-white': 'color',
         transparent: 'white',
@@ -1643,22 +1283,27 @@
         return (jsxs("a", { className: `inline-flex items-center font-sans no-underline ${className}`, href: href || 'https://rshb.ru/', target: targetBlank ? '_blank' : '_self', "aria-label": logo?.title || 'Россельхозбанк', children: [renderImage$1(bgColor, logo?.image, { width: '34', height: '34' }), showTitle ? renderTitle(children || logo?.title, bgColor, 'text-s') : null] }));
     });
 
-    const HeaderTop = JSX(({ onClick, bgColor, logo }) => (jsxs("div", { className: "flex items-center justify-between border-0 border-b border-main-divider h-12", children: [jsxs("div", { className: "flex items-center", children: [jsx("button", { className: "pl-0 pr-4 border-0 bg-transparent cursor-pointer", onClick: onClick, "aria-label": "\u041E\u0442\u043A\u0440\u044B\u0442\u044C \u043C\u0435\u043D\u044E", children: jsx(Img, { image: { icon: 'BurgerIcon', iconVersion: bgColor === 'bg-white' ? 'black' : 'white' }, className: "text-primary-text w-6 h-6", width: "24", height: "24" }) }), jsx(Logo, { className: "mr-8", bgColor: bgColor, logo: logo })] }), jsx("button", { className: "text-primary-main group-data-transparent:text-white group-data-transparent:hover:text-primary-hover text-s border-0 bg-transparent", children: "\u0412\u043E\u0439\u0442\u0438" })] })));
+    const BUTTON_STYLE = {
+        default: 'px-5 bg-main-divider rounded hover:text-primary-main',
+        transparent: 'text-white hover:text-primary-hover',
+    };
+    const HeaderTop = JSX(({ bgColor, logo, internetBankUrl, version, mobileHeaderType, mobileTitle, mobileBackwardButtonTitle, }) => {
+        const isTypeNone = mobileHeaderType === 'none';
+        const isTypeWithTitle = mobileHeaderType === 'withTitle';
+        return (jsxs("div", { className: "flex items-center justify-between w-full", children: [isTypeNone || isTypeWithTitle ? (jsx(Logo, { bgColor: bgColor, logo: logo, showTitle: isTypeNone })) : null, isTypeWithTitle ? mobileTitle : null, mobileHeaderType === 'backwardButton' ? (jsxs(Button, { className: "flex items-center text-l", children: [jsx(Img, { className: "w-6 h-6", image: {
+                                icon: 'ChevronLeft',
+                                iconVersion: 'black',
+                            } }), mobileBackwardButtonTitle] })) : null, internetBankUrl ? (jsx(Button, { href: internetBankUrl, ariaLabel: "\u0412\u043E\u0439\u0442\u0438", target: "_blank", className: style('p-3 my-1 text-s whitespace-nowrap text-primary-main hover:text-primary-hover', BUTTON_STYLE[version === 'transparent' ? 'transparent' : 'default']), children: "\u0412\u043E\u0439\u0442\u0438" })) : null] }));
+    });
 
     const BG_COLOR_TO_BLOCK_VERSION = {
         'bg-white': 'primary',
         transparent: 'transparent',
     };
-    const Header = JSX(({ bgColor = 'bg-white', version = BG_COLOR_TO_BLOCK_VERSION[bgColor], ...rest }) => {
-        const router = useRouter();
+    const Header = JSX(({ bgColor = 'bg-white', version = BG_COLOR_TO_BLOCK_VERSION[bgColor], mobileHeaderType = 'none', ...rest }) => {
         const fallback = rest.options?.page?.fallback;
-        const { topItems, dispositions, defaultLocation, logo } = useSWRResource(projectSettings.SITEMAP || 'sitemap', fallback);
-        const activeTopItem = topItems?.find(isTopItemActive(router));
-        const subItems = activeTopItem?.items;
-        const activeSubItem = findActiveSubItem(router)(subItems);
-        const [burgerMenuShow, setBurgerMenuShow] = useState(false);
-        const handleBurgerMenuShow = useCallback(() => setBurgerMenuShow((_) => !_), []);
-        return (jsxs(BlockWrapper, { tag: "header", version: version, ...rest, children: [jsxs("div", { className: "container px-4 py-0 box-border", children: [jsx(HeaderTop, { onClick: handleBurgerMenuShow, bgColor: bgColor, logo: logo }), jsx("nav", { className: "flex items-center m-0 p-0 overflow-y-hidden w-full h-12", children: jsx("div", { className: "flex no-scrollbar horizontal-list h-full items-center", children: subItems?.map((_, i) => (jsx(HeaderItem, { className: "mr-8 whitespace-nowrap text-s", active: _ === activeSubItem, ..._ }, String(i)))) }) })] }), burgerMenuShow ? (jsx(HeaderBurger, { onClick: handleBurgerMenuShow, burgerSubMenu: dispositions, defaultLocation: defaultLocation, children: jsx("div", { className: "list-none m-0 p-0", children: topItems?.map((item, i) => (jsx(RollupItem, { label: item.text, children: jsx(LinkList, { className: "mt-2.5", items: item.items }) }, String(i)))) }) })) : null] }));
+        const { logo, internetBankUrl } = useSWRResource(projectSettings.SITEMAP || 'sitemap', fallback);
+        return (jsx(BlockWrapper, { tag: "header", version: version, ...rest, children: jsx("div", { className: "container px-4 py-1 box-border", children: jsx(HeaderTop, { bgColor: bgColor, logo: logo, internetBankUrl: internetBankUrl, version: version, mobileHeaderType: mobileHeaderType, ...rest }) }) }));
     });
 
     const ImgBlock = JSX((props) => {
@@ -1750,7 +1395,8 @@
         return (jsx("div", { className: style(richVersion, 'md-container'), dangerouslySetInnerHTML: { __html } }));
     });
 
-    const BaseTile = JSX(({ className, title = '', insetTitle = '', buttons, leftImage, rightImage, backImage, children, }) => (jsxs("div", { className: style('relative flex flex-col font-sans', className), children: [backImage ? jsx("div", { className: "absolute bottom-0 right-0 z-0", children: backImage }) : null, title, jsxs("div", { className: "grow relative flex flex-wrap justify-between items-stretch gap-8", children: [leftImage, jsxs("div", { className: style('flex flex-col gap-8', leftImage ? '' : 'grow'), children: [insetTitle, jsx("div", { className: "grow", children: children }), buttons] }), rightImage ? jsx("div", { className: "sm:-order-1 md:-order-1", children: rightImage }) : null] })] })));
+    const BaseTile = JSX(({ className, title = '', insetTitle = '', buttons, leftImage, rightImage, backImage, children, }) => (jsxs("div", { className: style('relative flex flex-col font-sans', className), children: [backImage ? jsx("div", { className: "absolute bottom-0 right-0 z-0", children: backImage }) : null, title, jsxs("div", { className: "grow relative flex flex-wrap sm:flex-nowrap justify-between items-stretch gap-8", children: [renderImageContainer(leftImage), jsxs("div", { className: style('flex flex-col gap-8', leftImage ? '' : 'grow'), children: [insetTitle, jsx("div", { className: "grow", children: children }), buttons] }), renderImageContainer(rightImage, { className: '-order-1 sm:order-1' })] })] })));
+    const renderImageContainer = (image, { className } = {}) => image ? jsx("div", { className: style('flex-none', className), children: image }) : null;
 
     const BenefitItem = JSX(({ className, icon, label, description, version = 'primary', benefitsVersion = 'normal' }) => (jsxs("div", { className: style('flex gap-5', description ? 'items-start' : 'items-center', className), children: [icon ? (jsx("div", { className: getBenefitIconBgStyle(version, benefitsVersion), children: jsx(Img, { className: "w-6 h-6", image: { ...icon, iconVersion: icon.iconVersion || benefitsVersion } }) })) : null, jsxs("div", { children: [label ? (jsx(Text, { size: "text-h6", color: "text-primary-text group-data-secondary:text-white", children: label })) : null, description ? (jsx(Paragraph, { size: "text-m-light", color: "text-secondary-text group-data-secondary:text-white", children: description })) : null] })] })));
     function getBenefitIconBgStyle(version, benefitsVersion) {
@@ -1769,7 +1415,7 @@
     const ProductBlockInner = JSX(({ className, version = 'primary', headlineVersion = 'L', title, description, benefits, benefitsVersion, items, isDotted = true, __html, buttons, image, directionRight = true, }) => {
         const benefitsWithLabel = benefits?.filter((_) => _.label);
         const img = image?.src ? jsx(Img, { className: "mt-[-50px]", image: image }) : null;
-        return (jsxs(BaseTile, { className: className, insetTitle: jsx(Headline, { className: "max-w-[600px] xl:max-w-[800px]", title: title, description: description, headlineVersion: headlineVersion, align: "text-left", isPadding: false }), ...(directionRight ? { rightImage: img } : { leftImage: img }), buttons: renderButtonsSection(buttons), children: [benefitsWithLabel?.length ? (jsx("div", { className: "flex flex-wrap gap-6", children: benefitsWithLabel.map(renderBenefit(version, benefitsVersion)) })) : null, __html ? (jsx("div", { className: "mt-5", children: jsx(RichText, { __html: __html }) })) : null, items?.length ? jsx(List, { className: "mt-5", items: items, isDotted: isDotted }) : null] }));
+        return (jsxs(BaseTile, { className: className, insetTitle: jsx(Headline, { className: "max-w-[600px] xl:max-w-[728px]", title: title, description: description, headlineVersion: headlineVersion, align: "text-left", isPadding: false }), ...(directionRight ? { rightImage: img } : { leftImage: img }), buttons: renderButtonsSection(buttons), children: [benefitsWithLabel?.length ? (jsx("div", { className: "flex flex-wrap gap-6", children: benefitsWithLabel.map(renderBenefit(version, benefitsVersion)) })) : null, __html ? (jsx("div", { className: "mt-5", children: jsx(RichText, { __html: __html }) })) : null, items?.length ? jsx(List, { className: "mt-5", items: items, isDotted: isDotted }) : null] }));
     });
 
     function renderBackwardButton({ text, href, target, icon }, version) {
@@ -1786,11 +1432,21 @@
                 ? renderBackwardButton(backwardButton, !rest.version || rest.version === 'primary' ? 'primary' : 'white')
                 : null, jsx(ProductBlockInner, { className: "grow", ...rest })] })));
 
+    const ProductGallery = JSX(({ className = '', slides = [], ...rest }) => {
+        const galleryBlocks = slides.map((s) => s.productBlock);
+        return (jsx(BlockWrapper, { className: `box-border py-6 overflow-hidden relative w-100 mb-6 ${className}`, ...rest, children: jsx(SwipeListControl, { gap: 0, padding: 0, children: galleryBlocks.map((_, i) => renderProductBlock({ ..._, ...rest }, i)) }) }));
+    });
+    const renderProductBlock = (block, i) => (jsx(ProductBlockInner, { className: "z-10 px-5 group-data-secondary:text-white", ...block }, String(i)));
+
     const RichTextBlock = JSX((props) => {
         const { __html, richVersion, ...rest } = props;
         return (jsx(BlockWrapper, { ...rest, children: jsx(RichText, { __html: __html, richVersion: richVersion }) }));
     });
 
+    function assertUnreachable(x) {
+        throw new Error(x);
+    }
+
     const checkCanRenderIcon = (icon) => Boolean(icon?.icon || icon?.src);
 
     const STEPS_BLOCK_STYLE = {
@@ -1943,8 +1599,18 @@
         RollupItem,
         VerticalLayout,
         CarouselRecommendationCard,
+        CarouselProgramsCard,
+        ProductGallery,
     };
 
+    function useBool(defaultValue = false) {
+        const [value, setValue] = useState(defaultValue);
+        const setTrue = useCallback(() => setValue(true), []);
+        const setFalse = useCallback(() => setValue(false), []);
+        const toggle = useCallback(() => setValue((_) => !_), []);
+        return [value, { setValue, setTrue, setFalse, toggle }];
+    }
+
     const debounce = (fn, delay = 600) => {
         let timerId;
         const debouncedCallback = (...args) => {
@@ -2000,6 +1666,53 @@
         }, [scrollTarget]);
     }
 
+    const CloseButton = JSX(({ className, onClick }) => (jsx("button", { className: style('flex justify-center items-center w-12 h-12 p-1 bg-transparent border-none', className), onClick: onClick, title: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C", children: jsx(Img, { image: { icon: 'CloseIcon' }, width: "24", height: "24" }) })));
+
+    function useDialogHandlers({ onOpen, onClose } = {}) {
+        useEffect(() => defaultEventBus.subscribe('dialog', (action) => {
+            switch (action.type) {
+                case 'open':
+                    onOpen && onOpen(action);
+                    break;
+                case 'close':
+                    onClose && onClose();
+                    break;
+                default:
+                    assertUnreachable(action);
+            }
+        }), [onOpen, onClose]);
+    }
+
+    function useDialogProps(id, initOpen = false) {
+        const [isOpened, { setTrue: open, setFalse: close }] = useBool(initOpen);
+        const [params, setParams] = useState({ id });
+        const wasOpened = useRef(isOpened);
+        wasOpened.current ||= isOpened;
+        const handleOpen = useCallback((_) => {
+            if (_.id === id) {
+                setParams(_);
+                open();
+            }
+            else {
+                close();
+            }
+        }, [id]);
+        useDialogHandlers({
+            onOpen: handleOpen,
+            onClose: close,
+        });
+        const handleCloseAsEventSource = useCallback(() => {
+            close();
+            defaultEventBus.fire('dialog', { type: 'close' });
+        }, []);
+        return {
+            ...params,
+            isOpened,
+            wasOpened: wasOpened.current,
+            onClose: handleCloseAsEventSource,
+        };
+    }
+
     const COOKIE_DIALOG_ID = 'cookie';
     const LOCAL_STORAGE_NAME = 'cookieClose';
     const CookiePopup = JSX(({ termLink, personalDataPolicyLink }) => {
@@ -2087,7 +1800,7 @@
 
     const joinList = (sep) => (list) => list.reduce((acc, el, i) => (acc.length ? acc.concat({ ...sep, key: `sep-${i}` }, el) : [el]), []);
 
-    const packageVersion = "0.11.0";
+    const packageVersion = "0.11.2";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;