@redneckz/wildless-cms-uni-blocks 0.14.124 → 0.14.126

package/mobile/bundle/bundle.umd.js

@@ -863,11 +863,10 @@
     };
 
     const EMPTY_VALUE$5 = {};
-    const DEFAULT_FOLDER_NAME = 'wcms-resources';
+    const DEFAULT_PATH_DIR = '/wcms-resources';
     function useSWRResource(filename, options = {}) {
-        const { fallback = EMPTY_VALUE$5, folderName = DEFAULT_FOLDER_NAME, setBasePath = false } = options;
-        const path = joinPath('/', setBasePath ? projectSettings.BASE_PATH : '', folderName, `${filename}.json`);
-        const { data } = useAsyncData(filename ? path : null, fetchJSONUnsafe, {
+        const { fallback = EMPTY_VALUE$5, pathDir = DEFAULT_PATH_DIR } = options;
+        const { data } = useAsyncData(filename ? `${pathDir}/${filename}.json` : null, fetchJSONUnsafe, {
             fallback,
         });
         return data || EMPTY_VALUE$5;
@@ -3689,7 +3688,10 @@
     };
     const Header = JSX(({ bgColor = 'bg-white', version = BG_COLOR_TO_BLOCK_VERSION[bgColor], ...rest }) => {
         const { logo } = useSitemap(rest.options?.page?.fallback);
-        const { internetBankUrl } = useSWRResource(projectSettings.PORTAL_DATA || 'portal-data', { folderName: 'portal-resources', setBasePath: true });
+        const { internetBankUrl } = useSWRResource(projectSettings.PORTAL_DATA || 'portal-data', {
+            fallback: rest.options?.page?.fallback,
+            pathDir: joinPath(projectSettings.BASE_PATH, 'portal-resources'),
+        });
         return (jsx(BlockWrapper, { tag: "header", defaultPadding: "", version: version, ...rest, children: jsx("div", { className: "container px-lg py-2xs box-border", children: jsx(HeaderTop, { bgColor: bgColor, logo: logo, internetBankUrl: internetBankUrl, version: version, ...rest }) }) }));
     });
 
@@ -4562,802 +4564,805 @@
     };
     const getIconSizeStyle = (size) => (size === 'normal' ? '38' : '24');
 
-    const isHrefActive = (router) => ({ href }) => !href ? false : withoutQuery(getRouterHref(href, router)).startsWith(withoutQuery(href));
-    const getRouterHref = (href, router) => isURL(href) ? router.href : router.pathname;
-
-    const isTopItemActive = (router) => isHrefActive(projectSettings.BASE_PATH ? { pathname: projectSettings.BASE_PATH } : router);
-
-    function useActiveRoute(items = []) {
-        const router = useRouter();
-        const activeIndex = items.findIndex(isTopItemActive(router));
-        return [activeIndex, items[activeIndex]];
-    }
-
-    const StickyBottomMenuBurger = JSX(({ isActive, onClick }) => (jsxs("button", { className: style(isActive ? 'text-primary-main' : 'text-primary-text', `w-10 m-4 flex justify-center items-center flex-col text-xs cursor-pointer`), onClick: onClick, children: [jsx(Icon, { className: "w-6 h-6", name: "BurgerIcon", iconVersion: isActive ? 'color' : 'black' }), "\u041C\u0435\u043D\u044E"] })));
-
-    const StickyBottomMenuItem = JSX(({ isActive, item, onClick }) => {
-        const link = useLink({ isRemote: true });
-        const { href, onClick: handleClick } = link({ href: item?.href, onClick });
-        return (jsxs("a", { className: style(isActive ? 'text-primary-main' : 'text-primary-text', `w-10 m-4 flex justify-center items-center flex-col text-xs cursor-pointer`), href: href, target: "_self", title: item?.title || '', onClick: handleClick, children: [jsx(Icon, { className: "w-6 h-6", name: item?.icon?.icon, iconVersion: isActive ? 'color' : 'black' }), item?.title || ''] }));
-    });
-
-    const isDialogOpen = (id, dialogs) => dialogs.find((item) => item.id === id, id);
-
-    function useList(initialList = []) {
-        const [list, setList] = useState(initialList);
-        const push = useCallback((item) => setList(_ => [..._, item]), []);
-        const pop = useCallback(() => setList(_ => _.slice(0, -1)), []);
-        const remove = useCallback((item) => setList(_ => _.filter(currentItem => currentItem !== item)), []);
-        const clear = useCallback(() => setList([]), []);
-        return [list, { setList, push, pop, remove, clear }];
-    }
-
-    const useDialogsList = ({ onCloseAll, onClose, } = {}) => {
-        const [dialogs, { push, pop, clear }] = useList();
-        const closeAll = useCallback(() => {
-            onCloseAll && onCloseAll(dialogs);
-            clear();
-        }, [dialogs, onCloseAll]);
-        const close = useCallback(() => {
-            onClose && onClose(dialogs[dialogs.length - 1]);
-            pop();
-        }, [dialogs, onClose]);
-        useEffect(() => defaultEventBus.subscribe('dialog', (action) => {
-            switch (action.type) {
-                case 'open':
-                    push(action);
-                    break;
-                case 'close':
-                    if (action.all) {
-                        closeAll();
-                    }
-                    else {
-                        close();
-                    }
-                    break;
-                default:
-                    assertUnreachable(action);
-            }
-        }), [closeAll, close]);
-        return dialogs;
-    };
-
-    const CloseButton = JSX(({ className, onClose }) => (jsx("button", { className: style('flex justify-center items-center w-12 h-12 p-2xs bg-transparent border-none', className), onClick: onClose, title: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C", children: jsx(Img, { image: { icon: 'CloseIcon' }, width: "24", height: "24" }) })));
-
-    const Dialog = JSX(({ className, head, children, onClose }) => {
-        const { close } = useDialogManager();
-        const handleClose = useCallback(() => {
-            close();
-            onClose && onClose();
-        }, [onClose]);
-        return (jsxs("div", { className: style('relative min-h-full bg-white pt-0 p-5', className), children: [jsxs("div", { className: "sticky py-xl top-0 bg-white z-10", children: [jsx(CloseButton, { className: "absolute top-0 right-0", onClose: handleClose }), jsx("div", { className: "container", children: head })] }), jsx("div", { className: "container pb-6xl", children: children })] }));
+    const scrollButtonStyle = 'hidden sm:flex absolute z-40 top-0';
+    const ScrollableTabsControl = JSX(({ className, items = [], value, onChange, tabsType }) => {
+        const [containerRef, scroll] = useSwipeListScroll({
+            itemCount: items?.length || 0,
+        });
+        return (jsxs("div", { className: style('relative overflow-x-auto no-scrollbar', className), role: "tablist", children: [jsx(SwipeListContainer, { containerRef: containerRef, snapAlign: "snap-start", onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: items.map(renderTab(value, onChange, tabsType)) }), scroll.canScrollLeft ? (jsx(ScrollLeftButton, { className: style('left-6', scrollButtonStyle), onClick: scroll.scrollLeft })) : null, scroll.canScrollRight ? (jsx(ScrollRightButton, { className: style('right-6', scrollButtonStyle), onClick: scroll.scrollRight })) : null] }));
     });
 
-    const REGIONS_URL = '/api/v1/regions';
-    function useRegions() {
-        const { data } = useAsyncData(REGIONS_URL, fetchJSONUnsafe);
-        return data || [];
-    }
-
-    const groupBy = (list, keyGetter) => {
-        const result = new Map();
-        for (const item of list) {
-            const key = keyGetter(item);
-            const group = result.get(key) || [];
-            result.set(key, [...group, item]);
+    const renderTabs = ({ tabsMode, ...props }) => {
+        switch (tabsMode) {
+            case 'wideScreen':
+                return jsx(TabsControl, { ...props });
+            case 'centered':
+                return (jsx("div", { className: "flex", children: jsx(TabsControl, { className: "m-auto p-xs rounded-md bg-main-gray", tabsType: "rounded", ...props }) }));
+            case 'scrollable':
+                return (jsx("div", { className: "flex", children: jsx(ScrollableTabsControl, { className: "m-auto", tabsType: "underlined", ...props }) }));
+            default:
+                return null;
         }
-        return result;
     };
 
-    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 = Array.from({ length: s1.length });
-        const s2Matches = Array.from({ length: 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;
+    const TAB_QUERY_PARAM_KEY = 'tab';
+    const Tabs = JSX(({ className = '', isSticky, tabs = [], tabsMode, ...rest }) => {
+        const router = useRouter();
+        const { isReady } = router;
+        const tabsControlItems = useMemo(() => tabs.map(normalizeTab), [tabs]);
+        const [activeTabIndex, setActiveTabIndex] = useState(0);
+        useEffect(() => {
+            if (!tabs || !tabs[0]) {
+                return;
             }
-        }
-        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;
+            const defaultTabIndex = router.query[TAB_QUERY_PARAM_KEY]
+                ? tabs.findIndex((_) => _.type === 'group' && _.ref === router.query[TAB_QUERY_PARAM_KEY]) || 0
+                : 0;
+            const defaultTab = tabs[defaultTabIndex] || tabs[0];
+            setActiveTabIndex(defaultTabIndex);
+            fireTabEvent(defaultTab);
+        }, [isReady]);
+        useEffect(() => {
+            const activeTab = tabs[activeTabIndex];
+            if (activeTab?.type === 'group') {
+                defaultEventBus.subject('tab', {
+                    type: activeTab.type,
+                    label: activeTab.ref,
+                    groupName: activeTab.name,
+                });
             }
-            let j = k;
-            for (; j < s2.length; j++) {
-                if (s2Matches[j]) {
-                    k = j + 1;
-                    break;
-                }
+        }, [tabs, activeTabIndex]);
+        const updateUrlSearchTabParam = (_) => {
+            const searchParams = new URLSearchParams(router.query);
+            if (_.name) {
+                searchParams.set(TAB_QUERY_PARAM_KEY, _.name);
             }
-            if (s1[i] !== s2[j]) {
-                t++;
+            else {
+                searchParams.delete(TAB_QUERY_PARAM_KEY);
+            }
+            router.replace(`${router.pathname}?${searchParams}`, '', { scroll: false });
+        };
+        const handleChange = useCallback((_) => {
+            const index = tabsControlItems.indexOf(_);
+            const tab = tabs[index];
+            setActiveTabIndex(index);
+            fireTabEvent(tab);
+            if (tab.type === 'group') {
+                updateUrlSearchTabParam(_);
             }
+        }, [tabs, tabsControlItems]);
+        return (jsx(BlockWrapper, { className: style(isSticky ? 'sticky top-1 z-20' : '', className), defaultPadding: "p-0", ...rest, children: renderTabs({
+                items: tabsControlItems,
+                value: tabsControlItems[activeTabIndex],
+                tabsMode,
+                onChange: handleChange,
+            }) }));
+    });
+    const fireTabEvent = (tab) => {
+        if (tab.type === 'group') {
+            defaultEventBus.fire('tab', { type: tab.type, label: tab.ref, groupName: tab.name });
         }
-        return t;
-    }
-    function computePrefixL(s1, s2) {
-        let prefixL = 0;
-        while (s1[prefixL] === s2[prefixL] && prefixL < JARO_WINKLER_MAX_L) {
-            prefixL++;
+        if (tab.type === 'link') {
+            defaultEventBus.fire('tab', { type: tab.type, label: tab.href });
         }
-        return prefixL;
-    }
+    };
+    const normalizeTab = (_) => _?.type === 'group' ? { text: _.title, name: _.ref } : _;
 
-    const renderForeignOffices = (foreignOffices) => foreignOffices?.length ? (jsxs("div", { className: "sm:border-t sm:border-main-divider mt-2xs pt-2xs", children: [jsx("div", { className: "mb-m", children: jsx(Text, { size: "text-m", font: "font-light", color: "text-secondary-text", children: "\u041F\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u0435\u043B\u044C\u0441\u0442\u0432\u0430 \u0437\u0430 \u0440\u0443\u0431\u0435\u0436\u043E\u043C:" }) }), jsx("div", { className: "flex flex-col sm:flex-row gap-5xl", children: foreignOffices.map((office, i) => (jsx(ForeignOffice, { ...office }, String(i)))) })] })) : null;
-    const ForeignOffice = JSX(({ icon, ...rest }) => {
-        const link = useLink();
-        const { text, target, href, onClick } = link(rest);
-        return (jsxs("div", { className: "flex gap-s items-center", children: [icon ? jsx(Img, { pathPrefix: "/wcms-resources/", image: icon }) : null, text ? (jsx("a", { className: "hover:text-primary-hover", href: href, target: target, onClick: onClick, children: jsx(Text, { size: "text-l", font: "font-light", color: "text-primary-text", children: text }) })) : null] }));
-    });
+    const dividerStyle = '@4xl:border-main-divider @4xl:border-b';
+    const firstCellStyle = 'w-80 flex-shrink-0';
+    const COLS_LENGTH_FOR_SCROLL = 2;
+    const COLUMN_WIDTH$1 = 4 * 80 + 40; // w-80 + pl-10 = 360px
 
-    const renderRegion = (onChangeLocation) => (region) => (jsx("div", { className: "mb-xs sm:mb-2xs", children: jsx("button", { className: "cursor-pointer hover:text-primary-hover", onClick: () => {
-                onChangeLocation && onChangeLocation(region);
-            }, children: jsx(Text, { size: "text-l", font: "font-light", children: region.name || '' }) }) }, region.id));
+    const carouselContainerClassesMap = {
+        comparison: 'flex gap-m duration-1000',
+        tariff: 'flex gap-5xl flex-grow duration-1000',
+    };
+    const TableCarouselContainer = JSX(({ children, activeIndex, columnWidth, version = 'comparison' }) => (jsx("div", { className: "flex flex-1 overflow-hidden", children: jsx("div", { className: carouselContainerClassesMap[version], style: { transform: `translateX(-${activeIndex * columnWidth}px)` }, children: children }) })));
 
-    const renderRegionGroup = (onChangeLocation) => ([letter, regions]) => (jsxs("div", { className: "break-inside-avoid mb-2xl w-56", children: [jsx("div", { className: "mb-s", children: jsx(Text, { size: "text-h6", children: letter }) }), regions.map(renderRegion(onChangeLocation))] }, letter));
+    const TableInnerButton = JSX(({ className = '', isOpen, onClick }) => (jsx(LinkButton, { className: className, appendRight: jsx(Img, { image: { icon: isOpen ? 'ArrowUpIcon' : 'ArrowDownIcon' }, width: "20", height: "20" }), text: isOpen ? 'Скрыть' : 'Показать', version: "gray", onClick: onClick })));
 
-    const SearchBar$1 = JSX(({ className, searchTerm, onSearch }) => {
-        return (jsxs("form", { className: `font-sans relative ${className}`, children: [jsx("div", { className: "absolute rounded h-full flex items-center justify-center pl-m max-w-44 gap-s pointer-events-none", children: searchTerm ? null : (jsx("label", { htmlFor: "search-bar-input", className: `text-secondary-text `, children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0444\u0438\u043B\u0438\u0430\u043B\u0430\u043C" })) }), jsx("input", { id: "search-bar-input", className: `h-12 pl-m w-full peer text-l text-black border border-solid rounded-md box-border
-              outline-none border-gray hover:border-primary-hover active:border-primary-text focus:border-primary-text`, value: searchTerm, onChange: (e) => onSearch(e.target.value.toLowerCase()), type: "text", name: "location-search-bar-input" })] }));
+    const renderButtonsCellData = ({ buttons }) => renderButtonsSection(buttons, {
+        buttonClassName: 'basis-0',
     });
+    const renderLabelDescriptionCellData = ({ label, description }) => (jsxs("div", { className: "space-y-2xs", children: [label ? (jsx("div", { children: jsx(Text, { size: "text-h6", children: label }) })) : null, description ? (jsx("div", { children: jsx(Text, { size: "text-l", color: "text-secondary-text", children: description }) })) : null] }));
+    const renderImgCellData = ({ image }) => (image?.src ? jsx(Img, { image: image }) : null);
+    const renderListCellData = ({ isDotted, ...rest }) => (jsx(List, { className: "flex flex-col justify-between items-start text-h6", isDotted: isDotted ?? true, ...rest }));
+    const renderInnerTableCellData = ({ isVisible, displayTable, dataUrl, pdfUrl, isOpen, }) => isVisible ? (jsx(TableInnerButton, { isOpen: isOpen, onClick: () => {
+            displayTable({ dataUrl, pdfUrl });
+        } })) : null;
+    const EmbeddableCellData = {
+        Buttons: renderButtonsCellData,
+        Img: renderImgCellData,
+        List: renderListCellData,
+        LabelDescription: renderLabelDescriptionCellData,
+        Table: renderInnerTableCellData,
+    };
 
-    const SEARCH_TERM_MIN_LENGTH = 3;
-    const LocationDialog = JSX(() => {
-        const { defaultLocation, foreignOffices } = useSitemap();
-        const [currentLocation, selectCurrentLocation] = useLocation(defaultLocation);
-        const [query, setQuery] = useState('');
-        const regions = cleanUpRegions(useRegions()).sort((a, b) => a.name.localeCompare(b.name));
-        const regionsGroupByLetter = groupBy(regions, regionFirstLetter);
-        const { close } = useDialogManager();
-        const handleChangeLocation = useCallback((region) => {
-            selectCurrentLocation(region);
-            close();
-        }, []);
-        return (jsxs(Dialog, { className: "pb-20", head: jsxs("div", { children: [jsx(Text, { size: "text-h4", color: "text-primary-text", children: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0438\u043B\u0438\u0430\u043B" }), currentLocation ? (jsxs("div", { className: "mb-s", children: [jsx(Text, { size: "text-l", font: "font-light", children: "\u0421\u0435\u0439\u0447\u0430\u0441 \u0432\u044B\u0431\u0440\u0430\u043D:\u00A0" }), jsx("button", { onClick: () => selectCurrentLocation(currentLocation), children: jsx(Text, { color: "text-primary-main", children: currentLocation.name }) })] })) : null, jsx(SearchBar$1, { onSearch: setQuery, searchTerm: query })] }), children: [query && query.length >= SEARCH_TERM_MIN_LENGTH ? (jsx("div", { children: regions
-                        .filter(({ name }) => name && jaroWinklerDistance(name.toLowerCase())(query.toLowerCase()) >= 0.8)
-                        .map(renderRegion(handleChangeLocation)) })) : (jsx("div", { className: "columns-1 sm:columns-5", children: Array.from(regionsGroupByLetter.entries()).map(renderRegionGroup(handleChangeLocation)) })), renderForeignOffices(foreignOffices)] }));
-    });
-    const regionFirstLetter = (region) => region.name?.charAt(0) || '';
-    const cleanUpRegions = (regions) => regions.map((region) => ({
-        ...region,
-        name: region.name?.replace(/республика|область|край'/gi, '').trim() || '',
-    }));
-
-    const useLocationDialog = () => {
-        const { open, close } = useDialogManager();
-        return {
-            open: (options = {}) => open(jsx(LocationDialog, {}), options),
-            close,
+    const RenderCellInner = JSX(({ cell, fieldIdx, rowIdx, cellIdx, setTableInner, tableInner, openTableInnerIdx, setOpenTableInnerIdx, }) => {
+        const [isVisible, setVisibility] = useState(true);
+        useEffect(() => {
+            if (cellIdx !== openTableInnerIdx || !tableInner) {
+                setVisibility(true);
+            }
+        }, [tableInner, openTableInnerIdx]);
+        const displayTable = (props) => {
+            setVisibility(false);
+            setOpenTableInnerIdx(cellIdx);
+            setTableInner(props);
         };
+        return renderCell({
+            cell,
+            cellProps: {
+                rowIdx,
+                cellIdx,
+                fieldIdx,
+                displayTable,
+                isVisible,
+            },
+        });
+    });
+    const renderCell = ({ cell, cellProps }) => {
+        if (!cell) {
+            return null;
+        }
+        const { tableCellType: type, ...rest } = cell;
+        if (!type || !(type in EmbeddableCellData)) {
+            return null;
+        }
+        const EmbeddableCellInner = EmbeddableCellData[type];
+        return jsx(EmbeddableCellInner, { ...cellProps, ...rest });
     };
 
-    const SearchInput = JSX(({ className, value, autoFocus, onChange, onFocus, placeholder = 'Поиск по сайту' }) => {
-        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-m pointer-events-none", children: jsx(Img, { image: { icon: 'LoupeIcon', iconVersion: 'black' }, width: "24", height: "24" }) }), jsx("input", { className: style('h-14 w-full px-10 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: placeholder, autoFocus: autoFocus, onChange: handleChange, onFocus: onFocus })] }));
+    const TariffsTableCell = JSX(({ cells, rowIdx, cellIdx, setTableInner, tableInner, openTableInnerIdx, setOpenTableInnerIdx, }) => {
+        return (jsx("div", { className: "w-80 flex-grow flex flex-col gap-m @4xl:gap-lg", role: "cell", children: cells?.length
+                ? cells.map((_, i) => (jsx(RenderCellInner, { cell: _, fieldIdx: i, rowIdx: rowIdx, cellIdx: cellIdx, setTableInner: setTableInner, tableInner: tableInner, openTableInnerIdx: openTableInnerIdx, setOpenTableInnerIdx: setOpenTableInnerIdx }, String(i))))
+                : null }));
     });
 
-    function useDebouncedEffect(effect, deps, delay = 300) {
-        useEffect(() => {
-            const timerId = globalThis.setTimeout(effect, delay);
-            return () => {
-                globalThis.clearTimeout(timerId);
-            };
-        }, deps);
-    }
-
-    const compareBy = (indexOf) => (a, b) => indexOf(a) - indexOf(b);
-    const desc = (cmp) => (a, b) => -cmp(a, b);
+    const COLUMN_WIDTH = 140;
+    const getHorizontalShift = (columns, activeColumnIndex) => sum(columns.slice(0, activeColumnIndex).map((_) => _?.cols?.length ?? 1)) * COLUMN_WIDTH;
 
-    const joinMaps = (aggregate, emptyVal) => (acc, map) => {
-        for (const [key, b] of map) {
-            acc.set(key, aggregate(acc.get(key) || emptyVal, b));
+    const renderInnerTableRow = (activeColumnIndex) => (rowData, rowIdx) => {
+        if (!rowData?.length) {
+            return null;
         }
-        return acc;
+        const [headerColumn, ...columns] = rowData;
+        const columnsStyle = style('flex duration-1000 text-center', rowIdx !== 0 ? 'font-normal' : 'font-light');
+        return (jsxs("div", { className: "flex border-main-divider border-b border-solid h-full", children: [headerColumn?.data ? (jsx("div", { className: "text-xl font-light w-56 min-w-56 py-lg", children: headerColumn.data })) : null, jsx("div", { className: "flex flex-grow overflow-hidden", children: jsx("div", { className: columnsStyle, style: {
+                            transform: `translateX(-${getHorizontalShift(columns, activeColumnIndex)}px)`,
+                        }, children: columns?.map((_, i) => (jsxs("div", { className: "flex flex-col flex-grow gap-s justify-center py-xl odd:bg-main-divider", children: [_?.data ? jsx("div", { className: "text-xl font-light", children: _.data }) : null, _?.cols ? renderCols(_.cols, activeColumnIndex) : null] }, `row${i}`))) }) })] }, String(rowIdx)));
     };
+    const renderCols = (cols, rowIndex) => cols?.length > 0 ? (jsx("div", { className: style('flex', rowIndex === 0 ? 'text-secondary-text' : ''), children: cols.map((data, i) => (jsx("div", { className: "w-20 text-h6 mx-lg", children: data }, String(i)))) })) : null;
 
-    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 InnerTableBodyItem = JSX(({ rows }) => (jsx(SwipeListContainer, { visibleItemCount: 0, snapAlign: "snap-start", children: jsx("div", { children: rows?.map(renderInnerTableRow(0)) }) })));
 
-    const textRank = (queryTokens) => (text) => {
-        const textTokens = tokenize(text || '');
-        return textTokens.length
-            ? sum(queryTokens.map((qToken) => max(textTokens.map(jaroWinklerDistance(qToken)))))
-            : 0;
-    };
+    const InnerTableBody = JSX(({ activeTabIndex, items }) => {
+        return (jsx("div", { children: items.map((_, tableIdx) => {
+                const key = `activeTabIdx:${activeTabIndex}-tableIdx:${tableIdx}`;
+                return (jsxs("div", { className: "w-full @container", children: [jsx("div", { className: "flex p-m bg-white @4xl:bg-gray text-center justify-center relative", children: jsx(Text, { size: "text-xl", font: "font-light", children: _.title }) }), jsx("div", { className: "w-full pl-xs overflow-hidden transition-height duration-500 ease-in-out", children: jsx("div", { className: "relative", children: jsx(InnerTableBodyItem, { rows: _.rowsData }) }) })] }, key));
+            }) }));
+    });
 
-    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 linkButtonVersion = 'link';
 
-    const SEARCH_INDEX_FILENAME = 'search.index.json';
-    const useSearch = ({ basePathList, initialQuery = '', }) => {
-        const [query, setQuery] = useState(initialQuery || '');
-        useEffect(() => {
-            if (initialQuery !== undefined && initialQuery !== null) {
-                setQuery(initialQuery);
-            }
-        }, [initialQuery]);
-        const { data } = useAsyncData(basePathList?.length ? basePathList : null, 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 InnerTableHeader = JSX(({ currencies, linkToPDF, activeTabIndex, setActiveTabIndex }) => (jsxs("div", { className: "flex justify-between items-center w-full py-lg", children: [currencies && currencies.length > 1 ? (jsx("div", { className: "flex bg-secondary-light p-2xs rounded-md", children: currencies.map((currency, idx) => (jsx("div", { className: `rounded-md text-xl font-light px-4 py-3 cursor-pointer ${idx === activeTabIndex ? 'bg-primary-main text-white' : 'text-secondary-text'}`, onClick: () => setActiveTabIndex(idx), children: currency || idx + 1 }, currency))) })) : null, linkToPDF ? (jsx(LinkButton, { className: "text-primary-main", href: linkToPDF, version: linkButtonVersion, target: "_blank", appendLeft: jsx(Icon, { name: "DocDownloadIcon", iconVersion: "color", className: "mr-3xs", width: "20", height: "20" }), text: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0432 PDF" })) : null] })));
 
-    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 FOOTER_AREA_KEYS = ['all', 'footer'];
-    const renderColumn = (menuItem, index) => {
-        const { text, items = [], href, target, onClick } = menuItem;
-        const visibleSubItems = items.filter((_) => !_.displayArea || FOOTER_AREA_KEYS.includes(_.displayArea.toLowerCase()));
-        return (jsxs("div", { className: "flex flex-col gap-s 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}` }), visibleSubItems.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 font-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}` }));
+    function useTariffsInnerTableData(directoryName) {
+        const { data } = useAsyncData(tariffsInnerTableDataUrl(directoryName), fetchTariffsInnerTableData);
+        return data || {};
+    }
+    async function fetchTariffsInnerTableData(url) {
+        const response = await fetch(url);
+        return await response.json();
+    }
+    function tariffsInnerTableDataUrl(directoryName) {
+        return `/wcms-resources/${directoryName || 'tariffs-inner-table-data'}.json`;
+    }
+
+    const EMPTY_DATA = 'Данных нет';
+    const InnerTable = JSX(({ dataUrl, pdfUrl, onClick }) => {
+        const { tableData } = useTariffsInnerTableData(dataUrl);
+        const [activeTabIndex, setActiveTabIndex] = useState(0);
+        const handleActiveTabIndex = useCallback((_) => setActiveTabIndex(_), []);
+        const items = tableData?.[activeTabIndex]?.items ?? [];
+        const currencies = tableData?.map((item) => item.currency ?? '');
+        return tableData ? (jsxs("div", { className: "bg-white z-10", children: [jsx(InnerTableHeader, { currencies: currencies, activeTabIndex: activeTabIndex, setActiveTabIndex: handleActiveTabIndex, linkToPDF: pdfUrl }), jsx(InnerTableBody, { activeTabIndex: activeTabIndex, items: items }), jsx(TableInnerButton, { className: "mt-xl", onClick: onClick, isOpen: true })] })) : (jsxs("div", { className: "my-lg space-y-m text-h6 text-center", children: [jsx("p", { children: EMPTY_DATA }), jsx(TableInnerButton, { onClick: onClick, isOpen: true })] }));
     });
 
-    const SearchDialog = JSX(({ initialQuery }) => {
-        const { topItems } = useSitemap();
-        const basePathList = useMemo(() => topItems?.map((_) => _.href || '/'), [topItems]);
-        const [searchResult, searchInputProps] = useSearch({
-            basePathList,
-            initialQuery,
-        });
-        const searchItems = useMemo(() => combineTopItemsAndSearchResult(topItems)(searchResult), [topItems, searchResult]);
-        useEffect(() => printSearchItems(searchItems), [searchItems]); // Temp
-        return (jsx(Dialog, { head: jsx(SearchInput, { autoFocus: true, ...searchInputProps }), children: jsx(Sitemap, { topItems: searchItems }) }));
+    const TariffsTableRowContainer = JSX(({ children, tableInner, onHideContentClick }) => (jsxs("div", { className: "self-start flex flex-col", role: "row", children: [jsx("div", { className: style(dividerStyle, 'flex flex-col @4xl:flex-row gap-y-xs gap-x-5xl pb-lg @4xl:pt-lg'), children: children }), tableInner ? (jsx("div", { className: "origin-top animate-expansion", children: jsx(InnerTable, { ...tableInner, onClick: onHideContentClick }) })) : null] })));
+
+    const TariffsTableRow = JSX(({ row: { header, data }, activeIndex, rowIdx, ...rest }) => {
+        const [tableInner, setTableInner] = useState(undefined);
+        const handleSetTableInner = useCallback((_) => setTableInner(_), []);
+        const [openTableInnerIdx, setOpenTableInnerIdx] = useState(undefined);
+        const handleOpenTableInnerIdx = useCallback((_) => setOpenTableInnerIdx(_), []);
+        const onHideContentClick = () => setTableInner(undefined);
+        return (jsxs(TariffsTableRowContainer, { onHideContentClick: onHideContentClick, tableInner: tableInner, ...rest, children: [jsx("div", { className: style('text-s', firstCellStyle), children: jsxs("div", { className: "flex gap-m items-center text-primary-text", role: "cell", children: [header?.icon ? (jsx(Img, { className: "hidden @4xl:block max-w-6 shrink-0", image: header.icon, width: "24", height: "24" })) : null, header?.title ? (jsx(Text, { size: "text-m", font: "font-light", children: header?.title })) : null] }) }), data?.length ? (jsx(TableCarouselContainer, { activeIndex: activeIndex, columnWidth: COLUMN_WIDTH$1, version: "tariff", children: data.map((cells, i) => (jsx(TariffsTableCell, { cells: cells, rowIdx: rowIdx, cellIdx: i, setTableInner: handleSetTableInner, tableInner: tableInner, openTableInnerIdx: openTableInnerIdx, setOpenTableInnerIdx: handleOpenTableInnerIdx, ...rest }, String(i)))) })) : null] }));
     });
-    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();
+
+    /** @deprecated */
+    function renderArrows({ dec, inc, canDec, canInc, btnClass, className = '', }) {
+        const isVisible = canDec || canInc;
+        if (!isVisible) {
+            return null;
         }
+        return (jsxs("div", { children: [canDec ? (jsx(ArrowButton, { className: style('absolute z-40', btnClass[0], className), onClick: dec, ariaLabel: "\u041F\u0440\u043E\u043B\u0438\u0441\u0442\u0430\u0442\u044C \u0432\u043B\u0435\u0432\u043E", "data-block-control": "scroll-left", disabled: !canDec })) : null, canInc ? (jsx(ArrowButton, { className: style('absolute z-40 rotate-180', btnClass[1], className), onClick: inc, ariaLabel: "\u041F\u0440\u043E\u043B\u0438\u0441\u0442\u0430\u0442\u044C \u0432\u043F\u0440\u0430\u0432\u043E", "data-block-control": "scroll-right", disabled: !canInc })) : null] }));
     }
 
-    const useSearchDialog = () => {
-        const { open, close } = useDialogManager();
-        return {
-            open: (props = {}, options = {}) => open(jsx(SearchDialog, { ...props }), options),
-            close,
-        };
-    };
-
-    const MIN_QUERY_LEN = 3;
-    const SearchBar = JSX(({ className }) => {
-        const [value, setValue] = useState('');
-        const resetQueryOnDialogClose = useCallback(() => setValue(''), []);
-        const { open } = useSearchDialog();
-        const handleInitialInputChange = useCallback((_) => {
-            setValue(_);
-            if (isQueryLongEnough(_)) {
-                open({ initialQuery: _ }, { onClose: resetQueryOnDialogClose });
-            }
-        }, [resetQueryOnDialogClose]);
-        return (jsxs("div", { className: style('relative', className), children: [jsx(SearchInput, { value: value, onChange: handleInitialInputChange }), jsx(CloseButton, { className: "absolute top-0 right-0 sm:hidden", onClose: resetQueryOnDialogClose })] }));
+    const TariffsTableWrapper = JSX(({ children, controls }) => {
+        const { isScrollAvailable } = controls;
+        return (jsxs("div", { role: "table", children: [jsxs("div", { className: "relative space-y-xs", children: [children, renderArrows({
+                            ...controls,
+                            btnClass: ['top-28', 'top-11'],
+                            className: 'right-7',
+                        })] }), isScrollAvailable ? (jsx("div", { className: "absolute top-0 right-0 bottom-0 w-20 bg-opacity-to-white" })) : null] }));
     });
-    const isQueryLongEnough = (_) => _ && _.length >= MIN_QUERY_LEN;
 
-    const ActiveSubMenuItem = JSX(({ item, basePath }) => {
-        const isAnotherPortal = projectSettings.BASE_PATH && basePath ? !projectSettings.BASE_PATH.startsWith(basePath) : false;
-        const link = useLink({ isRemote: isAnotherPortal, basePath });
-        const { href, target, onClick } = link(item);
-        const router = useRouter();
-        const isActive = isHrefActive(router)({ href });
-        return (jsxs("a", { className: style(isActive ? 'text-primary-main' : 'text-primary-text', `py-3 text-h5 font-light flex justify-between cursor-pointer`), href: href, target: target, onClick: onClick, children: [item.text, jsx(Img, { image: { icon: 'ChevronLeftIcon', iconVersion: 'black' }, width: "24", height: "24", className: "text-secondary-text rotate-180 opacity-30" })] }));
+    const TariffsTable = JSX(({ className = '', title, description, rowHeaders, tariffsColumns: columns, hiddenRowsNum = 0, ...rest }) => {
+        const colData = columns?.map(({ data }) => data) || [];
+        const rowData = rowHeaders?.map((header, i) => ({
+            header,
+            data: colData.map((col) => col?.[i] || []),
+        }));
+        const itemCount = colData.length;
+        const [activeIndex, controls] = useCarouselControls({
+            itemCount: itemCount,
+            visibleItemCount: COLS_LENGTH_FOR_SCROLL,
+        });
+        const rows = (rowData || []).map((row, i) => (jsx(TariffsTableRow, { row: row, activeIndex: activeIndex, rowIdx: i, ...rest }, String(i))));
+        const [visibleRows, hiddenRows] = hiddenRowsNum > 0 ? [rows.slice(0, -hiddenRowsNum), rows.slice(-hiddenRowsNum)] : [rows, []];
+        return (jsxs(BlockWrapper, { className: style('overflow-hidden relative space-y-6xl @4xl:space-y-xl', className), defaultPadding: "p-6xl", ...rest, children: [jsx(Headline, { title: title, description: description, headlineVersion: "M", isEmbedded: true, align: "text-center" }), jsx("div", { className: "space-y-m", children: hiddenRowsNum > 0 ? (jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs(TariffsTableWrapper, { controls: controls, children: [visibleRows, jsx(FoldableSection, { isUnfolded: isUnfolded, children: hiddenRows })] })), renderFoldButton: renderDefaultFoldButton })) : (jsx(TariffsTableWrapper, { controls: controls, children: rows })) })] }));
     });
 
-    const ActiveSubMenu = JSX(({ activeMenuSubItems, basePath }) => activeMenuSubItems ? (jsx("div", { className: "mb-5", children: activeMenuSubItems.map((_, i) => (jsx(ActiveSubMenuItem, { item: _, basePath: basePath }, String(i)))) })) : null);
+    const TextBlock = JSX(({ className = '', title, description, iconVersion, __html, ...rest }) => (jsxs(BlockWrapper, { className: style('flex gap-s sm:gap-m bg-white group-data-secondary:bg-primary-main/10', className), ...rest, children: [iconVersion === 'small' ? renderIcon() : null, jsxs("div", { className: "flex flex-col w-fit gap-2xs sm:gap-xs", children: [title ? (jsx(Text, { size: "text-l", font: "font-normal", color: "text-primary-text group-data-secondary:text-white", children: title })) : null, description ? renderDescription(description) : null, __html ? jsx(RichText, { __html: __html }) : null] })] })));
+    const renderIcon = () => (jsx("div", { className: `rounded-full h-4 w-4 text-center text-xs font-light bg-primary-main text-white group-data-secondary:bg-white group-data-secondary:text-primary-main`, children: "i" }));
+    const renderDescription = (description) => (jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text group-data-secondary:text-white", children: description }));
 
-    const TopItemMobile = ({ item, isActive, onClick }) => (jsxs("button", { type: "button", className: "relative", onClick: onClick, children: [jsx("span", { className: style('whitespace-nowrap', isActive ? 'text-primary-main' : ''), children: item.text }), isActive ? (jsx("div", { className: "absolute left-0 right-0 -bottom-3 h-0.5 bg-primary-main group-data-transparent:bg-transparent" })) : null] }));
+    const Blocks = {
+        AdTile,
+        ApplicationForm,
+        BenefitsBlock,
+        Bonus,
+        BonusBenefitsBlock,
+        ButtonsBlock,
+        Calculator,
+        CardTransfer,
+        Carousel,
+        CarouselBankHistoryCard,
+        CarouselCard,
+        CarouselCatalogCard,
+        CarouselLinks,
+        CarouselRecommendationCard,
+        CarouselTariffsCard,
+        ComparisonTable,
+        DepositFiltration,
+        ErrorBlock,
+        ExchangeRateTile,
+        Footer,
+        Header,
+        Headline,
+        HorizontalLayout,
+        ImgBlock,
+        LinkDocs,
+        MobileAppTile,
+        MortgageFiltration,
+        OfficesAtmsMap,
+        Placeholder,
+        ProductBlock,
+        ProductGallery,
+        RepresentativeOfficeInfo,
+        RichTextBlock,
+        RollupItem,
+        SafeDepositRental,
+        StepsBlock,
+        Tabs,
+        TariffsTable,
+        TextBlock,
+        VerticalLayout,
+    };
 
-    const BurgerMenuDialog = JSX((props) => {
-        const { topItems, officesLink, defaultLocation } = useSitemap(props.options?.page?.fallback);
-        const [location] = useLocation(defaultLocation);
-        const locationDialog = useLocationDialog();
-        const openLocationDialog = useCallback(() => locationDialog.open(), []);
-        const [containerRef, scroll] = useSwipeListScroll({
-            itemCount: topItems?.length ?? 0,
-        });
-        const [activeIndex] = useActiveRoute(topItems);
-        const [activeTopItemIndex, setActiveTopItemIndex] = useState(activeIndex);
-        const activeRoute = useMemo(() => topItems?.[activeTopItemIndex], [topItems, activeTopItemIndex]);
-        const activeMenuSubItems = activeRoute?.items || [];
-        useEffect(() => {
-            setActiveTopItemIndex(activeIndex);
-        }, [activeIndex]);
-        useEffect(() => {
-            if (activeTopItemIndex > 0) {
-                scroll.scrollTo(activeTopItemIndex);
+    function useDebouncedEffect(effect, deps, delay = 300) {
+        useEffect(() => {
+            const timerId = globalThis.setTimeout(effect, delay);
+            return () => {
+                globalThis.clearTimeout(timerId);
+            };
+        }, deps);
+    }
+
+    const CloseButton = JSX(({ className, onClose }) => (jsx("button", { className: style('flex justify-center items-center w-12 h-12 p-2xs bg-transparent border-none', className), onClick: onClose, title: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C", children: jsx(Img, { image: { icon: 'CloseIcon' }, width: "24", height: "24" }) })));
+
+    const COOKIE_DIALOG_ID = 'cookie';
+    const DIALOG_INITIAL_DELAY = 3 * 1000;
+    const CookiePopup = JSX(({ termLink, personalDataPolicyLink }) => {
+        const [opened, { setTrue: open, setFalse: close }] = useBool();
+        useDebouncedEffect(() => {
+            if (!globalThis.localStorage?.getItem(COOKIE_DIALOG_ID)) {
+                open();
             }
-        }, [activeTopItemIndex, scroll]);
-        const handleTopItemClick = useCallback((idx) => setActiveTopItemIndex(idx), []);
-        return (jsx(Dialog, { head: jsx("div", { className: "flex items-center", children: jsx(Heading, { as: "h4", title: "\u041C\u0435\u043D\u044E" }) }), children: jsxs("div", { className: "flex flex-col flex-nowrap relative w-full h-auto m-auto bg-white pb-24 box-border rounded-md", children: [jsx("div", { className: "w-full mb-3", children: jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: 0, gap: 20, className: "pb-3", children: topItems?.map((item, i) => (jsx(TopItemMobile, { item: item, isActive: activeTopItemIndex === i, onClick: () => handleTopItemClick(i) }, String(i)))) }) }), jsxs("div", { className: "relative grow overflow-auto", children: [jsx(ActiveSubMenu, { activeMenuSubItems: activeMenuSubItems, basePath: activeRoute?.href }), jsx(SearchBar, { className: "grow mb-5" }), renderOfficeLink(officesLink), jsxs("div", { className: "flex items-center text-s cursor-pointer", onClick: openLocationDialog, children: [jsx(Img, { image: { icon: 'GeolocationIcon', iconVersion: 'black' }, width: "24", height: "24", className: "text-primary-main box-border mr-xs bg-main-divider p-xs rounded-md" }), jsxs("div", { className: "flex flex-col items-start", children: [jsx(Text, { size: "text-h5", children: location.name }), jsx(Text, { color: "text-secondary-text", size: "text-s", children: "\u0412\u0430\u0448\u0430 \u043B\u043E\u043A\u0430\u0446\u0438\u044F" })] })] })] })] }) }));
+        }, [], DIALOG_INITIAL_DELAY);
+        const handleClose = useCallback(() => {
+            globalThis.localStorage?.setItem(COOKIE_DIALOG_ID, 'true');
+            close();
+        }, []);
+        return opened ? (jsx("div", { className: "container fixed left-0 right-0 bottom-0 z-50", children: jsxs("div", { className: "bg-white m-xl p-xl rounded-md flex sm:items-center shadow-main-black", children: [jsx("div", { className: "sm:flex-1", children: jsxs(Paragraph, { size: "text-s", font: "font-light", color: "text-primary-text", children: ["\u0410\u041E \u00AB\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A\u00BB \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442", jsx(LinkWrapper, { isRemote: true, className: linkWrapperStyle(termLink?.href), ...termLink, children: "cookie" }), "(\u0444\u0430\u0439\u043B\u044B \u0441 \u0434\u0430\u043D\u043D\u044B\u043C\u0438 \u043E \u043F\u0440\u043E\u0448\u043B\u044B\u0445 \u043F\u043E\u0441\u0435\u0449\u0435\u043D\u0438\u044F\u0445 \u0441\u0430\u0439\u0442\u0430) \u0434\u043B\u044F \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u043E\u0432 \u0438 \u0443\u0434\u043E\u0431\u0441\u0442\u0432\u0430 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u0435\u0439. \u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0437\u0430\u043F\u0440\u0435\u0442\u0438\u0442\u044C \u0441\u043E\u0445\u0440\u0430\u043D\u0435\u043D\u0438\u0435 cookie \u0432 \u043D\u0430\u0441\u0442\u0440\u043E\u0439\u043A\u0430\u0445 \u0441\u0432\u043E\u0435\u0433\u043E \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.", jsx(LinkWrapper, { isRemote: true, className: linkWrapperStyle(personalDataPolicyLink?.href), ...personalDataPolicyLink, children: "\u041E\u0431\u0440\u0430\u0431\u043E\u0442\u043A\u0430 \u0412\u0430\u0448\u0438\u0445 \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445" }), "\u043F\u0440\u043E\u0438\u0437\u0432\u043E\u0434\u0438\u0442\u0441\u044F \u0432 \u0441\u043E\u043E\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u0442\u0440\u0435\u0431\u043E\u0432\u0430\u043D\u0438\u044F\u043C\u0438 \u0424\u0435\u0434\u0435\u0440\u0430\u043B\u044C\u043D\u043E\u0433\u043E \u0437\u0430\u043A\u043E\u043D\u0430 \u043E\u0442 27.07.2006 \u2116 152-\u04243 \u00AB\u041E \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445\u00BB."] }) }), jsx("div", { className: "ml-s sm:ml-0 w-24 flex justify-end", children: jsx(CloseButton, { className: "bg-main-gray rounded-md", onClose: handleClose }) })] }) })) : null;
     });
-    const renderOfficeLink = (officesLink) => officesLink ? (jsxs("a", { className: "flex items-center mb-3", href: officesLink, rel: "noopener noreferrer", "aria-label": "\u041E\u0444\u0438\u0441\u044B \u0438 \u0431\u0430\u043D\u043A\u043E\u043C\u0430\u0442\u044B", children: [jsx(Img, { image: { icon: 'MapOpenedIcon', iconVersion: 'black' }, width: "24", height: "24", className: "text-primary-main box-border mr-xs bg-main-divider p-xs rounded-md" }), jsx("span", { children: "\u041E\u0444\u0438\u0441\u044B \u0438 \u0431\u0430\u043D\u043A\u043E\u043C\u0430\u0442\u044B" })] })) : null;
+    const linkWrapperStyle = (href) => style('inline mx-2xs', href ? 'text-green-dark' : '');
 
-    const BURGER_MENU_DIALOG_ID = 'burgerMenuDialog';
-    const useBurgerMenuDialog = () => {
-        const { open: openDialog, closeAll, close } = useDialogManager();
-        const dialogs = useDialogsList();
-        const isBurgerMenuOpen = isDialogOpen(BURGER_MENU_DIALOG_ID, dialogs);
-        const open = useCallback(() => openDialog(jsx(BurgerMenuDialog, {}), { id: BURGER_MENU_DIALOG_ID }), []);
-        const toggle = useCallback(() => {
-            if (isBurgerMenuOpen) {
-                closeAll();
+    function useList(initialList = []) {
+        const [list, setList] = useState(initialList);
+        const push = useCallback((item) => setList(_ => [..._, item]), []);
+        const pop = useCallback(() => setList(_ => _.slice(0, -1)), []);
+        const remove = useCallback((item) => setList(_ => _.filter(currentItem => currentItem !== item)), []);
+        const clear = useCallback(() => setList([]), []);
+        return [list, { setList, push, pop, remove, clear }];
+    }
+
+    const useDialogsList = ({ onCloseAll, onClose, } = {}) => {
+        const [dialogs, { push, pop, clear }] = useList();
+        const closeAll = useCallback(() => {
+            onCloseAll && onCloseAll(dialogs);
+            clear();
+        }, [dialogs, onCloseAll]);
+        const close = useCallback(() => {
+            onClose && onClose(dialogs[dialogs.length - 1]);
+            pop();
+        }, [dialogs, onClose]);
+        useEffect(() => defaultEventBus.subscribe('dialog', (action) => {
+            switch (action.type) {
+                case 'open':
+                    push(action);
+                    break;
+                case 'close':
+                    if (action.all) {
+                        closeAll();
+                    }
+                    else {
+                        close();
+                    }
+                    break;
+                default:
+                    assertUnreachable(action);
+            }
+        }), [closeAll, close]);
+        return dialogs;
+    };
+
+    const DialogManager = JSX(() => {
+        const handleCloseAll = useCallback((dialogs) => {
+            for (const _ of dialogs) {
+                _?.onClose && _.onClose();
+            }
+        }, []);
+        const handleClose = useCallback((_) => {
+            _?.onClose && _.onClose();
+        }, []);
+        const dialogs = useDialogsList({ onCloseAll: handleCloseAll, onClose: handleClose });
+        const { close } = useDialogManager();
+        const escapeHandler = useCallback(({ key }) => {
+            if (key === 'Escape') {
+                close();
+            }
+        }, []);
+        useEventListener(globalThis.document, 'keydown', escapeHandler);
+        useEffect(() => {
+            if (dialogs.length) {
+                globalThis.document?.body.classList.add('no-scrollbar');
+                globalThis.document?.body.classList.add('overflow-hidden');
             }
             else {
-                open();
+                globalThis.document?.body.classList.remove('no-scrollbar');
+                globalThis.document?.body.classList.remove('overflow-hidden');
             }
-        }, [isBurgerMenuOpen]);
-        return [Boolean(isBurgerMenuOpen), { open, close, toggle }];
-    };
+        }, [dialogs]);
+        return dialogs.length ? (jsx("div", { className: "fixed inset-0 z-50", role: "dialog", children: dialogs.map(({ dialog, id }, i) => (jsx("div", { className: style('absolute inset-0 overflow-x-hidden overflow-y-scroll no-scrollbar', i === dialogs.length - 1 ? '' : 'hidden'), children: dialog }, String(id || i)))) })) : null;
+    });
 
-    const EMPTY_MENU = [];
-    const StickyBottomMenu = JSX(({ ...rest }) => {
-        const [isBurgerMenuDialogOpen, { toggle, close }] = useBurgerMenuDialog();
-        const { menuItems = EMPTY_MENU } = useSWRResource(projectSettings.STICKY_MOBILE_MENU || 'sticky-mobile-menu', { fallback: rest.options?.page?.fallback, folderName: 'portal-resources', setBasePath: true });
-        const [, activeItem] = useActiveRoute(menuItems);
-        const middleIdx = Math.floor(menuItems.length / 2);
-        const leftItems = menuItems.slice(0, middleIdx);
-        const rightItems = menuItems.slice(middleIdx);
-        /* Attribute [data-component] need for correct render in wcms editor. Do not remove. */
-        return (jsx("div", { className: "w-full mb-5", "data-component": "sticky-bottom-menu-container", children: jsx(BlockWrapper, { className: "@container-normal fixed w-full h-[74px] bottom-0 left-0 my-0 mx-auto bg-transparent z-[100]", padding: "p-0", children: jsxs("div", { className: "ml-auto container bg-white flex justify-center shadow-blue-gray", children: [leftItems.map(renderMenuItem(activeItem, close)), jsx(StickyBottomMenuBurger, { isActive: isBurgerMenuDialogOpen, onClick: toggle }), rightItems.map(renderMenuItem(activeItem, close))] }) }) }));
+    const PopupManager = JSX(() => {
+        const [popup, setPopup] = useState(null);
+        const close = useCallback(() => {
+            setPopup(null);
+        }, []);
+        useEffect(() => defaultEventBus.subscribe('popup', (action) => {
+            switch (action.type) {
+                case 'open':
+                case 'update':
+                    setPopup(action);
+                    break;
+                case 'close':
+                    close();
+                    break;
+                default:
+                    assertUnreachable(action);
+            }
+        }), []);
+        const escapeHandler = useCallback(({ key }) => {
+            if (key === 'Escape') {
+                close();
+            }
+        }, [close]);
+        useEventListener(globalThis.document, 'keydown', escapeHandler);
+        return popup ? (jsx("div", { className: "absolute z-50", style: {
+                left: `${popup.left}px`,
+                top: `${popup.top}px`,
+                ...(popup.width ? { width: `${popup.width}px` } : {}),
+            }, role: "dialog", children: popup.popup })) : null;
     });
-    const renderMenuItem = (activeItem, close) => (_, i) => (jsx(StickyBottomMenuItem, { isActive: _ === activeItem, item: _, onClick: close }, _.href || String(i)));
 
-    const scrollButtonStyle = 'hidden sm:flex absolute z-40 top-0';
-    const ScrollableTabsControl = JSX(({ className, items = [], value, onChange, tabsType }) => {
-        const [containerRef, scroll] = useSwipeListScroll({
-            itemCount: items?.length || 0,
-        });
-        return (jsxs("div", { className: style('relative overflow-x-auto no-scrollbar', className), role: "tablist", children: [jsx(SwipeListContainer, { containerRef: containerRef, snapAlign: "snap-start", onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: items.map(renderTab(value, onChange, tabsType)) }), scroll.canScrollLeft ? (jsx(ScrollLeftButton, { className: style('left-6', scrollButtonStyle), onClick: scroll.scrollLeft })) : null, scroll.canScrollRight ? (jsx(ScrollRightButton, { className: style('right-6', scrollButtonStyle), onClick: scroll.scrollRight })) : null] }));
+    const isHrefActive = (router) => ({ href }) => !href ? false : withoutQuery(getRouterHref(href, router)).startsWith(withoutQuery(href));
+    const getRouterHref = (href, router) => isURL(href) ? router.href : router.pathname;
+
+    const isTopItemActive = (router) => isHrefActive(projectSettings.BASE_PATH ? { pathname: projectSettings.BASE_PATH } : router);
+
+    function useActiveRoute(items = []) {
+        const router = useRouter();
+        const activeIndex = items.findIndex(isTopItemActive(router));
+        return [activeIndex, items[activeIndex]];
+    }
+
+    const StickyBottomMenuBurger = JSX(({ isActive, onClick }) => (jsxs("button", { className: style(isActive ? 'text-primary-main' : 'text-primary-text', `w-10 m-4 flex justify-center items-center flex-col text-xs cursor-pointer`), onClick: onClick, children: [jsx(Icon, { className: "w-6 h-6", name: "BurgerIcon", iconVersion: isActive ? 'color' : 'black' }), "\u041C\u0435\u043D\u044E"] })));
+
+    const StickyBottomMenuItem = JSX(({ isActive, item, onClick }) => {
+        const link = useLink({ isRemote: true });
+        const { href, onClick: handleClick } = link({ href: item?.href, onClick });
+        return (jsxs("a", { className: style(isActive ? 'text-primary-main' : 'text-primary-text', `w-10 m-4 flex justify-center items-center flex-col text-xs cursor-pointer`), href: href, target: "_self", title: item?.title || '', onClick: handleClick, children: [jsx(Icon, { className: "w-6 h-6", name: item?.icon?.icon, iconVersion: isActive ? 'color' : 'black' }), item?.title || ''] }));
     });
 
-    const renderTabs = ({ tabsMode, ...props }) => {
-        switch (tabsMode) {
-            case 'wideScreen':
-                return jsx(TabsControl, { ...props });
-            case 'centered':
-                return (jsx("div", { className: "flex", children: jsx(TabsControl, { className: "m-auto p-xs rounded-md bg-main-gray", tabsType: "rounded", ...props }) }));
-            case 'scrollable':
-                return (jsx("div", { className: "flex", children: jsx(ScrollableTabsControl, { className: "m-auto", tabsType: "underlined", ...props }) }));
-            default:
-                return null;
+    const isDialogOpen = (id, dialogs) => dialogs.find((item) => item.id === id, id);
+
+    const Dialog = JSX(({ className, head, children, onClose }) => {
+        const { close } = useDialogManager();
+        const handleClose = useCallback(() => {
+            close();
+            onClose && onClose();
+        }, [onClose]);
+        return (jsxs("div", { className: style('relative min-h-full bg-white pt-0 p-5', className), children: [jsxs("div", { className: "sticky py-xl top-0 bg-white z-10", children: [jsx(CloseButton, { className: "absolute top-0 right-0", onClose: handleClose }), jsx("div", { className: "container", children: head })] }), jsx("div", { className: "container pb-6xl", children: children })] }));
+    });
+
+    const REGIONS_URL = '/api/v1/regions';
+    function useRegions() {
+        const { data } = useAsyncData(REGIONS_URL, fetchJSONUnsafe);
+        return data || [];
+    }
+
+    const groupBy = (list, keyGetter) => {
+        const result = new Map();
+        for (const item of list) {
+            const key = keyGetter(item);
+            const group = result.get(key) || [];
+            result.set(key, [...group, item]);
         }
+        return result;
     };
 
-    const TAB_QUERY_PARAM_KEY = 'tab';
-    const Tabs = JSX(({ className = '', isSticky, tabs = [], tabsMode, ...rest }) => {
-        const router = useRouter();
-        const { isReady } = router;
-        const tabsControlItems = useMemo(() => tabs.map(normalizeTab), [tabs]);
-        const [activeTabIndex, setActiveTabIndex] = useState(0);
-        useEffect(() => {
-            if (!tabs || !tabs[0]) {
-                return;
-            }
-            const defaultTabIndex = router.query[TAB_QUERY_PARAM_KEY]
-                ? tabs.findIndex((_) => _.type === 'group' && _.ref === router.query[TAB_QUERY_PARAM_KEY]) || 0
-                : 0;
-            const defaultTab = tabs[defaultTabIndex] || tabs[0];
-            setActiveTabIndex(defaultTabIndex);
-            fireTabEvent(defaultTab);
-        }, [isReady]);
-        useEffect(() => {
-            const activeTab = tabs[activeTabIndex];
-            if (activeTab?.type === 'group') {
-                defaultEventBus.subject('tab', {
-                    type: activeTab.type,
-                    label: activeTab.ref,
-                    groupName: activeTab.name,
-                });
+    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 = Array.from({ length: s1.length });
+        const s2Matches = Array.from({ length: 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;
             }
-        }, [tabs, activeTabIndex]);
-        const updateUrlSearchTabParam = (_) => {
-            const searchParams = new URLSearchParams(router.query);
-            if (_.name) {
-                searchParams.set(TAB_QUERY_PARAM_KEY, _.name);
+        }
+        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;
             }
-            else {
-                searchParams.delete(TAB_QUERY_PARAM_KEY);
+            let j = k;
+            for (; j < s2.length; j++) {
+                if (s2Matches[j]) {
+                    k = j + 1;
+                    break;
+                }
             }
-            router.replace(`${router.pathname}?${searchParams}`, '', { scroll: false });
-        };
-        const handleChange = useCallback((_) => {
-            const index = tabsControlItems.indexOf(_);
-            const tab = tabs[index];
-            setActiveTabIndex(index);
-            fireTabEvent(tab);
-            if (tab.type === 'group') {
-                updateUrlSearchTabParam(_);
+            if (s1[i] !== s2[j]) {
+                t++;
             }
-        }, [tabs, tabsControlItems]);
-        return (jsx(BlockWrapper, { className: style(isSticky ? 'sticky top-1 z-20' : '', className), defaultPadding: "p-0", ...rest, children: renderTabs({
-                items: tabsControlItems,
-                value: tabsControlItems[activeTabIndex],
-                tabsMode,
-                onChange: handleChange,
-            }) }));
-    });
-    const fireTabEvent = (tab) => {
-        if (tab.type === 'group') {
-            defaultEventBus.fire('tab', { type: tab.type, label: tab.ref, groupName: tab.name });
         }
-        if (tab.type === 'link') {
-            defaultEventBus.fire('tab', { type: tab.type, label: tab.href });
+        return t;
+    }
+    function computePrefixL(s1, s2) {
+        let prefixL = 0;
+        while (s1[prefixL] === s2[prefixL] && prefixL < JARO_WINKLER_MAX_L) {
+            prefixL++;
         }
-    };
-    const normalizeTab = (_) => _?.type === 'group' ? { text: _.title, name: _.ref } : _;
+        return prefixL;
+    }
 
-    const dividerStyle = '@4xl:border-main-divider @4xl:border-b';
-    const firstCellStyle = 'w-80 flex-shrink-0';
-    const COLS_LENGTH_FOR_SCROLL = 2;
-    const COLUMN_WIDTH$1 = 4 * 80 + 40; // w-80 + pl-10 = 360px
+    const renderForeignOffices = (foreignOffices) => foreignOffices?.length ? (jsxs("div", { className: "sm:border-t sm:border-main-divider mt-2xs pt-2xs", children: [jsx("div", { className: "mb-m", children: jsx(Text, { size: "text-m", font: "font-light", color: "text-secondary-text", children: "\u041F\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u0435\u043B\u044C\u0441\u0442\u0432\u0430 \u0437\u0430 \u0440\u0443\u0431\u0435\u0436\u043E\u043C:" }) }), jsx("div", { className: "flex flex-col sm:flex-row gap-5xl", children: foreignOffices.map((office, i) => (jsx(ForeignOffice, { ...office }, String(i)))) })] })) : null;
+    const ForeignOffice = JSX(({ icon, ...rest }) => {
+        const link = useLink();
+        const { text, target, href, onClick } = link(rest);
+        return (jsxs("div", { className: "flex gap-s items-center", children: [icon ? jsx(Img, { pathPrefix: "/wcms-resources/", image: icon }) : null, text ? (jsx("a", { className: "hover:text-primary-hover", href: href, target: target, onClick: onClick, children: jsx(Text, { size: "text-l", font: "font-light", color: "text-primary-text", children: text }) })) : null] }));
+    });
 
-    const carouselContainerClassesMap = {
-        comparison: 'flex gap-m duration-1000',
-        tariff: 'flex gap-5xl flex-grow duration-1000',
-    };
-    const TableCarouselContainer = JSX(({ children, activeIndex, columnWidth, version = 'comparison' }) => (jsx("div", { className: "flex flex-1 overflow-hidden", children: jsx("div", { className: carouselContainerClassesMap[version], style: { transform: `translateX(-${activeIndex * columnWidth}px)` }, children: children }) })));
+    const renderRegion = (onChangeLocation) => (region) => (jsx("div", { className: "mb-xs sm:mb-2xs", children: jsx("button", { className: "cursor-pointer hover:text-primary-hover", onClick: () => {
+                onChangeLocation && onChangeLocation(region);
+            }, children: jsx(Text, { size: "text-l", font: "font-light", children: region.name || '' }) }) }, region.id));
 
-    const TableInnerButton = JSX(({ className = '', isOpen, onClick }) => (jsx(LinkButton, { className: className, appendRight: jsx(Img, { image: { icon: isOpen ? 'ArrowUpIcon' : 'ArrowDownIcon' }, width: "20", height: "20" }), text: isOpen ? 'Скрыть' : 'Показать', version: "gray", onClick: onClick })));
+    const renderRegionGroup = (onChangeLocation) => ([letter, regions]) => (jsxs("div", { className: "break-inside-avoid mb-2xl w-56", children: [jsx("div", { className: "mb-s", children: jsx(Text, { size: "text-h6", children: letter }) }), regions.map(renderRegion(onChangeLocation))] }, letter));
 
-    const renderButtonsCellData = ({ buttons }) => renderButtonsSection(buttons, {
-        buttonClassName: 'basis-0',
+    const SearchBar$1 = JSX(({ className, searchTerm, onSearch }) => {
+        return (jsxs("form", { className: `font-sans relative ${className}`, children: [jsx("div", { className: "absolute rounded h-full flex items-center justify-center pl-m max-w-44 gap-s pointer-events-none", children: searchTerm ? null : (jsx("label", { htmlFor: "search-bar-input", className: `text-secondary-text `, children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0444\u0438\u043B\u0438\u0430\u043B\u0430\u043C" })) }), jsx("input", { id: "search-bar-input", className: `h-12 pl-m w-full peer text-l text-black border border-solid rounded-md box-border
+              outline-none border-gray hover:border-primary-hover active:border-primary-text focus:border-primary-text`, value: searchTerm, onChange: (e) => onSearch(e.target.value.toLowerCase()), type: "text", name: "location-search-bar-input" })] }));
     });
-    const renderLabelDescriptionCellData = ({ label, description }) => (jsxs("div", { className: "space-y-2xs", children: [label ? (jsx("div", { children: jsx(Text, { size: "text-h6", children: label }) })) : null, description ? (jsx("div", { children: jsx(Text, { size: "text-l", color: "text-secondary-text", children: description }) })) : null] }));
-    const renderImgCellData = ({ image }) => (image?.src ? jsx(Img, { image: image }) : null);
-    const renderListCellData = ({ isDotted, ...rest }) => (jsx(List, { className: "flex flex-col justify-between items-start text-h6", isDotted: isDotted ?? true, ...rest }));
-    const renderInnerTableCellData = ({ isVisible, displayTable, dataUrl, pdfUrl, isOpen, }) => isVisible ? (jsx(TableInnerButton, { isOpen: isOpen, onClick: () => {
-            displayTable({ dataUrl, pdfUrl });
-        } })) : null;
-    const EmbeddableCellData = {
-        Buttons: renderButtonsCellData,
-        Img: renderImgCellData,
-        List: renderListCellData,
-        LabelDescription: renderLabelDescriptionCellData,
-        Table: renderInnerTableCellData,
-    };
 
-    const RenderCellInner = JSX(({ cell, fieldIdx, rowIdx, cellIdx, setTableInner, tableInner, openTableInnerIdx, setOpenTableInnerIdx, }) => {
-        const [isVisible, setVisibility] = useState(true);
-        useEffect(() => {
-            if (cellIdx !== openTableInnerIdx || !tableInner) {
-                setVisibility(true);
-            }
-        }, [tableInner, openTableInnerIdx]);
-        const displayTable = (props) => {
-            setVisibility(false);
-            setOpenTableInnerIdx(cellIdx);
-            setTableInner(props);
-        };
-        return renderCell({
-            cell,
-            cellProps: {
-                rowIdx,
-                cellIdx,
-                fieldIdx,
-                displayTable,
-                isVisible,
-            },
-        });
+    const SEARCH_TERM_MIN_LENGTH = 3;
+    const LocationDialog = JSX(() => {
+        const { defaultLocation, foreignOffices } = useSitemap();
+        const [currentLocation, selectCurrentLocation] = useLocation(defaultLocation);
+        const [query, setQuery] = useState('');
+        const regions = cleanUpRegions(useRegions()).sort((a, b) => a.name.localeCompare(b.name));
+        const regionsGroupByLetter = groupBy(regions, regionFirstLetter);
+        const { close } = useDialogManager();
+        const handleChangeLocation = useCallback((region) => {
+            selectCurrentLocation(region);
+            close();
+        }, []);
+        return (jsxs(Dialog, { className: "pb-20", head: jsxs("div", { children: [jsx(Text, { size: "text-h4", color: "text-primary-text", children: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0438\u043B\u0438\u0430\u043B" }), currentLocation ? (jsxs("div", { className: "mb-s", children: [jsx(Text, { size: "text-l", font: "font-light", children: "\u0421\u0435\u0439\u0447\u0430\u0441 \u0432\u044B\u0431\u0440\u0430\u043D:\u00A0" }), jsx("button", { onClick: () => selectCurrentLocation(currentLocation), children: jsx(Text, { color: "text-primary-main", children: currentLocation.name }) })] })) : null, jsx(SearchBar$1, { onSearch: setQuery, searchTerm: query })] }), children: [query && query.length >= SEARCH_TERM_MIN_LENGTH ? (jsx("div", { children: regions
+                        .filter(({ name }) => name && jaroWinklerDistance(name.toLowerCase())(query.toLowerCase()) >= 0.8)
+                        .map(renderRegion(handleChangeLocation)) })) : (jsx("div", { className: "columns-1 sm:columns-5", children: Array.from(regionsGroupByLetter.entries()).map(renderRegionGroup(handleChangeLocation)) })), renderForeignOffices(foreignOffices)] }));
     });
-    const renderCell = ({ cell, cellProps }) => {
-        if (!cell) {
-            return null;
-        }
-        const { tableCellType: type, ...rest } = cell;
-        if (!type || !(type in EmbeddableCellData)) {
-            return null;
-        }
-        const EmbeddableCellInner = EmbeddableCellData[type];
-        return jsx(EmbeddableCellInner, { ...cellProps, ...rest });
+    const regionFirstLetter = (region) => region.name?.charAt(0) || '';
+    const cleanUpRegions = (regions) => regions.map((region) => ({
+        ...region,
+        name: region.name?.replace(/республика|область|край'/gi, '').trim() || '',
+    }));
+
+    const useLocationDialog = () => {
+        const { open, close } = useDialogManager();
+        return {
+            open: (options = {}) => open(jsx(LocationDialog, {}), options),
+            close,
+        };
     };
 
-    const TariffsTableCell = JSX(({ cells, rowIdx, cellIdx, setTableInner, tableInner, openTableInnerIdx, setOpenTableInnerIdx, }) => {
-        return (jsx("div", { className: "w-80 flex-grow flex flex-col gap-m @4xl:gap-lg", role: "cell", children: cells?.length
-                ? cells.map((_, i) => (jsx(RenderCellInner, { cell: _, fieldIdx: i, rowIdx: rowIdx, cellIdx: cellIdx, setTableInner: setTableInner, tableInner: tableInner, openTableInnerIdx: openTableInnerIdx, setOpenTableInnerIdx: setOpenTableInnerIdx }, String(i))))
-                : null }));
+    const SearchInput = JSX(({ className, value, autoFocus, onChange, onFocus, placeholder = 'Поиск по сайту' }) => {
+        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-m pointer-events-none", children: jsx(Img, { image: { icon: 'LoupeIcon', iconVersion: 'black' }, width: "24", height: "24" }) }), jsx("input", { className: style('h-14 w-full px-10 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: placeholder, autoFocus: autoFocus, onChange: handleChange, onFocus: onFocus })] }));
     });
 
-    const COLUMN_WIDTH = 140;
-    const getHorizontalShift = (columns, activeColumnIndex) => sum(columns.slice(0, activeColumnIndex).map((_) => _?.cols?.length ?? 1)) * COLUMN_WIDTH;
+    const compareBy = (indexOf) => (a, b) => indexOf(a) - indexOf(b);
+    const desc = (cmp) => (a, b) => -cmp(a, b);
 
-    const renderInnerTableRow = (activeColumnIndex) => (rowData, rowIdx) => {
-        if (!rowData?.length) {
-            return null;
+    const joinMaps = (aggregate, emptyVal) => (acc, map) => {
+        for (const [key, b] of map) {
+            acc.set(key, aggregate(acc.get(key) || emptyVal, b));
         }
-        const [headerColumn, ...columns] = rowData;
-        const columnsStyle = style('flex duration-1000 text-center', rowIdx !== 0 ? 'font-normal' : 'font-light');
-        return (jsxs("div", { className: "flex border-main-divider border-b border-solid h-full", children: [headerColumn?.data ? (jsx("div", { className: "text-xl font-light w-56 min-w-56 py-lg", children: headerColumn.data })) : null, jsx("div", { className: "flex flex-grow overflow-hidden", children: jsx("div", { className: columnsStyle, style: {
-                            transform: `translateX(-${getHorizontalShift(columns, activeColumnIndex)}px)`,
-                        }, children: columns?.map((_, i) => (jsxs("div", { className: "flex flex-col flex-grow gap-s justify-center py-xl odd:bg-main-divider", children: [_?.data ? jsx("div", { className: "text-xl font-light", children: _.data }) : null, _?.cols ? renderCols(_.cols, activeColumnIndex) : null] }, `row${i}`))) }) })] }, String(rowIdx)));
+        return acc;
     };
-    const renderCols = (cols, rowIndex) => cols?.length > 0 ? (jsx("div", { className: style('flex', rowIndex === 0 ? 'text-secondary-text' : ''), children: cols.map((data, i) => (jsx("div", { className: "w-20 text-h6 mx-lg", children: data }, String(i)))) })) : null;
-
-    const InnerTableBodyItem = JSX(({ rows }) => (jsx(SwipeListContainer, { visibleItemCount: 0, snapAlign: "snap-start", children: jsx("div", { children: rows?.map(renderInnerTableRow(0)) }) })));
 
-    const InnerTableBody = JSX(({ activeTabIndex, items }) => {
-        return (jsx("div", { children: items.map((_, tableIdx) => {
-                const key = `activeTabIdx:${activeTabIndex}-tableIdx:${tableIdx}`;
-                return (jsxs("div", { className: "w-full @container", children: [jsx("div", { className: "flex p-m bg-white @4xl:bg-gray text-center justify-center relative", children: jsx(Text, { size: "text-xl", font: "font-light", children: _.title }) }), jsx("div", { className: "w-full pl-xs overflow-hidden transition-height duration-500 ease-in-out", children: jsx("div", { className: "relative", children: jsx(InnerTableBodyItem, { rows: _.rowsData }) }) })] }, key));
-            }) }));
-    });
+    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 linkButtonVersion = 'link';
+    const textRank = (queryTokens) => (text) => {
+        const textTokens = tokenize(text || '');
+        return textTokens.length
+            ? sum(queryTokens.map((qToken) => max(textTokens.map(jaroWinklerDistance(qToken)))))
+            : 0;
+    };
 
-    const InnerTableHeader = JSX(({ currencies, linkToPDF, activeTabIndex, setActiveTabIndex }) => (jsxs("div", { className: "flex justify-between items-center w-full py-lg", children: [currencies && currencies.length > 1 ? (jsx("div", { className: "flex bg-secondary-light p-2xs rounded-md", children: currencies.map((currency, idx) => (jsx("div", { className: `rounded-md text-xl font-light px-4 py-3 cursor-pointer ${idx === activeTabIndex ? 'bg-primary-main text-white' : 'text-secondary-text'}`, onClick: () => setActiveTabIndex(idx), children: currency || idx + 1 }, currency))) })) : null, linkToPDF ? (jsx(LinkButton, { className: "text-primary-main", href: linkToPDF, version: linkButtonVersion, target: "_blank", appendLeft: jsx(Icon, { name: "DocDownloadIcon", iconVersion: "color", className: "mr-3xs", width: "20", height: "20" }), text: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0432 PDF" })) : null] })));
+    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]));
 
-    function useTariffsInnerTableData(directoryName) {
-        const { data } = useAsyncData(tariffsInnerTableDataUrl(directoryName), fetchTariffsInnerTableData);
-        return data || {};
-    }
-    async function fetchTariffsInnerTableData(url) {
-        const response = await fetch(url);
-        return await response.json();
-    }
-    function tariffsInnerTableDataUrl(directoryName) {
-        return `/wcms-resources/${directoryName || 'tariffs-inner-table-data'}.json`;
-    }
+    const SEARCH_INDEX_FILENAME = 'search.index.json';
+    const useSearch = ({ basePathList, initialQuery = '', }) => {
+        const [query, setQuery] = useState(initialQuery || '');
+        useEffect(() => {
+            if (initialQuery !== undefined && initialQuery !== null) {
+                setQuery(initialQuery);
+            }
+        }, [initialQuery]);
+        const { data } = useAsyncData(basePathList?.length ? basePathList : null, 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 EMPTY_DATA = 'Данных нет';
-    const InnerTable = JSX(({ dataUrl, pdfUrl, onClick }) => {
-        const { tableData } = useTariffsInnerTableData(dataUrl);
-        const [activeTabIndex, setActiveTabIndex] = useState(0);
-        const handleActiveTabIndex = useCallback((_) => setActiveTabIndex(_), []);
-        const items = tableData?.[activeTabIndex]?.items ?? [];
-        const currencies = tableData?.map((item) => item.currency ?? '');
-        return tableData ? (jsxs("div", { className: "bg-white z-10", children: [jsx(InnerTableHeader, { currencies: currencies, activeTabIndex: activeTabIndex, setActiveTabIndex: handleActiveTabIndex, linkToPDF: pdfUrl }), jsx(InnerTableBody, { activeTabIndex: activeTabIndex, items: items }), jsx(TableInnerButton, { className: "mt-xl", onClick: onClick, isOpen: true })] })) : (jsxs("div", { className: "my-lg space-y-m text-h6 text-center", children: [jsx("p", { children: EMPTY_DATA }), jsx(TableInnerButton, { onClick: onClick, isOpen: true })] }));
+    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 FOOTER_AREA_KEYS = ['all', 'footer'];
+    const renderColumn = (menuItem, index) => {
+        const { text, items = [], href, target, onClick } = menuItem;
+        const visibleSubItems = items.filter((_) => !_.displayArea || FOOTER_AREA_KEYS.includes(_.displayArea.toLowerCase()));
+        return (jsxs("div", { className: "flex flex-col gap-s 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}` }), visibleSubItems.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 font-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 TariffsTableRowContainer = JSX(({ children, tableInner, onHideContentClick }) => (jsxs("div", { className: "self-start flex flex-col", role: "row", children: [jsx("div", { className: style(dividerStyle, 'flex flex-col @4xl:flex-row gap-y-xs gap-x-5xl pb-lg @4xl:pt-lg'), children: children }), tableInner ? (jsx("div", { className: "origin-top animate-expansion", children: jsx(InnerTable, { ...tableInner, onClick: onHideContentClick }) })) : null] })));
-
-    const TariffsTableRow = JSX(({ row: { header, data }, activeIndex, rowIdx, ...rest }) => {
-        const [tableInner, setTableInner] = useState(undefined);
-        const handleSetTableInner = useCallback((_) => setTableInner(_), []);
-        const [openTableInnerIdx, setOpenTableInnerIdx] = useState(undefined);
-        const handleOpenTableInnerIdx = useCallback((_) => setOpenTableInnerIdx(_), []);
-        const onHideContentClick = () => setTableInner(undefined);
-        return (jsxs(TariffsTableRowContainer, { onHideContentClick: onHideContentClick, tableInner: tableInner, ...rest, children: [jsx("div", { className: style('text-s', firstCellStyle), children: jsxs("div", { className: "flex gap-m items-center text-primary-text", role: "cell", children: [header?.icon ? (jsx(Img, { className: "hidden @4xl:block max-w-6 shrink-0", image: header.icon, width: "24", height: "24" })) : null, header?.title ? (jsx(Text, { size: "text-m", font: "font-light", children: header?.title })) : null] }) }), data?.length ? (jsx(TableCarouselContainer, { activeIndex: activeIndex, columnWidth: COLUMN_WIDTH$1, version: "tariff", children: data.map((cells, i) => (jsx(TariffsTableCell, { cells: cells, rowIdx: rowIdx, cellIdx: i, setTableInner: handleSetTableInner, tableInner: tableInner, openTableInnerIdx: openTableInnerIdx, setOpenTableInnerIdx: handleOpenTableInnerIdx, ...rest }, String(i)))) })) : null] }));
+    const SearchDialog = JSX(({ initialQuery }) => {
+        const { topItems } = useSitemap();
+        const basePathList = useMemo(() => topItems?.map((_) => _.href || '/'), [topItems]);
+        const [searchResult, searchInputProps] = useSearch({
+            basePathList,
+            initialQuery,
+        });
+        const searchItems = useMemo(() => combineTopItemsAndSearchResult(topItems)(searchResult), [topItems, searchResult]);
+        useEffect(() => printSearchItems(searchItems), [searchItems]); // Temp
+        return (jsx(Dialog, { head: jsx(SearchInput, { autoFocus: true, ...searchInputProps }), children: jsx(Sitemap, { topItems: searchItems }) }));
     });
-
-    /** @deprecated */
-    function renderArrows({ dec, inc, canDec, canInc, btnClass, className = '', }) {
-        const isVisible = canDec || canInc;
-        if (!isVisible) {
-            return null;
+    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();
         }
-        return (jsxs("div", { children: [canDec ? (jsx(ArrowButton, { className: style('absolute z-40', btnClass[0], className), onClick: dec, ariaLabel: "\u041F\u0440\u043E\u043B\u0438\u0441\u0442\u0430\u0442\u044C \u0432\u043B\u0435\u0432\u043E", "data-block-control": "scroll-left", disabled: !canDec })) : null, canInc ? (jsx(ArrowButton, { className: style('absolute z-40 rotate-180', btnClass[1], className), onClick: inc, ariaLabel: "\u041F\u0440\u043E\u043B\u0438\u0441\u0442\u0430\u0442\u044C \u0432\u043F\u0440\u0430\u0432\u043E", "data-block-control": "scroll-right", disabled: !canInc })) : null] }));
     }
 
-    const TariffsTableWrapper = JSX(({ children, controls }) => {
-        const { isScrollAvailable } = controls;
-        return (jsxs("div", { role: "table", children: [jsxs("div", { className: "relative space-y-xs", children: [children, renderArrows({
-                            ...controls,
-                            btnClass: ['top-28', 'top-11'],
-                            className: 'right-7',
-                        })] }), isScrollAvailable ? (jsx("div", { className: "absolute top-0 right-0 bottom-0 w-20 bg-opacity-to-white" })) : null] }));
+    const useSearchDialog = () => {
+        const { open, close } = useDialogManager();
+        return {
+            open: (props = {}, options = {}) => open(jsx(SearchDialog, { ...props }), options),
+            close,
+        };
+    };
+
+    const MIN_QUERY_LEN = 3;
+    const SearchBar = JSX(({ className }) => {
+        const [value, setValue] = useState('');
+        const resetQueryOnDialogClose = useCallback(() => setValue(''), []);
+        const { open } = useSearchDialog();
+        const handleInitialInputChange = useCallback((_) => {
+            setValue(_);
+            if (isQueryLongEnough(_)) {
+                open({ initialQuery: _ }, { onClose: resetQueryOnDialogClose });
+            }
+        }, [resetQueryOnDialogClose]);
+        return (jsxs("div", { className: style('relative', className), children: [jsx(SearchInput, { value: value, onChange: handleInitialInputChange }), jsx(CloseButton, { className: "absolute top-0 right-0 sm:hidden", onClose: resetQueryOnDialogClose })] }));
     });
+    const isQueryLongEnough = (_) => _ && _.length >= MIN_QUERY_LEN;
 
-    const TariffsTable = JSX(({ className = '', title, description, rowHeaders, tariffsColumns: columns, hiddenRowsNum = 0, ...rest }) => {
-        const colData = columns?.map(({ data }) => data) || [];
-        const rowData = rowHeaders?.map((header, i) => ({
-            header,
-            data: colData.map((col) => col?.[i] || []),
-        }));
-        const itemCount = colData.length;
-        const [activeIndex, controls] = useCarouselControls({
-            itemCount: itemCount,
-            visibleItemCount: COLS_LENGTH_FOR_SCROLL,
-        });
-        const rows = (rowData || []).map((row, i) => (jsx(TariffsTableRow, { row: row, activeIndex: activeIndex, rowIdx: i, ...rest }, String(i))));
-        const [visibleRows, hiddenRows] = hiddenRowsNum > 0 ? [rows.slice(0, -hiddenRowsNum), rows.slice(-hiddenRowsNum)] : [rows, []];
-        return (jsxs(BlockWrapper, { className: style('overflow-hidden relative space-y-6xl @4xl:space-y-xl', className), defaultPadding: "p-6xl", ...rest, children: [jsx(Headline, { title: title, description: description, headlineVersion: "M", isEmbedded: true, align: "text-center" }), jsx("div", { className: "space-y-m", children: hiddenRowsNum > 0 ? (jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs(TariffsTableWrapper, { controls: controls, children: [visibleRows, jsx(FoldableSection, { isUnfolded: isUnfolded, children: hiddenRows })] })), renderFoldButton: renderDefaultFoldButton })) : (jsx(TariffsTableWrapper, { controls: controls, children: rows })) })] }));
+    const ActiveSubMenuItem = JSX(({ item, basePath }) => {
+        const isAnotherPortal = projectSettings.BASE_PATH && basePath ? !projectSettings.BASE_PATH.startsWith(basePath) : false;
+        const link = useLink({ isRemote: isAnotherPortal, basePath });
+        const { href, target, onClick } = link(item);
+        const router = useRouter();
+        const isActive = isHrefActive(router)({ href });
+        return (jsxs("a", { className: style(isActive ? 'text-primary-main' : 'text-primary-text', `py-3 text-h5 font-light flex justify-between cursor-pointer`), href: href, target: target, onClick: onClick, children: [item.text, jsx(Img, { image: { icon: 'ChevronLeftIcon', iconVersion: 'black' }, width: "24", height: "24", className: "text-secondary-text rotate-180 opacity-30" })] }));
     });
 
-    const TextBlock = JSX(({ className = '', title, description, iconVersion, __html, ...rest }) => (jsxs(BlockWrapper, { className: style('flex gap-s sm:gap-m bg-white group-data-secondary:bg-primary-main/10', className), ...rest, children: [iconVersion === 'small' ? renderIcon() : null, jsxs("div", { className: "flex flex-col w-fit gap-2xs sm:gap-xs", children: [title ? (jsx(Text, { size: "text-l", font: "font-normal", color: "text-primary-text group-data-secondary:text-white", children: title })) : null, description ? renderDescription(description) : null, __html ? jsx(RichText, { __html: __html }) : null] })] })));
-    const renderIcon = () => (jsx("div", { className: `rounded-full h-4 w-4 text-center text-xs font-light bg-primary-main text-white group-data-secondary:bg-white group-data-secondary:text-primary-main`, children: "i" }));
-    const renderDescription = (description) => (jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text group-data-secondary:text-white", children: description }));
+    const ActiveSubMenu = JSX(({ activeMenuSubItems, basePath }) => activeMenuSubItems ? (jsx("div", { className: "mb-5", children: activeMenuSubItems.map((_, i) => (jsx(ActiveSubMenuItem, { item: _, basePath: basePath }, String(i)))) })) : null);
 
-    const Blocks = {
-        AdTile,
-        ApplicationForm,
-        BenefitsBlock,
-        Bonus,
-        BonusBenefitsBlock,
-        ButtonsBlock,
-        Calculator,
-        CardTransfer,
-        Carousel,
-        CarouselBankHistoryCard,
-        CarouselCard,
-        CarouselCatalogCard,
-        CarouselLinks,
-        CarouselRecommendationCard,
-        CarouselTariffsCard,
-        ComparisonTable,
-        DepositFiltration,
-        ErrorBlock,
-        ExchangeRateTile,
-        Footer,
-        Header,
-        Headline,
-        HorizontalLayout,
-        ImgBlock,
-        LinkDocs,
-        MobileAppTile,
-        MortgageFiltration,
-        OfficesAtmsMap,
-        Placeholder,
-        ProductBlock,
-        ProductGallery,
-        RepresentativeOfficeInfo,
-        RichTextBlock,
-        RollupItem,
-        SafeDepositRental,
-        StepsBlock,
-        StickyBottomMenu,
-        Tabs,
-        TariffsTable,
-        TextBlock,
-        VerticalLayout,
-    };
+    const TopItemMobile = ({ item, isActive, onClick }) => (jsxs("button", { type: "button", className: "relative", onClick: onClick, children: [jsx("span", { className: style('whitespace-nowrap', isActive ? 'text-primary-main' : ''), children: item.text }), isActive ? (jsx("div", { className: "absolute left-0 right-0 -bottom-3 h-0.5 bg-primary-main group-data-transparent:bg-transparent" })) : null] }));
 
-    const COOKIE_DIALOG_ID = 'cookie';
-    const DIALOG_INITIAL_DELAY = 3 * 1000;
-    const CookiePopup = JSX(({ termLink, personalDataPolicyLink }) => {
-        const [opened, { setTrue: open, setFalse: close }] = useBool();
-        useDebouncedEffect(() => {
-            if (!globalThis.localStorage?.getItem(COOKIE_DIALOG_ID)) {
-                open();
+    const BurgerMenuDialog = JSX((props) => {
+        const { topItems, officesLink, defaultLocation } = useSitemap(props.options?.page?.fallback);
+        const [location] = useLocation(defaultLocation);
+        const locationDialog = useLocationDialog();
+        const openLocationDialog = useCallback(() => locationDialog.open(), []);
+        const [containerRef, scroll] = useSwipeListScroll({
+            itemCount: topItems?.length ?? 0,
+        });
+        const [activeIndex] = useActiveRoute(topItems);
+        const [activeTopItemIndex, setActiveTopItemIndex] = useState(activeIndex);
+        const activeRoute = useMemo(() => topItems?.[activeTopItemIndex], [topItems, activeTopItemIndex]);
+        const activeMenuSubItems = activeRoute?.items || [];
+        useEffect(() => {
+            setActiveTopItemIndex(activeIndex);
+        }, [activeIndex]);
+        useEffect(() => {
+            if (activeTopItemIndex > 0) {
+                scroll.scrollTo(activeTopItemIndex);
             }
-        }, [], DIALOG_INITIAL_DELAY);
-        const handleClose = useCallback(() => {
-            globalThis.localStorage?.setItem(COOKIE_DIALOG_ID, 'true');
-            close();
-        }, []);
-        return opened ? (jsx("div", { className: "container fixed left-0 right-0 bottom-0 z-50", children: jsxs("div", { className: "bg-white m-xl p-xl rounded-md flex sm:items-center shadow-main-black", children: [jsx("div", { className: "sm:flex-1", children: jsxs(Paragraph, { size: "text-s", font: "font-light", color: "text-primary-text", children: ["\u0410\u041E \u00AB\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A\u00BB \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442", jsx(LinkWrapper, { isRemote: true, className: linkWrapperStyle(termLink?.href), ...termLink, children: "cookie" }), "(\u0444\u0430\u0439\u043B\u044B \u0441 \u0434\u0430\u043D\u043D\u044B\u043C\u0438 \u043E \u043F\u0440\u043E\u0448\u043B\u044B\u0445 \u043F\u043E\u0441\u0435\u0449\u0435\u043D\u0438\u044F\u0445 \u0441\u0430\u0439\u0442\u0430) \u0434\u043B\u044F \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u043E\u0432 \u0438 \u0443\u0434\u043E\u0431\u0441\u0442\u0432\u0430 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u0435\u0439. \u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0437\u0430\u043F\u0440\u0435\u0442\u0438\u0442\u044C \u0441\u043E\u0445\u0440\u0430\u043D\u0435\u043D\u0438\u0435 cookie \u0432 \u043D\u0430\u0441\u0442\u0440\u043E\u0439\u043A\u0430\u0445 \u0441\u0432\u043E\u0435\u0433\u043E \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.", jsx(LinkWrapper, { isRemote: true, className: linkWrapperStyle(personalDataPolicyLink?.href), ...personalDataPolicyLink, children: "\u041E\u0431\u0440\u0430\u0431\u043E\u0442\u043A\u0430 \u0412\u0430\u0448\u0438\u0445 \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445" }), "\u043F\u0440\u043E\u0438\u0437\u0432\u043E\u0434\u0438\u0442\u0441\u044F \u0432 \u0441\u043E\u043E\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u0442\u0440\u0435\u0431\u043E\u0432\u0430\u043D\u0438\u044F\u043C\u0438 \u0424\u0435\u0434\u0435\u0440\u0430\u043B\u044C\u043D\u043E\u0433\u043E \u0437\u0430\u043A\u043E\u043D\u0430 \u043E\u0442 27.07.2006 \u2116 152-\u04243 \u00AB\u041E \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445\u00BB."] }) }), jsx("div", { className: "ml-s sm:ml-0 w-24 flex justify-end", children: jsx(CloseButton, { className: "bg-main-gray rounded-md", onClose: handleClose }) })] }) })) : null;
+        }, [activeTopItemIndex, scroll]);
+        const handleTopItemClick = useCallback((idx) => setActiveTopItemIndex(idx), []);
+        return (jsx(Dialog, { head: jsx("div", { className: "flex items-center", children: jsx(Heading, { as: "h4", title: "\u041C\u0435\u043D\u044E" }) }), children: jsxs("div", { className: "flex flex-col flex-nowrap relative w-full h-auto m-auto bg-white pb-24 box-border rounded-md", children: [jsx("div", { className: "w-full mb-3", children: jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: 0, gap: 20, className: "pb-3", children: topItems?.map((item, i) => (jsx(TopItemMobile, { item: item, isActive: activeTopItemIndex === i, onClick: () => handleTopItemClick(i) }, String(i)))) }) }), jsxs("div", { className: "relative grow overflow-auto", children: [jsx(ActiveSubMenu, { activeMenuSubItems: activeMenuSubItems, basePath: activeRoute?.href }), jsx(SearchBar, { className: "grow mb-5" }), renderOfficeLink(officesLink), jsxs("div", { className: "flex items-center text-s cursor-pointer", onClick: openLocationDialog, children: [jsx(Img, { image: { icon: 'GeolocationIcon', iconVersion: 'black' }, width: "24", height: "24", className: "text-primary-main box-border mr-xs bg-main-divider p-xs rounded-md" }), jsxs("div", { className: "flex flex-col items-start", children: [jsx(Text, { size: "text-h5", children: location.name }), jsx(Text, { color: "text-secondary-text", size: "text-s", children: "\u0412\u0430\u0448\u0430 \u043B\u043E\u043A\u0430\u0446\u0438\u044F" })] })] })] })] }) }));
     });
-    const linkWrapperStyle = (href) => style('inline mx-2xs', href ? 'text-green-dark' : '');
+    const renderOfficeLink = (officesLink) => officesLink ? (jsxs("a", { className: "flex items-center mb-3", href: officesLink, rel: "noopener noreferrer", "aria-label": "\u041E\u0444\u0438\u0441\u044B \u0438 \u0431\u0430\u043D\u043A\u043E\u043C\u0430\u0442\u044B", children: [jsx(Img, { image: { icon: 'MapOpenedIcon', iconVersion: 'black' }, width: "24", height: "24", className: "text-primary-main box-border mr-xs bg-main-divider p-xs rounded-md" }), jsx("span", { children: "\u041E\u0444\u0438\u0441\u044B \u0438 \u0431\u0430\u043D\u043A\u043E\u043C\u0430\u0442\u044B" })] })) : null;
 
-    const DialogManager = JSX(() => {
-        const handleCloseAll = useCallback((dialogs) => {
-            for (const _ of dialogs) {
-                _?.onClose && _.onClose();
-            }
-        }, []);
-        const handleClose = useCallback((_) => {
-            _?.onClose && _.onClose();
-        }, []);
-        const dialogs = useDialogsList({ onCloseAll: handleCloseAll, onClose: handleClose });
-        const { close } = useDialogManager();
-        const escapeHandler = useCallback(({ key }) => {
-            if (key === 'Escape') {
-                close();
-            }
-        }, []);
-        useEventListener(globalThis.document, 'keydown', escapeHandler);
-        useEffect(() => {
-            if (dialogs.length) {
-                globalThis.document?.body.classList.add('no-scrollbar');
-                globalThis.document?.body.classList.add('overflow-hidden');
+    const BURGER_MENU_DIALOG_ID = 'burgerMenuDialog';
+    const useBurgerMenuDialog = () => {
+        const { open: openDialog, closeAll, close } = useDialogManager();
+        const dialogs = useDialogsList();
+        const isBurgerMenuOpen = isDialogOpen(BURGER_MENU_DIALOG_ID, dialogs);
+        const open = useCallback(() => openDialog(jsx(BurgerMenuDialog, {}), { id: BURGER_MENU_DIALOG_ID }), []);
+        const toggle = useCallback(() => {
+            if (isBurgerMenuOpen) {
+                closeAll();
             }
             else {
-                globalThis.document?.body.classList.remove('no-scrollbar');
-                globalThis.document?.body.classList.remove('overflow-hidden');
+                open();
             }
-        }, [dialogs]);
-        return dialogs.length ? (jsx("div", { className: "fixed inset-0 z-50", role: "dialog", children: dialogs.map(({ dialog, id }, i) => (jsx("div", { className: style('absolute inset-0 overflow-x-hidden overflow-y-scroll no-scrollbar', i === dialogs.length - 1 ? '' : 'hidden'), children: dialog }, String(id || i)))) })) : null;
-    });
+        }, [isBurgerMenuOpen]);
+        return [Boolean(isBurgerMenuOpen), { open, close, toggle }];
+    };
 
-    const PopupManager = JSX(() => {
-        const [popup, setPopup] = useState(null);
-        const close = useCallback(() => {
-            setPopup(null);
-        }, []);
-        useEffect(() => defaultEventBus.subscribe('popup', (action) => {
-            switch (action.type) {
-                case 'open':
-                case 'update':
-                    setPopup(action);
-                    break;
-                case 'close':
-                    close();
-                    break;
-                default:
-                    assertUnreachable(action);
-            }
-        }), []);
-        const escapeHandler = useCallback(({ key }) => {
-            if (key === 'Escape') {
-                close();
-            }
-        }, [close]);
-        useEventListener(globalThis.document, 'keydown', escapeHandler);
-        return popup ? (jsx("div", { className: "absolute z-50", style: {
-                left: `${popup.left}px`,
-                top: `${popup.top}px`,
-                ...(popup.width ? { width: `${popup.width}px` } : {}),
-            }, role: "dialog", children: popup.popup })) : null;
+    const EMPTY_MENU = [];
+    const StickyBottomMenu = JSX(({ ...rest }) => {
+        const [isBurgerMenuDialogOpen, { toggle, close }] = useBurgerMenuDialog();
+        const dataName = projectSettings.STICKY_MOBILE_MENU || 'sticky-mobile-menu';
+        const { menuItems = EMPTY_MENU } = useSWRResource(dataName, {
+            fallback: rest.options?.page?.fallback,
+            pathDir: joinPath(projectSettings.BASE_PATH, 'portal-resources'),
+        });
+        const [, activeItem] = useActiveRoute(menuItems);
+        const middleIdx = Math.floor(menuItems.length / 2);
+        const leftItems = menuItems.slice(0, middleIdx);
+        const rightItems = menuItems.slice(middleIdx);
+        /* Attribute [data-component] need for correct render in wcms editor. Do not remove. */
+        return (jsx("div", { className: "w-full mb-5", "data-component": "sticky-bottom-menu-container", children: jsx("div", { className: "fixed w-full h-[74px] bottom-0 left-0 my-0 mx-auto bg-transparent z-[100]", children: jsxs("div", { className: "ml-auto container bg-white flex justify-center shadow-blue-gray", children: [leftItems.map(renderMenuItem(activeItem, close)), jsx(StickyBottomMenuBurger, { isActive: isBurgerMenuDialogOpen, onClick: toggle }), rightItems.map(renderMenuItem(activeItem, close))] }) }) }));
     });
+    const renderMenuItem = (activeItem, close) => (_, i) => (jsx(StickyBottomMenuItem, { isActive: _ === activeItem, item: _, onClick: close }, _.href || String(i)));
 
     const api = LikeAPI();
     function useLikeService(pagePath) {
@@ -5406,17 +5411,17 @@
             blockDecorator,
             parent: data,
         };
-        return (jsxs("div", { "data-theme": colorPalette, children: [jsxs("section", { className: style('@container relative', pageStyle, className), children: [slots?.header ? (jsx("div", { className: "relative z-10 mb-lg shadow-[0_8px_32px_0px_#00000014]", children: renderBlocksList(slots?.header, { ...options, slotName: 'header' }) })) : null, jsxs("div", { className: "container space-y-px @5xl:space-y-0 @5xl:grid @5xl:grid-cols-12 @5xl:gap-2xs", children: [renderChildren({ block: data, options, extraProps: { className: 'scroll-mt-12' } }), renderBlocksList(slots?.footer, { ...options, slotName: 'footer' })] }), likeControl ? renderLikeControl() : null] }), jsx(StickyBottomMenu, {}), jsx(DialogManager, {}), jsx(PopupManager, {}), jsx(CookiePopup, { termLink: { href: '/pd-policy#cookie', target: '_blank' }, personalDataPolicyLink: { href: '/pd-policy', target: '_blank' } })] }));
+        return (jsxs("div", { "data-theme": colorPalette, children: [jsxs("section", { className: style('@container relative', pageStyle, className), children: [slots?.header ? (jsx("div", { className: "relative z-10 mb-lg shadow-[0_8px_32px_0px_#00000014]", children: renderBlocksList(slots?.header, { ...options, slotName: 'header' }) })) : null, jsxs("div", { className: "container space-y-px @5xl:space-y-0 @5xl:grid @5xl:grid-cols-12 @5xl:gap-2xs", children: [renderChildren({ block: data, options, extraProps: { className: 'scroll-mt-12' } }), renderBlocksList(slots?.footer, { ...options, slotName: 'footer' })] }), likeControl ? renderLikeControl() : null] }), jsx(StickyBottomMenu, { options: options }), jsx(DialogManager, {}), jsx(PopupManager, {}), jsx(CookiePopup, { termLink: { href: '/pd-policy#cookie', target: '_blank' }, personalDataPolicyLink: { href: '/pd-policy', target: '_blank' } })] }));
     });
     ContentPage.childrenTypes = [];
-    ContentPage.slots = () => ['header', 'footer', 'StickyBottomMenu'];
+    ContentPage.slots = () => ['header', 'footer'];
     function renderLikeControl() {
         return (jsx("div", { className: "flex items-end absolute bottom-0 right-0 h-full pointer-events-none", children: jsx(LikeControl, { className: "rounded-tl-3xl sticky bottom-0 pointer-events-auto" }) }));
     }
 
     const joinList = (sep) => (list) => list.reduce((acc, el, i) => (acc.length ? acc.concat({ ...sep, key: `sep-${i}` }, el) : [el]), []);
 
-    const packageVersion = "0.14.123";
+    const packageVersion = "0.14.125";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;