@redneckz/wildless-cms-uni-blocks 0.14.14 → 0.14.16

package/bundle/bundle.umd.js

@@ -513,10 +513,10 @@
     }
 
     const REGIONS_URL$1 = '/api/v1/regions';
-    const EMPTY_VALUE$4 = [];
+    const EMPTY_VALUE$5 = [];
     function useGetRegions() {
         const { data } = useAsyncData(REGIONS_URL$1, fetchJSONUnsafe);
-        return data || EMPTY_VALUE$4;
+        return data || EMPTY_VALUE$5;
     }
 
     const useDialogManager = () => ({
@@ -638,7 +638,7 @@
 
     const ButtonInner = JSX((props) => {
         const { text, aboveText, appendLeft, appendRight, version = 'primary' } = props;
-        return (jsxs("div", { className: style(getButtonStyle(props), 'flex gap-xs'), children: [appendLeft ? jsx("div", { className: iconStyleMap[version], children: appendLeft }) : null, isWithText(props) ? (jsxs("div", { children: [aboveText ? jsx("div", { className: "text-xs font-light text-left", children: aboveText }) : null, jsx("div", { className: `text-left ${aboveText ? 'text-s -mt-3xs' : 'text-l'}`, children: text })] })) : null, appendRight ? jsx("div", { className: iconStyleMap[version], children: appendRight }) : null] }));
+        return (jsxs("div", { className: style(getButtonStyle(props), 'flex gap-xs'), children: [appendLeft ? jsx("div", { className: iconStyleMap[version], children: appendLeft }) : null, isWithText(props) ? (jsxs("div", { className: "whitespace-pre", children: [aboveText ? jsx("div", { className: "text-xs font-light text-left", children: aboveText }) : null, jsx("div", { className: `text-left ${aboveText ? 'text-s -mt-3xs' : 'text-l'}`, children: text })] })) : null, appendRight ? jsx("div", { className: iconStyleMap[version], children: appendRight }) : null] }));
     });
     const getButtonStyle = (props) => {
         const { version, aboveText, rounded } = props;
@@ -832,7 +832,7 @@
         return options.filter((_) => _.text?.toLocaleLowerCase().includes(query?.trim().toLocaleLowerCase()));
     };
 
-    const SelectPopup = JSX(({ popupRef, options, value, query, onChange }) => options?.length ? (jsx("div", { className: "bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md s1hadow-black", role: "listbox", ref: popupRef, children: filterOptions(options, query).map((option) => (jsxs("div", { className: "flex px-m py-s cursor-pointer hover:bg-main-divider pr-5xl relative", role: "option", "aria-selected": option.key === value?.key, onClick: () => onChange && onChange(option), children: [jsx("span", { className: "min-h-6", children: formatOption(option) }), jsx(Icon, { name: "DoneSimpleIcon", width: "16", height: "16", className: style('absolute right-4 pt-3xs', option.key === value?.key ? '' : 'hidden') })] }, option.key))) })) : null);
+    const SelectPopup = JSX(({ popupRef, options, value, query, onChange }) => options?.length ? (jsx("div", { className: "bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md", role: "listbox", ref: popupRef, children: filterOptions(options, query).map((option) => (jsxs("div", { className: "flex px-m py-s cursor-pointer hover:bg-main-divider pr-5xl relative", role: "option", "aria-selected": option.key === value?.key, onClick: () => onChange && onChange(option), children: [jsx("span", { className: "min-h-6", children: formatOption(option) }), jsx(Icon, { name: "DoneSimpleIcon", width: "16", height: "16", className: style('absolute right-4 pt-3xs', option.key === value?.key ? '' : 'hidden') })] }, option.key))) })) : null);
 
     function useSelectPopup({ isOpen, options, value, query, onChange, onClose, }) {
         const popup = usePopupManager();
@@ -972,14 +972,14 @@
     });
 
     const BRANCHES_URL = '/api/v1/branches';
-    const EMPTY_VALUE$3 = [];
+    const EMPTY_VALUE$4 = [];
     function useBranches(regionCode) {
         const { data } = useAsyncData(regionCode ? `${BRANCHES_URL}?regionCode=${regionCode}` : null, fetchSafeBoxes$1);
-        return data || EMPTY_VALUE$3;
+        return data || EMPTY_VALUE$4;
     }
     const fetchSafeBoxes$1 = async (url) => {
         const result = await fetchJSON(url, { method: 'GET' });
-        return result || EMPTY_VALUE$3;
+        return result || EMPTY_VALUE$4;
     };
 
     const MIN_CREDIT_AMOUNT = 1000;
@@ -1124,15 +1124,15 @@
         return (jsxs("form", { className: "container", onSubmit: formProps.onSubmit, children: [jsx(Heading, { headingType: "h6", title: "\u041E\u0441\u0442\u0430\u0432\u044C\u0442\u0435 \u0437\u0430\u044F\u0432\u043A\u0443 \u0438 \u043C\u044B \u043E\u0442\u0432\u0435\u0442\u0438\u043C \u043D\u0430 \u043B\u044E\u0431\u044B\u0435 \u0432\u043E\u043F\u0440\u043E\u0441\u044B \u043F\u043E \u0434\u0435\u043F\u043E\u0437\u0438\u0442\u0430\u043C", className: "@xl:text-center mb-m" }), jsxs("div", { className: "max-w-[560px] m-auto space-y-s", children: [jsx(InputControl, { className: "shrink-0 w-full", label: "\u0418\u043C\u044F", ...withValidator(field('name'), nameValidator) }), jsx(PhoneInputControl, { className: "shrink-0 w-full", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) })] }), jsxs("div", { className: "flex justify-between flex-col-reverse @xl:items-center @xl:flex-row max-w-[560px] m-auto", children: [jsx("div", { className: "flex-1", children: jsx(Footnote, { link: link }) }), renderSubmitButton(button)] })] }));
     });
 
-    const EMPTY_VALUE$2 = {};
+    const EMPTY_VALUE$3 = {};
     const DEFAULT_FOLDER_NAME = 'wcms-resources';
     function useSWRResource(filename, options = {}) {
-        const { fallback = EMPTY_VALUE$2, folderName = DEFAULT_FOLDER_NAME, setBasePath = false } = options;
+        const { fallback = EMPTY_VALUE$3, folderName = DEFAULT_FOLDER_NAME, setBasePath = false } = options;
         const path = joinPath('/', setBasePath ? projectSettings.BASE_PATH : '', folderName, `${filename}.json`);
         const { data } = useAsyncData(filename ? path : null, fetchJSONUnsafe, {
             fallback,
         });
-        return data || EMPTY_VALUE$2;
+        return data || EMPTY_VALUE$3;
     }
 
     const ApplicationFormGrantSupport = JSX((props) => {
@@ -1298,8 +1298,8 @@
     const AlignStyles = 'text-center';
 
     const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => (jsxs(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: [title ? jsx(Heading, { headingType: "h3", as: "h2", className: AlignStyles, title: title }) : null, benefitList?.length ? (jsx("div", { className: "flex flex-col @md:flex-row flex-wrap w-full @md:justify-center mt-xl gap-5xl", role: "list", children: benefitList.map(renderBenefit) })) : null] })));
-    const renderBenefit = (benefit, i) => (jsxs("div", { className: "flex gap-m items-center @md:basis-1/2 @md:max-w-[500px]", role: "listitem", children: [benefit?.icon?.icon ? (jsx(RoundedIcon, { className: "shrink-0", defaultIconSize: defaultIconSize, iconBgVersion: benefit?.iconBgVersion || '', ...benefit?.icon })) : null, benefit?.icon?.src ? jsx(Img, { className: "shrink-0", image: benefit.icon }) : null, benefit?.label ? (jsxs("div", { className: "@sm:h-full", children: [jsx(Heading, { headingType: "h6", children: benefit.label }), renderDescription$3(benefit.description)] })) : null] }, String(i)));
-    const renderDescription$3 = (description) => {
+    const renderBenefit = (benefit, i) => (jsxs("div", { className: "flex gap-m items-center @md:basis-1/2 @md:max-w-[500px]", role: "listitem", children: [benefit?.icon?.icon ? (jsx(RoundedIcon, { className: "shrink-0", defaultIconSize: defaultIconSize, iconBgVersion: benefit?.iconBgVersion || '', ...benefit?.icon })) : null, benefit?.icon?.src ? jsx(Img, { className: "shrink-0", image: benefit.icon }) : null, benefit?.label ? (jsxs("div", { className: "@sm:h-full", children: [jsx(Heading, { headingType: "h6", children: benefit.label }), renderDescription$2(benefit.description)] })) : null] }, String(i)));
+    const renderDescription$2 = (description) => {
         const benefitType = description?.benefitType || null;
         return description && benefitType ? (jsx("div", { className: "mt-xs text-l font-light text-secondary-text group-data-secondary:text-white/80", children: benefitType === 'list'
                 ? renderListBenefit(description)
@@ -1438,13 +1438,14 @@
 
     const BusinessBlock = JSX(({ className, title, cards, ...rest }) => (jsxs(BlockWrapper, { className: className, defaultPadding: "p-6xl space-y-3xl", ...rest, children: [jsx(Heading, { headingType: "h3", title: title, className: "text-center" }), jsx("div", { className: "flex gap-lg", children: cards?.length ? cards.map((_, i) => jsx(BusinessCard, { ..._ }, String(i))) : null })] })));
 
-    const alignStyleMap$1 = {
+    const AlignJustifyStyle = {
         start: 'justify-start',
         center: 'justify-center',
         end: 'justify-end',
     };
+
     const ButtonsBlock = JSX(({ buttons, className = '', align, ...rest }) => {
-        const alignStyle = align ? style('flex', alignStyleMap$1[align]) : '';
+        const alignStyle = align ? style('flex', AlignJustifyStyle[align]) : '';
         return (jsx(BlockWrapper, { className: style('!bg-transparent', alignStyle, className), defaultPadding: "p-0", ...rest, children: renderButtonsSection(buttons) }));
     });
 
@@ -2208,11 +2209,6 @@
         return (jsx("section", { className: "box-border relative bg-white flex shrink-0 self-start basis-full", role: "listitem", children: jsxs("div", { className: "box-border p-4xl w-full space-y-xl", children: [block?.title ? jsx(Heading, { className: "text-center", title: block.title }) : null, jsx(EmbeddedBlock, { ...block })] }) }, String(i)));
     };
 
-    const alignStyleMap = {
-        start: 'justify-start',
-        center: 'justify-center',
-        end: 'justify-end',
-    };
     const Calculator = JSX(({ className = '', tabAlign, calculatorTabs = [], ...rest }) => {
         const tabsNav = calculatorTabs.map((_) => _.nav || {});
         const calculatorBlocks = calculatorTabs.map(({ calculatorBlock }) => calculatorBlock || {});
@@ -2255,7 +2251,7 @@
     }
     function renderTabs$1({ activeIndex, tabsNav, tabAlign, slideIndexShift, onClick }) {
         const CARD_SHIFT = 388;
-        const alignStyle = tabAlign ? alignStyleMap[tabAlign] : '';
+        const alignStyle = tabAlign ? AlignJustifyStyle[tabAlign] : '';
         return (jsxs("div", { children: [jsx("div", { style: { transform: `translateX(-${activeIndex * CARD_SHIFT}px)` }, className: "flex flex-col justify-end items-center h-32 pt-4xl box-border duration-1000", children: jsx("div", { className: style('w-full flex flex-nowrap items-end gap-xs', alignStyle), children: tabsNav.map((tab, i) => renderNavButton$3({
                             tab,
                             i,
@@ -2624,13 +2620,13 @@
         center: '@xl:self-center',
         end: '@xl:self-end',
     };
-    const BaseTile = JSX(({ className, defaultPadding, padding, title = '', insetTitle = '', buttons, leftImage, rightImage, imageAlign, isImageAlwaysOnRight = false, isImageSecondary = false, 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: style('grow relative flex flex-col-reverse @xl:flex-row justify-around @xl:justify-between items-stretch gap-3xl'), children: [renderImageContainer(leftImage, { imageAlign }), jsxs("div", { className: style('grid gap-3xl', rightImage ? '@xl:grid-cols-2' : '', leftImage ? '' : 'grow'), children: [jsxs("div", { className: "grow grid gap-3xl row-span-1", children: [insetTitle, children] }), renderImageContainer(rightImage, {
-                                className: style('@xl:justify-self-end @xl:row-start-1 @xl:row-end-3 @xl:col-start-2 ', positionStyle(isImageAlwaysOnRight), isImageSecondary ? 'hidden @xl:block' : ''),
+    const BaseTile = JSX(({ className, defaultPadding, padding, title = '', insetTitle = '', buttons, leftImage, rightImage, imageAlign, isImageAlwaysOnRight = false, isImageSecondary = false, 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: style('grow relative flex flex-col-reverse @xl:flex-row justify-around @xl:justify-between items-stretch gap-3xl'), children: [renderImageContainer(leftImage, { imageAlign }), jsxs("div", { className: style('grid gap-3xl', rightImage ? '@xl:grid-cols-2' : '', leftImage ? '' : 'grow'), children: [jsxs("div", { className: "grow space-y-lg min-w-fit", children: [insetTitle, children] }), renderImageContainer(rightImage, {
+                                className: style('@xl:justify-self-end @xl:col-start-2', buttons ? rowSpanStyle(isImageAlwaysOnRight) : '', positionStyle(isImageAlwaysOnRight), isImageSecondary ? 'hidden @xl:block' : ''),
                                 imageAlign,
-                            }), jsx("div", { className: "self-end", children: buttons })] })] })] })));
-    const positionStyle = (isImageAlwaysOnRight) => isImageAlwaysOnRight
-        ? 'ml-xl justify-self-end row-start-1 row-end-3 col-start-2 self-center'
-        : '';
+                            }), renderButtons(buttons)] })] })] })));
+    const rowSpanStyle = (isImageAlwaysOnRight) => isImageAlwaysOnRight ? 'row-span-2' : '@xl:row-span-2';
+    const positionStyle = (isImageAlwaysOnRight) => isImageAlwaysOnRight ? 'justify-self-end col-start-2 self-center' : '';
+    const renderButtons = (buttons) => buttons ? jsx("div", { className: "self-end", children: buttons }) : null;
     const renderImageContainer = (image, { className, imageAlign }) => image ? (jsx("div", { className: style('shrink-1/2 justify-self-center', imageAlign && imageAlignmentMap[imageAlign], className), children: image })) : null;
 
     const cardStyleMap = {
@@ -2696,14 +2692,14 @@
     const List = JSX(({ className, hasIndent, isDotted, items, listItemSize = 'M' }) => items?.length ? (jsx("section", { className: style('flex flex-col gap-xs text-left text-primary-text group-data-secondary:text-white group-data-gray:text-secondary-text', TEXT_SIZE_MAP[listItemSize], hasIndent ? ITEM_INDENT_MAP[listItemSize] : '', className), role: "list", children: items.map((item, i) => (jsx(ListItem, { isDotted: isDotted, size: listItemSize, children: item }, String(i)))) })) : null);
 
     const CarouselProductCard = JSX(({ additionalDescription, align = AlignStyles, button = {}, className = '', description, headlineSmallVersion = 'H6', href, icon, isDotted = true, isButtonFullWidth = true, isImageFullWidth = false, isTopPosition = false, items = [], target, title, version = 'primary', ...rest }) => {
-        return (jsxs(BlockWrapper, { className: style('flex flex-col justify-between', className), defaultPadding: "p-0", version: version, ...rest, children: [jsxs(LinkWrapper, { className: "p-m flex flex-col gap-xs", href: href, target: target, children: [renderCardTitle(headlineSmallVersion, title, align), renderDescription$2(description, align), renderItems(items, isDotted, version), renderAdditionalDescription(additionalDescription, align), renderImage$2(icon, isImageFullWidth, isTopPosition)] }), renderButtonsSection([button], {
+        return (jsxs(BlockWrapper, { className: style('flex flex-col justify-between', className), defaultPadding: "p-0", version: version, ...rest, children: [jsxs(LinkWrapper, { className: "p-m flex flex-col gap-xs", href: href, target: target, children: [renderCardTitle(headlineSmallVersion, title, align), renderDescription$1(description, align), renderItems(items, isDotted, version), renderAdditionalDescription(additionalDescription, align), renderImage$2(icon, isImageFullWidth, isTopPosition)] }), renderButtonsSection([button], {
                     className: style('p-m pt-0', isButtonFullWidth ? '' : 'self-center'),
                     isVertical: isButtonFullWidth,
                 })] }));
     });
     const renderImage$2 = (image, isImageFullWidth, isTopPosition) => (jsxs("div", { className: style('flex gap-y-lg justify-center', isImageFullWidth ? 'min-w-full h-full' : '', isTopPosition ? 'order-first' : 'order-last'), children: [image?.src ? jsx(Img, { image: image }) : null, image?.icon ? (jsx(Img, { className: style(!isImageFullWidth ? 'w-8 h-8 min-w-8' : 'w-full h-full'), image: image })) : null] }));
     const renderCardTitle = (headlineSmallVersion, title, align) => title ? (jsx(Text, { align: align, size: HEADLINE_SMALL_VERSION[headlineSmallVersion], children: title })) : null;
-    const renderDescription$2 = (description, align) => description ? (jsx(Paragraph, { align: align, size: "text-l", children: description })) : null;
+    const renderDescription$1 = (description, align) => description ? (jsx(Paragraph, { align: align, size: "text-l", children: description })) : null;
     const renderAdditionalDescription = (additionalDescription, align) => additionalDescription ? (jsx(Text, { size: "text-m", font: "font-light", color: "text-secondary-text group-data-secondary:text-white/80", align: align, children: additionalDescription })) : null;
     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;
 
@@ -2968,9 +2964,7 @@
                                 return (jsx(FoldableSection, { className: style(resultsGridStyle), isUnfolded: isUnfolded, children: renderBlocksList(hiddenBlocks, { ...rest.options, parent: block }) }));
                             }, renderFoldButton: ({ isUnfolded, onToggle }) => (jsx(DefaultFoldButton, { className: style(topItemsCount < 1 ? 'hidden' : ''), disabled: !hiddenBlocks?.length, label: label, icon: ICONS[Number(isUnfolded)], dataTheme: rest.options?.page?.colorPalette, onClick: onToggle })) })] })] }));
     });
-    function renderNotFound({ title, description }) {
-        return (jsx("div", { className: "bg-white py-20", children: jsx(Headline, { title: title, description: description, headlineVersion: "S", isEmbedded: true }) }));
-    }
+    const renderNotFound = ({ title, description }) => (jsxs("div", { className: "bg-white p-6xl py-20 flex gap-s flex-col @xl:items-center", children: [jsx(Img, { image: { icon: 'MagnifierIcon' }, width: "120", height: "120" }), jsx(Headline, { title: title, description: description, headlineVersion: "S", isEmbedded: true, align: AlignStyles })] }));
 
     const isEmpty = (v) => v === null ||
         v === undefined ||
@@ -3157,7 +3151,7 @@
     const formatDate$1 = (date) => date.split('-').reverse().join('.');
 
     const DepositoryItem = ({ title, timestamp = '', publicId }) => {
-        const link = useLink();
+        const link = useLink({ basePath: '/' });
         const { href } = link({ href: `/api/v1/depository/${publicId}/file` });
         return (jsxs("div", { className: "grid grid-cols-12 py-lg border-gray border-opacity-50 border-b", children: [jsx("div", { className: "col-span-2 text-m", children: jsx("span", { children: formatDate$1(timestamp) }) }), jsx("div", { className: "col-span-10 text-h6 hover:text-primary-active", children: jsx("a", { href: href, download: true, "aria-label": "\u0421\u043A\u0430\u0447\u0430\u0442\u044C", children: title }) })] }, publicId));
     };
@@ -4147,8 +4141,6 @@
         return (jsx("div", { role: "listitem", children: jsx(LinkDocItem, { text: docBlockDef?.text, target: docBlockDef?.target, href: href, fileSize: fileSize, icon: icon ? jsx(Img, { className: linkIconStyle, image: icon, width: "24", height: "24" }) : null }) }, String(i)));
     };
 
-    const renderDescription$1 = (description) => description ? (jsx("div", { className: "mb-lg pt-3xs", children: jsx(Text, { size: "text-xl", "font-weight": "font-light", children: description }) })) : null;
-
     const renderList$1 = (items, listItemSize) => {
         return items?.length ? (jsx(List, { items: items, listItemSize: listItemSize, className: "text-l font-light" })) : (jsx("span", { className: "text-m font-light text-secondary-text", children: "\u041D\u0430\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u0430\u043C\u0435\u0440\u0443 \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u0430 \u043D\u0430 QR-\u043A\u043E\u0434 \u0438 \u0441\u043A\u0430\u0447\u0430\u0439\u0442\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435" }));
     };
@@ -4156,7 +4148,7 @@
     const MobileAppTile = JSX(({ className, padding, align = 'text-left', buttons = [], description, headingType = 'h4', image, items, listItemSize, qr, title = 'Мобильное приложение', version = 'primary', ...rest }) => {
         const containerStyle = version === 'secondary' ? 'p-m min-w-32' : 'min-w-24';
         const img = image?.src ? jsx(Img, { className: "hidden lg:block", image: image }) : null;
-        return (jsx(BlockWrapper, { className: style('min-h-80', className), padding: "p-0", version: version, ...rest, children: jsxs(BaseTile, { className: "h-full", padding: padding, defaultPadding: "p-6xl", title: title ? (jsx(Heading, { headingType: headingType, title: title, className: style('whitespace-pre-wrap', align) })) : null, rightImage: img, buttons: renderButtonsSection(buttons), children: [renderDescription$1(description), jsxs("div", { className: style('gap-m', 'flex flex-1 flex-col', 'flex-col items-start @4xl:flex-row @4xl:items-center'), children: [renderList$1(items, listItemSize), qr?.src ? (jsx("div", { className: style('flex justify-center bg-white rounded-md @4xl:-order-1', containerStyle), children: jsx(Img, { className: "w-fit", image: qr }) })) : null, image?.src ? jsx(Img, { className: "lg:hidden", image: image }) : null] })] }) }));
+        return (jsx(BlockWrapper, { className: style('min-h-80', className), padding: "p-0", version: version, ...rest, children: jsxs(BaseTile, { className: "h-full", padding: padding, defaultPadding: "p-6xl", title: title ? (jsx(Heading, { headingType: headingType, title: title, className: style('whitespace-pre-wrap', align) })) : null, rightImage: img, buttons: renderButtonsSection(buttons, { className: 'flex-wrap' }), children: [description ? (jsx(Text, { size: "text-xl", "font-weight": "font-light", children: description })) : null, jsxs("div", { className: style('gap-m', 'flex flex-1 flex-col', 'flex-col items-start @xl:flex-row @xl:items-center'), children: [renderList$1(items, listItemSize), qr?.src ? (jsx("div", { className: style('flex justify-center bg-white rounded-md @xl:-order-1', containerStyle), children: jsx(Img, { className: "w-fit", image: qr }) })) : null, image?.src ? jsx(Img, { className: "lg:hidden", image: image }) : null] })] }) }));
     });
 
     const badgeBgStyleMap = {
@@ -4398,6 +4390,10 @@
         useEffect(() => {
             if (!map?.current) {
                 yandexMaps?.ready(() => {
+                    // Ready function may be called few times, but must be called once
+                    if (map.current) {
+                        return;
+                    }
                     map.current = new yandexMaps.Map('map', {
                         center: pointsCenter,
                         zoom,
@@ -4413,7 +4409,7 @@
                     map.current.setCenter(DEFAULT_CENTER_COORDS);
                 }
             }
-        }, [yandexMaps, map, points]);
+        }, [yandexMaps, map, points, pointsCenter, zoom]);
         if (!yandexMaps) {
             return null;
         }
@@ -4437,6 +4433,29 @@
     const mapByIndex = (arr, index) => arr.map((a) => a[index]);
     const getArraySumAndAverage = (arr) => arr.length && arr.reduce((a, b) => a + b) / arr.length;
 
+    const FILTRATION_LABELS = {
+        safeBoxCaseVolumes: 'Аренда индивидуальных сейфовых ячеек',
+        workingSaturday: 'Открыты по субботам',
+        terminalTypeAtms: 'Банкоматы',
+        terminalTypeTerm: 'Терминалы',
+        workAllTime: 'Круглосуточно',
+        billAcceptorEnable: 'Прием наличных',
+    };
+    const renderFiltrationForm = (filters, { field, reset }) => (jsxs("div", { className: "pb-2xl", children: [filters?.length ? (jsx("div", { className: "flex flex-wrap gap-3xl pb-2xl", children: filters.map((key) => (jsx(Checkbox, { text: FILTRATION_LABELS[key], ...field(key) }, key))) })) : null, jsx(Button, { version: "transparent", className: "text-secondary-text [&>*]:p-0", onClick: reset, text: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440", appendRight: jsx(Icon, { name: "CloseIcon", width: "16", height: "16" }) })] }));
+
+    const defaultRenderCard = () => null;
+    const defaultFilterItems = () => [];
+    const OfficesAtmsMapLayout = JSX(({ className, data = [], renderCard = defaultRenderCard, filterItems = defaultFilterItems, initFilterState = {}, descriptionData, title, }) => {
+        const [filtrationState, { field, reset }] = useForm(initFilterState);
+        const filteredItems = filterItems(data, filtrationState);
+        const points = filteredItems
+            .map((_) => [_.gpsLatitude, _.gpsLongitude].filter(Boolean))
+            .filter((_) => _ && _.length === 2);
+        const lengthItems = filteredItems.length;
+        return (jsxs("div", { className: style('space-y-1', className), children: [jsxs("div", { className: "bg-white", children: [jsxs("div", { className: "pt-6xl px-6xl", children: [jsxs("div", { className: "flex gap-xs pb-2xl", children: [jsx(Heading, { headingType: "h2", children: title }), lengthItems ? (jsx(Text, { size: "text-h2", color: "text-secondary-text", children: `(${lengthItems})` })) : null] }), descriptionData ? renderDescriptionBlock$1(descriptionData) : null, renderFiltrationForm(Object.keys(initFilterState), { field, reset })] }), jsx("div", { className: "h-[600px]", children: jsx(ClientOnly, { children: jsx(YandexMap, { points: points, className: "h-full" }) }) })] }), filteredItems.map(renderCard)] }));
+    });
+    const renderDescriptionBlock$1 = (data) => (jsxs("div", { className: "p-xl mb-2xl border border-gray rounded-md", children: [data?.description ? (jsx(Paragraph, { size: "text-l", font: "font-light", children: data.description })) : null, data?.list?.length ? (jsx("div", { className: "flex gap-2xl flex-wrap pt-xs", children: data.list.map((item, i) => (jsxs("div", { className: "flex gap-xs items-center", children: [item?.image ? jsx(Img, { image: item.image }) : null, item?.text ? (jsx(Text, { size: "text-m", font: "font-light", children: item.text })) : null] }, String(i)))) })) : null] }));
+
     const colorStyle = {
         yellow: { border: 'border-yellow-light', text: 'text-yellow' },
         green: { border: 'border-green-light', text: 'text-green-dark' },
@@ -4477,6 +4496,47 @@
     const renderInfo = (item, index) => (jsx(CardCell, { ...item }, String(index)));
     const capitalizedFirstLetter = (text) => text ? `${text?.charAt(0)?.toUpperCase()}${text?.slice(1)}` : '';
 
+    const EMPTY_VALUE$2 = [];
+    function useAtms(regionCode) {
+        const { data = EMPTY_VALUE$2 } = useAsyncData(`/api/v1/atms?regionCode=${regionCode}`, fetchMap$1);
+        return data;
+    }
+    const fetchMap$1 = async (url) => {
+        const result = await fetchJSON(url, { method: 'GET' });
+        return result || EMPTY_VALUE$2;
+    };
+
+    const INITIAL_FILTRATION_STATE$1 = {
+        terminalTypeAtms: true,
+        terminalTypeTerm: false,
+        workAllTime: false,
+        billAcceptorEnable: false,
+    };
+    const FILTRATION_PREDICATES$1 = {
+        terminalTypeAtms: (item) => item.terminalType?.toLowerCase() === 'банкомат',
+        terminalTypeTerm: (item) => item.terminalType?.toLowerCase() === 'терминал',
+        workAllTime: (item) => item.workTime?.toLowerCase() === 'круглосуточно',
+        billAcceptorEnable: (item) => Boolean(item.billAcceptorEnable),
+    };
+    const AtmsMap = JSX(({ data, className }) => {
+        const [currentLocation] = useLocation();
+        const regionCode = currentLocation?.code ?? '000';
+        const officesData = useAtms(regionCode);
+        return (jsx(OfficesAtmsMapLayout, { className: className, filterItems: filterItems$1, data: officesData, initFilterState: INITIAL_FILTRATION_STATE$1, renderCard: renderAtmCard, title: `Банкоматы филиала ${currentLocation?.name}`, descriptionData: data }));
+    });
+    const filterItems$1 = (data, filtrationState) => {
+        const truthyFilters = Object.keys(filtrationState).filter((key) => filtrationState[key]);
+        const filtersOR = truthyFilters.filter((_) => _.startsWith('terminalType'));
+        const filtersAND = truthyFilters.filter((_) => !filtersOR.includes(_));
+        return data.filter((item) => {
+            const resultAND = filtersAND.every((_) => FILTRATION_PREDICATES$1[_](item));
+            const resultOR = filtersOR.length
+                ? filtersOR.some((_) => FILTRATION_PREDICATES$1[_](item))
+                : true;
+            return resultAND && resultOR;
+        });
+    };
+
     const WEEKDAY_MAP = [
         ['Понедельник', 'workingMonday'],
         ['Вторник', 'workingTuesday'],
@@ -4515,67 +4575,39 @@
     };
     const renderDay = ({ title, status, workTime, lunchHour, hasLunch }, index) => (jsx(CardCell, { label: title, value: status && workTime ? workTime : '', subText: !status ? 'Выходной' : lunchHour, subColor: !status || hasLunch ? 'text-error' : 'text-green-dark' }, String(index)));
 
-    const MAP_URL = {
-        offices: '/api/v1/branches',
-        atms: '/api/v1/atms',
-    };
     const EMPTY_VALUE$1 = [];
-    function useOfficesAtmsMap(regionCode, type = 'offices') {
-        const { data } = useAsyncData(`${MAP_URL[type]}?regionCode=${regionCode}`, fetchMap);
-        return data || EMPTY_VALUE$1;
+    function useOffices(regionCode) {
+        const { data = EMPTY_VALUE$1 } = useAsyncData(`/api/v1/branches?regionCode=${regionCode}`, fetchMap);
+        return data;
     }
     const fetchMap = async (url) => {
         const result = await fetchJSON(url, { method: 'GET' });
         return result || EMPTY_VALUE$1;
     };
 
-    const INITIAL_FILTRATION_OFFICES_STATE = {
-        safeBoxCaseVolumes: false,
+    const INITIAL_FILTRATION_STATE = {
+        //safeBoxCaseVolumes: false, //TODO: temp hide
         workingSaturday: false,
     };
-    const INITIAL_FILTRATION_ATMS_STATE = {
-        terminalTypeAtms: true,
-        terminalTypeTerm: false,
-        workAllTime: false,
-        billAcceptorEnable: false,
-    };
-    const FILTRATION_LABELS = {
-        safeBoxCaseVolumes: 'Аренда индивидуальных сейфовых ячеек',
-        workingSaturday: 'Открыты по субботам',
-        terminalTypeAtms: 'Банкоматы',
-        terminalTypeTerm: 'Терминалы',
-        workAllTime: 'Круглосуточно',
-        billAcceptorEnable: 'Прием наличных',
-    };
     const FILTRATION_PREDICATES = {
-        safeBoxCaseVolumes: (item) => Boolean(item.safeBoxCaseVolumes),
+        //safeBoxCaseVolumes: (item: Branch) => Boolean(item.safeBoxCaseVolumes), //TODO: temp hide
         workingSaturday: (item) => Boolean(item.workSchedule?.workingSaturday),
-        terminalTypeAtms: (item) => item.terminalType?.toLowerCase() === 'банкомат',
-        terminalTypeTerm: (item) => item.terminalType?.toLowerCase() === 'терминал',
-        workAllTime: (item) => item.workTime?.toLowerCase() === 'круглосуточно',
-        billAcceptorEnable: (item) => Boolean(item.billAcceptorEnable),
     };
-    const OfficesAtmsMap = JSX(({ data, className = '', ...rest }) => {
-        const dataType = data?.dataType ?? 'offices';
-        const initialState = dataType === 'offices' ? INITIAL_FILTRATION_OFFICES_STATE : INITIAL_FILTRATION_ATMS_STATE;
-        const [filtrationState, { field, reset }] = useForm(initialState);
+    const OfficesMap = JSX(({ className }) => {
         const [currentLocation] = useLocation();
-        const [regionCode, title] = useMemo(() => [currentLocation?.code || '000', getTitle(currentLocation?.name, dataType)], [currentLocation, dataType]);
-        const officesAtmsData = useOfficesAtmsMap(regionCode, dataType);
-        const filteredOfficesAtmsData = filterOfficesAtms(officesAtmsData, filtrationState);
-        const lengthOfficesAtms = filteredOfficesAtmsData.length;
-        const points = filteredOfficesAtmsData
-            .map((_) => [_.gpsLatitude, _.gpsLongitude].filter(Boolean))
-            .filter((_) => _ && _.length === 2);
-        return (jsxs(BlockWrapper, { version: "transparent", className: style('grid grid-cols-12 gap-1', className), defaultPadding: "p-0", ...rest, children: [jsxs("div", { className: "col-span-12 bg-white", children: [jsxs("div", { className: "pt-6xl px-6xl", children: [jsxs("div", { className: "flex gap-2 pb-2xl", children: [jsx(Heading, { headingType: "h2", children: title }), lengthOfficesAtms ? (jsx(Text, { size: "text-h2", color: "text-secondary-text", children: `(${lengthOfficesAtms})` })) : null] }), data && 'description' in data ? renderDescriptionBlock$1(data) : null, renderFiltrationForm(Object.keys(initialState), { field, reset })] }), jsx("div", { className: "h-[600px]", children: jsx(ClientOnly, { children: jsx(YandexMap, { points: points, className: "h-full" }) }) })] }), filteredOfficesAtmsData.map(dataType === 'offices' ? renderOfficeCard : renderAtmCard)] }));
+        const regionCode = currentLocation?.code ?? '000';
+        const officesData = useOffices(regionCode);
+        return (jsx(OfficesAtmsMapLayout, { className: className, filterItems: filterItems, data: officesData, initFilterState: INITIAL_FILTRATION_STATE, renderCard: renderOfficeCard, title: `Офисы филиала ${currentLocation?.name}` }));
     });
-    const filterOfficesAtms = (data, filtrationState) => {
+    const filterItems = (data, filtrationState) => {
         const truthyFilters = Object.keys(filtrationState).filter((key) => filtrationState[key]);
-        return data.filter((item) => truthyFilters.every((filterName) => FILTRATION_PREDICATES[filterName](item)));
+        return data.filter((item) => truthyFilters.every((_) => FILTRATION_PREDICATES[_](item)));
     };
-    const getTitle = (name = '', dataType = 'offices') => dataType === 'offices' ? `Офисы филиала ${name}` : `Банкоматы филиала ${name}`;
-    const renderFiltrationForm = (filters, { field, reset }) => (jsxs("div", { className: "pb-2xl", children: [filters?.length ? (jsx("div", { className: "flex flex-wrap gap-3xl pb-2xl", children: filters.map((key) => (jsx(Checkbox, { text: FILTRATION_LABELS[key], ...field(key) }, key))) })) : null, jsx(Button, { version: "transparent", className: "text-secondary-text [&>*]:p-0", onClick: reset, text: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440", appendRight: jsx(Icon, { name: "CloseIcon", width: "16", height: "16" }) })] }));
-    const renderDescriptionBlock$1 = ({ description, list }) => (jsxs("div", { className: "p-xl mb-2xl border border-gray rounded-md", children: [jsx(Paragraph, { size: "text-l", font: "font-light", children: description }), list?.length ? (jsx("div", { className: "flex gap-2xl flex-wrap pt-xs", children: list.map((item, i) => (jsxs("div", { className: "flex gap-xs items-center", children: [item?.image ? jsx(Img, { image: item.image }) : null, item?.text ? (jsx(Text, { size: "text-m", font: "font-light", children: item.text })) : null] }, String(i)))) })) : null] }));
+
+    const OfficesAtmsMap = JSX(({ data, className, ...rest }) => {
+        const dataType = data?.dataType ?? 'offices';
+        return (jsx(BlockWrapper, { version: "transparent", className: style(className), defaultPadding: "p-0", ...rest, children: dataType === 'offices' ? jsx(OfficesMap, {}) : jsx(AtmsMap, { data: data }) }));
+    });
 
     const ParagraphBlock = JSX(({ text, size, align, font, children, ...rest }) => (jsx(BlockWrapper, { defaultPadding: "p-0", ...rest, children: jsx(Paragraph, { size: size, align: align, font: font, children: text || children }) })));
 
@@ -5451,7 +5483,7 @@
         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 packageVersion = "0.14.14";
+    const packageVersion = "0.14.16";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;