@redneckz/wildless-cms-uni-blocks 0.13.18 → 0.13.20

package/mobile/bundle/bundle.umd.js

@@ -1488,7 +1488,7 @@
                 });
             }
         };
-        return dotCount ? (jsx("div", { className: style('flex gap-xs', containerStyles[listType], version ? 'group' : ''), ...(version ? { 'data-ver': version } : {}), children: new Array(dotCount).fill(null).map((_, idx) => (jsx("div", { className: `${dotStyle} ${idx === activeIndex ? activeDotStyles[listType] : inactiveDotStyle}`, role: "button", "aria-hidden": true, onClick: () => handleClick(idx) }, String(idx)))) })) : null;
+        return dotCount ? (jsx("div", { className: style('flex gap-xs @lg:hidden', containerStyles[listType], version ? 'group' : ''), ...(version ? { 'data-ver': version } : {}), children: new Array(dotCount).fill(null).map((_, idx) => (jsx("div", { className: `${dotStyle} ${idx === activeIndex ? activeDotStyles[listType] : inactiveDotStyle}`, role: "button", "aria-hidden": true, onClick: () => handleClick(idx) }, String(idx)))) })) : null;
     });
 
     const areArraysEqual = (as, bs) => as === bs || Boolean(as && bs && as?.length === bs?.length && as.every((_, i) => _ === bs[i]));
@@ -1634,8 +1634,8 @@
     const calculatorValueBlockStyle = 'flex justify-between md:flex-col';
     const CalculatorValueBlock = JSX(({ title, value, postfix = '', prefix, className = '' }) => (jsxs("div", { className: style(calculatorValueBlockStyle, className), children: [title ? (jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: title })) : null, value ? (jsx("div", { children: jsxs(Text, { size: "text-h3", children: [prefix, " ", toLocalNumberFormat(2)(Math.round(value)), " ", postfix] }) })) : (jsx("div", { children: jsx(Text, { size: "text-h3", children: "-" }) }))] })));
 
-    const DEFAULT_MIN_SUM = 10000;
-    const DEFAULT_MAX_SUM = 5000000;
+    const DEFAULT_MIN_SUM$1 = 10000;
+    const DEFAULT_MAX_SUM$1 = 5000000;
     const CREDIT_DEFAULT_SUM = 200000;
     const REFINANCING_DEFAULT_SUM = 700000;
     const REFINANCING_DEFAULT_MAX_SUM = 3000000;
@@ -1645,11 +1645,11 @@
     const REFINANCING_EXTRA_MIN_SUM = 0;
     const REFINANCING_EXTRA_MAX_SUM = 500000;
     const DEPOSIT_DEFAULT_SUM = 20000;
-    const DEFAULT_MIN_MONTHS = 13;
+    const DEFAULT_MIN_MONTHS$1 = 13;
     const DEFAULT_REFINANCING_MIN_MONTHS = 13;
     const DEFAULT_REFINANCING_MONTHS = 48;
-    const DEFAULT_MAX_MONTHS = 60;
-    const DEFAULT_MONTHS = Math.round((DEFAULT_MAX_MONTHS - DEFAULT_MIN_MONTHS) / 2);
+    const DEFAULT_MAX_MONTHS$1 = 60;
+    const DEFAULT_MONTHS = Math.round((DEFAULT_MAX_MONTHS$1 - DEFAULT_MIN_MONTHS$1) / 2);
     const BUSINESS_DEFAULT_SUM = 100000;
     const BUSINESS_MIN_DAYS = 1;
     const BUSINESS_MAX_DAYS = 1095;
@@ -1660,10 +1660,10 @@
     const MONTHS_IN_YEAR = 12;
     const MONTHLY_INTEREST_RATE = MONTHS_IN_YEAR * 100;
     const DEFAULT_CREDIT_CALCULATOR_PARAMS = {
-        minSum: DEFAULT_MIN_SUM,
-        maxSum: DEFAULT_MAX_SUM,
-        minMonths: DEFAULT_MIN_MONTHS,
-        maxMonths: DEFAULT_MAX_MONTHS,
+        minSum: DEFAULT_MIN_SUM$1,
+        maxSum: DEFAULT_MAX_SUM$1,
+        minMonths: DEFAULT_MIN_MONTHS$1,
+        maxMonths: DEFAULT_MAX_MONTHS$1,
         rate: 0,
         isSalaryClient: false,
         isPensionClient: false,
@@ -1671,14 +1671,14 @@
         isInsurance: true,
     };
     const DEFAULT_REFINANCING_CALCULATOR_PARAMS = {
-        minSum: DEFAULT_MIN_SUM,
+        minSum: DEFAULT_MIN_SUM$1,
         maxSum: REFINANCING_DEFAULT_MAX_SUM,
         minSumOld: REFINANCING_OLD_MIN_SUM,
         maxSumOld: REFINANCING_OLD_MAX_SUM,
         minSumExtra: REFINANCING_EXTRA_MIN_SUM,
         maxSumExtra: REFINANCING_EXTRA_MAX_SUM,
         minMonths: DEFAULT_REFINANCING_MIN_MONTHS,
-        maxMonths: DEFAULT_MAX_MONTHS,
+        maxMonths: DEFAULT_MAX_MONTHS$1,
         rate: 0,
         isExtraMoney: false,
         isSalaryClient: false,
@@ -2520,7 +2520,7 @@
         'border border-solid border-gray group-data-secondary:border-white/50 group-data-gray:border-main-divider');
     const isCardHighlighted = (_) => _?.content && 'isHighlighting' in _.content && _.content.isHighlighting;
 
-    const Carousel = JSX(({ className, itemCount, visibleItemCount = 0, noCardBorder, isAlignCenter, showDots, arrowsPadded = true, isGap = true, cardSize = 'normal', ...rest }) => {
+    const Carousel = JSX(({ className, itemCount, visibleItemCount = 0, noCardBorder, isAlignCenter, arrowsPadded = true, isGap = true, cardSize = 'normal', ...rest }) => {
         const { blocks: childBlocks = [] } = rest.block || {};
         const count = itemCount || childBlocks?.length;
         const [activeIndex, { inc: increaseActiveIndex, dec: decreaseActiveIndex }] = useCarouselControls({
@@ -2531,7 +2531,7 @@
         const [dotsActiveIndex] = scroll.visibleIndicesRange;
         // TODO Remove
         const isBankHistoryCarousel = childBlocks && childBlocks[0]?.type === 'CarouselBankHistoryCard';
-        return (jsx(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: jsxs("div", { className: style(isAlignCenter ? 'flex justify-center' : '', 'relative max-w-full'), children: [jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: visibleItemCount, snapAlign: "snap-start", gap: isGap ? ITEMS_GAP : undefined, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: renderCarouselCards({ noCardBorder, activeIndex, cardSize, ...rest }) }), jsx(CarouselScrollButtons, { scroll: scroll, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count }), showDots ? (jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: dotsActiveIndex, dotCount: count, listType: "horizontal-list" })) : null] }) }));
+        return (jsxs(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: [jsxs("div", { className: style(isAlignCenter ? 'flex justify-center' : '', 'relative max-w-full'), children: [jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: visibleItemCount, snapAlign: "snap-start", gap: isGap ? ITEMS_GAP : undefined, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: renderCarouselCards({ noCardBorder, activeIndex, cardSize, ...rest }) }), jsx(CarouselScrollButtons, { scroll: scroll, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count })] }), jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: dotsActiveIndex, dotCount: count, listType: "horizontal-list" })] }));
     });
     Carousel.childrenTypes = [
         'CarouselCard',
@@ -2584,7 +2584,7 @@
     const CarouselLinks = JSX(({ className, additionalDescription, description, links, title, maxLinksCount = 10, ...rest }) => (jsxs(BlockWrapper, { className: style('flex flex-col sm:flex-row w-full overflow-hidden', className), ...rest, children: [jsxs("div", { className: "mr-xl flex-auto", children: [jsx(Headline, { isEmbedded: true, title: title, description: description, as: "h1", align: "text-left" }), additionalDescription ? (jsx(Headline, { className: "pt-m", description: additionalDescription, align: "text-left", isEmbedded: true })) : null] }), links?.length ? renderLinks(links, maxLinksCount) : null] })));
     const renderLinks = (links, maxLinksCount) => {
         const itemCount = Math.ceil(links.length / maxLinksCount);
-        return (jsx(Carousel, { className: "@container-normal sm:w-2/3 w-full p-0 sm:p-xs", version: "secondary", itemCount: itemCount, arrowsPadded: false, showDots: false, children: new Array(itemCount).fill(null).map((_, groupIndex) => (jsx("div", { className: style('flex flex-wrap self-start w-full sm:w-[672px]'), children: links
+        return (jsx(Carousel, { className: "@container-normal sm:w-2/3 w-full p-0 sm:p-xs", version: "secondary", itemCount: itemCount, arrowsPadded: false, children: new Array(itemCount).fill(null).map((_, groupIndex) => (jsx("div", { className: style('flex flex-wrap self-start w-full sm:w-[672px]'), children: links
                     .slice(groupIndex * maxLinksCount, (groupIndex + 1) * maxLinksCount)
                     .map((link, index) => (jsx(CarouselLinkButton, { className: "sm:m-2xs", ...link }, String(index)))) }, String(groupIndex)))) }));
     };
@@ -2740,6 +2740,11 @@
             iconMapped: { icon: 'YoutubeIcon' },
             label: 'Youtube',
         },
+        {
+            origins: ['rutube.ru'],
+            iconMapped: { icon: 'RutubeIcon' },
+            label: 'Rutube',
+        },
     ];
 
     const findIconByHref = (href) => ICONS_MAP.find(({ origins }) => origins?.some((_) => href?.includes(_))) || {};
@@ -3141,12 +3146,12 @@
             e.preventDefault();
             router.back();
         }, []);
-        return (jsxs("div", { className: "flex items-center justify-between w-full", children: [isRootLocation ? (jsx(Logo, { className: "mt-2xs", bgColor: bgColor, logo: logo })) : (renderBackButton(onClick)), internetBankUrl ? (jsx(Button, { href: internetBankUrl, ariaLabel: "\u0412\u043E\u0439\u0442\u0438", target: "_blank", className: style('p-s text-s whitespace-nowrap text-primary-main hover:text-primary-hover', BUTTON_STYLE[version === 'transparent' ? 'transparent' : 'default']), children: "\u0412\u043E\u0439\u0442\u0438" })) : null] }));
+        return (jsxs("div", { className: "flex items-center justify-between w-full", children: [isRootLocation ? (jsx("div", { children: jsx(Logo, { className: "my-2xs", bgColor: bgColor, logo: logo }) })) : (renderBackButton(onClick)), internetBankUrl ? (jsx("div", { children: jsx(Button, { href: internetBankUrl, ariaLabel: "\u0412\u043E\u0439\u0442\u0438", target: "_blank", className: style('p-s text-s whitespace-nowrap text-primary-main hover:text-primary-hover', BUTTON_STYLE[version === 'transparent' ? 'transparent' : 'default']), children: "\u0412\u043E\u0439\u0442\u0438" }) })) : null] }));
     });
-    const renderBackButton = (onClick) => (jsxs("button", { className: "flex items-center text-l mt-2xs", "aria-label": "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434", onClick: onClick, children: [jsx(Img, { className: "w-6 h-6", image: {
-                    icon: 'ChevronLeftIcon',
-                    iconVersion: 'black',
-                }, width: "24", height: "24" }), "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434"] }));
+    const renderBackButton = (onClick) => (jsx("div", { children: jsxs("button", { className: "flex items-center text-l my-2xs", "aria-label": "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434", onClick: onClick, children: [jsx(Img, { className: "w-6 h-6", image: {
+                        icon: 'ChevronLeftIcon',
+                        iconVersion: 'black',
+                    }, width: "24", height: "24" }), "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434"] }) }));
 
     const BG_COLOR_TO_BLOCK_VERSION = {
         'bg-white': 'primary',
@@ -3267,19 +3272,26 @@
     const renderShimmerItem = (width, index) => (jsx("div", { style: { width: `${width || 100}%` }, className: "h-4 mt-xs bg-secondary-light" }, String(index)));
     const goldenSequence = (first, size) => [first].concat(size > 0 ? goldenSequence(first / GOLDEN_RATIO, size - 1) : []);
 
-    function renderBackwardButton({ text, href, target, icon }, version) {
+    function renderBackwardButton(version, handleClick) {
         const iconVersion = version === 'primary' ? 'white' : 'black';
-        const commonProps = { text, href, target, ariaLabel: text };
-        return (jsxs("div", { className: "flex items-center gap-s", children: [jsx(Button, { className: "w-12 h-12 min-h-12 min-w-12 flex items-center justify-center", version: version, rounded: true, ...commonProps, children: jsx(Img, { className: "w-4 h-4", image: {
-                            ...icon,
-                            icon: icon?.icon || 'ArrowLeftIcon',
-                            iconVersion: icon?.iconVersion || iconVersion,
-                        } }) }), jsx(Button, { version: "link", ...commonProps })] }));
+        const className = 'w-12 h-12 min-h-12 min-w-12 flex items-center justify-center';
+        const text = 'Вернуться назад';
+        return (jsxs("div", { className: "flex items-center gap-s", children: [jsx("div", { className: getRegularButtonClasses({ className, version, rounded: true }), onClick: handleClick, children: jsx(Img, { className: "w-4 h-4", image: {
+                            icon: 'ArrowLeftIcon',
+                            iconVersion: iconVersion,
+                        } }) }), jsx(Button, { version: "link", text: text, ariaLabel: text, onClick: handleClick })] }));
     }
 
-    const ProductBlock = JSX(({ className, padding, backwardButton, ...rest }) => (jsxs(BlockWrapper, { className: style('overflow-hidden flex flex-col gap-3xl box-border', className), defaultPadding: "p-6xl", padding: padding, ...rest, children: [backwardButton?.text
-                ? renderBackwardButton(backwardButton, !rest.version || rest.version === 'primary' ? 'primary' : 'white')
-                : null, jsx(BaseProductTile, { className: "grow h-full", ...rest })] })));
+    const ProductBlock = JSX(({ className, padding, backwardButton, ...rest }) => {
+        const router = useRouter();
+        const handleClick = useCallback((ev) => {
+            ev?.preventDefault();
+            router.back();
+        }, []);
+        return (jsxs(BlockWrapper, { className: style('overflow-hidden flex flex-col gap-3xl box-border', className), defaultPadding: "p-6xl", padding: padding, ...rest, children: [backwardButton
+                    ? renderBackwardButton(!rest.version || rest.version === 'primary' ? 'primary' : 'white', handleClick)
+                    : null, jsx(BaseProductTile, { className: "grow h-full", ...rest })] }));
+    });
 
     const ProductGallery = JSX(({ className, padding, slides = [], ...rest }) => (jsx(BlockWrapper, { className: style('overflow-hidden relative', className), padding: padding, ...rest, children: jsx(SwipeListControl, { gap: 0, padding: 0, children: slides
                 .map((s) => s.productBlock)
@@ -3730,7 +3742,9 @@
         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 isHrefActive = (router) => ({ href }) => withoutQuery(isURL(href) ? router.href : router.pathname).startsWith(withoutQuery(href));
+    const isHrefActive = (router) => ({ href }) => !href
+        ? false
+        : withoutQuery(isURL(href) ? router.href : router.pathname).startsWith(withoutQuery(href));
 
     const isTopItemActive = (router) => isHrefActive(projectSettings.BASE_PATH ? { pathname: projectSettings.BASE_PATH } : router);
 
@@ -3790,7 +3804,7 @@
             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 })] }));
+        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';
@@ -4021,14 +4035,14 @@
         const isAnotherPortal = projectSettings.BASE_PATH && basePath ? !projectSettings.BASE_PATH.startsWith(basePath) : false;
         const link = useLink({ isRemote: isAnotherPortal, basePath });
         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" })] }));
+        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 ActiveSubMenu = JSX(({ activeMenuSubItems, basePath }) => {
-        return activeMenuSubItems ? (jsx("div", { className: "mb-5", children: activeMenuSubItems.map((_, i) => (jsx(ActiveSubMenuItem, { item: _, basePath: basePath }, String(i)))) })) : null;
-    });
+    const ActiveSubMenu = JSX(({ activeMenuSubItems, basePath }) => activeMenuSubItems ? (jsx("div", { className: "mb-5", children: activeMenuSubItems.map((_, i) => (jsx(ActiveSubMenuItem, { item: _, basePath: basePath }, String(i)))) })) : null);
 
-    const TopItemMobile = ({ item, isActive, onClick }) => (jsxs("button", { type: "button", 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 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 BurgerMenuDialog = JSX((props) => {
         const { topItems, officesLink, defaultLocation } = useSitemap(props.options?.page?.fallback);
@@ -4055,22 +4069,27 @@
     });
     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 RenderItem = JSX(({ item, onClick }) => {
+    const RenderItem = JSX(({ isActive, item, onClick }) => {
         const isAnotherPortal = projectSettings?.BASE_PATH
-            ? !item.url?.startsWith(projectSettings?.BASE_PATH)
+            ? !item.href?.startsWith(projectSettings?.BASE_PATH)
             : true;
         const link = useLink({ isRemote: isAnotherPortal });
         const { href, target, onClick: handleClick, } = link({
-            href: item.url,
+            href: item.href,
             target: '_self',
         });
-        return (jsxs("a", { className: style(item.isActive ? 'text-primary-main' : 'text-primary-text', `w-10 m-4 flex justify-center items-center flex-col text-[10px] cursor-pointer`), onClick: () => (item?.icon?.icon === 'BurgerIcon' && onClick ? onClick() : handleClick()), href: href, target: target, children: [jsx(Img, { className: "w-6 h-6", image: {
+        const isActiveItem = item?.icon?.icon === 'BurgerIcon' ? item.isActive : isActive;
+        const iconVersion = isActiveItem ? 'color' : 'black';
+        return (jsxs("a", { className: style(isActiveItem ? 'text-primary-main' : 'text-primary-text', `w-10 m-4 flex justify-center items-center flex-col text-xs cursor-pointer`), onClick: () => (item?.icon?.icon === 'BurgerIcon' && onClick ? onClick() : handleClick()), href: href, target: target, children: [jsx(Img, { className: "w-6 h-6", image: {
                         icon: item?.icon?.icon,
-                        iconVersion: item?.icon?.iconVersion || 'black',
+                        iconVersion: iconVersion,
                     } }), item.title] }));
     });
 
-    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) => (jsx(RenderItem, { item: _, onClick: onClick }, String(i)))) }) }));
+    const RenderMenuItems = JSX(({ menuItems, onClick }) => {
+        const [activeIndex] = useActiveRoute(menuItems);
+        return (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) => (jsx(RenderItem, { isActive: i === activeIndex, item: _, onClick: onClick }, String(i)))) }) }));
+    });
 
     function useList(initialList = []) {
         const [list, setList] = useState(initialList);
@@ -4147,7 +4166,7 @@
             burgerMenu,
             ...menuItems.slice(middleIdx),
         ], [menuItems, middleIdx, burgerMenu]);
-        return (jsxs("div", { className: "contents", children: [renderMenuItems(menuItemsWithButton, toggle), isBurgerMenuDialogOpen ? jsx(BurgerMenuDialog, {}) : null] }));
+        return (jsxs("div", { className: "contents", children: [jsx(RenderMenuItems, { menuItems: menuItemsWithButton, onClick: toggle }), isBurgerMenuDialogOpen ? jsx(BurgerMenuDialog, {}) : null] }));
     });
 
     const tabPaddingStyleMap = {
@@ -4309,6 +4328,179 @@
 
     const Tile = JSX(({ className, padding, headlineVersion = 'S', listItemSize = 'M', ...rest }) => (jsx(BlockWrapper, { className: className, padding: "p-0", ...rest, children: jsx(BaseProductTile, { className: "h-full", defaultPadding: "p-xl", padding: padding, headlineVersion: headlineVersion, listItemSize: listItemSize, ...rest }) })));
 
+    const isEmpty = (v) => v === null ||
+        v === undefined ||
+        v === '' ||
+        (Array.isArray(v) && v.length === 0) ||
+        (typeof v === 'object' && Object.keys(v).length === 0);
+
+    const isSingularFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) || isEmpty(target[key]) || pattern[key] === target[key];
+    const isMultipleFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) ||
+        isEmpty(target[key]) ||
+        pattern[key]?.some((_) => target[key]?.includes(_));
+    const isNumberFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) ||
+        isEmpty(target[key]) ||
+        naturalNumber(pattern[key]) <= naturalNumber(target[key]);
+    const isValueInRange = (key, pattern) => (target) => isEmpty(pattern[key]) ||
+        isEmpty(target[key]) ||
+        (naturalNumber(pattern[key]?.min) >= naturalNumber(target[key]?.min) &&
+            naturalNumber(pattern[key]?.min) <= naturalNumber(target[key]?.max));
+    const checkShouldRenderBlock = (pattern, target) => Object.entries(pattern)
+        .map(([key, subPattern]) => {
+        if (typeof subPattern === 'number') {
+            return isNumberFieldMatch(key, pattern);
+        }
+        if (typeof subPattern === 'object' && 'min' in subPattern && 'max' in subPattern) {
+            return isValueInRange(key, pattern);
+        }
+        return Array.isArray(subPattern)
+            ? isMultipleFieldMatch(key, pattern)
+            : isSingularFieldMatch(key, pattern);
+    })
+        .every((predicate) => predicate(target));
+    const naturalNumber = (n) => Number(n || 0);
+
+    const ICONS = ['ArrowDownIcon', 'ArrowUpIcon'];
+    const resultsGridStyle = 'space-y-px lg:space-y-0 lg:grid lg:grid-cols-12 gap-2xs border-box';
+    const BaseFiltrationInner = JSX(({ label = '', filtrationState = {}, topItemsCount = 0, block, notFound, ...rest }) => {
+        const blocksToRender = block?.blocks?.filter((b) => checkShouldRenderBlock(filtrationState, b.content || {})) || [];
+        const [visibleBlocks, hiddenBlocks] = topItemsCount > 0
+            ? [blocksToRender.slice(0, topItemsCount), blocksToRender.slice(topItemsCount)]
+            : [blocksToRender, []];
+        return (jsxs("div", { children: [jsx("div", { className: style(blocksToRender.length ? 'hidden' : 'block'), children: notFound ? renderNotFound(notFound) : null }), jsxs("div", { className: style('space-y-2xs', blocksToRender.length ? '' : 'hidden'), children: [jsx("div", { className: style(resultsGridStyle), children: renderBlocksList(visibleBlocks, { ...rest.options, parent: block }) }), jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => {
+                                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 SlideCheckboxGroup = JSX(({ value, onChange, items = [], multiple }) => {
+        const handleChange = (newValue) => {
+            if (!onChange) {
+                return;
+            }
+            if (multiple) {
+                const hasAlready = value?.includes(newValue);
+                onChange(hasAlready ? (value || []).filter((v) => v !== newValue) : [...(value || []), newValue]);
+            }
+            else {
+                onChange(value === newValue ? '' : newValue);
+            }
+        };
+        return items.map((item) => (jsx(SlideCheckbox, { text: item.title, value: [value].flatMap((_) => _).includes(item.value), onChange: () => handleChange(item.value), type: multiple ? 'checkbox' : 'radio' }, item.value)));
+    });
+
+    const renderFiltrationForm = ({ field, reset, filtrationSchema, resetButton, children, }) => (jsxs("form", { className: "flex flex-col @4xl:flex-row justify-between bg-white p-4xl gap-s @4xl:gap-0", children: [jsxs("div", { className: "flex flex-col @4xl:flex-row gap-5xl", children: [children, Object.entries(filtrationSchema).map(renderFormItem(field))] }), resetButton ? (jsx("div", { children: jsx(Button, { className: "w-full @4xl:w-72 @4xl:ml-s", onClick: reset, ...resetButton }) })) : null] }));
+    const renderFormItem = (field) => ([key, item]) => {
+        const type = item?.type;
+        switch (type) {
+            case 'array':
+                return renderCheckboxes(key, field)(item);
+            default:
+                return null;
+        }
+    };
+    const renderCheckboxes = (key, field) => (item) => {
+        const options = item?.items?.enum?.map((e, i) => ({ value: e, title: item?.items?.enumNames?.[i] || '' })) ||
+            [];
+        return (jsxs("div", { children: [item?.title ? (jsx("div", { className: "mb-m", children: jsx(Text, { size: "text-m", font: "font-light", color: "text-secondary-text", children: item.title }) })) : null, jsx(SlideCheckboxGroup, { items: options, multiple: true, ...field(key) })] }, key));
+    };
+
+    const DEFAULT_MIN_MONTHS = 3;
+    const DEFAULT_MAX_MONTHS = 60;
+    const DEFAULT_MIN_SUM = 500;
+    const DEFAULT_MAX_SUM = 1000000000;
+    const initialFiltrationState$1 = {
+        sum: {
+            min: 10000,
+            max: DEFAULT_MAX_SUM,
+        },
+        period: {
+            min: 3,
+            max: 36,
+        },
+    };
+    const DepositFiltration = JSX(({ className, filtrationSchema = {}, resetButton, sumInput, periodInput, ...rest }) => {
+        const [filtrationState, { field, reset }] = useForm(initialFiltrationState$1);
+        const maxPeriodValue = periodInput?.max || DEFAULT_MAX_MONTHS;
+        const Inputs = (jsxs("div", { children: [jsx(CurrencyInput, { label: sumInput?.title, min: DEFAULT_MIN_SUM, max: DEFAULT_MAX_SUM, ...field('sum', {
+                        parse: (min) => ({ min: Number(min), max: DEFAULT_MAX_SUM }),
+                        format: ({ min }) => String(min),
+                    }) }), jsx(InputRange, { title: periodInput?.title, items: ['От 3 мес', 'До 5 лет'], min: periodInput?.min || DEFAULT_MIN_MONTHS, max: maxPeriodValue, ...field('period', {
+                        parse: (min) => ({ min, max: maxPeriodValue }),
+                        format: ({ min }) => min,
+                    }) })] }));
+        return (jsxs(BlockWrapper, { className: style('space-y-2xs', className), defaultPadding: "p-0", version: "transparent", ...rest, children: [renderFiltrationForm({ field, reset, filtrationSchema, resetButton, children: Inputs }), jsx(BaseFiltrationInner, { filtrationState: filtrationState, ...rest })] }));
+    });
+    DepositFiltration.childrenTypes = ['ProductTile'];
+    DepositFiltration.childSchema = (content) => content?.filtrationSchema || {};
+
+    const badgeBgStyleMap = {
+        primary: 'bg-white/30',
+        secondary: 'bg-main-divider',
+    };
+    const badgeTextColorStyleMap = {
+        primary: 'text-white',
+        secondary: 'text-secondary-text',
+    };
+    const Badge = JSX(({ count, version = 'secondary' }) => {
+        return (jsx("div", { className: style('w-6 h-6 rounded-full flex items-center justify-center', badgeBgStyleMap[version]), children: jsx(Text, { size: "text-xs", color: badgeTextColorStyleMap[version], children: count }) }));
+    });
+
+    const getBadgeCount = (blocks = [], filter = {}) => blocks.filter(({ content = {} }) => checkShouldRenderBlock(filter, content)).length;
+
+    const scalarCmp = (a, b) => a === b;
+    const arrCmp = (cmp = scalarCmp) => (a, b) => a === b || Boolean(a && b && a.length === b.length && a.every((_, i) => cmp(_, b[i])));
+    const objCmp = (cmp) => (a, b) => a === b ||
+        Boolean(a &&
+            b &&
+            Object.keys(a).length === Object.keys(b).length &&
+            Object.entries(a).every(([key, value]) => cmp(value, b[key])));
+    function combineBoolCmps(...comparators) {
+        return (a, b) => comparators.some((cmp) => cmp(a, b));
+    }
+
+    const hotFilterRecordCmp = objCmp(combineBoolCmps(scalarCmp, arrCmp()));
+
+    const EMPTY_ARR = [];
+    const EMPTY_OBJ = {};
+    const useHotFilters = ({ hotFilters = EMPTY_ARR, filtrationState = EMPTY_OBJ, blocks = EMPTY_ARR, onFiltrationStateChange, }) => {
+        const activeItemIndex = useMemo(() => Math.max(0, hotFilters.findIndex((_) => hotFilterRecordCmp(_.filter, filtrationState))), [hotFilters, filtrationState]);
+        const items = useMemo(() => hotFilters.map((_) => ({
+            text: _.text,
+            appendRight: (jsx(Badge, { version: _ === hotFilters[activeItemIndex] ? 'primary' : 'secondary', count: getBadgeCount(blocks, _.filter) })),
+        })), [hotFilters, blocks, activeItemIndex]);
+        const handleChange = useCallback((_) => {
+            onFiltrationStateChange(hotFilters[items.indexOf(_)].filter);
+        }, [hotFilters, items]);
+        return {
+            value: items[activeItemIndex],
+            items: items,
+            onChange: handleChange,
+        };
+    };
+
+    const initialFiltrationState = {
+        categories: [],
+        extraOptions: [],
+        propertyType: [],
+        stage: [],
+    };
+    const MortgageFiltration = JSX(({ className, hotFilters, filtrationSchema = {}, resetButton, ...rest }) => {
+        const [filtrationState, { field, reset, update: replaceFiltrationState }] = useForm(initialFiltrationState);
+        const handleFiltrationStateChange = useCallback((_ = initialFiltrationState) => replaceFiltrationState(_), []);
+        const tabsControlProps = useHotFilters({
+            hotFilters,
+            filtrationState,
+            blocks: rest.block?.blocks,
+            onFiltrationStateChange: handleFiltrationStateChange,
+        });
+        return (jsxs(BlockWrapper, { className: style('space-y-2xs', className), defaultPadding: "p-0", version: "transparent", ...rest, children: [jsx(TabsControl, { ...tabsControlProps }), renderFiltrationForm({ field, reset, filtrationSchema, resetButton }), jsx(BaseFiltrationInner, { filtrationState: filtrationState, ...rest })] }));
+    });
+    MortgageFiltration.childrenTypes = ['ProductTile'];
+    MortgageFiltration.childSchema = (content) => content?.filtrationSchema || {};
+
     const Blocks = {
         ApplicationForm,
         BenefitsBlock,
@@ -4327,6 +4519,8 @@
         CarouselRecommendationCard,
         CarouselTariffsCard,
         ComparisonTable,
+        DepositFiltration,
+        MortgageFiltration,
         ErrorBlock,
         ExchangeRateTile,
         Footer,
@@ -4510,7 +4704,7 @@
             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 space-y-px @lg:space-y-0 @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' } })] }));
+        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 space-y-px @lg:space-y-0 @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', 'StickyBottomMenu'];
@@ -4520,7 +4714,7 @@
 
     const joinList = (sep) => (list) => list.reduce((acc, el, i) => (acc.length ? acc.concat({ ...sep, key: `sep-${i}` }, el) : [el]), []);
 
-    const packageVersion = "0.13.18";
+    const packageVersion = "0.13.20";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;