@redneckz/wildless-cms-uni-blocks 0.13.9 → 0.13.10

package/mobile/bundle/bundle.umd.js

@@ -79,9 +79,15 @@
         get SITEMAP() {
             return this._.SITEMAP;
         }
+        get STICKY_MOBILE_MENU() {
+            return this._.STICKY_MOBILE_MENU;
+        }
         get FOOTER() {
             return this._.FOOTER;
         }
+        get PORTAL_DATA() {
+            return this._.PORTAL_DATA;
+        }
         get CHAT_BOT() {
             return this._.CHAT_BOT;
         }
@@ -510,10 +516,10 @@
         return await response.json();
     }
 
-    const REGIONS_URL = '/api/v1/regions';
+    const REGIONS_URL$1 = '/api/v1/regions';
     const EMPTY_VALUE$3 = [];
     function useGetRegions() {
-        const { data } = useAsyncData(REGIONS_URL, fetchJSONUnsafe);
+        const { data } = useAsyncData(REGIONS_URL$1, fetchJSONUnsafe);
         return data || EMPTY_VALUE$3;
     }
 
@@ -951,7 +957,7 @@
 
     const renderBusinessCardDataOrganization = (field) => (jsxs("div", { className: "sm:flex sm:justify-between sm:gap-lg", children: [jsxs("div", { className: "sm:w-1/2 space-y-s", children: [jsx(InputControl, { className: "shrink-0 w-full", label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { className: "shrink-0 w-full", label: "\u0418\u041D\u041D", ...withValidator(field('inn'), innValidator) })] }), jsxs("div", { className: "sm:w-1/2 space-y-s", children: [jsx(PhoneInputControl, { className: "shrink-0 w-full", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) }), jsx(InputControl, { className: "shrink-0 w-full", label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...withValidator(field('mail'), defaultValidator) })] })] }));
 
-    const renderRegion = ({ regions, field }) => (jsx(SelectControl, { className: "w-full", label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", isSearch: true, options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }));
+    const renderRegion$1 = ({ regions, field }) => (jsx(SelectControl, { className: "w-full", label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", isSearch: true, options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }));
 
     const initialFormState$3 = {
         name: '',
@@ -982,7 +988,7 @@
         }, [onSubmit]);
         const [, { field, ...formProps }] = useForm(initialFormState$3, handleSubmit);
         const regions = useGetRegions();
-        return (jsxs("form", { className: "container space-y-s", onSubmit: formProps.onSubmit, children: [renderRegion({ regions, field }), renderBusinessCardDataOrganization(field), renderSubmitButton(button), jsx(Footnote, { link: link })] }));
+        return (jsxs("form", { className: "container space-y-s", onSubmit: formProps.onSubmit, children: [renderRegion$1({ regions, field }), renderBusinessCardDataOrganization(field), renderSubmitButton(button), jsx(Footnote, { link: link })] }));
     });
 
     const BRANCHES_URL = '/api/v1/branches';
@@ -1139,8 +1145,9 @@
     });
 
     const EMPTY_VALUE$1 = {};
-    function useSWRResource(filename, fallback = EMPTY_VALUE$1) {
-        const { data } = useAsyncData(filename ? `/wcms-resources/${filename}.json` : null, fetchJSONUnsafe, { fallback });
+    const DEFAULT_FOLDER_NAME = 'wcms-resources';
+    function useSWRResource(filename, fallback = EMPTY_VALUE$1, folderName = DEFAULT_FOLDER_NAME) {
+        const { data } = useAsyncData(filename ? `/${folderName}/${filename}.json` : null, fetchJSONUnsafe, { fallback });
         return data || EMPTY_VALUE$1;
     }
 
@@ -1262,7 +1269,7 @@
     const ResponseNotification = JSX(({ responseType }) => {
         const responseOK = responseType === 'OK';
         const backgroundColor = responseOK ? 'bg-ok' : 'bg-fail';
-        return (jsxs("div", { className: `flex items-center p-lg rounded-md space-x-m ${backgroundColor}`, children: [responseOK ? (jsx(Img, { image: { icon: 'ResponceOKIcon' }, width: "42", height: "42" })) : (jsx(Img, { image: { icon: 'ResponceFailIcon' }, width: "37", height: "34" })), jsxs("div", { children: [jsx(Heading, { headingType: "h6", title: responseOK ? 'Ваша заявка отправлена' : 'Не удалось отправить заявку', className: "mb-2xs" }), jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: responseOK ? 'Совсем скоро мы с вами свяжемся' : 'Пожалуйста, повторите позднее' })] })] }));
+        return (jsxs("div", { className: `flex items-center p-lg rounded-md space-x-m ${backgroundColor}`, children: [responseOK ? (jsx(Img, { image: { icon: 'ResponseOKIcon' }, width: "42", height: "42" })) : (jsx(Img, { image: { icon: 'ResponseFailIcon' }, width: "37", height: "34" })), jsxs("div", { children: [jsx(Heading, { headingType: "h6", title: responseOK ? 'Ваша заявка отправлена' : 'Не удалось отправить заявку', className: "mb-2xs" }), jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: responseOK ? 'Совсем скоро мы с вами свяжемся' : 'Пожалуйста, повторите позднее' })] })] }));
     });
 
     const API = CorporateLeadAPI();
@@ -1540,11 +1547,17 @@
                 scrollToStart(containerRef.current);
             }
         }, [itemCount, canScrollRight]);
+        const scrollTo = useCallback((idx) => {
+            if (containerRef?.current) {
+                containerRef.current.children[idx]?.scrollIntoView();
+            }
+        }, [containerRef]);
         return [
             containerRef,
             {
                 scrollLeft,
                 scrollRight,
+                scrollTo,
                 canScrollLeft,
                 canScrollRight,
                 visibleIndicesRange: [minIndex, maxIndex],
@@ -2619,12 +2632,15 @@
     const renderItems = (items, isDotted, version = 'primary') => items?.length ? (jsx(List, { className: style('text-s', version === 'primary' ? '!text-secondary-text' : ''), items: items.filter((item) => item?.text).map((item) => item.text), isDotted: isDotted, listItemSize: "S" })) : null;
 
     const imageAlignmentMap = {
-        start: 'self-start',
-        center: 'self-center',
-        end: 'self-end',
+        start: '@xl:self-start',
+        center: '@xl:self-center',
+        end: '@xl:self-end',
     };
-    const BaseTile = JSX(({ className, defaultPadding, padding, title = '', insetTitle = '', buttons, leftImage, rightImage, imageAlign, backImage, children, }) => (jsxs("div", { className: style('relative flex flex-col gap-3xl font-sans overflow-hidden', padding || defaultPadding, className), children: [title ? jsx("div", { className: "relative", children: title }) : null, jsxs("div", { className: "grow relative flex flex-wrap @xl:flex-nowrap justify-around @xl:justify-between items-stretch gap-3xl", children: [renderImageContainer(leftImage, { imageAlign }), jsxs("div", { className: style('flex flex-col gap-3xl max-w-[600px] @xl:max-w-[728px]', leftImage ? '' : 'grow'), children: [insetTitle, jsx("div", { className: "grow", children: children }), backImage ? (jsx("div", { className: "mx-auto sm:absolute sm:-z-10 sm:-bottom-4 sm:-right-4", children: backImage })) : null, buttons] }), renderImageContainer(rightImage, { className: '-order-1 @xl:order-1', imageAlign })] })] })));
-    const renderImageContainer = (image, { className, imageAlign }) => image ? (jsx("div", { className: style('md:flex-shrink-0', imageAlign && imageAlignmentMap[imageAlign], className), children: image })) : null;
+    const BaseTile = JSX(({ className, defaultPadding, padding, title = '', insetTitle = '', buttons, leftImage, rightImage, imageAlign, backImage, children, }) => (jsxs("div", { className: style('relative flex flex-col gap-3xl font-sans overflow-hidden', padding || defaultPadding, className), children: [title ? jsx("div", { className: "relative", children: title }) : null, jsxs("div", { className: "grow relative flex flex-col @xl:flex-row justify-around @xl:justify-between items-stretch gap-3xl", children: [renderImageContainer(leftImage, { imageAlign }), jsxs("div", { className: style('flex flex-col gap-3xl max-w-[600px] @xl:max-w-[728px]', leftImage ? '' : 'grow'), children: [insetTitle, jsx("div", { className: "grow", children: children }), backImage ? (jsx("div", { className: "justify-center mx-auto sm:absolute sm:-z-10 sm:-bottom-4 sm:-right-4", children: backImage })) : null, buttons] }), renderImageContainer(rightImage, {
+                        className: '-order-1 @xl:order-1',
+                        imageAlign,
+                    })] })] })));
+    const renderImageContainer = (image, { className, imageAlign }) => image ? (jsx("div", { className: style('md:flex-shrink-0 self-center', imageAlign && imageAlignmentMap[imageAlign], className), children: image })) : null;
 
     const sum = (list = []) => list.reduce((a, b) => a + b, 0);
 
@@ -2668,12 +2684,14 @@
     const Tags = JSX(({ className, tags }) => tags?.length ? (jsx("div", { className: style('flex flex-wrap gap-xs', className), role: "list", children: tags.map(renderTag) })) : null);
     const renderTag = (tag, key) => (jsx("div", { className: "p-xs border-solid border rounded-md border-gray", role: "listitem", children: jsx(Text, { size: "text-m", font: "font-light", children: tag }) }, String(key)));
 
-    const BaseProductTile = JSX(({ className, padding, defaultPadding, title, description, headlineVersion = 'L', align = 'text-left', isInsetTitle = true, benefitsVersion, isTabularBenefits, benefits, __html, items, isDotted = true, listItemSize, tags, buttons, image, imageOptions: { imageAlign = 'end', directionRight = true, isBackground } = {}, children, }) => {
+    const BaseProductTile = JSX(({ className, padding, defaultPadding, title, description, headlineVersion = 'L', align = 'text-left', benefitsVersion, isTabularBenefits, benefits, __html, isFullWidthTitle = true, items, isDotted = true, listItemSize, tags = [], buttons, image, imageOptions: { imageAlign = 'end', directionRight = true, isBackground } = {}, children, }) => {
         const img = image?.src ? jsx(Img, { image: image }) : null;
         const headline = (jsx(Headline, { title: title, description: description, headlineVersion: headlineVersion, align: align, isEmbedded: true }));
-        return (jsx(BaseTile, { className: className, padding: padding, defaultPadding: defaultPadding, ...(isInsetTitle ? { insetTitle: headline } : { title: headline }), ...(isBackground ? { backImage: img } : leftOrRightImage(img, directionRight)), imageAlign: imageAlign, buttons: renderButtonsSection(buttons), children: jsxs("div", { className: "flex flex-col gap-xl", children: [jsx(BenefitsList, { benefitsVersion: benefitsVersion, isTabularBenefits: isTabularBenefits, benefits: benefits }), __html ? jsx(RichText, { __html: __html }) : null, items?.length ? (jsx(List, { items: items, isDotted: isDotted, listItemSize: listItemSize })) : null, children, tags?.length ? jsx(Tags, { tags: tags }) : null] }) }));
+        const filteredBenefits = benefits?.filter((_) => _?.type === 'rte' || 'label' in _ || 'description' in _);
+        return (jsx(BaseTile, { className: className, padding: padding, defaultPadding: defaultPadding, ...(isFullWidthTitle ? { insetTitle: headline } : { title: headline }), ...(isBackground ? { backImage: img } : leftOrRightImage(img, directionRight)), imageAlign: imageAlign, buttons: renderButtonsSection(buttons), children: jsxs("div", { className: "flex flex-col gap-xl", children: [filteredBenefits?.length ? (jsx(BenefitsList, { benefitsVersion: benefitsVersion, isTabularBenefits: isTabularBenefits, benefits: filteredBenefits })) : null, __html ? jsx(RichText, { __html: __html }) : null, items?.length ? (jsx(List, { items: items, isDotted: isDotted, listItemSize: listItemSize })) : null, children, renderTags(tags)] }) }));
     });
     const leftOrRightImage = (img, directionRight) => directionRight ? { rightImage: img } : { leftImage: img };
+    const renderTags = (tags) => (tags?.length ? jsx(Tags, { tags: tags }) : null);
 
     const CarouselProgramsCard = JSX(({ className, title, icon, list, href, target, ...rest }) => (jsx(BlockWrapper, { className: className, defaultPadding: "p-3xl", ...rest, children: jsx(LinkWrapper, { className: "flex items-center h-full", href: href, target: target, children: jsx(BaseProductTile, { title: title, headlineVersion: "XS", image: icon, imageOptions: { directionRight: false, imageAlign: 'center' }, benefits: list?.map((_) => ({
                     type: 'default',
@@ -2925,7 +2943,7 @@
     };
 
     const EXCHANGE_RATES_URL = '/api/v1/exchangerates';
-    const REGION_URL = '/api/v1/region';
+    const REGION_URL$1 = '/api/v1/region';
     function useFetchExchangeRateData() {
         const { data } = useAsyncData(EXCHANGE_RATES_URL, fetchData);
         return data || {};
@@ -2938,7 +2956,7 @@
     };
     const fetchRegion = async () => {
         try {
-            return await fetchJSONUnsafe(REGION_URL, { method: 'GET' });
+            return await fetchJSONUnsafe(REGION_URL$1, { method: 'GET' });
         }
         catch (error) {
             console.log(error);
@@ -3227,7 +3245,7 @@
     const renderInsuranceSumMonth = (sum, monthLimit) => sum || monthLimit ? (jsxs("div", { className: "flex flex-wrap xl:flex-nowrap xl:bg-main-divider xl:rounded-md p-xs gap-xl", children: [Number(sum) > 0 ? renderValueBlock('Страховая сумма:', sum) : null, Number(monthLimit) > 0 ? renderValueBlock('Ежемесячный лимит:', monthLimit) : null] })) : null;
     const renderValueBlock = (title, value = 0) => (jsxs("div", { className: "basis-full flex flex-col-reverse sm:flex-row sm:justify-between items-baseline whitespace-pre", children: [jsx(Text, { font: "font-light", size: "text-l", children: title }), jsxs(Text, { size: "text-h6", color: "text-primary-text", children: [toLocalNumberFormat(2)(value), " \u20BD"] })] }));
 
-    const PictureText = JSX(({ className, padding, headlineVersion = 'M', align = 'text-center', sum, monthLimit, imageOptions, ...rest }) => (jsx(BlockWrapper, { className: className, padding: "p-0", ...rest, children: jsx(BaseProductTile, { className: "h-full", defaultPadding: "p-6xl", padding: padding, headlineVersion: headlineVersion, align: align, isInsetTitle: false, imageOptions: { directionRight: false, imageAlign: 'center', ...imageOptions }, ...rest, children: renderInsuranceSumMonth(Number(sum), Number(monthLimit)) }) })));
+    const PictureText = JSX(({ className, padding, headlineVersion = 'M', align = 'text-center', sum, monthLimit, imageOptions, ...rest }) => (jsx(BlockWrapper, { className: className, padding: "p-0", ...rest, children: jsx(BaseProductTile, { className: "h-full", defaultPadding: "p-6xl", padding: padding, headlineVersion: headlineVersion, align: align, isFullWidthTitle: false, imageOptions: { directionRight: false, imageAlign: 'center', ...imageOptions }, ...rest, children: renderInsuranceSumMonth(Number(sum), Number(monthLimit)) }) })));
 
     const GOLDEN_RATIO = 1.618;
     const Placeholder = JSX(({ className, title, description = 'Блок в разработке...', ...rest }) => (jsxs(BlockWrapper, { className: style('box-border', className), ...rest, children: [jsx(Headline, { className: "max-w-[600px]", title: title, description: description, headlineVersion: "L", align: "text-left", isEmbedded: true }), jsx("figure", { className: "m-0 mt-xl min-w-[80%]", children: renderShimmer() })] })));
@@ -3700,6 +3718,413 @@
         return (jsx("div", { className: style(iconAreaSize, containerStyle, 'z-10 mr-s flex justify-center content-center'), children: jsx("span", { className: "flex self-center text-h4 text-secondary-text group-data-secondary:text-white", children: checkCanRenderIcon(step?.icon) ? (jsx(Img, { image: { ...step.icon, iconVersion: step.icon?.iconVersion || iconVersion }, width: iconSize, height: iconSize })) : (jsx("span", { children: i + 1 })) }) }));
     };
 
+    const useLatestEvent = (eventBus, type, initialEvent) => {
+        const [latestEvent, setLatestEvent] = useState(initialEvent || null);
+        useEffect(() => eventBus.subscribe(type, (_) => setLatestEvent(_)), [eventBus, type]);
+        const fireEvent = useCallback((_) => eventBus.fire(type, _), [eventBus, type]);
+        return [latestEvent, fireEvent];
+    };
+
+    const REGION_URL = '/api/v1/region';
+    const LOCATION_STORAGE_KEY = 'location';
+    function useLocation(defaultLocation = 'Москва') {
+        const [currentLocation, fireCurrentLocation] = useLatestEvent(defaultEventBus, 'location', restoreLocation() ?? { name: defaultLocation });
+        const selectCurrentLocation = useCallback((_) => {
+            storeLocation(_);
+            fireCurrentLocation(_);
+        }, []);
+        const { data } = useAsyncData(REGION_URL, fetchJSONUnsafe);
+        useEffect(() => {
+            if (data && !hasStoredLocation()) {
+                fireCurrentLocation(data);
+            }
+        }, [data]);
+        return [currentLocation ?? { name: defaultLocation }, selectCurrentLocation];
+    }
+    const hasStoredLocation = () => Boolean(globalThis.localStorage?.getItem(LOCATION_STORAGE_KEY));
+    const restoreLocation = () => {
+        try {
+            const data = globalThis.localStorage?.getItem(LOCATION_STORAGE_KEY);
+            return data && JSON.parse(data);
+        }
+        catch (ex) {
+            return null;
+        }
+    };
+    const storeLocation = (_) => {
+        try {
+            globalThis.localStorage?.setItem(LOCATION_STORAGE_KEY, JSON.stringify(_));
+        }
+        catch (ex) {
+            // Do nothing
+        }
+    };
+
+    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 SearchInput = JSX(({ className, value, autoFocus, onChange, onFocus }) => {
+        const handleChange = useCallback((ev) => {
+            onChange && onChange(ev.target?.value || '');
+        }, [onChange]);
+        return (jsxs("div", { className: style('font-sans relative', className), role: "form", children: [jsx("div", { className: "absolute h-full flex items-center pl-m pointer-events-none", children: jsx(Img, { image: { icon: 'LoupeIcon', iconVersion: 'black' }, width: "24", height: "24" }) }), jsx("input", { className: style('h-12 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: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443", autoFocus: autoFocus, onChange: handleChange, onFocus: onFocus })] }));
+    });
+
+    const useDebouncedEffect = (effect, deps, delay = 300) => useEffect(() => {
+        const timerId = setTimeout(effect, delay);
+        return () => {
+            clearTimeout(timerId);
+        };
+    }, deps);
+
+    const compareBy = (indexOf) => (a, b) => indexOf(a) - indexOf(b);
+    const desc = (cmp) => (a, b) => -cmp(a, b);
+
+    function zip(firstCol, ...restCols) {
+        return firstCol.map((firstEl, rowIndex) => [firstEl, ...restCols.map((col) => col[rowIndex])]);
+    }
+
+    const joinMaps = (aggregate, emptyVal) => (acc, map) => {
+        for (const [key, b] of map) {
+            acc.set(key, aggregate(acc.get(key) || emptyVal, b));
+        }
+        return acc;
+    };
+
+    const MIN_TERM_LEN = 3;
+    const tokenize = (text) => text
+        .toLowerCase()
+        .split(/[^0-9a-zа-я-]+/)
+        .filter((token) => token.length >= MIN_TERM_LEN && !/[0-9a-z]/.test(token));
+
+    const textRank = (queryTokens) => (text) => {
+        const textTokens = tokenize(text || '');
+        return textTokens.length
+            ? sum(queryTokens.map((qToken) => max(textTokens.map(jaroWinklerDistance(qToken)))))
+            : 0;
+    };
+
+    const JW_THRESHOLD = 0.8;
+    const RANK_EPS = 0.001;
+    const search = (query) => (searchIndex) => {
+        const { corpus, dictionary } = searchIndex || {};
+        if (!query || !corpus?.length || !dictionary || !Object.keys(dictionary).length) {
+            return [];
+        }
+        const queryTokens = tokenize(query);
+        if (!queryTokens.length) {
+            return [];
+        }
+        const dictEntries = Object.entries(dictionary);
+        const pagesRanking = queryTokens
+            .map(computePagesRankingPerToken(dictEntries))
+            .reduce(joinMaps((a, b) => a + b, 0), new Map());
+        const relevantPages = [...pagesRanking.entries()]
+            .filter(([, pageRank]) => pageRank >= (JW_THRESHOLD - RANK_EPS) * queryTokens.length) // Multiplication of query tokens
+            .map(([pageIndex]) => corpus[pageIndex]);
+        return sortResultsByRank(queryTokens)(relevantPages);
+    };
+    const computePagesRankingPerToken = (dictEntries) => (qToken) => dictEntries
+        .map(([stem, pageIndices]) => [jaroWinklerDistance(qToken)(stem), pageIndices])
+        .filter(([stemRank]) => stemRank >= JW_THRESHOLD)
+        .map(([stemRank, pageIndices]) => fillMapWith(pageIndices, stemRank))
+        .reduce(joinMaps(Math.max, 0), new Map());
+    const sortResultsByRank = (queryTokens) => (results) => zip(results, results.map(({ title }) => title).map(textRank(queryTokens)))
+        .sort(desc(compareBy(([, pageTitleRank]) => pageTitleRank)))
+        .map(([corpusItem]) => corpusItem);
+    const fillMapWith = (keys, value) => new Map(keys.map((_) => [_, value]));
+
+    const SEARCH_INDEX_FILENAME = 'search.index.json';
+    const DEFAULT_BASE_PATH = ['/'];
+    const useSearch = ({ basePathList = DEFAULT_BASE_PATH, initialQuery = '', wasOpened, }) => {
+        const [query, setQuery] = useState(initialQuery || '');
+        useEffect(() => {
+            if (initialQuery !== undefined && initialQuery !== null) {
+                setQuery(initialQuery);
+            }
+        }, [initialQuery]);
+        const key = useMemo(() => basePathList.map((_) => (wasOpened ? _ : null)), // Load search index on very first search
+        [wasOpened, basePathList]);
+        const { data } = useAsyncData(key, fetchSearchIndex);
+        const [result, setResult] = useState(null);
+        useDebouncedEffect(() => {
+            if (data) {
+                setResult(data.map(search(query)));
+            }
+        }, [data, query]);
+        return [result, { value: query, onChange: setQuery }];
+    };
+    const fetchSearchIndex = async (...basePathList) => (await Promise.allSettled(basePathList.map((basePath) => fetchJSON(joinPath(basePath, '/', SEARCH_INDEX_FILENAME))))).map((_) => (_.status === 'fulfilled' ? _.value : {}));
+
+    const Dialog = JSX(({ className, head, children, onClose }) => {
+        const { close } = useDialogManager();
+        const handleClose = useCallback(() => {
+            close();
+            onClose && onClose();
+        }, [onClose]);
+        return (jsxs("div", { className: style('relative min-h-full bg-white 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 Sitemap = JSX(({ className, topItems }) => {
+        const link = useLink({ isRemote: true });
+        return (jsx("div", { className: style('flex items-start justify-between', className), children: topItems?.map(link).map(renderColumn) }));
+    });
+    const renderColumn = (menuItem, index) => {
+        const { text, items, href, target, onClick } = menuItem;
+        return (jsxs("div", { className: "flex flex-col gap-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}` }), items
+                    ?.filter((_) => !_.displayArea || _.displayArea === 'Footer')
+                    .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 SearchDialog = JSX(({ initialQuery }) => {
+        const { topItems } = useSitemap();
+        const basePathList = useMemo(() => topItems?.map((_) => _.href || '/'), [topItems]);
+        const [searchResult, searchInputProps] = useSearch({
+            basePathList,
+            initialQuery,
+            wasOpened: false,
+        });
+        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 combineTopItemsAndSearchResult = (topItems) => (searchResult) => topItems?.length && searchResult?.length
+        ? zip(topItems, searchResult).map(([_, portalSearchResult]) => ({
+            ..._,
+            items: portalSearchResult?.map(({ title, uri }) => ({ text: title, href: joinPath('/', uri) })),
+        }))
+        : [];
+    // Temp
+    function printSearchItems(topItems) {
+        for (const _ of topItems.filter(({ items }) => items?.length)) {
+            console.group(_.text);
+            console.table(_.items, ['text', 'href']);
+            console.groupEnd();
+        }
+    }
+
+    const useSearchDialog = () => {
+        const { open, close } = useDialogManager();
+        return {
+            open: (props = {}, options = {}) => open(jsx(SearchDialog, { ...props }), options),
+            close,
+        };
+    };
+
+    const MIN_QUERY_LEN = 3;
+    const SearchBar$1 = 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 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 renderForeignOffices = (foreignOffices) => foreignOffices?.length ? (jsxs("div", { className: "border-t 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 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", 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: text })) : null] }));
+    });
+
+    const renderRegion = (onChangeLocation) => (region) => (jsx("div", { className: "mb-2xs", children: jsx("button", { className: "cursor-pointer hover:text-primary-hover", onClick: () => {
+                onChangeLocation && onChangeLocation(region);
+            }, children: region.name || '' }) }, region.id));
+
+    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 SearchBar = 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 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, { head: jsxs("div", { children: [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, { 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-2 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 TopItemMobile = ({ item, i, isActive }) => {
+        const link = useLink();
+        const { href, target, onClick } = link(item);
+        return (jsxs("a", { href: href, target: target, onClick: onClick, className: "relative", "aria-label": item.text, 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] }, String(i)));
+    };
+
+    const ActiveSubMenuItem = JSX(({ item, i }) => {
+        const link = useLink();
+        const { href, target, onClick } = link(item);
+        return (jsxs("a", { className: "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" })] }, `subItems-${String(i)}`));
+    });
+
+    const ActiveSubMenu = JSX(({ activeMenuSubItems }) => {
+        return activeMenuSubItems ? (jsx("div", { className: "mb-5", children: activeMenuSubItems.map((_, i) => (jsx(ActiveSubMenuItem, { item: _, i: i }))) })) : null;
+    });
+
+    const isHrefActive = (router) => ({ href }) => withoutQuery(isURL(href) ? router.href : router.pathname).startsWith(withoutQuery(href));
+
+    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 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 itemCount = Array.isArray(topItems) ? topItems.length : 0;
+        const [containerRef, scroll] = useSwipeListScroll({
+            itemCount,
+        });
+        const [activeTopItemIndex, activeRoute] = useActiveRoute(topItems);
+        const activeMenuSubItems = activeRoute?.items || [];
+        useEffect(() => {
+            if (activeTopItemIndex > 0) {
+                scroll.scrollTo(activeTopItemIndex);
+            }
+        }, [activeTopItemIndex, scroll]);
+        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, i: i, isActive: activeTopItemIndex === i }))) }) }), jsxs("div", { className: "relative grow overflow-auto", children: [jsx(ActiveSubMenu, { activeMenuSubItems: activeMenuSubItems }), jsx(SearchBar$1, { 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 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;
+
+    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 isDialogOpen = (id, dialogs) => dialogs.find((item) => item.id === id, id);
+
+    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 {
+                open();
+            }
+        }, [isBurgerMenuOpen]);
+        return [Boolean(isBurgerMenuOpen), { open, close, toggle }];
+    };
+
+    const renderMenuItems = (menuItems, onClick) => (jsx(BlockWrapper, { className: "sticky bottom-0 left-0 right-0 bg-transparent z-[100]", padding: "p-0", children: jsx("div", { className: "ml-auto container bg-white flex justify-center shadow-blue-gray", children: menuItems.map((_, i) => renderItem(_, i, onClick)) }) }));
+    const renderItem = (_, idx, onClick) => (jsxs("div", { className: style(_.isActive ? 'text-primary-main' : 'text-primary-text', `w-10 m-4 flex justify-center items-center flex-col text-[10px] cursor-pointer`), onClick: () => (_?.icon?.icon === 'BurgerIcon' && onClick ? onClick() : undefined), children: [jsx(Img, { className: "w-6 h-6", image: {
+                    icon: _.icon?.icon,
+                    iconVersion: _.icon?.iconVersion || 'black',
+                } }), _.title] }, `menuItems-${String(idx)}`));
+
+    const StickyBottomMenu = JSX(({ ...rest }) => {
+        const { menuItems = [] } = useSWRResource(projectSettings.STICKY_MOBILE_MENU || 'stickyBottomMenu', rest.options?.page?.fallback);
+        const [isBurgerMenuDialogOpen, { toggle }] = useBurgerMenuDialog();
+        const burgerMenu = {
+            title: 'Меню',
+            icon: {
+                icon: 'BurgerIcon',
+                iconVersion: isBurgerMenuDialogOpen ? 'color' : 'black',
+            },
+            isActive: isBurgerMenuDialogOpen,
+        };
+        const middleIdx = Math.floor(menuItems.length / 2);
+        const menuItemsWithButton = useMemo(() => [
+            ...menuItems.slice(0, middleIdx),
+            burgerMenu,
+            ...menuItems.slice(middleIdx),
+        ], [menuItems, middleIdx, burgerMenu]);
+        return (jsxs("div", { className: "contents", children: [renderMenuItems(menuItemsWithButton, toggle), isBurgerMenuDialogOpen ? jsx(BurgerMenuDialog, {}) : null] }));
+    });
+
     const tabPaddingStyleMap = {
         default: 'px-xs',
         underlined: 'px-m',
@@ -3895,6 +4320,7 @@
         RollupItem,
         SafeDepositRental,
         StepsBlock,
+        StickyBottomMenu,
         Tabs,
         TariffsTable,
         TextBlock,
@@ -3957,15 +4383,6 @@
         }, [scrollTarget]);
     }
 
-    const useDebouncedEffect = (effect, deps, delay = 300) => useEffect(() => {
-        const timerId = setTimeout(effect, delay);
-        return () => {
-            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 }) => {
@@ -3983,45 +4400,6 @@
     });
     const linkWrapperStyle = (href) => style('inline mx-2xs', href ? 'text-green-dark' : '');
 
-    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) {
@@ -4106,17 +4484,17 @@
             parent: data,
         };
         useBlockRouterProvider();
-        return (jsxs("div", { children: [jsxs("section", { className: style('relative @container', pageStyle, className), "data-theme": colorPalette, 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 @lg:grid @lg:grid-cols-12 @lg:gap-2xs", children: [renderChildren({ block: data, options, extraProps: { className: 'scroll-mt-12' } }), renderBlocksList(slots?.footer, { ...options, slotName: 'footer' })] }), likeControl ? renderLikeControl() : null] }), jsx(DialogManager, {}), jsx(CookiePopup, { termLink: { href: '/pd-policy#cookie', target: '_blank' }, personalDataPolicyLink: { href: '/pd-policy', target: '_blank' } })] }));
+        return (jsxs("div", { children: [jsxs("section", { className: style('relative @container', pageStyle, className), "data-theme": colorPalette, 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 @lg:grid @lg:grid-cols-12 @lg: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(CookiePopup, { termLink: { href: '/pd-policy#cookie', target: '_blank' }, personalDataPolicyLink: { href: '/pd-policy', target: '_blank' } })] }));
     });
     ContentPage.childrenTypes = [];
-    ContentPage.slots = () => ['header', 'footer'];
+    ContentPage.slots = () => ['header', 'footer', 'StickyBottomMenu'];
     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.13.9";
+    const packageVersion = "0.13.10";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;