@redneckz/wildless-cms-uni-blocks 0.5.5 → 0.5.6

package/bundle/bundle.umd.js

@@ -13,6 +13,7 @@
     const useEffect = lazyHook('useEffect');
     const useCallback = lazyHook('useCallback');
     const useMemo = lazyHook('useMemo');
+    const useRef = lazyHook('useRef');
 
     const setup = (_jsx, _jsxs) => {
         globalThis._uni = {
@@ -84,6 +85,9 @@
         get YANDEX_MAP_API_KEY() {
             return this._.YANDEX_MAP_API_KEY;
         }
+        get YANDEX_METRIKA_ID() {
+            return this._.YANDEX_METRIKA_ID;
+        }
     })();
 
     const AUTH_PREFIX = 'guest';
@@ -307,11 +311,13 @@
         IconMap["ArrowUpIcon"] = "ArrowUpIcon";
         IconMap["AtmIcon"] = "AtmIcon";
         IconMap["BankIcon"] = "BankIcon";
+        IconMap["BuildingIcon"] = "BuildingIcon";
         IconMap["BurgerIcon"] = "BurgerIcon";
         IconMap["Calendar2Icon"] = "Calendar2Icon";
         IconMap["CalendarCircleIcon"] = "CalendarCircleIcon";
         IconMap["CalendarIcon"] = "CalendarIcon";
         IconMap["CalendarTickIcon"] = "CalendarTickIcon";
+        IconMap["Car2Icon"] = "Car2Icon";
         IconMap["CardIcon"] = "CardIcon";
         IconMap["CardPosIcon"] = "CardPosIcon";
         IconMap["CardTickIcon"] = "CardTickIcon";
@@ -331,6 +337,7 @@
         IconMap["DocumentTextIcon"] = "DocumentTextIcon";
         IconMap["DollarIcon"] = "DollarIcon";
         IconMap["DoneIcon"] = "DoneIcon";
+        IconMap["DoneSimpleIcon"] = "DoneSimpleIcon";
         IconMap["EarthIcon"] = "EarthIcon";
         IconMap["EmptyWalletChangeIcon"] = "EmptyWalletChangeIcon";
         IconMap["EmptyWalletIcon"] = "EmptyWalletIcon";
@@ -352,6 +359,7 @@
         IconMap["MirIcon"] = "MirIcon";
         IconMap["MoneyIcon"] = "MoneyIcon";
         IconMap["MoneyInsuranceIcon"] = "MoneyInsuranceIcon";
+        IconMap["MoneysIcon"] = "MoneysIcon";
         IconMap["MonitorMobileIcon"] = "MonitorMobileIcon";
         IconMap["NewDocIcon"] = "NewDocIcon";
         IconMap["OfficeIcon"] = "OfficeIcon";
@@ -373,9 +381,10 @@
         IconMap["SignDocsIcon"] = "SignDocsIcon";
         IconMap["SmallClockIcon"] = "SmallClockIcon";
         IconMap["SoundIcon"] = "SoundIcon";
-        IconMap["StateMortgageIcon"] = "StateMortgageIcon";
+        IconMap["StrongBoxIcon"] = "StrongBoxIcon";
         IconMap["TelegramIcon"] = "TelegramIcon";
         IconMap["UnionPayIcon"] = "UnionPayIcon";
+        IconMap["UserSquareIcon"] = "UserSquareIcon";
         IconMap["UserTickIcon"] = "UserTickIcon";
         IconMap["VisaIcon"] = "VisaIcon";
         IconMap["VKIcon"] = "VKIcon";
@@ -395,11 +404,13 @@
         IconTitleMap["ArrowUpIcon"] = "\u0421\u0442\u0440\u0435\u043B\u043A\u0430 \u0432\u0432\u0435\u0440\u0445";
         IconTitleMap["AtmIcon"] = "\u0411\u0430\u043D\u043A\u043E\u043C\u0430\u0442";
         IconTitleMap["BankIcon"] = "\u0411\u0430\u043D\u043A";
+        IconTitleMap["BuildingIcon"] = "\u0417\u0434\u0430\u043D\u0438\u0435 \u0441 \u0434\u0435\u0440\u0435\u0432\u043E\u043C";
         IconTitleMap["BurgerIcon"] = "\u0411\u0443\u0440\u0433\u0435\u0440";
         IconTitleMap["Calendar2Icon"] = "\u041A\u0430\u043B\u0435\u043D\u0434\u0430\u0440\u044C 2";
         IconTitleMap["CalendarCircleIcon"] = "\u0421\u043A\u0440\u0443\u0433\u043B\u0451\u043D\u043D\u044B\u0439 \u043A\u0430\u043B\u0435\u043D\u0434\u0430\u0440\u044C";
         IconTitleMap["CalendarIcon"] = "\u041A\u0430\u043B\u0435\u043D\u0434\u0430\u0440\u044C";
         IconTitleMap["CalendarTickIcon"] = "\u041A\u0430\u043B\u0435\u043D\u0434\u0430\u0440\u044C \u0441 \u0433\u0430\u043B\u043E\u0447\u043A\u043E\u0439";
+        IconTitleMap["Car2Icon"] = "\u041C\u0430\u0448\u0438\u043D\u04302";
         IconTitleMap["CardIcon"] = "\u041A\u0440\u0435\u0434. \u043A\u0430\u0440\u0442\u0430";
         IconTitleMap["CardPosIcon"] = "\u041A\u0440\u0435\u0434. \u043A\u0430\u0440\u0442\u0430 \u043F\u043E\u0434 \u043D\u0430\u043A\u043B\u043E\u043D\u043E\u043C";
         IconTitleMap["CardTickIcon"] = "\u041A\u0440\u0435\u0434. \u043A\u0430\u0440\u0442\u0430 \u0441 \u0433\u0430\u043B\u043E\u0447\u043A\u043E\u0439";
@@ -418,7 +429,8 @@
         IconTitleMap["DocsIcon"] = "\u0414\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u044B";
         IconTitleMap["DocumentTextIcon"] = "\u0414\u043E\u043A\u0443\u043C\u0435\u043D\u0442 \u0441 \u0442\u0435\u043A\u0441\u0442\u043E\u043C";
         IconTitleMap["DollarIcon"] = "\u0414\u043E\u043B\u043B\u0430\u0440";
-        IconTitleMap["DoneIcon"] = "\u0417\u0435\u043B\u0451\u043D\u0430\u044F '\u0433\u0430\u043B\u043E\u0447\u043A\u0430'";
+        IconTitleMap["DoneIcon"] = "\u0417\u0435\u043B\u0451\u043D\u0430\u044F '\u0433\u0430\u043B\u043E\u0447\u043A\u0430' \u0432 \u043A\u0440\u0443\u0433\u0435";
+        IconTitleMap["DoneSimpleIcon"] = "\u0417\u0435\u043B\u0451\u043D\u0430\u044F '\u0433\u0430\u043B\u043E\u0447\u043A\u0430'";
         IconTitleMap["EarthIcon"] = "\u0417\u0435\u043C\u043B\u044F";
         IconTitleMap["EmptyWalletChangeIcon"] = "\u041F\u0443\u0441\u0442\u043E\u0439 \u043A\u043E\u0448\u0435\u043B\u0451\u043A \u0441 \u0432\u043E\u0437\u0432\u0440\u0430\u0442\u043E\u043C";
         IconTitleMap["EmptyWalletIcon"] = "\u041F\u0443\u0441\u0442\u043E\u0439 \u043A\u043E\u0448\u0435\u043B\u0451\u043A";
@@ -440,6 +452,7 @@
         IconTitleMap["MirIcon"] = "\u041C\u0418\u0420";
         IconTitleMap["MoneyIcon"] = "\u0414\u0435\u043D\u044C\u0433\u0438";
         IconTitleMap["MoneyInsuranceIcon"] = "\u0414\u0435\u043D\u0435\u0436\u043D\u043E\u0435 \u0441\u0442\u0440\u0430\u0445\u043E\u0432\u0430\u043D\u0438\u0435";
+        IconTitleMap["MoneysIcon"] = "MoneysIcon";
         IconTitleMap["MonitorMobileIcon"] = "\u041C\u043E\u043D\u0438\u0442\u043E\u0440 \u0438 \u043C\u043E\u0431\u0438\u043B\u044C\u043D\u044B\u0439";
         IconTitleMap["NewDocIcon"] = "\u041D\u043E\u0432\u044B\u0439 \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442";
         IconTitleMap["OfficeIcon"] = "\u041E\u0444\u0438\u0441";
@@ -461,9 +474,10 @@
         IconTitleMap["SignDocsIcon"] = "\u041F\u043E\u0434\u043F\u0438\u0441\u0430\u043D\u043D\u044B\u0435 \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u044B";
         IconTitleMap["SmallClockIcon"] = "\u041C\u0430\u043B\u0435\u043D\u044C\u043A\u0438\u0435 \u0447\u0430\u0441\u044B";
         IconTitleMap["SoundIcon"] = "\u0417\u0432\u0443\u043A";
-        IconTitleMap["StateMortgageIcon"] = "StateMortgageIcon";
+        IconTitleMap["StrongBoxIcon"] = "\u042F\u0449\u0438\u043A \u0441 \u0437\u0430\u043C\u043E\u0447\u043D\u043E\u0439 \u0441\u043A\u0432\u0430\u0436\u0438\u043D\u043E\u0439";
         IconTitleMap["TelegramIcon"] = "\u041B\u043E\u0433\u043E \u00ABTelegram\u00BB";
         IconTitleMap["UnionPayIcon"] = "UnionPay";
+        IconTitleMap["UserSquareIcon"] = "\u041F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u044C \u0432 \u0440\u0430\u043C\u043A\u0435";
         IconTitleMap["UserTickIcon"] = "\u041F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u044C";
         IconTitleMap["VisaIcon"] = "Visa";
         IconTitleMap["VKIcon"] = "\u041B\u043E\u0433\u043E \u00ABVK\u00BB";
@@ -673,7 +687,7 @@
     const addSpacesBetweenNumbers = (number) => new Intl.NumberFormat('ru-RU', { maximumSignificantDigits: 3 }).format(number);
 
     const PictureText = JSX(({ className = '', context, title, description, image, benefits, version = 'primary', sum, monthLimit, directionRight = false, ...rest }) => {
-        return (jsxs(BlockWrapper, { className: `relative font-sans py-12 px-28 ${VersionStyleMap[version]} ${className}`, context: context, ...rest, children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: description, headlineVersion: "M", bgColorHeadline: version, align: "center" }), jsxs("div", { className: 'flex justify-center gap-[122px] mt-[30px]', children: [image?.src ? jsx(Img, { className: directionRight ? 'order-2' : '', image: image }) : null, jsxs("div", { className: "w-[558px] m-auto", children: [benefits?.length ? (jsx("div", { className: "flex flex-col gap-4", children: benefits.map(renderBenefit$2(version)) })) : null, renderInsuranceSumMonth(sum, monthLimit)] })] })] }));
+        return (jsxs(BlockWrapper, { className: `relative font-sans py-12 px-24 ${VersionStyleMap[version]} ${className}`, context: context, ...rest, children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: description, headlineVersion: "M", bgColorHeadline: version, align: "center" }), jsxs("div", { className: 'flex justify-center gap-[122px] mt-[30px]', children: [image?.src ? jsx(Img, { className: directionRight ? 'order-2' : '', image: image }) : null, jsxs("div", { className: "w-[558px] m-auto", children: [benefits?.length ? (jsx("div", { className: "flex flex-col gap-4", children: benefits.map(renderBenefit$2(version)) })) : null, renderInsuranceSumMonth(sum, monthLimit)] })] })] }));
     });
     const renderBenefit$2 = (version) => (benefit, i) => (jsx(BenefitItem, { icon: benefit.icon, label: benefit.label, description: benefit.description, version: version }, String(i)));
     function renderInsuranceSumMonth(sum, monthLimit) {
@@ -791,10 +805,11 @@
         white: 'text-primary-main bg-white hover:text-white hover:bg-primary-hover active:bg-white',
         link: '',
     };
+    const DisabledStyle = 'bg-main-divider text-main-disabled';
     const buttonDisabledStyleMap = {
-        primary: 'bg-secondary-dark text-secondary-text',
-        secondary: 'bg-secondary-light text-secondary-text',
-        white: 'bg-white text-primary-text',
+        primary: DisabledStyle,
+        secondary: DisabledStyle,
+        white: DisabledStyle,
         link: '',
     };
     const buttonStyle = 'text-center font-sans select-none';
@@ -840,7 +855,8 @@
             return null;
         }
         const imgStyle = version === 'primary' ? 'group-hover:text-black' : 'group-hover:text-white';
-        return icon ? (jsx(Button, { appendLeft: jsx(Img, { imageClassName: imgStyle, image: icon, width: "24", height: "24", asSVG: true }), appendRight: jsx(Img, { imageClassName: imgStyle, image: iconRight, width: "24", height: "24", asSVG: true }), version: version, ...button }, String(i))) : (jsx(Button, { version: version, ...button }, String(i)));
+        const iconVersion = version === 'secondary' ? 'normal' : 'white';
+        return icon ? (jsx(Button, { appendLeft: jsx(Img, { imageClassName: imgStyle, image: { ...icon, iconVersion: iconVersion }, width: "24", height: "24", asSVG: true }), appendRight: jsx(Img, { imageClassName: imgStyle, image: { ...iconRight, iconVersion: iconVersion }, width: "24", height: "24", asSVG: true }), version: version, ...button }, String(i))) : (jsx(Button, { version: version, ...button }, String(i)));
     }
 
     const LIST_STYLE_CLASSES = {
@@ -998,12 +1014,16 @@
     }
 
     const ProductTile = JSX(({ context, className = '', title, headlineVersion = 'S', description, additionalDescription, benefits = [], buttons, image, version = 'primary', ...rest }) => {
-        return (jsxs(BlockWrapper, { context: context, className: `overflow-hidden font-sans p-9 box-border relative justify-between grid ${className} ${VersionStyleMap[version]} ${getTileRightPadding(className)} ${getTileMinHeight(className)}`, ...rest, children: [jsx(Headline, { context: context, className: `!p-0 !bg-transparent z-10 ${title || description ? 'mb-3.5' : ''}`, as: "h2", title: title, description: description, headlineVersion: headlineVersion, bgColorHeadline: version, align: "left" }), renderBenefits$1(benefits, version), additionalDescription ? renderAdditionalDescription(additionalDescription, version) : null, buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex self-end mt-5 gap-4 z-10 text-l" })) : null, image?.src ? jsx(Img, { className: "absolute right-0 bottom-0", image: image }) : null] }));
+        return (jsxs(BlockWrapper, { context: context, className: `overflow-hidden font-sans p-9 box-border relative justify-between grid min-h-[364px]
+          ${className} ${VersionStyleMap[version]} ${getTileRightPadding(className)}`, ...rest, children: [jsx(Headline, { context: context, className: `!p-0 !bg-transparent z-10 ${title || description ? 'mb-3.5' : ''}`, as: "h2", title: title, description: description, headlineVersion: headlineVersion, bgColorHeadline: version, align: "left" }), renderBenefits$1(benefits, version, image), additionalDescription
+                    ? renderAdditionalDescription(additionalDescription, image, version)
+                    : null, buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex self-end mt-5 gap-4 z-10 text-l" })) : null, image?.src ? jsx(Img, { className: "absolute right-0 bottom-0", image: image }) : null] }));
     });
-    // picture width = 242px. Text can overlay picture 20px deep. Outer paddings_x = 36px. 242-36-20 = 186px
-    const BENEFITS_WIDTH = 'max-w-[calc(100%-186px)]';
-    function renderBenefits$1(benefits, version) {
-        return (jsx("div", { className: `z-10 grid grid-cols-[max-content_1fr] auto-rows-auto gap-x-6 gap-y-2.5 items-baseline ${BENEFITS_WIDTH}`, children: benefits.length ? benefits.map(renderBenefit(version)) : null }));
+    function renderBenefits$1(benefits, version, image) {
+        // picture width = 242px. Text can overlay picture 20px deep. Outer paddings_x = 36px. 242-36-20 = 186px
+        const BENEFITS_WIDTH = image?.src ? 'max-w-[calc(100%-186px)]' : '100%';
+        return (jsx("div", { className: `z-10 grid grid-cols-[max-content_1fr] auto-rows-auto gap-x-6 gap-y-2.5 items-baseline 
+        ${BENEFITS_WIDTH}`, children: benefits.length ? benefits.map(renderBenefit(version)) : null }));
     }
     function renderBenefit(version = 'primary') {
         const labelStyleMap = {
@@ -1018,12 +1038,14 @@
             ];
         };
     }
-    function renderAdditionalDescription(additionalDescription, version = 'primary') {
+    function renderAdditionalDescription(additionalDescription, image, version = 'primary') {
         const descStyleMap = {
             primary: 'text-secondary-text',
             secondary: 'text-white',
         };
-        return (jsx("div", { className: `text-m-light mt-2.5 z-10 ${descStyleMap[version]}`, children: additionalDescription }));
+        // picture width = 242px. Text can overlay picture 20px deep. Outer paddings_x = 36px. 242-36-20 = 186px
+        const DESCRIPTION_WIDTH = image?.src ? 'max-w-[calc(100%-186px)]' : '100%';
+        return (jsx("div", { className: `text-m-light mt-2.5 z-10 ${DESCRIPTION_WIDTH} ${descStyleMap[version]}`, children: additionalDescription }));
     }
 
     const ArrowButton = JSX(({ className, disabled, ...rest }) => (jsx(Button, { rounded: true, className: `group shadow-[0_4px_25px_rgba(0,0,0,0.07)] w-12 h-12 min-h-12 max-h-12 flex items-center justify-center ${disabled
@@ -1242,15 +1264,13 @@
         }
     }
 
-    const BonusBenefitsBlock = JSX(({ context, className = '', title, subtitle, bonusBenefits, ...rest }) => {
-        return (jsxs(BlockWrapper, { className: `font-sans text-primary-text bg-white p-50 flex flex-col text-center ${className}`, context: context, ...rest, children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: subtitle, headlineVersion: "M", align: "center" }), bonusBenefits?.length ? (jsx("div", { className: `grid gap-1 mt-8 ${getElementsColsValue(className)}`, children: bonusBenefits.map(renderBonusBenefit) })) : null] }));
-    });
+    const BonusBenefitsBlock = JSX(({ context, className = '', title, subtitle, bonusBenefits, ...rest }) => (jsxs(BlockWrapper, { className: `font-sans text-primary-text bg-white p-[50px] flex flex-col text-center ${className}`, context: context, ...rest, children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: subtitle, headlineVersion: "M", align: "center" }), bonusBenefits?.length ? (jsx("div", { className: `grid gap-1 mt-8 ${getElementsColsValue(className)}`, children: bonusBenefits.map(renderBonusBenefit) })) : null] })));
     const renderBonusBenefit = (bonusBenefit, i) => {
-        return (jsxs("div", { className: "flex flex-col items-center max-w-[292px]", children: [bonusBenefit?.icon ? (jsx(Img, { className: "h-[180px] w-[160px] min-w-[160px] min-h-[160px]", image: bonusBenefit.icon, width: "160", height: "180" })) : null, jsx("div", { children: bonusBenefit?.label ? jsx("span", { className: "text-h6 m-0", children: bonusBenefit.label }) : null })] }, String(i)));
+        return (jsxs("div", { className: "flex flex-col items-center max-w-[292px]", children: [bonusBenefit?.icon ? (jsx(Img, { className: "h-[160px] w-[180px] min-w-[180px] min-h-[160px]", image: bonusBenefit.icon, width: "180", height: "160" })) : null, jsx("div", { children: bonusBenefit?.label ? jsx("span", { className: "text-h6 m-0", children: bonusBenefit.label }) : null })] }, String(i)));
     };
 
     const CalculatorValueBlock = JSX(({ title, value, postfix = '', prefix, className = '' }) => {
-        return (jsxs("div", { className: `mb-5 ${className}`, children: [title ? jsx("div", { className: "text-l-light text-secondary-text", children: title }) : null, value ? (jsxs("div", { className: "text-h3", children: [prefix, " ", addSpacesBetweenNumbers(Math.round(value)), " ", postfix] })) : null] }));
+        return (jsxs("div", { className: `mb-7 ${className}`, children: [title ? jsx("div", { className: "text-l-light text-secondary-text", children: title }) : null, value ? (jsxs("div", { className: "text-h3", children: [prefix, " ", addSpacesBetweenNumbers(Math.round(value)), " ", postfix] })) : null] }));
     });
 
     const DEFAULT_MIN_SUM = 60000;
@@ -1296,34 +1316,26 @@
         return buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex flex-col mt-7 gap-2" })) : null;
     }
 
+    const clamp = (value, min, max) => Math.max(min, Math.min(value, max));
+
     const DISABLED_INPUT_CLASSES = 'disabled:border-main-stroke disabled:bg-main-divider';
     const InputRange = JSX(({ className, title, items = [], min = 1, max = 100, step = 1, value = min, disabled = false, onChange, }) => {
-        const handleChange = (_) => {
+        const getSanitizedValue = (_) => Number(_.replace(/\D/g, ''));
+        const handleChange = (e) => {
             if (!onChange) {
                 return;
             }
-            const sanitizedValue = Number(_.replace(/\D/g, ''));
-            onChange(sanitizedValue);
+            onChange(clamp(getSanitizedValue(e.target.value), min, max));
         };
         const inputStyle = {
             backgroundSize: `${(((value - min) * 100) / (max - min)).toFixed(2)}% 100%`,
         };
-        const handleBlur = () => {
-            if (!onChange) {
-                return;
-            }
-            if (value < min) {
-                onChange(min);
-            }
-            if (value > max) {
-                onChange(max);
-            }
-        };
         return (jsxs("div", { className: className, children: [jsxs("label", { className: "block relative", children: [title ? jsx("span", { className: "text-m-light", children: title }) : null, jsx("input", { className: `m-0 mt-2 font-sans text-h3 w-full h-14 border border-solid border-main-stroke rounded-md
-                        outline-none p-0 pl-4 box-border text-primary-text hover:border-primary-hover focus:border-primary-focus ${DISABLED_INPUT_CLASSES}`, value: addSpacesBetweenNumbers(value), disabled: disabled, onChange: (e) => handleChange(e.target.value), onBlur: handleBlur }), jsx("div", { className: "absolute inset-x-0 -bottom-1 px-4 leading-[18px]", children: jsx("input", { className: "box-border w-full m-0 cursor-pointer slider", type: "range", min: min, max: max, step: step, value: value, disabled: disabled, onChange: (e) => handleChange(e.target.value), style: inputStyle }) })] }), jsx("div", { className: "flex justify-between my-2", children: items.map((item, i) => (jsx("span", { className: "text-s-light text-secondary-text", children: item }, String(i)))) })] }));
+            outline-none p-0 pl-4 box-border text-primary-text hover:border-primary-hover focus:border-primary-focus ${DISABLED_INPUT_CLASSES}`, value: addSpacesBetweenNumbers(value), disabled: disabled, onChange: handleChange, onBlur: handleChange }), jsx("div", { className: "absolute inset-x-0 -bottom-1 px-4 leading-[18px]", children: jsx("input", { className: "box-border w-full m-0 cursor-pointer slider", type: "range", min: min, max: max, step: step, value: value, disabled: disabled, onChange: handleChange, style: inputStyle }) })] }), renderRangeCaption(items)] }));
     });
-
-    const clamp = (value, min, max) => Math.max(min, Math.min(value, max));
+    function renderRangeCaption(items) {
+        return (jsx("div", { className: "flex justify-between my-2", children: items.map((item, i) => (jsx("span", { className: "text-s-light text-secondary-text", children: item }, String(i)))) }));
+    }
 
     const DEFAULT_MONEY_STEP = 1000;
     function renderWantedSumInput(title, params, callback) {
@@ -1448,7 +1460,9 @@
         };
     };
 
-    const BonusCalculatorForm = JSX(({ context, className = '', sourceBookDir = '', buttons }) => {
+    const renderFootnote = (text) => text ? jsx("p", { className: "text-s-light text-secondary-text mt-7", children: text }) : null;
+
+    const BonusCalculatorForm = JSX(({ context, className = '', sourceBookDir = '', buttons, footnote }) => {
         const [travelExpenseValue, setTravelExpenseValue] = useState(DEFAULT_TRAVEL_MIN_SUM);
         const [restExpenseValue, setRestExpenseValue] = useState(DEFAULT_REST_MIN_SUM);
         const userInputParams = {
@@ -1469,7 +1483,7 @@
                             moneyValue: restExpenseValue,
                             step: 500,
                             isShowItems: false,
-                        }, setRestExpenseValue)] }), jsx("div", { children: monthBonus >= 0 ? (jsx(Rate, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u043C\u0435\u0441\u044F\u0446", rate: monthBonus, rateBlockClassName: "tracking-[-14px]" })) : null }), jsxs("div", { className: "w-[240px]", children: [yearBonus >= 0 ? jsx(CalculatorValueBlock, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u0433\u043E\u0434", value: yearBonus }) : null, renderButtonSection(context, buttons)] })] }));
+                        }, setRestExpenseValue)] }), jsx("div", { children: monthBonus >= 0 ? (jsx(Rate, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u043C\u0435\u0441\u044F\u0446", rate: monthBonus, rateBlockClassName: "tracking-[-14px]" })) : null }), jsxs("div", { className: "w-full max-w-[350px]", children: [yearBonus >= 0 ? jsx(CalculatorValueBlock, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u0433\u043E\u0434", value: yearBonus }) : null, renderButtonSection(context, buttons), renderFootnote(footnote)] })] }));
     });
 
     const SVG = JSX(({ className, viewBox, fill = 'none', width, height, paths, ...commonOptions }) => {
@@ -1504,7 +1518,7 @@
     }
 
     const RadioButtonGroup = JSX(({ items, checkedItem, onChangeCheckedItem }) => {
-        return (jsx("div", { children: items?.map(({ id, text }) => (jsx(Checkbox, { isRadio: true, text: text, checked: checkedItem === id, onChange: () => onChangeCheckedItem(id) }, id))) }));
+        return (jsx("div", { className: "flex flex-col gap-3", children: items?.map(({ id, text }) => (jsx(Checkbox, { isRadio: true, text: text, checked: checkedItem === id, onChange: () => onChangeCheckedItem(id) }, id))) }));
     });
 
     function renderPaymentTypeSelector(context, { items, checkedItem, onChange }) {
@@ -1557,7 +1571,7 @@
             text: 'Дифференцированный',
         },
     ];
-    const CreditCalculatorForm = JSX(({ context, className = '', sourceBookDir, buttons }) => {
+    const CreditCalculatorForm = JSX(({ context, className = '', sourceBookDir, buttons, footnote }) => {
         const [isAnnuity, toggleIsAnnuity] = useState(false);
         const [isInsurance, toggleIsInsurance] = useState(true);
         const [isSalaryClient, toggleIsSalaryClient] = useState(false);
@@ -1573,16 +1587,29 @@
             monthsValue,
         };
         const calculatorParams = useCreditCalculatorParams(userInputParams, sourceBookDir);
-        return (jsxs("section", { className: className, children: [jsxs("div", { className: "w-[468px]", children: [renderWantedSumInput('Сумма кредита, ₽', { ...calculatorParams, step: 500 }, setMoneyValue), renderMonthsInput('Срок кредита, месяцев', calculatorParams, setMonthsValue), jsxs("div", { className: "mt-7", children: [jsx(Checkbox, { text: "\u041F\u043E\u043B\u0443\u0447\u0430\u044E \u0437\u0430\u0440\u043F\u043B\u0430\u0442\u0443 \u043D\u0430 \u0441\u0447\u0451\u0442 \u0432 \u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A\u0435", checked: isSalaryClient, onChange: toggleIsSalaryClient }), jsx(Checkbox, { className: "mt-3", text: "\u0420\u0430\u0431\u043E\u0442\u0430\u044E \u0432 \u0431\u044E\u0434\u0436\u0435\u0442\u043D\u043E\u0439 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", checked: isStateEmployee, onChange: toggleIsStateEmployee }), jsx(Checkbox, { className: "mt-3", text: "\u041A\u043E\u043C\u043F\u043B\u0435\u043A\u0441\u043D\u0430\u044F \u0441\u0442\u0440\u0430\u0445\u043E\u0432\u0430\u044F \u0437\u0430\u0449\u0438\u0442\u0430", checked: isInsurance, onChange: toggleIsInsurance })] })] }), jsx(Rate, { title: "\u0421\u0442\u0430\u0432\u043A\u0430", rate: calculatorParams.finalRate, rateBlockClassName: "tracking-[-25px]", unit: "%" }), jsxs("div", { className: "w-[351px]", children: [jsx(CalculatorValueBlock, { title: isAnnuity ? 'Ежемесячный платеж' : 'Платёж в первый месяц', value: calculatorParams.monthlyPayment, postfix: "\u20BD" }), renderPaymentTypeSelector(context, {
+        return (jsxs("section", { className: className, children: [jsxs("div", { className: "w-[468px]", children: [renderWantedSumInput('Сумма кредита, ₽', { ...calculatorParams, step: 500 }, setMoneyValue), renderMonthsInput('Срок кредита, месяцев', calculatorParams, setMonthsValue), jsxs("div", { className: "mt-7", children: [jsx(Checkbox, { text: "\u041F\u043E\u043B\u0443\u0447\u0430\u044E \u0437\u0430\u0440\u043F\u043B\u0430\u0442\u0443 \u043D\u0430 \u0441\u0447\u0451\u0442 \u0432 \u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A\u0435", checked: isSalaryClient, onChange: toggleIsSalaryClient }), jsx(Checkbox, { className: "mt-3", text: "\u0420\u0430\u0431\u043E\u0442\u0430\u044E \u0432 \u0431\u044E\u0434\u0436\u0435\u0442\u043D\u043E\u0439 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", checked: isStateEmployee, onChange: toggleIsStateEmployee }), jsx(Checkbox, { className: "mt-3", text: "\u041A\u043E\u043C\u043F\u043B\u0435\u043A\u0441\u043D\u0430\u044F \u0441\u0442\u0440\u0430\u0445\u043E\u0432\u0430\u044F \u0437\u0430\u0449\u0438\u0442\u0430", checked: isInsurance, onChange: toggleIsInsurance })] })] }), jsx(Rate, { title: "\u0421\u0442\u0430\u0432\u043A\u0430", rate: calculatorParams.finalRate, rateBlockClassName: "tracking-[-25px]", unit: "%" }), jsxs("div", { className: "w-full max-w-[350px]", children: [jsx(CalculatorValueBlock, { title: isAnnuity ? 'Ежемесячный платеж' : 'Платёж в первый месяц', value: calculatorParams.monthlyPayment, postfix: "\u20BD" }), renderPaymentTypeSelector(context, {
                             items: paymentTypeItems,
                             checkedItem: isAnnuity ? ANNUITY : DIFFERENTIAL,
                             onChange: (text) => toggleIsAnnuity(text === ANNUITY),
-                        }), renderButtonSection(context, buttons)] })] }));
+                        }), renderButtonSection(context, buttons), renderFootnote(footnote)] })] }));
     });
 
-    const DepositCalculatorForm = JSX(({ context, className = '', buttons, rate }) => {
+    const EVERY_MONTH = 'everyMonth';
+    const AT_END_TERM = 'atEndTerm';
+    const depositTypeItems = [
+        {
+            id: EVERY_MONTH,
+            text: 'Ежемесячно',
+        },
+        {
+            id: AT_END_TERM,
+            text: 'В конце срока',
+        },
+    ];
+    const DepositCalculatorForm = JSX(({ context, className = '', rate, buttons, footnote }) => {
         const [moneyValue, setMoneyValue] = useState(DEFAULT_SUM);
         const [monthsValue, setMonthsValue] = useState(DEFAULT_MONTHS);
+        const [isEveryMonth, toggleIsEveryMonth] = useState(false);
         const income = 948841;
         const finallySum = 1218841;
         return (jsxs("section", { className: className, children: [jsxs("div", { className: "w-[468px]", children: [renderWantedSumInput('Сумма вклада, ₽', {
@@ -1593,66 +1620,15 @@
                             minMonths: DEFAULT_MIN_MONTHS,
                             maxMonths: DEFAULT_MAX_MONTHS,
                             monthsValue,
-                        }, setMonthsValue)] }), jsx(Rate, { rate: rate || 1, rateBlockClassName: "tracking-[-25px]", unit: "%" }), jsxs("div", { className: "w-[351px]", children: [(jsx(CalculatorValueBlock, { title: "\u0414\u043E\u0445\u043E\u0434 \u043F\u043E \u0432\u043A\u043B\u0430\u0434\u0443", value: income, postfix: "\u20BD", prefix: "+" })) , (jsx(CalculatorValueBlock, { title: "\u0421\u0443\u043C\u043C\u0430 \u0432 \u043A\u043E\u043D\u0446\u0435 \u0441\u0440\u043E\u043A\u0430", value: finallySum, postfix: "\u20BD" })) , renderButtonSection(context, buttons)] })] }));
-    });
-
-    const DEFAULT_RATE = 10.2;
-    const getCreditRate = (params) => {
-        const { calculatorParams, isInsurance } = params;
-        if (!calculatorParams) {
-            return DEFAULT_RATE;
-        }
-        return isInsurance
-            ? calculatorParams?.rateWithInsurance || DEFAULT_RATE
-            : calculatorParams?.rateWithoutInsurance || DEFAULT_RATE;
-    };
-
-    const STEP_MONEY$1 = 1000;
-    function renderInitialFeeInput(title, props, callback) {
-        const { moneyValue } = props;
-        const minSum = DEFAULT_MIN_SUM;
-        const maxSum = DEFAULT_MAX_SUM;
-        return (jsx(InputRange, { className: "mt-7", title: title, items: [
-                `От ${addSpacesBetweenNumbers(minSum)} рублей`,
-                `До ${addSpacesBetweenNumbers(maxSum)} рублей`,
-            ], min: minSum, max: maxSum, step: STEP_MONEY$1, value: moneyValue, onChange: callback }));
-    }
-
-    const monthlyPayment = 777777; // TODO: hardcode
-    function renderProposalMortgage({ credit, period, taxRefund }) {
-        return (jsxs("div", { children: [jsxs("div", { className: "flex justify-between", children: [jsx(CalculatorValueBlock, { title: "\u0421\u0443\u043C\u043C\u0430 \u043A\u0440\u0435\u0434\u0438\u0442\u0430", value: credit, postfix: "\u20BD" }), jsx(CalculatorValueBlock, { title: "\u0421\u0440\u043E\u043A", value: period, postfix: "\u043B\u0435\u0442", className: "w-[120px]" })] }), jsx(CalculatorValueBlock, { title: "\u0415\u0436\u0435\u043C\u0435\u0441\u044F\u0447\u043D\u044B\u0439 \u043F\u043B\u0430\u0442\u0435\u0436", value: monthlyPayment, postfix: "\u20BD" }), jsx(CalculatorValueBlock, { title: "\u041D\u0430\u043B\u043E\u0433\u043E\u0432\u044B\u0439 \u0432\u044B\u0447\u0435\u0442", value: taxRefund, postfix: "\u20BD" })] }));
-    }
-
-    const STEP_MONEY = 1000;
-    function renderRealEstateValue(title, props, callback) {
-        const { moneyValue } = props;
-        const minSum = DEFAULT_MIN_SUM;
-        const maxSum = DEFAULT_MAX_SUM;
-        return (jsx(InputRange, { title: title, items: [`От ${addSpacesBetweenNumbers(minSum)} ₽`, `До ${addSpacesBetweenNumbers(maxSum)} ₽`], min: minSum, max: maxSum, step: STEP_MONEY, value: moneyValue, onChange: callback }));
-    }
-
-    const MortgageCalculatorForm = JSX(({ context, className = '', buttons }) => {
-        const [moneyValue, setMoneyValue] = useState(1000000);
-        const [monthsValue, setMonthsValue] = useState(12);
-        const [isInsurance, toggleIsInsurance] = useState(false);
-        const [isFullInsurance, toggleIsFullInsurance] = useState(false);
-        const calculatorParams = {}; // getCalculatorParams(context, { isAnnuity: isInsurance });
-        const minMonths = /*calculatorParams?.minMonths ||*/ DEFAULT_MIN_MONTHS;
-        const maxMonths = /* calculatorParams?.maxMonths || */ DEFAULT_MAX_MONTHS;
-        const rate = getCreditRate({ calculatorParams, isInsurance: isInsurance });
-        const proposalMortgageValue = { credit: 3892000, period: 15, taxRefund: 650000 }; // TODO: hardcode
-        return (jsxs("section", { className: className, children: [jsxs("div", { className: "w-[468px]", children: [renderRealEstateValue('Стоимость недвижимости, ₽', { moneyValue }, setMoneyValue), renderInitialFeeInput('Первоначальный взнос, ₽', {
-                            moneyValue,
-                        }, setMoneyValue), renderMonthsInput('Срок ипотеки, месяцев', {
-                            minMonths,
-                            maxMonths,
-                            monthsValue,
-                        }, setMonthsValue), jsxs("div", { className: "mt-7", children: [jsx(Checkbox, { text: "\u0421\u0442\u0440\u0430\u0445\u043E\u0432\u0430\u043D\u0438\u0435 \u0436\u0438\u0437\u043D\u0438", checked: isInsurance, onChange: toggleIsInsurance }), jsx(Checkbox, { className: "mt-4", text: "\u0421\u0442\u0440\u0430\u0445\u043E\u0432\u0430\u043D\u0438\u0435 \u0436\u0438\u0437\u043D\u0438, \u0437\u0434\u043E\u0440\u043E\u0432\u044C\u044F \u0438 \u0432\u0440\u0435\u043C\u0435\u043D\u043D\u043E\u0439 \u0443\u0442\u0440\u0430\u0442\u044B \u0442\u0440\u0443\u0434\u043E\u0441\u043F\u043E\u0441\u043E\u0431\u043D\u043E\u0441\u0442\u0438", checked: isFullInsurance, onChange: toggleIsFullInsurance })] })] }), jsx(Rate, { rate: rate, rateBlockClassName: "tracking-[-25px]", unit: "%" }), jsxs("div", { children: [jsx("div", { className: "w-[351px]", children: renderProposalMortgage(proposalMortgageValue) }), renderButtonSection(context, buttons)] })] }));
+                        }, setMonthsValue)] }), jsx(Rate, { rate: rate || 1, rateBlockClassName: "tracking-[-25px]", unit: "%" }), jsxs("div", { className: "w-full max-w-[350px]", children: [(jsx(CalculatorValueBlock, { title: "\u0414\u043E\u0445\u043E\u0434 \u043F\u043E \u0432\u043A\u043B\u0430\u0434\u0443", value: income, postfix: "\u20BD", prefix: "+" })) , (jsx(CalculatorValueBlock, { title: "\u0421\u0443\u043C\u043C\u0430 \u0432 \u043A\u043E\u043D\u0446\u0435 \u0441\u0440\u043E\u043A\u0430", value: finallySum, postfix: "\u20BD" })) , renderPaymentTypeSelector(context, {
+                            items: depositTypeItems,
+                            checkedItem: isEveryMonth ? EVERY_MONTH : AT_END_TERM,
+                            onChange: (text) => toggleIsEveryMonth(text === EVERY_MONTH),
+                        }), renderButtonSection(context, buttons), renderFootnote(footnote)] })] }));
     });
 
     const EmbeddableCalcBlocks = {
         CreditCalculatorForm,
-        MortgageCalculatorForm,
         DepositCalculatorForm,
         BonusCalculatorForm,
     };
@@ -1886,6 +1862,21 @@
         return (jsx("div", { className: "pr-[50px]", children: jsxs("div", { className: "flex w-full", children: [jsx("div", { className: FIRST_CELL_CLASSES$1 }), jsx("button", { onClick: onClick, className: "mt-5 flex-1 border-main-stroke border-solid border text-primary-text bg-white hover:border-primary-main hover:text-primary-main", children: jsx("div", { className: "font-sans text-xs-light font-medium py-[11px]", children: !isShowAllRow ? 'Показать все параметры' : 'Скрыть' }) })] }) }));
     };
 
+    const renderErrorContent = (error) => {
+        if (error?.errorContentType === 'Image' && error?.image) {
+            return jsx(Img, { image: error.image });
+        }
+        if (error?.errorContentType === 'Code' && error.code) {
+            return jsx("div", { className: "font-mohave text-title-extra gradient-color-text", children: error.code });
+        }
+        return null;
+    };
+    const ErrorBlock = JSX(({ context, className = '', title, subtitle, error, button }) => {
+        const { useRouter, handlerDecorator } = context;
+        const router = useRouter();
+        return (jsxs("section", { className: `flex flex-col justify-center items-center mt-12 ${className}`, role: "listitem", children: [jsx("div", { className: "flex justify-center py-20", children: renderErrorContent(error) }), title ? jsx(Heading, { headingType: "h1", className: "text-left mb-4", title: title }) : null, subtitle ? (jsx("div", { className: "font-sans text-xl-light text-left mb-7 max-w-[613px] text-center", children: subtitle })) : null, button?.text ? (jsx(Button, { className: "py-4 px-9", version: button?.version, ...useLink({ router, handlerDecorator }, button), children: button.text })) : null] }));
+    });
+
     const roundTo = (value, precision = 2) => {
         const factor = 10 ** precision;
         return Math.round(parseFloat(String(value)) * factor) / factor;
@@ -1998,23 +1989,38 @@
             const validInputValue = e.target.validity.valid ? e.target.value : value;
             onChange(validInputValue);
         };
-        return (jsx("input", { className: `border-main-stroke hover:border-primary-hover active:border-primary-text focus:border-primary-text ${className}`, id: id, name: name || id, type: type, pattern: pattern, placeholder: placeholder, value: value, onChange: handleChange }));
+        return (jsx("input", { className: `border rounded-md border-main-stroke hover:border-primary-hover active:border-primary-text focus:border-primary-text text-primary-text outline-none ${className}`, id: id, name: name || id, type: type, pattern: pattern, placeholder: placeholder, value: value, onChange: handleChange }));
     });
 
-    const selectStyle = {
-        background: `url('/icons/ArrowDownIcon.svg') no-repeat right 16px top 50%`,
-    };
-    const Select = JSX(({ className = '', id, name, children, value, onChange }) => {
-        return (jsx("select", { className: `appearance-none pl-0.5 ${className}`, style: selectStyle, id: id, name: name || id, value: value, onChange: (e) => onChange(e.target.value), placeholder: "", children: children }));
-    });
-
-    const SelectOption = JSX(({ className = '', value, selected, disabled = false, children }) => {
-        return (jsx("option", { className: className, value: `${value}`, selected: selected, disabled: disabled, children: children }));
+    const SelectCustom = JSX(({ className = '', isBorder = true, label, options = [], value, onChange }) => {
+        const [selectedItem, setSelectedItem] = useState(options[0] || { key: '', text: '' });
+        const [isOpen, setIsOpen] = useState(false);
+        const choiceOption = (option) => {
+            setSelectedItem(option);
+            setIsOpen(false);
+            onChange(option);
+        };
+        const isSelected = (option) => Boolean(option.key === selectedItem.key);
+        useEffect(() => {
+            setSelectedItem(value || { key: '', text: '' });
+        }, [value]);
+        return (jsxs("div", { className: `${isOpen ? 'z-10' : ''} ${className}`, children: [label ? jsx("span", { className: "mb-2", children: label }) : null, jsxs("div", { className: `relative w-fit`, children: [jsxs("div", { className: `text-m-light flex justify-between min-h-[56px] mb-0.5 p-4 pr-8 text-primary-text cursor-pointer
+            ${getBorderStyle(isBorder)}`, onClick: () => setIsOpen(!isOpen), children: [selectedItem.text, jsx(Icon, { name: "ArrowUpIcon", className: `absolute right-3 ${isOpen ? '' : 'rotate-180'}` })] }), options.length > 0 ? (jsx("div", { className: `h-0 ${isOpen ? '' : 'overflow-hidden'}`, children: jsx("div", { className: `bg-white text-l rounded-md`, children: options.map(renderOption(choiceOption, isOpen, isSelected)) }) })) : null] })] }));
     });
+    const renderOption = (choiceOption, isOpen, isSelected) => (option, i) => {
+        return (jsxs("div", { onClick: () => {
+                choiceOption(option);
+            }, className: "flex px-4 py-3 cursor-pointer hover:bg-main-divider pr-11", children: [jsx("span", { children: option.text }), jsx(Icon, { name: "DoneSimpleIcon", className: ['absolute right-4 pt-0.5', isSelected(option) && isOpen ? '' : 'hidden'].join(' ') })] }, String(i)));
+    };
+    function getBorderStyle(isBorder) {
+        return isBorder ? 'border border-main-stroke rounded-md hover:border-primary-hover' : '';
+    }
 
     function renderInput(props) {
         const { placeholder, rates, selected, value, setValue, setSelected } = props;
-        return (jsxs("div", { className: "relative flex items-center", children: [jsx(Input, { className: "shrink-0 h-13 border pl-4 pt-4 pb-4 rounded-md text-l w-full appearance-none -mr-12", placeholder: placeholder, type: "text", value: value, onChange: setValue }), rates.length ? (jsx(Select, { className: "shrink-0 w-20 h-9 -translate-x-8 bg-transparent", value: selected, onChange: (_) => setSelected(_), children: rates.map((_, i) => (jsx(SelectOption, { value: _.code, children: _.code }, String(i)))) })) : null] }));
+        const ratesOptions = rates.map((_) => ({ key: _.code ?? '', text: _.code ?? '' }));
+        const selectedValue = { key: selected, text: selected };
+        return (jsxs("div", { className: "relative flex", children: [jsx(Input, { className: "shrink-0 h-14 pl-4 pt-4 pb-4 text-l w-full appearance-none mr-[-90px]", placeholder: placeholder, type: "text", value: value, onChange: setValue }), ratesOptions.length ? (jsx(SelectCustom, { isBorder: false, onChange: (_) => setSelected(_.key), options: ratesOptions, value: selectedValue })) : null] }));
     }
 
     const ExchangeCurrencyCalculator = JSX(({ context, className = '', currencyRatesBuy, currencyRatesSell, button }) => {
@@ -2135,7 +2141,7 @@
               outline-none pr-[6%] border-main-stroke hover:border-primary-hover active:border-primary-text focus:border-primary-text ${SearchBarInputClassName}`, value: term, onChange: (e) => setTerm(e.target.value), type: "text", name: "search-bar-input", placeholder: inputPlaceholder }), isMobile ? (jsx("button", { className: "visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer border-none", onClick: (e) => {
                         e.preventDefault();
                         setTerm('');
-                    }, children: jsx(Img, { image: "CloseIcon", width: "24", height: "24" }) })) : (jsx(Button, { version: "primary", text: "\u041D\u0430\u0439\u0442\u0438", className: "invisible peer-focus:visible absolute top-1 right-1", onClick: (ev) => {
+                    }, children: jsx(Img, { image: "CloseIcon", width: "24", height: "24" }) })) : (jsx(Button, { version: "primary", text: "\u041D\u0430\u0439\u0442\u0438", className: "invisible peer-focus:visible absolute top-[3px] right-1", onClick: (ev) => {
                         ev?.preventDefault();
                         console.log('click');
                     }, children: jsx("div", { className: "text-s px-9 py-2.5", children: "\u041D\u0430\u0439\u0442\u0438" }) }))] }));
@@ -2183,13 +2189,13 @@
     const subtract = (minuend, subtrahend) => (minuend || []).filter((_) => !subtrahend?.find(cmp(_)));
     const mergeTopItems = (left, right) => substitute(left, right).concat(subtract(right, left));
 
-    function useSitemap() {
-        const { data } = useAsyncData(`/wcms-resources/${projectSettings.SITEMAP || 'sitemap'}.json`, fetchJSONUnsafe);
+    function useSitemap(fallback = {}) {
+        const { data } = useAsyncData(`/wcms-resources/${projectSettings.SITEMAP || 'sitemap'}.json`, fetchJSONUnsafe, { fallback });
         return data || {};
     }
 
-    const Sitemap = JSX(({ className = '', items, context }) => {
-        const sitemap = useSitemap();
+    const Sitemap = JSX(({ className = '', items, fallback, context }) => {
+        const sitemap = useSitemap(fallback);
         const mergedItems = mergeTopItems(sitemap.topItems, items);
         const linkParams = {
             router: context.useRouter(),
@@ -2257,8 +2263,9 @@
     });
 
     const LEFT_COL_WIDTH_FULL_HD = 'w-[204px]';
-    const Footer = JSX(({ className, documents, relatedEnterprises, contacts, socialMedia, mobileApps, topItems, context, ...rest }) => {
-        return (jsxs(BlockWrapper, { tag: "footer", context: context, className: `p-9 bg-white font-sans ${className || ''}`, ...rest, children: [jsxs("div", { className: "flex items-stretch gap-[54px] pb-[30px] xl:gap-8", children: [jsx(Logo, { className: LEFT_COL_WIDTH_FULL_HD }), jsx(SearchBar, { context: context, className: "grow" })] }), jsxs("div", { className: "flex items-stretch gap-[54px] xl:gap-8", children: [jsxs("div", { className: `${LEFT_COL_WIDTH_FULL_HD} flex flex-col shrink-0 overflow-hidden`, children: [jsx(Contacts, { items: contacts, context: context, hasButton: true }), jsx(SocialMedia, { media: socialMedia, context: context, children: "\u0421\u043E\u0446\u0441\u0435\u0442\u0438" }), jsx(SocialMedia, { className: "mt-6", media: mobileApps, context: context, children: "\u041C\u043E\u0431\u0438\u043B\u044C\u043D\u043E\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435" })] }), jsx(Sitemap, { className: "pt-[3px]", context: context, items: topItems })] }), jsx(HorizontalNavigation, { className: "mt-[98px]", links: relatedEnterprises, context: context }), jsx(TextInformation, { links: documents, context: context })] }));
+    const Footer = JSX(({ className, documents, relatedEnterprises, contacts, socialMedia, mobileApps, topItems, context, page, ...rest }) => {
+        const fallback = page?.fallback;
+        return (jsxs(BlockWrapper, { tag: "footer", context: context, className: `p-9 bg-white font-sans ${className || ''}`, ...rest, children: [jsxs("div", { className: "flex items-stretch gap-[54px] pb-[30px] xl:gap-8", children: [jsx(Logo, { className: LEFT_COL_WIDTH_FULL_HD }), jsx(SearchBar, { context: context, className: "grow" })] }), jsxs("div", { className: "flex items-stretch gap-[54px] xl:gap-8", children: [jsxs("div", { className: `${LEFT_COL_WIDTH_FULL_HD} flex flex-col shrink-0 overflow-hidden`, children: [jsx(Contacts, { items: contacts, context: context, hasButton: true }), jsx(SocialMedia, { media: socialMedia, context: context, children: "\u0421\u043E\u0446\u0441\u0435\u0442\u0438" }), jsx(SocialMedia, { className: "mt-6", media: mobileApps, context: context, children: "\u041C\u043E\u0431\u0438\u043B\u044C\u043D\u043E\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435" })] }), jsx(Sitemap, { className: "pt-[3px]", context: context, items: topItems, fallback: fallback })] }), jsx(HorizontalNavigation, { className: "mt-[98px]", links: relatedEnterprises, context: context }), jsx(TextInformation, { links: documents, context: context })] }));
     });
 
     const GracePeriod = JSX(({ context, className = '', title, description, calendar, ...rest }) => {
@@ -2412,9 +2419,10 @@
         'bg-white': 'bg-main-divider',
         transparent: 'bg-main-divider opacity-30',
     };
-    const Header = JSX(({ className = '', defaultLocation = 'Москва', showSubMenu = true, bgColor = 'bg-white', context, topItems, logo, ...rest }) => {
+    const Header = JSX(({ className = '', defaultLocation = 'Москва', showSubMenu = true, bgColor = 'bg-white', context, topItems, logo, page, ...rest }) => {
         const router = context.useRouter();
-        const sitemap = useSitemap();
+        const fallback = page?.fallback;
+        const sitemap = useSitemap(fallback);
         const { handlerDecorator } = context;
         const mergedItems = mergeTopItems(sitemap.topItems, topItems);
         const [firstPortal] = mergedItems;
@@ -2422,7 +2430,7 @@
             ? mergedItems.find(isTopItemActive(router)) || firstPortal // Если по слагу невозможно понять к какому подпорталу этот слаг относиться, то выбираем первый подпортал.
             : null;
         const topMenu = mergedItems.map((_, i) => (jsx(TopItem, { active: _ === activeTopItem, ...useLink({ router, handlerDecorator }, _), "aria-label": _.text, bgColor: bgColor }, String(i))));
-        return (jsx(BlockWrapper, { tag: "header", context: context, className: `pt-6 pb-5 px-20 ${bgColor} ${className}`, ...rest, children: jsxs("div", { className: "container", children: [jsxs("div", { className: "flex items-center", children: [jsx(Logo, { className: "mr-8", bgColor: bgColor, logo: logo }), topMenu, jsx(HeaderSecondaryMenu, { className: "ml-auto", defaultLocation: defaultLocation, bgColor: bgColor })] }), jsx("div", { className: `mt-6 h-[1px] ${BORDER_COLORS[bgColor]}` }), showSubMenu && activeTopItem?.items?.length ? (jsx(HeaderSubMenu, { context: context, subItems: activeTopItem.items, bgColor: bgColor })) : null] }) }));
+        return (jsx(BlockWrapper, { tag: "header", context: context, className: `pt-6 px-20 ${bgColor} ${className} ${showSubMenu && activeTopItem?.items?.length ? 'pb-4' : 'pb-5'}`, ...rest, children: jsxs("div", { className: "container", children: [jsxs("div", { className: "flex items-center", children: [jsx(Logo, { className: "mr-8", bgColor: bgColor, logo: logo }), topMenu, jsx(HeaderSecondaryMenu, { className: "ml-auto", defaultLocation: defaultLocation, bgColor: bgColor })] }), jsx("div", { className: `mt-6 h-[1px] ${BORDER_COLORS[bgColor]}` }), showSubMenu && activeTopItem?.items?.length ? (jsx(HeaderSubMenu, { context: context, subItems: activeTopItem.items, bgColor: bgColor })) : null] }) }));
     });
 
     const InsuranceAmountBlockInner = JSX(({ className = '', cards = [], button }) => {
@@ -2517,21 +2525,10 @@
         return items?.length ? (jsx(List, { items: items, itemClassName: "text-l-light mb-2 last:mb-0", version: version === 'primary' ? 'tile' : 'tile-white' })) : (jsx("span", { className: "text-m-light text-secondary-text", children: "\u041D\u0430\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u0430\u043C\u0435\u0440\u0443 \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u0430 \u043D\u0430 QR-\u043A\u043E\u0434 \u0438 \u0441\u043A\u0430\u0447\u0430\u0439\u0442\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435" }));
     };
 
-    const NavigationItem = JSX(({ className, text, onClick, href, target, isActive }) => (jsx("a", { className: `bg-inherit no-underline px-4 py-2.5 cursor-pointer rounded text-s border border-solid hover:text-primary-main ${className || ''} ${isActive ? 'border-primary-main text-primary-main' : 'border-white text-secondary-text'}`, onClick: onClick, href: href, target: target, children: text })));
-
-    const Navigation = JSX(({ className, context, title, buttons, ...rest }) => {
-        const router = context.useRouter();
-        const { handlerDecorator } = context;
-        const activeButton = findActiveSubItem(router)(buttons);
-        return (jsxs(BlockWrapper, { context: context, className: `font-sans text-primary-text flex items-center justify-between ${className || ''}`, ...rest, children: [jsx("h2", { className: "text-xl font-medium m-0", children: title }), buttons?.length ? (jsx("div", { className: "flex rounded-md overflow-hidden bg-white", children: buttons
-                        .filter(({ text }) => text)
-                        .map((button, i) => (jsx(NavigationItem, { className: "first:rounded-tl-md first:rounded-bl-md last:rounded-tr-md last:rounded-br-md", isActive: button === activeButton, ...useLink({ router, handlerDecorator }, button) }, String(i)))) })) : null] }));
-    });
-
     const OfficeServicesBlock = JSX(({ className = '', context, title, servicesList, anchor = '', ...rest }) => {
         return (jsxs(BlockWrapper, { context: context, id: anchor, className: `font-sans bg-white p-8 flex flex-col ${className}`, ...rest, children: [title ? jsx(Heading, { headingType: "h5", className: "mb-5", title: title }) : null, servicesList?.length ? servicesList.map(renderListItems) : null] }));
     });
-    const renderListItems = (itemList, i) => (jsxs("li", { className: "flex mb-5 last:mb-0 list-none", children: [itemList.icon ? (jsx(Img, { className: "mr-3 max-w-6 max-h-6", width: "24px", height: "24px", asSVG: true, image: itemList.icon })) : null, itemList.label ? jsx("span", { className: "text-l-light", children: itemList.label }) : null] }, `list_item_${String(i)}`));
+    const renderListItems = (itemList, i) => (jsxs("li", { className: "flex mb-5 last:mb-0 list-none", children: [itemList.icon ? (jsx(Img, { className: "mr-3 min-w-6 min-h-6 w-6 h-6", width: "24", height: "24", asSVG: true, image: itemList.icon })) : null, itemList.label ? jsx("span", { className: "text-l-light", children: itemList.label }) : null] }, `list_item_${String(i)}`));
 
     const foldableBlockClassNames = 'transition-all duration-300 max-h-0 overflow-hidden';
     const useActiveHandler = ({ initialState = false }) => {
@@ -2558,7 +2555,7 @@
             initialState: isUnfolded,
         });
         const buttonClassName = foldButtonClasses ||
-            'border-none bg-primary-main hover:bg-primary-hover px-0 py-5 mb-[1px] w-full font-sans text-white text-h4 flex justify-center cursor-pointer';
+            'border-none bg-primary-main hover:bg-primary-hover focus:bg-primary-main active:bg-primary-active px-0 py-5 mb-[1px] w-full font-sans text-white text-h4 flex justify-center cursor-pointer';
         const getFoldButtonLabel = isActive ? 'Скрыть' : foldButtonLabel;
         return blocks ? (jsxs("div", { children: [renderBlocks(blocks, render, { blocksToHide, isActive, containerClasses }), hiddenBlocksNum ? (jsxs("button", { className: buttonClassName, "data-theme": foldButtonDataTheme, onClick: handleToggle, children: [jsx("span", { className: "pr-3", children: getFoldButtonLabel }), icon ? (jsx(Icon, { className: "my-auto", name: icon, iconVersion: "white", width: "20", height: "20", asSVG: true })) : null] })) : null] })) : null;
     });
@@ -2780,6 +2777,17 @@
         return fetchJSON(url, { method: 'GET' });
     };
 
+    const selectStyle = {
+        background: `url('/icons/ArrowDownIcon.svg') no-repeat right 16px top 50%`,
+    };
+    const Select = JSX(({ className = '', id, name, children, value, onChange }) => {
+        return (jsx("select", { className: `appearance-none pl-0.5 ${className}`, style: selectStyle, id: id, name: name || id, value: value, onChange: (e) => onChange(e.target.value), placeholder: "", children: children }));
+    });
+
+    const SelectOption = JSX(({ className = '', value, selected, disabled = false, children }) => {
+        return (jsx("option", { className: className, value: `${value}`, selected: selected, disabled: disabled, children: children }));
+    });
+
     const WrapperSelect = JSX(({ data, fieldLabel, fieldValue, selected, placeholder, setSelected, label }) => {
         return (jsxs("div", { children: [jsx("span", { className: "block text-m-light mb-2", children: label }), jsxs(Select, { className: `h-14 border border-gray p-4 rounded-md text-s w-full cursor-pointer ${!selected ? 'text-secondary-text' : ''}`, value: selected, onChange: (_) => setSelected(_), children: [placeholder ? jsx(SelectOption, { value: "", children: placeholder }) : null, data.map((_, i) => (jsx(SelectOption, { value: _?.[fieldValue || fieldLabel], children: _?.[fieldLabel] }, String(i))))] })] }));
     });
@@ -2788,7 +2796,7 @@
         return (jsxs("div", { className: "flex justify-between mb-6", children: [jsx("div", { className: "w-full mr-4", children: jsx(WrapperSelect, { data: regions, fieldValue: "code", fieldLabel: "name", selected: selectedRegion, setSelected: onSelectedRegion, label: "\u0413\u043E\u0440\u043E\u0434" }) }), jsx("div", { className: "w-full", 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 Radio = JSX(({ name, text, value, checked, onChange, className }) => (jsx("div", { className: className, children: jsxs("label", { className: "flex items-center relative cursor-pointer", children: [jsx("input", { className: "appearance-none flex justify-center items-center shrink-0 w-5 h-5 border-2 border-primary-main rounded-full cursor-pointer after:block after:w-2.5 after:h-2.5 after:rounded-full checked:after:bg-primary-main", type: "radio", value: value, name: name, checked: checked, onChange: onChange }), text ? jsx("span", { className: "font-sans ml-3 cursor-pointer", children: text }) : null] }) })));
+    const Radio = JSX(({ name, text, value, checked, onChange, className }) => (jsx("div", { className: className, children: jsxs("label", { className: "flex items-center relative cursor-pointer", children: [jsx("input", { className: "appearance-none flex justify-center items-center shrink-0 w-5 h-5 border-2 border-primary-main\n        rounded-full cursor-pointer after:block after:w-2.5 after:h-2.5 after:rounded-full checked:after:bg-primary-main", type: "radio", value: value, name: name, checked: checked, onChange: onChange }), text ? jsx("span", { className: "font-sans ml-3 cursor-pointer", children: text }) : null] }) })));
 
     const RenderRadioButtons = JSX(() => {
         const [selectedOption, setSelectedOption] = useState('option2');
@@ -2934,19 +2942,19 @@
         });
     }
 
-    let Map$1 = null;
     const YandexMap = JSX(({ points }) => {
+        const map = useRef(null);
         useEffect(() => {
             ymaps.ready(() => {
-                Map$1 = new ymaps.Map('map', {
+                map.current = new ymaps.Map('map', {
                     center: points[0],
                     zoom: 10,
                 });
-                renderClusterer(Map$1, points);
+                renderClusterer(map.current, points);
             });
         }, []);
-        if (Map$1 && points) {
-            renderClusterer(Map$1, points);
+        if (map.current && points) {
+            renderClusterer(map.current, points);
         }
         return (jsxs("div", { className: "pt-12 mt-1 bg-white", children: [jsx(Heading, { title: "\u041E\u0444\u0438\u0441\u044B \u043D\u0430 \u043A\u0430\u0440\u0442\u0435", headingType: "h3", className: "mb-8 text-center" }), jsx("div", { id: "map", className: "h-[640px]" })] }));
     });
@@ -3212,7 +3220,7 @@
     });
 
     const TariffsTableRow = JSX(({ row: { header, data }, activeCardIndex, isLastRow, context, rowIdx }) => {
-        return (jsxs(TariffsTableRowContainer, { context: context, rowIdx: rowIdx, children: [jsx("div", { className: `text-s py-5 ${FIRST_CELL_CLASSES} ${DIVIDER_CLASSES} ${!isLastRow ? 'border-solid' : ''}`, children: jsxs("div", { className: "flex items-center text-primary-text", role: "cell", children: [header?.icon ? (jsx(Img, { className: "mr-[14px] max-w-6 max-h-6", image: header.icon, width: "24px", height: "24px", asSVG: true })) : null, header?.title] }) }), data?.length ? (jsx(TableCarouselContainer, { activeCardIndex: activeCardIndex, columnWidth: COLUMN_WIDTH$1, version: "tariff", children: data.map((cells, i) => (jsx(TariffsTableCell, { cells: cells, isLastRow: isLastRow, rowIdx: rowIdx, cellIdx: i, context: context }, String(i)))) })) : null] }));
+        return (jsxs(TariffsTableRowContainer, { context: context, rowIdx: rowIdx, children: [jsx("div", { className: `text-s py-5 ${FIRST_CELL_CLASSES} ${DIVIDER_CLASSES} ${!isLastRow ? 'border-solid' : ''}`, children: jsxs("div", { className: "flex items-center text-primary-text", role: "cell", children: [header?.icon ? (jsx(Img, { className: "mr-[14px] max-w-6 max-h-6", image: header.icon, width: "24px", height: "24px", asSVG: true })) : null, header?.title ? (jsx(Heading, { headingType: header?.headingType || 'h6', as: "h6", title: header?.title })) : null] }) }), data?.length ? (jsx(TableCarouselContainer, { activeCardIndex: activeCardIndex, columnWidth: COLUMN_WIDTH$1, version: "tariff", children: data.map((cells, i) => (jsx(TariffsTableCell, { cells: cells, isLastRow: isLastRow, rowIdx: rowIdx, cellIdx: i, context: context }, String(i)))) })) : null] }));
     });
 
     const TariffsTable = JSX(({ className = '', context, title, description, rowHeaders, tariffsColumns: columns, hiddenRowsNum = 0, ...rest }) => {
@@ -3237,21 +3245,6 @@
         return (jsxs("div", { role: "table", children: [jsxs("div", { className: "relative", children: [children, jsx(TableArrowScrollControl, { ...tableArrowScrollControlProps })] }), isScrollAvailable ? (jsx("div", { className: "absolute top-0 right-0 bottom-0 w-[84px] bg-opacity-to-white" })) : null] }));
     });
 
-    const renderErrorContent = (error) => {
-        if (error?.errorContentType === 'Image' && error?.image) {
-            return jsx(Img, { image: error.image });
-        }
-        if (error?.errorContentType === 'Code' && error.code) {
-            return jsx("div", { className: "font-mohave text-title-extra gradient-color-text", children: error.code });
-        }
-        return null;
-    };
-    const ErrorBlock = JSX(({ context, className = '', title, subtitle, error, button }) => {
-        const { useRouter, handlerDecorator } = context;
-        const router = useRouter();
-        return (jsxs("section", { className: `flex flex-col justify-center items-center mt-12 ${className}`, role: "listitem", children: [jsx("div", { className: "flex justify-center py-20", children: renderErrorContent(error) }), title ? jsx(Heading, { headingType: "h1", className: "text-left mb-4", title: title }) : null, subtitle ? (jsx("div", { className: "font-sans text-xl-light text-left mb-7 max-w-[613px] text-center", children: subtitle })) : null, button?.text ? (jsx(Button, { className: "py-4 px-9", version: button?.version, ...useLink({ router, handlerDecorator }, button), children: button.text })) : null] }));
-    });
-
     const Blocks = {
         Accordion,
         BenefitsBlock,
@@ -3281,7 +3274,6 @@
         TariffsTable,
         TextBlock,
         Tile,
-        Navigation,
         Placeholder,
         BonusBenefitsBlock,
         SafeDepositRental,