@redneckz/wildless-cms-uni-blocks 0.14.17 → 0.14.19

package/mobile/bundle/bundle.umd.js

@@ -840,7 +840,12 @@
         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", 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: (e) => {
+                e.stopPropagation();
+                if (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();
@@ -869,7 +874,7 @@
         return inputRef;
     }
 
-    const Select = JSX(({ className, label, options = [], value, valid = true, isBorder = true, placeholder = '', isSearch = false, onChange, }) => {
+    const Select = JSX(({ className, label, options = [], value, valid = true, isBorder = true, placeholder = '', isSearch = false, iconVersion, onChange, }) => {
         const [isOpen, { setFalse: close, setTrue: open }] = useBool();
         const [query, setQuery] = useState('');
         const handleClose = useCallback(() => {
@@ -884,10 +889,10 @@
             onChange,
             onClose: handleClose,
         });
-        return (jsxs("div", { className: className, children: [renderLabel(label), jsxs("div", { className: style('relative', isOpen ? 'z-20' : 'z-10'), ref: inputRef, children: [jsxs("div", { className: style('text-l flex justify-between items-center text-primary-text cursor-pointer relative z-10', getBorderStyle(isBorder, valid)), onClick: isOpen ? handleClose : open, children: [jsx("p", { className: "p-m pr-3xl flex items-center overflow-hidden text-ellipsis whitespace-nowrap", children: formatOption(value) || placeholder }), renderIcon$2(isOpen)] }), isSearch && isOpen ? (jsx("div", { className: style('absolute top-0 w-full z-20'), children: jsx(Input, { type: "text", autoFocus: true, value: query, onChange: setQuery }) })) : null] })] }));
+        return (jsxs("div", { className: className, children: [renderLabel(label), jsxs("div", { className: style('relative', isOpen ? 'z-20' : 'z-10'), ref: inputRef, children: [jsxs("div", { className: style('text-l flex justify-between items-center text-primary-text cursor-pointer relative z-10', getBorderStyle(isBorder, valid)), onClick: isOpen ? handleClose : open, children: [jsx("p", { className: "p-m pr-3xl flex items-center overflow-hidden text-ellipsis whitespace-nowrap", children: formatOption(value) || placeholder }), renderIcon$1(isOpen, iconVersion)] }), isSearch && isOpen ? (jsx("div", { className: style('absolute top-0 w-full z-20'), children: jsx(Input, { type: "text", autoFocus: true, value: query, onChange: setQuery }) })) : null] })] }));
     });
     const renderLabel = (label) => label ? (jsx("div", { className: "mb-xs", children: jsx(Text, { size: "text-m", color: "text-primary-text", font: "font-light", children: label }) })) : null;
-    const renderIcon$2 = (isOpen) => (jsx(Icon, { className: style('absolute right-3', isOpen ? '' : 'rotate-180'), name: "ArrowUpIcon", width: "16", height: "16" }));
+    const renderIcon$1 = (isOpen, iconVersion) => (jsx(Icon, { className: style('absolute right-3', isOpen ? '' : 'rotate-180'), iconVersion: iconVersion, name: "ArrowUpIcon", width: "16", height: "16" }));
     const getBorderStyle = (isBorder, valid) => style(isBorder ? 'border rounded-md hover:border-primary-hover' : '', valid ? ' border-gray' : 'border-error');
 
     const SelectControl = JSX(({ className = '', error, ...rest }) => (jsxs("div", { className: className, children: [jsx(Select, { ...rest, valid: !error }), jsx("div", { className: "h-2", children: error ? (jsx(Text, { size: "text-xs", font: "font-light", color: "text-error", children: error })) : null })] })));
@@ -1034,8 +1039,9 @@
     function renderRangeWithTicks({ list = [], min, max, step, value = list[0] || min, disabled, onChange, }) {
         const rangeValue = list.length ? list.indexOf(value) : value;
         const rangeValueShift = rangeValue > min ? rangeValue - min : 0;
+        const percentage = (rangeValueShift * 100) / (max - min);
         const inputStyle = {
-            backgroundSize: `${((rangeValueShift * 100) / (max - min)).toFixed(2)}% 100%`,
+            backgroundSize: `${percentage.toFixed(2)}% 100%`,
         };
         return (jsxs("div", { children: [list.length ? (jsx("div", { className: "absolute w-full flex justify-between -bottom-[3px] px-m", children: list.map((_, i) => (jsx("div", { className: style('w-2 h-2 rounded-full', rangeValue <= i || disabled ? 'bg-gray' : 'bg-primary-main') }, String(i)))) })) : null, jsx("div", { className: "absolute inset-x-0 -bottom-1 px-m leading-[18px]", children: jsx("input", { className: "box-border w-full m-0 cursor-pointer slider relative z-10", style: inputStyle, type: "range", min: min, max: max, step: step, value: rangeValue, disabled: disabled, onInput: ((e) => {
                             const rawValue = parseDecimal(e.target?.value);
@@ -1056,7 +1062,7 @@
         const handleChange = useCallback((e) => {
             onChange && onChange(parseDecimal(e.target?.value));
         }, [onChange]);
-        return (jsxs("div", { className: className, children: [jsxs("label", { className: "block relative", children: [title ? (jsx(Text, { size: "text-m", font: "font-light", color: "text-primary-text", children: title })) : null, jsx("input", { className: style('m-0 mt-xs font-sans text-h3 w-full h-14', 'border border-solid border-gray rounded-md outline-none', 'p-0 pl-m box-border', 'text-primary-text hover:border-primary-hover focus:border-primary-text', DISABLED_INPUT_CLASSES), disabled: disabled, onInput: handleChange, ...normalizedProps }), renderRangeWithTicks({ list, min, max, step, disabled, value, onChange })] }), renderRangeCaption(items)] }));
+        return (jsxs("div", { className: className, children: [jsxs("label", { className: "block relative", children: [title ? (jsx(Text, { size: "text-m", font: "font-light", color: "text-primary-text", children: title })) : null, jsx("input", { className: style('mt-xs font-sans text-h3 w-full h-14', 'border border-solid border-gray rounded-md outline-none', 'pl-m box-border', 'text-primary-text hover:border-primary-hover focus:border-primary-text', DISABLED_INPUT_CLASSES), disabled: disabled, onInput: handleChange, ...normalizedProps }), renderRangeWithTicks({ list, min, max, step, disabled, value, onChange })] }), renderRangeCaption(items)] }));
     });
     const closestValue = (list) => (_) => list.reduce((prev, curr) => (Math.abs(curr - _) < Math.abs(prev - _) ? curr : prev));
     const renderRangeCaption = (items) => (jsx("div", { className: "flex justify-between my-xs", children: items.map((item, i) => (jsx(Text, { size: "text-s", font: "font-light", color: "text-secondary-text", children: item }, String(i)))) }));
@@ -1183,7 +1189,7 @@
 
     const renderContacts = () => (jsxs("div", { className: "flex gap-xl", children: [jsxs("a", { className: "flex gap-s items-center text-primary-text no-underline", href: `tel:8 (800) 200-78-70`, "aria-label": "8 (800) 200-78-70", children: [jsx(Img, { image: { icon: 'PhoneIcon' }, width: "24", height: "24" }), jsx("span", { children: "8 (800) 200-78-70" })] }), jsxs("a", { className: "flex gap-s items-center text-primary-text no-underline", "aria-label": "ved@rshb.ru", href: `mailto:ved@rshb.ru`, children: [jsx(Img, { image: { icon: 'MailIcon' }, width: "24", height: "24" }), jsx("span", { children: "ved@rshb.ru" })] })] }));
 
-    const Radio = JSX(({ name, text, value, checked, onChange, className }) => (jsx("div", { className: className, children: jsxs("label", { className: "font-sans flex gap-s items-center relative cursor-pointer", children: [jsx("input", { className: "appearance-none flex justify-center items-center shrink-0 w-5 h-5 border border-gray hover:border-primary-hover\n        checked:border-2 checked:!border-primary-main focus:checked:border-primary-main focus:border-primary-text active:border-primary-text\n        after:block after:w-2.5 after:h-2.5 after:rounded-full checked:after:bg-primary-main outline-none rounded-full cursor-pointer", type: "radio", value: value, name: name, checked: checked, onChange: (_) => onChange(_.target.value) }), text ? jsx("span", { className: "text-primary-text cursor-pointer", children: text }) : null] }) })));
+    const Radio = JSX(({ name, text, value, checked, onChange, className }) => (jsx("div", { className: className, children: jsxs("label", { className: "font-sans flex gap-s items-center relative cursor-pointer", children: [jsx("input", { className: "appearance-none flex justify-center items-center shrink-0 w-5 h-5 border border-gray hover:border-primary-hover\n        checked:border-2 checked:!border-primary-main focus:checked:border-primary-main focus:border-primary-text active:border-primary-text\n        after:block after:w-2.5 after:h-2.5 after:rounded-full checked:after:bg-primary-main outline-none rounded-full cursor-pointer", type: "radio", value: value, name: name, checked: checked, onChange: (_) => onChange(_.target.value) }), text ? jsx(Text, { color: "text-primary-text", children: text }) : null] }) })));
 
     const renderQuestionsInterested = (field) => {
         const { value, onChange } = field('vedTypes');
@@ -1287,6 +1293,8 @@
         return jsx(EmbeddedForm, { ...formBlock, onSubmit: handleSubmit });
     };
 
+    const AlignStyles = 'text-left';
+
     const iconBgStyles = {
         '': 'bg-main-divider group-data-secondary:bg-white/30',
         primary: 'bg-main-divider',
@@ -1303,8 +1311,6 @@
 
     const defaultIconSize = 56;
 
-    const AlignStyles = 'text-left';
-
     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$2(benefit.description)] })) : null] }, String(i)));
     const renderDescription$2 = (description) => {
@@ -1404,6 +1410,8 @@
             jsx("div", { className: "shrink-0 -mb-10", children: jsx("span", { className: "font-mohave text-title-large sm:text-title-extra gradient-color-text", children: _.bonusCount }) })) : null, _.bonusName ? (jsx("div", { className: "shrink-0 gradient-color-text", children: jsx(Text, { size: "text-h2", children: _.bonusName }) })) : null] }));
     const renderBonusImage = (_) => _.image ? jsx(Img, { className: "min-w-12 p-xs rounded-icon shrink-0", image: _.image }) : null;
 
+    const isShowDots = true;
+
     const mapChildren = (mapper) => (children) => {
         if (children === null || children === undefined) {
             return children;
@@ -1568,8 +1576,6 @@
         ];
     };
 
-    const isShowDots = true;
-
     const DEFAULT_GAP = 14;
     /*
       Horizontal padding used on a container above SwipeListControl.
@@ -1630,7 +1636,7 @@
         return (jsx("div", { ref: containerRef, className: `transition-max-h duration-300 overflow-hidden ${containerRef.current || !isUnfolded ? 'max-h-0' : ''} ${className}`, children: children }));
     });
 
-    const calculatorValueBlockStyle = 'flex justify-between md:flex-col';
+    const calculatorValueBlockStyle = 'flex justify-between @xl: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$1 = 10000;
@@ -1723,10 +1729,21 @@
     const BUSINESS_DEPOSIT_CALC_DEFAULT_DIR = 'business-calculator-data';
     const REFINANCING_CALC_DEFAULT_DIR = 'refinancing-calculator-data';
 
-    const Rate = JSX(({ rate, title = 'Ставка', unit, depositeName, isShowDepositeName, rateBlockClassName, fractionDigits = 2, }) => (jsxs("div", { children: [jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: title }), jsxs("div", { className: "relative", children: [jsxs("div", { className: "flex justify-start gradient-color-text", children: [jsx("span", { className: style('font-mohave text-title-huge pr-xl -mt-m', rateBlockClassName), children: String(rate.toFixed(fractionDigits)).replace('.', ',') }), unit ? jsx("span", { className: "text-7xl", children: unit }) : null] }), depositeName && isShowDepositeName ? (jsx("div", { className: "absolute bottom-7 w-full text-center whitespace-nowrap", children: depositeName })) : null] })] })));
-
     const renderFootnote = (text) => text ? (jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: text })) : null;
 
+    const Rate = JSX(({ rate, title = 'Ставка', unit, depositeName, isShowDepositeName, fractionDigits = 2 }) => (jsxs("div", { children: [jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: title }), jsxs("div", { className: "relative", children: [jsxs("div", { className: "flex justify-start gradient-color-text", children: [jsx("span", { className: "font-mohave text-title-huge pr-xl -mt-m tracking-[-15px]", children: String(rate.toFixed(fractionDigits)).replace('.', ',') }), unit ? jsx("span", { className: "text-7xl", children: unit }) : null] }), depositeName && isShowDepositeName ? (jsx("div", { className: "absolute bottom-7 w-full text-center whitespace-nowrap", children: depositeName })) : null] })] })));
+
+    const UnknownRate = JSX(({ title = 'Ставка', isUnavailableByTerm = false }) => (jsxs("div", { className: "space-y-s", children: [jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: title }), jsx(Icon, { className: "w-10 h-10 @5xl:h-auto @5xl:w-40", name: "PercentIcon" }), jsx("div", { className: "w-64", children: isUnavailableByTerm ? (jsxs(Paragraph, { size: "text-xl", font: "font-light", color: "text-primary-text", children: ["\u041F\u0440\u043E\u0446\u0435\u043D\u0442\u043D\u0430\u044F \u0441\u0442\u0430\u0432\u043A\u0430 \u0434\u043B\u044F \u0441\u0440\u043E\u043A\u0430 ", jsx("strong", { children: "1-30 \u0434\u043D\u0435\u0439" }), " \u0443\u0441\u0442\u0430\u043D\u0430\u0432\u043B\u0438\u0432\u0430\u0435\u0442\u0441\u044F \u043F\u0440\u0438 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0438 \u0432 \u0411\u0430\u043D\u043A"] })) : (jsx(Paragraph, { size: "text-xl", font: "font-light", color: "text-primary-text", children: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0434\u0440\u0443\u0433\u0443\u044E \u0441\u0443\u043C\u043C\u0443 \u0438\u043B\u0438 \u0441\u0440\u043E\u043A" })) })] })));
+
+    const renderDesktopRate = ({ rate, depositeName, fractionDigits, isShowDepositeName, title, unit, }) => (jsx(Rate, { rate: rate, depositeName: depositeName, fractionDigits: fractionDigits, isShowDepositeName: isShowDepositeName, unit: unit, title: title }));
+    const renderMobileRate = ({ rate, title, unit }) => (jsx(CalculatorValueBlock, { title: title, value: rate, postfix: unit }));
+    const renderRate = ({ isUnknownRateShown = true, isUnavailableByTerm = false, title = 'Ставка', unit = '%', rate = 0, ...rest }) => {
+        if (isUnknownRateShown && rate === 0) {
+            return jsx(UnknownRate, { isUnavailableByTerm: isUnavailableByTerm, title: title });
+        }
+        return (jsxs("div", { children: [jsx("div", { className: "hidden @xl:block", children: renderDesktopRate({ title, unit, rate, ...rest }) }), jsx("div", { className: "@xl:hidden", children: renderMobileRate({ title, unit, rate, ...rest }) })] }));
+    };
+
     const DEFAULT_MONEY_STEP = 1000;
     function renderWantedSumInput({ isShowItems = true, step = DEFAULT_MONEY_STEP, ...rest }) {
         const items = [
@@ -1772,7 +1789,7 @@
             restExpenseValue: DEFAULT_REST_MIN_SUM,
         });
         const { minSumTravel, maxSumTravel, minSumOther, maxSumOther, monthBonus, yearBonus } = useBonusCalculatorParams(userInputParams, sourceBookDir);
-        return (jsxs("section", { className: style('flex flex-col justify-between @5xl:flex-row gap-m', className), children: [jsxs("div", { className: "flex flex-col gap-y-m sm:max-w-md gap-2xl", children: [renderWantedSumInput({
+        return (jsxs("section", { className: style('flex flex-col justify-between @5xl:flex-row gap-y-4xl', className), children: [jsxs("div", { className: "flex flex-col @xl:max-w-md gap-2xl border-b border-b-main-divider @xl:border-none pb-3xl @xl:pb-0", children: [renderWantedSumInput({
                             title: 'Сумма покупок в категории путешествия, ₽',
                             min: minSumTravel,
                             max: maxSumTravel,
@@ -1786,7 +1803,15 @@
                             step: 500,
                             isShowItems: false,
                             ...field('restExpenseValue'),
-                        })] }), monthBonus >= 0 ? (jsx(Rate, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u043C\u0435\u0441\u044F\u0446", rate: monthBonus, rateBlockClassName: "tracking-[-14px]", fractionDigits: 0 })) : null, jsxs("div", { className: "flex flex-col gap-2xl sm:w-96", children: [yearBonus >= 0 ? jsx(CalculatorValueBlock, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u0433\u043E\u0434", value: yearBonus }) : null, renderButtonsSection(buttons, { isVertical: true }), renderFootnote(footnote)] })] }));
+                        })] }), monthBonus >= 0
+                    ? renderRate({
+                        title: 'Баллов за месяц',
+                        rate: monthBonus,
+                        fractionDigits: 0,
+                        isUnknownRateShown: false,
+                        unit: '',
+                    })
+                    : null, jsxs("div", { className: "flex flex-col gap-y-4xl @xl:w-96", children: [yearBonus >= 0 ? jsx(CalculatorValueBlock, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u0433\u043E\u0434", value: yearBonus }) : null, renderButtonsSection(buttons, { isVertical: true }), renderFootnote(footnote)] })] }));
     });
 
     const SVG = JSX(({ className, viewBox, fill = 'none', width, height, paths, ...commonOptions }) => {
@@ -1834,17 +1859,6 @@
         ],
     });
 
-    const UnknownRate = JSX(({ title = 'Ставка', isUnavailableByTerm = false }) => (jsxs("div", { children: [jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: title }), jsx("div", { className: "mt-2xs pt-2xs pl-lg pb-xs", children: jsx(Icon, { name: "PercentIcon", width: "90", height: "85" }) }), jsx("div", { className: "w-64 mt-m", children: isUnavailableByTerm ? (jsxs(Paragraph, { size: "text-xl", font: "font-light", color: "text-primary-text", children: ["\u041F\u0440\u043E\u0446\u0435\u043D\u0442\u043D\u0430\u044F \u0441\u0442\u0430\u0432\u043A\u0430 \u0434\u043B\u044F \u0441\u0440\u043E\u043A\u0430 ", jsx("strong", { children: "1-30 \u0434\u043D\u0435\u0439" }), " \u0443\u0441\u0442\u0430\u043D\u0430\u0432\u043B\u0438\u0432\u0430\u0435\u0442\u0441\u044F \u043F\u0440\u0438 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0438 \u0432 \u0411\u0430\u043D\u043A"] })) : (jsx(Paragraph, { size: "text-xl", font: "font-light", color: "text-primary-text", children: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0434\u0440\u0443\u0433\u0443\u044E \u0441\u0443\u043C\u043C\u0443 \u0438\u043B\u0438 \u0441\u0440\u043E\u043A" })) })] })));
-
-    const renderDesktopRate = ({ rate, depositeName, fractionDigits, isShowDepositeName, }) => (jsx(Rate, { rate: rate, depositeName: depositeName, fractionDigits: fractionDigits, isShowDepositeName: isShowDepositeName, rateBlockClassName: "tracking-[-25px]", unit: "%" }));
-    const renderMobileRate = ({ rate }) => (jsx(CalculatorValueBlock, { title: "\u0421\u0442\u0430\u0432\u043A\u0430", value: rate, postfix: "%" }));
-    const renderRate = (props) => {
-        if (props.rate === 0) {
-            return jsx(UnknownRate, { isUnavailableByTerm: props.isUnavailableByTerm });
-        }
-        return (jsxs("div", { children: [jsx("div", { className: "hidden md:block", children: renderDesktopRate(props) }), jsx("div", { className: "md:hidden", children: renderMobileRate(props) })] }));
-    };
-
     const mergeIntervals = (intervals) => {
         const result = [...intervals];
         result.sort(([a], [c]) => a - c);
@@ -2782,10 +2796,12 @@
     });
     const getFilteredIcon = (icon) => (icon?.src || icon?.icon ? icon : undefined);
 
-    const CarouselRecommendationCard = JSX(({ className = '', description, href, icon, items = [], socialMedia = [], target, title, align = 'text-left', ...rest }) => {
-        return (jsx(BlockWrapper, { className: style('relative group-data-gray:bg-main-divider/50', className), defaultPadding: "p-3xl", ...rest, children: jsxs(LinkWrapper, { href: href, target: target, className: 'space-y-lg', children: [jsx(Headline, { title: title, description: description, headlineVersion: "XS", isEmbedded: true, align: align }), items.length ? (jsx(List, { className: "flex flex-col gap-xs", items: items, listItemSize: "XS" })) : null, renderIcon$1(icon), socialMedia.length ? jsx(SocialMedia, { media: socialMedia, showButtonText: true }) : null] }) }));
+    const ImageAlwaysOnRight = false;
+
+    //TODO: replace SocialMedia with renderButtonSection
+    const CarouselRecommendationCard = JSX(({ className, padding, description, href, icon, items = [], listItemSize = 'S', socialMedia = [], target, title, align = 'text-left', isImageAlwaysOnRight = ImageAlwaysOnRight, ...rest }) => {
+        return (jsx(BlockWrapper, { className: style('relative min-h-28 group-data-gray:bg-main-divider/50', className), defaultPadding: "p-0", ...rest, children: jsx(LinkWrapper, { href: href, target: target, className: "h-full", children: jsx(BaseTile, { className: "h-full", defaultPadding: "p-m", padding: padding, insetTitle: title ? (jsx(Headline, { title: title, description: description, headlineVersion: "S", isEmbedded: true, align: align })) : null, rightImage: icon?.icon || icon?.src ? jsx(Img, { image: icon }) : null, buttons: socialMedia.length ? jsx(SocialMedia, { media: socialMedia, showButtonText: true }) : null, isImageAlwaysOnRight: isImageAlwaysOnRight, children: items.length ? jsx(List, { items: items, listItemSize: listItemSize }) : null }) }) }));
     });
-    const renderIcon$1 = (icon) => icon?.src || icon?.icon ? (jsx("div", { children: jsx(Img, { image: icon }) })) : null;
 
     const renderCardInfo = (cell, i) => {
         const { title, description, buttons } = cell;
@@ -2839,6 +2855,167 @@
         return orientation === 'horizontal' ? (jsx(SwipeListControl, { onVisibleIndicesChange: handleSlideChange, children: tableColumns })) : (tableColumns);
     });
 
+    const TextWithIcon = JSX(({ textNode, iconNode, tag, onClick, justifyContent = 'between', className, ...rest }) => {
+        const Tag = tag;
+        return (jsxs(Tag, { tag: tag, className: style('flex items-center w-full gap-1', justifyContent === 'between' ? 'justify-between' : 'justify-center', className), onClick: onClick, ...rest, children: [textNode ? jsx("div", { children: textNode }) : null, iconNode ? jsx("div", { children: iconNode }) : null] }));
+    });
+
+    const DefaultFoldButton = JSX(({ className = '', label, icon, dataTheme = '', disabled = false, onClick }) => (jsx(TextWithIcon, { tag: "button", onClick: onClick, disabled: disabled, "data-theme": dataTheme, justifyContent: "center", className: style('py-4 border border-transparent outline-none focus:border-primary-text', disabled
+            ? 'bg-main-divider text-main-disabled hover:bg-main-divider'
+            : 'bg-primary-main text-white hover:bg-primary-hove', className), textNode: jsx("span", { className: "text-h4 pr-s", children: label }), iconNode: icon ? (jsx(Img, { image: {
+                icon,
+                iconVersion: 'white',
+            }, className: "my-auto", width: "20", height: "20" })) : null })));
+    const renderDefaultFoldButton = ({ isUnfolded, onToggle }) => {
+        const labels = ['Развернуть', 'Скрыть'];
+        const icons = ['ArrowDownIcon', 'ArrowUpIcon'];
+        return (jsx(DefaultFoldButton, { icon: icons[Number(isUnfolded)], label: labels[Number(isUnfolded)], onClick: onToggle }));
+    };
+
+    const NotFound = JSX(({ 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 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 = '', blocksToRender = [], topItemsCount = 0, block, notFound, ...rest }) => {
+        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 ? jsx(NotFound, { ...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 })) })] })] }));
+    });
+
+    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 isMultipleNumberFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) || isEmpty(target[key]) || target[key]?.includes(pattern[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 shouldRenderBlock = (pattern, target) => Object.entries(pattern)
+        .map(([key, subPattern]) => {
+        if (typeof subPattern === 'number') {
+            return Array.isArray(target[key])
+                ? isMultipleNumberFieldMatch(key, pattern)
+                : 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 getBlocksToRender = (blocks, filtrationState) => (normalize = identity) => blocks && blocks.filter((b) => shouldRenderBlock(filtrationState, normalize(b.content || {})));
+
+    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 getPeriod = (source, content) => source[content?.sourceBook]?.rateRows
+        .map((el) => el.minMonths)
+        .filter((minMonths) => minMonths !== undefined);
+
+    async function fetchMultitudeJSON(...urls) {
+        const fetchPromises = urls.map((url) => fetchJSON(url));
+        return Promise.all(fetchPromises);
+    }
+
+    const unique = (list) => [...new Set(list)];
+
+    function zip(firstCol, ...restCols) {
+        return firstCol.map((firstEl, rowIndex) => [firstEl, ...restCols.map((col) => col[rowIndex])]);
+    }
+
+    const getChildSourceBook = (blocks) => blocks?.filter(hasSourceBook).map(({ content: { sourceBook } }) => sourceBook);
+    const hasSourceBook = (block) => Boolean(block && block.content && typeof block.content.sourceBook === 'string');
+
+    function useDepositsPeriods(blocks) {
+        const { dirs = [], source = [] } = useMemo(() => {
+            const sourceBooks = getChildSourceBook(blocks);
+            return { dirs: sourceBooks?.map((url) => `/wcms-resources/${url}.json`), source: sourceBooks };
+        }, [blocks]);
+        const { data = [] } = useAsyncData(dirs, fetchMultitudeJSON);
+        return {
+            source: Object.fromEntries(zip(source, data).filter(([, sourceData]) => Boolean(sourceData))),
+            months: unique(data
+                .flatMap((item) => item?.rateRows || [])
+                .filter((row) => typeof row.minMonths === 'number' && row.minMonths === row.maxMonths)
+                .map((row) => row.minMonths)).sort((a, b) => a - b) || [],
+        };
+    }
+
+    const DEFAULT_MIN_SUM = 500;
+    const DEFAULT_MAX_SUM = 1000000000;
+    const initialFiltrationState$1 = {
+        sum: {
+            min: 10000,
+            max: DEFAULT_MAX_SUM,
+        },
+        period: 3,
+    };
+    const DepositFiltration = JSX(({ className, filtrationSchema = {}, resetButton, sumInput, periodInput, ...rest }) => {
+        const { source, months } = useDepositsPeriods(rest.block?.blocks);
+        const [filtrationState, { field, reset }] = useForm(initialFiltrationState$1);
+        const blocksToRender = getBlocksToRender(rest.block?.blocks, filtrationState)((content) => ({ ...content, period: getPeriod(source, content || {}) || [] }));
+        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 лет'], list: months, ...field('period') })] }));
+        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, { blocksToRender: blocksToRender, ...rest })] }));
+    });
+    const sourceBookSchema = {
+        type: 'string',
+        title: 'Адрес справочника',
+    };
+    DepositFiltration.childrenTypes = ['ProductTile'];
+    DepositFiltration.childSchema = (content) => ({
+        ...(content?.filtrationSchema || {}),
+        sourceBook: sourceBookSchema,
+    });
+
     const renderErrorContent = (error) => {
         if (error?.contentType === 'Image' && error?.image) {
             return jsx(Img, { image: error.image });
@@ -3027,35 +3204,18 @@
 
     const useSitemap = (fallback) => useSWRResource(projectSettings.SITEMAP || 'sitemap', { fallback });
 
-    const TextWithIcon = JSX(({ textNode, iconNode, tag, onClick, justifyContent = 'between', className, ...rest }) => {
-        const Tag = tag;
-        return (jsxs(Tag, { tag: tag, className: style('flex items-center w-full gap-1', justifyContent === 'between' ? 'justify-between' : 'justify-center', className), onClick: onClick, ...rest, children: [textNode ? jsx("div", { children: textNode }) : null, iconNode ? jsx("div", { children: iconNode }) : null] }));
-    });
-
-    const DefaultFoldButton = JSX(({ className = '', label, icon, dataTheme = '', disabled = false, onClick }) => (jsx(TextWithIcon, { tag: "button", onClick: onClick, disabled: disabled, "data-theme": dataTheme, justifyContent: "center", className: style('py-4 border border-transparent outline-none focus:border-primary-text', disabled
-            ? 'bg-main-divider text-main-disabled hover:bg-main-divider'
-            : 'bg-primary-main text-white hover:bg-primary-hove', className), textNode: jsx("span", { className: "text-h4 pr-s", children: label }), iconNode: icon ? (jsx(Img, { image: {
-                icon,
-                iconVersion: 'white',
-            }, className: "my-auto", width: "20", height: "20" })) : null })));
-    const renderDefaultFoldButton = ({ isUnfolded, onToggle }) => {
-        const labels = ['Развернуть', 'Скрыть'];
-        const icons = ['ArrowDownIcon', 'ArrowUpIcon'];
-        return (jsx(DefaultFoldButton, { icon: icons[Number(isUnfolded)], label: labels[Number(isUnfolded)], onClick: onToggle }));
-    };
-
     const foldableSectionStyles = 'flex flex-wrap group-last:last:pb-0';
 
     const getIconName = (isUnfolded) => isUnfolded ? 'ArrowUpSolidIcon' : 'ArrowDownSolidIcon';
 
-    const rollupItemStyles = '';
-
     const renderRoundedIcon = (icon, iconBgVersion) => (jsx(RoundedIcon, { ...icon, iconBgVersion: iconBgVersion, className: "shrink-0" }));
 
     const rollupIconVersion = 'black';
 
     const PrimaryFoldButton = JSX(({ label, labelIconBgVersion, icon, onToggle, labelIcon }) => (jsx(TextWithIcon, { tag: "button", className: style('border-none bg-transparent items-center group/button', labelIcon?.icon ? 'py-xs' : 'py-lg'), onClick: onToggle, textNode: jsxs("div", { className: "flex items-center text-start group-hover/button:text-primary-main gap-s", children: [renderRoundedIcon(labelIcon, labelIconBgVersion), label ? (jsx(Text, { size: "text-h6", font: "font-normal", children: label })) : null] }), iconNode: icon ? jsx(Icon, { name: icon, iconVersion: rollupIconVersion, width: "24", height: "24" }) : null })));
 
+    const rollupItemStyles = '';
+
     const RollupItem = JSX(({ className = '', isExpanded, isFoldButtonOnTop = true, label = 'Развернуть', labelIcon, labelIconBgVersion, version = 'primary', ...rest }) => (jsx(BlockWrapper, { className: style('w-full', rollupItemStyles, className), defaultPadding: "p-0", tag: "div", version: "transparent", ...rest, children: jsx(Foldable, { isFoldButtonOnTop: isFoldButtonOnTop, unfoldedByDefault: isExpanded, renderFoldableSection: ({ isUnfolded }) => (jsx(FoldableSection, { className: style('gap-lg', foldableSectionStyles), isUnfolded: isUnfolded, children: renderChildren({
                     ...rest,
                     extraProps: { className: 'w-full', padding: 'p-0' },
@@ -3263,43 +3423,157 @@
         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 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 sm:bg-main-divider sm:py-m sm:px-lg sm:rounded-md items-baseline whitespace-pre", children: [jsx(Text, { font: "font-light", size: "text-l", color: "text-secondary-text", children: title }), jsxs("span", { className: "font-sans text-h6 sm:text-primary-main 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, isFullWidthTitle: true, imageOptions: { directionRight: false, imageAlign: 'center', ...imageOptions }, ...rest, children: renderInsuranceSumMonth(Number(sum), Number(monthLimit)) }) })));
+    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 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() })] })));
-    const renderShimmer = (size = 3) => goldenSequence(100, size)
-        .map((_) => Math.floor(_))
-        .map(renderShimmerItem);
-    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) : []);
+    const getBadgeCount = (blocks = [], filter = {}) => blocks.filter(({ content = {} }) => shouldRenderBlock(filter, content)).length;
 
-    function renderBackwardButton(version, handleClick) {
-        const iconVersion = version === 'primary' ? 'white' : 'black';
-        const className = 'w-12 h-12 min-h-12 min-w-12 flex items-center justify-center';
-        const text = 'Вернуться назад';
-        return (jsxs("div", { className: "hidden sm: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 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 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)
-                .map((_, i) => (jsx("div", { className: "box-border h-full", role: "listitem", children: jsx(BaseProductTile, { className: "px-5 h-full", headlineVersion: "L", ..._, ...rest }) }, String(i)))) }) })));
+    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 tabPaddingStyleMap = {
+        default: 'px-xs',
+        underlined: 'px-m',
+        rounded: 'px-lg rounded-md',
+    };
+    const tabTextStyle = 'text-secondary-text hover:text-primary-main';
+    const activeTabTextStyleMap = {
+        default: 'text-black sm:text-white',
+        underlined: 'text-primary-main border-b-2',
+        rounded: 'text-white',
+    };
+    const tabBgStyleMap = {
+        default: 'bg-white',
+        underlined: 'bg-white',
+        rounded: 'bg-transparent',
+    };
+    const activeTabBgStyleMap = {
+        default: 'sm:bg-primary-main',
+        underlined: 'bg-white',
+        rounded: 'bg-primary-main',
+    };
+    const TabItemInner = JSX(({ tag = 'div', item = {}, isActive, type = 'default', onClick }) => {
+        const Tag = tag;
+        const { text, appendRight, ...link } = item;
+        return (jsx(Tag, { className: style('h-12', 'block flex-1', 'cursor-pointer', tabPaddingStyleMap[type], isActive ? activeTabBgStyleMap[type] : tabBgStyleMap[type]), role: "tab", "aria-selected": isActive, onClick: onClick, ...link, children: jsxs("div", { className: style('h-full', 'flex justify-center items-center', 'text-center whitespace-nowrap', isActive ? activeTabTextStyleMap[type] : tabTextStyle), children: [jsx(Text, { size: "text-m", children: text }), appendRight ? jsx("div", { className: "ml-xs", children: appendRight }) : null] }) }));
+    });
+
+    const TabItem = JSX((props) => props?.item?.href ? jsx(LinkTabItem, { ...props }) : jsx(ButtonTabItem, { ...props }));
+    const LinkTabItem = JSX((props) => {
+        const link = useLink();
+        const handleClick = useCallback(() => {
+            props.onClick && props.onClick(props.item || {});
+        }, [props.onClick, props.item]);
+        const { onClick, ...item } = link({ ...props.item, onClick: handleClick });
+        return jsx(TabItemInner, { ...props, tag: "a", item: item, onClick: onClick });
+    });
+    // TODO: Update handlerDecorator (support buttons?)
+    const ButtonTabItem = JSX(({ item = {}, onClick, ...rest }) => {
+        const handleClick = useCallback(() => {
+            onClick && onClick(item);
+        }, [onClick, item]);
+        return jsx(TabItemInner, { item: item, onClick: handleClick, ...rest });
+    });
+
+    const renderTab = (activeTab, onClick, type) => (tab, i) => (jsx(TabItem, { isActive: tab === activeTab, onClick: onClick, type: type, item: tab }, String(i)));
+
+    const TabsControl = JSX(({ className, tabsType = 'default', items = [], value, onChange }) => (jsx("div", { className: style('flex gap-x-2xs overflow-x-auto no-scrollbar', className), role: "tablist", children: items.map(renderTab(value, onChange, tabsType)) })));
+
+    const initialFiltrationState = {
+        categories: [],
+        extraOptions: [],
+        propertyType: [],
+        stage: [],
+    };
+    const MortgageFiltration = JSX(({ className, hotFilters, filtrationSchema = {}, resetButton, ...rest }) => {
+        const [filtrationState, { field, reset, update: replaceFiltrationState }] = useForm(initialFiltrationState);
+        const blocksToRender = getBlocksToRender(rest.block?.blocks, filtrationState)();
+        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, { blocksToRender: blocksToRender, ...rest })] }));
+    });
+    MortgageFiltration.childrenTypes = ['ProductTile'];
+    MortgageFiltration.childSchema = (content) => content?.filtrationSchema || {};
+
+    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 sm:bg-main-divider sm:py-m sm:px-lg sm:rounded-md items-baseline whitespace-pre", children: [jsx(Text, { font: "font-light", size: "text-l", color: "text-secondary-text", children: title }), jsxs("span", { className: "font-sans text-h6 sm:text-primary-main 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, isFullWidthTitle: true, 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() })] })));
+    const renderShimmer = (size = 3) => goldenSequence(100, size)
+        .map((_) => Math.floor(_))
+        .map(renderShimmerItem);
+    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(version, handleClick) {
+        const iconVersion = version === 'primary' ? 'white' : 'black';
+        const className = 'w-12 h-12 min-h-12 min-w-12 flex items-center justify-center';
+        const text = 'Вернуться назад';
+        return (jsxs("div", { className: "hidden sm: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 }) => {
+        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)
+                .map((_, i) => (jsx("div", { className: "box-border h-full", role: "listitem", children: jsx(BaseProductTile, { className: "px-5 h-full", headlineVersion: "L", ..._, ...rest }) }, String(i)))) }) })));
 
     const ProductTile = JSX(({ className, padding, headlineVersion = 'S', isTabularBenefits = true, additionalDescription, imageOptions, isFullWidthTitle = true, ...rest }) => (jsx(BlockWrapper, { className: className, padding: "p-0", ...rest, children: jsx(BaseProductTile, { className: "h-full", defaultPadding: "p-4xl sm:p-xl", padding: padding, headlineVersion: headlineVersion, isTabularBenefits: isTabularBenefits, imageOptions: { isImageSecondary: true, ...imageOptions }, isFullWidthTitle: isFullWidthTitle, ...rest, children: additionalDescription ? (jsx(Paragraph, { size: "text-m", font: "font-light", color: "group-data-primary:text-secondary-text", children: additionalDescription })) : null }) })));
 
@@ -3322,25 +3596,6 @@
         return (jsx(BlockWrapper, { defaultPadding: "p-0", ...rest, children: jsx(RichText, { __html: __html, richVersion: richVersion }) }));
     });
 
-    const styles$2 = {
-        focus: 'focus:border-primary-text focus:border',
-        hover: 'hover:bg-primary-hover',
-        active: 'active:bg-primary-active',
-        border: 'border-b border-b-2 border-gray last:border-0',
-        position: 'relative flex items-center justify-center',
-        font: 'text-center font-sans text-l',
-    };
-    // TODO: Добавить метод определения центральной точки
-    const ZoomButton = JSX(({ yandexMaps, direction = 'in' }) => {
-        const iconName = direction === 'in' ? 'PlusIcon' : 'MinusIcon';
-        const changeZoom = () => {
-            const currentZoom = yandexMaps.current.getZoom();
-            const newZoom = direction === 'in' ? currentZoom + 1 : currentZoom - 1;
-            yandexMaps.current.setZoom(newZoom, { checkZoomRange: true });
-        };
-        return (jsx("div", { onClick: changeZoom, className: `${Object.values(styles$2).join(' ')} bg-white select-none cursor-pointer w-12 h-12`, children: jsx(Icon, { name: iconName, width: "20", height: "16" }) }));
-    });
-
     function renderClusterer(yandexMaps, map, points) {
         map.geoObjects.removeAll();
         const clusterIconContentLayout = yandexMaps.templateLayoutFactory.createClass('<div style="margin-top: -3px;">{{properties.geoObjects.length}}</div>');
@@ -3373,7 +3628,7 @@
         });
     }
 
-    const styles$1 = {
+    const styles$2 = {
         focus: 'focus:border-primary-text focus:border',
         hover: 'hover:bg-primary-hover',
         active: 'active:bg-primary-active',
@@ -3385,10 +3640,10 @@
         const getYandexMapUrl = () => {
             return `https://yandex.ru/maps/?ll=${[pointsCenter[1], pointsCenter[0]]}&z=10&l=map`;
         };
-        return (jsx("a", { className: `select-none cursor-pointer px-4xl h-12 bg-primary-main text-white ${Object.values(styles$1).join(' ')}`, href: getYandexMapUrl(), target: "_blank", children: "\u041E\u0442\u043A\u0440\u044B\u0442\u044C \u043D\u0430 \u043A\u0430\u0440\u0442\u0435" }));
+        return (jsx("a", { className: `select-none cursor-pointer px-4xl h-12 bg-primary-main text-white ${Object.values(styles$2).join(' ')}`, href: getYandexMapUrl(), target: "_blank", children: "\u041E\u0442\u043A\u0440\u044B\u0442\u044C \u043D\u0430 \u043A\u0430\u0440\u0442\u0435" }));
     };
 
-    const styles = {
+    const styles$1 = {
         focus: 'focus:border-primary-text focus:border',
         hover: 'hover:bg-primary-hover',
         active: 'active:bg-primary-active',
@@ -3410,7 +3665,7 @@
                 map.geoObjects.add(result.geoObjects);
             });
         };
-        return (jsx("div", { className: `select-none cursor-pointer py-m w-12 bg-white ${Object.values(styles).join(' ')} ${className}`, onClick: setUserGeoLocation, children: jsx(Icon, { name: "UserGeoLocationIcon", width: "20", height: "16" }) }));
+        return (jsx("div", { className: `select-none cursor-pointer py-m w-12 bg-white ${Object.values(styles$1).join(' ')} ${className}`, onClick: setUserGeoLocation, children: jsx(Icon, { name: "UserGeoLocationIcon", width: "20", height: "16" }) }));
     };
 
     const getNS = (_) => globalThis[_];
@@ -3453,6 +3708,25 @@
         return useExternalNS(YMAPS_NAMESPACE, url);
     };
 
+    const styles = {
+        focus: 'focus:border-primary-text focus:border',
+        hover: 'hover:bg-primary-hover',
+        active: 'active:bg-primary-active',
+        border: 'border-b border-b-2 border-gray last:border-0',
+        position: 'relative flex items-center justify-center',
+        font: 'text-center font-sans text-l',
+    };
+    // TODO: Добавить метод определения центральной точки
+    const ZoomButton = JSX(({ yandexMaps, direction = 'in' }) => {
+        const iconName = direction === 'in' ? 'PlusIcon' : 'MinusIcon';
+        const changeZoom = () => {
+            const currentZoom = yandexMaps.current.getZoom();
+            const newZoom = direction === 'in' ? currentZoom + 1 : currentZoom - 1;
+            yandexMaps.current.setZoom(newZoom, { checkZoomRange: true });
+        };
+        return (jsx("div", { onClick: changeZoom, className: `${Object.values(styles).join(' ')} bg-white select-none cursor-pointer w-12 h-12`, children: jsx(Icon, { name: iconName, width: "20", height: "16" }) }));
+    });
+
     const FULLSCREEN_STYLES = {
         border: 'border border-transparent rounded-md ',
         position: 'absolute flex items-center justify-center',
@@ -3519,6 +3793,12 @@
     const mapByIndex = (arr, index) => arr.map((a) => a[index]);
     const getArraySumAndAverage = (arr) => arr.length && arr.reduce((a, b) => a + b) / arr.length;
 
+    const RadioButtons = JSX(({ className = '' }) => {
+        const [selectedOption, setSelectedOption] = useState('option2');
+        const onChange = useCallback((_) => setSelectedOption(_), []);
+        return (jsxs("div", { className: style('order-4', className), children: [jsx(Radio, { className: "mb-xs", name: "contractType", text: "\u041F\u0440\u043E\u0441\u0442\u043E\u0435 \u0445\u0440\u0430\u043D\u0435\u043D\u0438\u0435", value: "option1", checked: selectedOption === 'option1', onChange: onChange }), jsx(Radio, { name: "contractType", text: "\u0421\u0434\u0435\u043B\u043A\u0430 \u0441 \u043D\u0435\u0434\u0432\u0438\u0436\u0438\u043C\u043E\u0441\u0442\u044C\u044E", value: "option2", checked: selectedOption === 'option2', onChange: onChange })] }));
+    });
+
     const WrapperSelect = JSX(({ data, fieldLabel, fieldValue, selected, placeholder = '', setSelected, label }) => {
         const dataFormat = data
             .filter(Boolean)
@@ -3529,12 +3809,6 @@
 
     const RegionsAndBranches = JSX(({ regions = [], selectedRegion, onSelectedRegion: onSelectedRegion, branches = [], selectedBranch, onSelectedBranch, }) => (jsxs("div", { className: "flex flex-col @xl:flex-row gap-m order-1", children: [jsx("div", { className: "flex-1 min-w-0", children: jsx(WrapperSelect, { data: regions, fieldValue: "code", fieldLabel: "name", selected: selectedRegion, setSelected: onSelectedRegion, label: "\u0420\u0435\u0433\u0438\u043E\u043D" }) }), jsx("div", { className: "flex-1 min-w-0", children: jsx(WrapperSelect, { data: branches, fieldValue: "branchCode", fieldLabel: "address", selected: selectedBranch, setSelected: onSelectedBranch, label: "\u041E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0435", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0435" }) })] })));
 
-    const RadioButtons = JSX(({ className = '' }) => {
-        const [selectedOption, setSelectedOption] = useState('option2');
-        const onChange = useCallback((_) => setSelectedOption(_), []);
-        return (jsxs("div", { className: style('order-4', className), children: [jsx(Radio, { className: "mb-xs", name: "contractType", text: "\u041F\u0440\u043E\u0441\u0442\u043E\u0435 \u0445\u0440\u0430\u043D\u0435\u043D\u0438\u0435", value: "option1", checked: selectedOption === 'option1', onChange: onChange }), jsx(Radio, { name: "contractType", text: "\u0421\u0434\u0435\u043B\u043A\u0430 \u0441 \u043D\u0435\u0434\u0432\u0438\u0436\u0438\u043C\u043E\u0441\u0442\u044C\u044E", value: "option2", checked: selectedOption === 'option2', onChange: onChange })] }));
-    });
-
     const ITEMS = ['От 1 дня', 'До 365 дней'];
     const MIN = 1;
     const MAX = 365;
@@ -3648,6 +3922,8 @@
         throw new Error(x);
     }
 
+    const checkCanRenderIcon = (icon) => Boolean(icon?.icon || icon?.src);
+
     const STEPS_BLOCK_STYLE = {
         description: 'text-white/80 text-l font-light group-data-primary:text-secondary-text group-data-gray:text-secondary-text',
         iconText: 'text-white group-data-primary:text-secondary-text group-data-gray:text-secondary-text',
@@ -3656,8 +3932,6 @@
         dot: 'bg-white/80 group-data-primary:bg-secondary-text',
     };
 
-    const checkCanRenderIcon = (icon) => Boolean(icon?.icon || icon?.src);
-
     const STEPS_SIZE_MAP = {
         normal: { icon: 'h-11 w-11', image: 'h-14 w-14' },
         small: { icon: 'h-12 w-12', image: 'h-14 w-14' },
@@ -3696,6 +3970,18 @@
         return (jsx("div", { className: style(iconAreaSize, containerStyle, 'z-10 mr-s flex justify-center content-center'), children: jsx("span", { className: "flex max-w-full max-h-full 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 }, imageClassName: "max-w-full max-h-full", width: iconSize, height: iconSize })) : (jsx("span", { children: i + 1 })) }) }));
     };
 
+    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);
+
+    function useActiveRoute(items = []) {
+        const router = useRouter();
+        const activeIndex = items.findIndex(isTopItemActive(router));
+        return [activeIndex, items[activeIndex]];
+    }
+
     const RenderItem = JSX(({ isActive, item, onClick }) => {
         const isAnotherPortal = projectSettings?.BASE_PATH
             ? !item.href?.startsWith(projectSettings?.BASE_PATH)
@@ -3713,23 +3999,52 @@
                     } }), item.title] }));
     });
 
-    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);
-
-    function useActiveRoute(items = []) {
-        const router = useRouter();
-        const activeIndex = items.findIndex(isTopItemActive(router));
-        return [activeIndex, items[activeIndex]];
-    }
-
     const RenderMenuItems = JSX(({ menuItems, onClick }) => {
         const [activeIndex] = useActiveRoute(menuItems);
         return (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)))) }));
     });
 
+    const isDialogOpen = (id, dialogs) => dialogs.find((item) => item.id === id, id);
+
+    function useList(initialList = []) {
+        const [list, setList] = useState(initialList);
+        const push = useCallback((item) => setList(_ => [..._, item]), []);
+        const pop = useCallback(() => setList(_ => _.slice(0, -1)), []);
+        const remove = useCallback((item) => setList(_ => _.filter(currentItem => currentItem !== item)), []);
+        const clear = useCallback(() => setList([]), []);
+        return [list, { setList, push, pop, remove, clear }];
+    }
+
+    const useDialogsList = ({ onCloseAll, onClose, } = {}) => {
+        const [dialogs, { push, pop, clear }] = useList();
+        const closeAll = useCallback(() => {
+            onCloseAll && onCloseAll(dialogs);
+            clear();
+        }, [dialogs, onCloseAll]);
+        const close = useCallback(() => {
+            onClose && onClose(dialogs[dialogs.length - 1]);
+            pop();
+        }, [dialogs, onClose]);
+        useEffect(() => defaultEventBus.subscribe('dialog', (action) => {
+            switch (action.type) {
+                case 'open':
+                    push(action);
+                    break;
+                case 'close':
+                    if (action.all) {
+                        closeAll();
+                    }
+                    else {
+                        close();
+                    }
+                    break;
+                default:
+                    assertUnreachable(action);
+            }
+        }), [closeAll, close]);
+        return dialogs;
+    };
+
     const useLatestEvent = (eventBus, type, initialEvent) => {
         const [latestEvent, setLatestEvent] = useState(initialEvent || null);
         useEffect(() => eventBus.subscribe(type, (_) => setLatestEvent(_)), [eventBus, type]);
@@ -3863,11 +4178,6 @@
         return prefixL;
     }
 
-    const SearchBar$1 = JSX(({ className, searchTerm, onSearch }) => {
-        return (jsxs("form", { className: `font-sans relative ${className}`, children: [jsx("div", { className: "absolute rounded h-full flex items-center justify-center pl-m max-w-44 gap-s pointer-events-none", children: searchTerm ? null : (jsx("label", { htmlFor: "search-bar-input", className: `text-secondary-text `, children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0444\u0438\u043B\u0438\u0430\u043B\u0430\u043C" })) }), jsx("input", { id: "search-bar-input", className: `h-12 pl-m w-full peer text-l text-black border border-solid rounded-md box-border
-              outline-none border-gray hover:border-primary-hover active:border-primary-text focus:border-primary-text`, value: searchTerm, onChange: (e) => onSearch(e.target.value.toLowerCase()), type: "text", name: "location-search-bar-input" })] }));
-    });
-
     const 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();
@@ -3881,6 +4191,11 @@
 
     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$1 = JSX(({ className, searchTerm, onSearch }) => {
+        return (jsxs("form", { className: `font-sans relative ${className}`, children: [jsx("div", { className: "absolute rounded h-full flex items-center justify-center pl-m max-w-44 gap-s pointer-events-none", children: searchTerm ? null : (jsx("label", { htmlFor: "search-bar-input", className: `text-secondary-text `, children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0444\u0438\u043B\u0438\u0430\u043B\u0430\u043C" })) }), jsx("input", { id: "search-bar-input", className: `h-12 pl-m w-full peer text-l text-black border border-solid rounded-md box-border
+              outline-none border-gray hover:border-primary-hover active:border-primary-text focus:border-primary-text`, value: searchTerm, onChange: (e) => onSearch(e.target.value.toLowerCase()), type: "text", name: "location-search-bar-input" })] }));
+    });
+
     const SEARCH_TERM_MIN_LENGTH = 3;
     const LocationDialog = JSX(() => {
         const { defaultLocation, foreignOffices } = useSitemap();
@@ -3911,11 +4226,11 @@
         };
     };
 
-    const SearchInput = JSX(({ className, value, autoFocus, onChange, onFocus }) => {
+    const SearchInput = JSX(({ className, value, autoFocus, onChange, onFocus, placeholder = 'Поиск по сайту' }) => {
         const handleChange = useCallback((ev) => {
             onChange && onChange(ev.target?.value || '');
         }, [onChange]);
-        return (jsxs("div", { className: style('font-sans relative', className), role: "form", children: [jsx("div", { className: "absolute h-full flex items-center pl-m pointer-events-none", children: jsx(Img, { image: { icon: 'LoupeIcon', iconVersion: 'black' }, width: "24", height: "24" }) }), jsx("input", { className: style('h-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 })] }));
+        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: placeholder, autoFocus: autoFocus, onChange: handleChange, onFocus: onFocus })] }));
     });
 
     function useDebouncedEffect(effect, deps, delay = 300) {
@@ -3930,10 +4245,6 @@
     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));
@@ -4107,47 +4418,6 @@
     });
     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();
@@ -4186,52 +4456,6 @@
         return (jsx("div", { className: "w-full mb-5", "data-component": "sticky-bottom-menu-container", children: jsx(BlockWrapper, { className: "@container-normal fixed w-full h-[74px] bottom-0 left-0 my-0 mx-auto bg-transparent z-[100]", padding: "p-0", "data-component": "sticky-bottom-menu", children: jsx(RenderMenuItems, { menuItems: menuItemsWithButton, onClick: toggle }) }) }));
     });
 
-    const tabPaddingStyleMap = {
-        default: 'px-xs',
-        underlined: 'px-m',
-        rounded: 'px-lg rounded-md',
-    };
-    const tabTextStyle = 'text-secondary-text hover:text-primary-main';
-    const activeTabTextStyleMap = {
-        default: 'text-black sm:text-white',
-        underlined: 'text-primary-main border-b-2',
-        rounded: 'text-white',
-    };
-    const tabBgStyleMap = {
-        default: 'bg-white',
-        underlined: 'bg-white',
-        rounded: 'bg-transparent',
-    };
-    const activeTabBgStyleMap = {
-        default: 'sm:bg-primary-main',
-        underlined: 'bg-white',
-        rounded: 'bg-primary-main',
-    };
-    const TabItemInner = JSX(({ tag = 'div', item = {}, isActive, type = 'default', onClick }) => {
-        const Tag = tag;
-        const { text, appendRight, ...link } = item;
-        return (jsx(Tag, { className: style('h-12', 'block flex-1', 'cursor-pointer', tabPaddingStyleMap[type], isActive ? activeTabBgStyleMap[type] : tabBgStyleMap[type]), role: "tab", "aria-selected": isActive, onClick: onClick, ...link, children: jsxs("div", { className: style('h-full', 'flex justify-center items-center', 'text-center whitespace-nowrap', isActive ? activeTabTextStyleMap[type] : tabTextStyle), children: [jsx(Text, { size: "text-m", children: text }), appendRight ? jsx("div", { className: "ml-xs", children: appendRight }) : null] }) }));
-    });
-
-    const TabItem = JSX((props) => props?.item?.href ? jsx(LinkTabItem, { ...props }) : jsx(ButtonTabItem, { ...props }));
-    const LinkTabItem = JSX((props) => {
-        const link = useLink();
-        const handleClick = useCallback(() => {
-            props.onClick && props.onClick(props.item || {});
-        }, [props.onClick, props.item]);
-        const { onClick, ...item } = link({ ...props.item, onClick: handleClick });
-        return jsx(TabItemInner, { ...props, tag: "a", item: item, onClick: onClick });
-    });
-    // TODO: Update handlerDecorator (support buttons?)
-    const ButtonTabItem = JSX(({ item = {}, onClick, ...rest }) => {
-        const handleClick = useCallback(() => {
-            onClick && onClick(item);
-        }, [onClick, item]);
-        return jsx(TabItemInner, { item: item, onClick: handleClick, ...rest });
-    });
-
-    const renderTab = (activeTab, onClick, type) => (tab, i) => (jsx(TabItem, { isActive: tab === activeTab, onClick: onClick, type: type, item: tab }, String(i)));
-
     const scrollButtonStyle = 'hidden sm:flex absolute z-40 top-0';
     const ScrollableTabsControl = JSX(({ className, items = [], value, onChange, tabsType }) => {
         const [containerRef, scroll] = useSwipeListScroll({
@@ -4240,8 +4464,6 @@
         return (jsxs("div", { className: style('relative overflow-x-auto no-scrollbar', className), role: "tablist", children: [jsx(SwipeListContainer, { containerRef: containerRef, snapAlign: "snap-start", onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: items.map(renderTab(value, onChange, tabsType)) }), scroll.canScrollLeft ? (jsx(ScrollLeftButton, { className: style('left-6', scrollButtonStyle), onClick: scroll.scrollLeft })) : null, scroll.canScrollRight ? (jsx(ScrollRightButton, { className: style('right-6', scrollButtonStyle), onClick: scroll.scrollRight })) : null] }));
     });
 
-    const TabsControl = JSX(({ className, tabsType = 'default', items = [], value, onChange }) => (jsx("div", { className: style('flex gap-x-2xs overflow-x-auto no-scrollbar', className), role: "tablist", children: items.map(renderTab(value, onChange, tabsType)) })));
-
     const renderTabs = ({ tabsMode, ...props }) => {
         switch (tabsMode) {
             case 'wideScreen':
@@ -4292,17 +4514,19 @@
     };
     const normalizeTab = (_) => (_?.type === 'group' ? { text: _.title } : _);
 
+    const dividerStyle = '@4xl:border-main-divider @4xl:border-b';
+    const firstCellStyle = 'w-80 flex-shrink-0';
+    const COLS_LENGTH_FOR_SCROLL = 2;
+    const COLUMN_WIDTH$1 = 4 * 80 + 40; // w-80 + pl-10 = 360px
+
+    const headlineAlign = 'text-left';
+
     const carouselContainerClassesMap = {
         comparison: 'flex gap-m duration-1000',
         tariff: 'flex gap-5xl flex-grow duration-1000',
     };
     const TableCarouselContainer = JSX(({ children, activeIndex, columnWidth, version = 'comparison' }) => (jsx("div", { className: "flex flex-1 overflow-hidden", children: jsx("div", { className: carouselContainerClassesMap[version], style: { transform: `translateX(-${activeIndex * columnWidth}px)` }, children: children }) })));
 
-    const dividerStyle = '@4xl:border-main-divider @4xl:border-b';
-    const firstCellStyle = 'w-80 flex-shrink-0';
-    const COLS_LENGTH_FOR_SCROLL = 2;
-    const COLUMN_WIDTH$1 = 4 * 80 + 40; // w-80 + pl-10 = 360px
-
     const TableInnerButton = JSX(({ className = '', isOpen, onClick }) => (jsx(Button, { className: className, appendRight: jsx(Img, { image: { icon: isOpen ? 'ArrowUpIcon' : 'ArrowDownIcon' }, width: "20", height: "20" }), text: isOpen ? 'Скрыть' : 'Показать', version: "gray", onClick: onClick })));
 
     const renderButtonsCellData = ({ buttons }) => renderButtonsSection(buttons, {
@@ -4445,8 +4669,6 @@
                         })] }), isScrollAvailable ? (jsx("div", { className: "absolute top-0 right-0 bottom-0 w-20 bg-opacity-to-white" })) : null] }));
     });
 
-    const headlineAlign = 'text-left';
-
     const TariffsTable = JSX(({ className = '', title, description, rowHeaders, tariffsColumns: columns, hiddenRowsNum = 0, ...rest }) => {
         const colData = columns?.map(({ data }) => data) || [];
         const rowData = rowHeaders?.map((header, i) => ({
@@ -4474,211 +4696,6 @@
 
     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, isFullWidthTitle: false, ...rest }) })));
 
-    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 = '', blocksToRender = [], topItemsCount = 0, block, notFound, ...rest }) => {
-        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 })) })] })] }));
-    });
-    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 ||
-        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 isMultipleNumberFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) || isEmpty(target[key]) || target[key]?.includes(pattern[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 shouldRenderBlock = (pattern, target) => Object.entries(pattern)
-        .map(([key, subPattern]) => {
-        if (typeof subPattern === 'number') {
-            return Array.isArray(target[key])
-                ? isMultipleNumberFieldMatch(key, pattern)
-                : 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 getBlocksToRender = (blocks, filtrationState) => (normalize = identity) => blocks && blocks.filter((b) => shouldRenderBlock(filtrationState, normalize(b.content || {})));
-
-    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 getPeriod = (source, content) => source[content?.sourceBook]?.rateRows
-        .map((el) => el.minMonths)
-        .filter((minMonths) => minMonths !== undefined);
-
-    async function fetchMultitudeJSON(...urls) {
-        const fetchPromises = urls.map((url) => fetchJSON(url));
-        return Promise.all(fetchPromises);
-    }
-
-    const unique = (list) => [...new Set(list)];
-
-    const getChildSourceBook = (blocks) => blocks?.filter(hasSourceBook).map(({ content: { sourceBook } }) => sourceBook);
-    const hasSourceBook = (block) => Boolean(block && block.content && typeof block.content.sourceBook === 'string');
-
-    function useDepositsPeriods(blocks) {
-        const { dirs = [], source = [] } = useMemo(() => {
-            const sourceBooks = getChildSourceBook(blocks);
-            return { dirs: sourceBooks?.map((url) => `/wcms-resources/${url}.json`), source: sourceBooks };
-        }, [blocks]);
-        const { data = [] } = useAsyncData(dirs, fetchMultitudeJSON);
-        return {
-            source: Object.fromEntries(zip(source, data).filter(([, sourceData]) => Boolean(sourceData))),
-            months: unique(data
-                .flatMap((item) => item?.rateRows || [])
-                .filter((row) => typeof row.minMonths === 'number' && row.minMonths === row.maxMonths)
-                .map((row) => row.minMonths)).sort((a, b) => a - b) || [],
-        };
-    }
-
-    const DEFAULT_MIN_SUM = 500;
-    const DEFAULT_MAX_SUM = 1000000000;
-    const initialFiltrationState$1 = {
-        sum: {
-            min: 10000,
-            max: DEFAULT_MAX_SUM,
-        },
-        period: 3,
-    };
-    const DepositFiltration = JSX(({ className, filtrationSchema = {}, resetButton, sumInput, periodInput, ...rest }) => {
-        const { source, months } = useDepositsPeriods(rest.block?.blocks);
-        const [filtrationState, { field, reset }] = useForm(initialFiltrationState$1);
-        const blocksToRender = getBlocksToRender(rest.block?.blocks, filtrationState)((content) => ({ ...content, period: getPeriod(source, content || {}) || [] }));
-        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 лет'], list: months, ...field('period') })] }));
-        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, { blocksToRender: blocksToRender, ...rest })] }));
-    });
-    const sourceBookSchema = {
-        type: 'string',
-        title: 'Адрес справочника',
-    };
-    DepositFiltration.childrenTypes = ['ProductTile'];
-    DepositFiltration.childSchema = (content) => ({
-        ...(content?.filtrationSchema || {}),
-        sourceBook: sourceBookSchema,
-    });
-
-    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 = {} }) => shouldRenderBlock(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 blocksToRender = getBlocksToRender(rest.block?.blocks, filtrationState)();
-        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, { blocksToRender: blocksToRender, ...rest })] }));
-    });
-    MortgageFiltration.childrenTypes = ['ProductTile'];
-    MortgageFiltration.childSchema = (content) => content?.filtrationSchema || {};
-
     const Blocks = {
         ApplicationForm,
         BenefitsBlock,
@@ -4920,7 +4937,7 @@
 
     const joinList = (sep) => (list) => list.reduce((acc, el, i) => (acc.length ? acc.concat({ ...sep, key: `sep-${i}` }, el) : [el]), []);
 
-    const packageVersion = "0.14.17";
+    const packageVersion = "0.14.19";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;