@redneckz/wildless-cms-uni-blocks 0.6.26 → 0.6.28

package/bundle/bundle.umd.js

@@ -79,6 +79,9 @@
         get SITEMAP() {
             return this._.SITEMAP;
         }
+        get FOOTER() {
+            return this._.FOOTER;
+        }
         get CDN() {
             return this._.CDN;
         }
@@ -299,8 +302,9 @@
     const OBSERVER_OPTIONS = {
         threshold: new Array(THRESHOLD_ARRAY_LENGTH).fill(0).map(getIntersectionThreshold),
     };
-    const BlockWrapper = JSX(({ anchor, className, children, tag = 'section', labels, role }) => {
+    const BlockWrapper = JSX(({ className, block, tag = 'section', role, children }) => {
         const Tag = tag;
+        const { anchor, labels } = block || {};
         const [isVisible, setVisible] = useState(true);
         const anchorClickRef = useRef({});
         const observerCallback = useMemo(() => changeHashOnObserve({ anchor, anchorClickRef }), [anchor]);
@@ -311,7 +315,7 @@
         }), []);
         useEffect(() => EventBus.inst.subscribe('tab', (event) => {
             if (event.type === 'group') {
-                const hasSettings = labels?.length || anchor;
+                const hasSettings = labels?.length || block?.anchor;
                 setVisible(event.label ? !hasSettings || Boolean(labels?.includes(event.label)) : true);
             }
             else {
@@ -347,7 +351,7 @@
 
     const AccordionItemsList = JSX(({ children }) => (jsx("ul", { className: "list-none m-0 p-0", children: children })));
 
-    const Accordion = JSX(({ className = '', context, title, accordionAlignTitle = 'center', description, children, ...rest }) => (jsxs(BlockWrapper, { context: context, className: `p-[50px] mb-1 last:mb-0 font-sans bg-white text-primary-text ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", as: "h2", className: `mb-2.5 ${AlignText[accordionAlignTitle]}`, title: title })) : null, description ? jsx("div", { className: "mb-2.5 text-l", children: description }) : null, jsx(AccordionItemsList, { children: children })] })));
+    const Accordion = JSX(({ className = '', title, accordionAlignTitle = 'center', description, children, ...rest }) => (jsxs(BlockWrapper, { className: `p-[50px] mb-1 last:mb-0 font-sans bg-white text-primary-text ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", as: "h2", className: `mb-2.5 ${AlignText[accordionAlignTitle]}`, title: title })) : null, description ? jsx("div", { className: "mb-2.5 text-l", children: description }) : null, jsx(AccordionItemsList, { children: children })] })));
     Accordion.childrenTypes = ['AccordionItem'];
 
     const Foldable = JSX(({ isFoldButtonOnTop = false, unfoldedByDefault = false, renderFoldableSection, renderFoldButton, }) => {
@@ -515,40 +519,60 @@
         isHash: isHash
     });
 
-    const MOBILE_URL_PATH = '/mobile';
-    const withoutMobilePath = (href) => (href || '').replace(MOBILE_URL_PATH, '');
-
     const adjustHref = (href, router) => {
-        if (!href) {
-            return href;
-        }
-        const relativeHref = toRelativeHref(href, router) || '';
-        const isMobilePage = router?.pathname.startsWith(MOBILE_URL_PATH);
-        return isMobilePage && !isURL(relativeHref) ? `${MOBILE_URL_PATH}${relativeHref}` : relativeHref;
-    };
-    const toRelativeHref = (href, router) => {
         if (!href) {
             return href;
         }
         const origin = getOrigin(router?.href);
+        // Relative URL
         return origin ? href.replace(origin, '') || '/' : href;
     };
 
-    const defaultHandlerDecorator = (handler) => handler;
-    function useLink({ router, handlerDecorator = defaultHandlerDecorator, }, link) {
-        const href = adjustHref(link.href, router);
-        return {
-            ...link,
-            href,
-            'aria-label': link.text,
-            onClick: handlerDecorator((ev) => {
-                const isLocalHref = href && !isURL(href);
-                const isLocalTarget = !link.target || link.target === '_self';
-                if (isLocalHref && isLocalTarget) {
-                    ev?.preventDefault();
-                    router.push(href);
-                }
-            }, link),
+    /* eslint-disable @typescript-eslint/ban-types */
+    const handlerDecorator = (handler, targetContent) => {
+        return handlerDecorator._impl(handler, targetContent);
+    };
+    handlerDecorator._impl = (handler) => handler;
+    handlerDecorator.setup = (impl) => {
+        handlerDecorator._impl = impl;
+    };
+
+    function useRouter() {
+        return useRouter._impl();
+    }
+    useRouter._impl = () => ({
+        href: globalThis.location?.href || '/',
+        pathname: globalThis.location?.pathname || '/',
+        query: {},
+        push: () => {
+            // Do nothing
+        },
+        replace: () => {
+            // Do nothing
+        },
+    });
+    useRouter.setup = (impl) => {
+        useRouter._impl = impl;
+    };
+
+    function useLink() {
+        const router = useRouter();
+        return (props) => {
+            const href = adjustHref(props.href, router);
+            return {
+                ...props,
+                href,
+                'aria-label': props.text,
+                onClick: handlerDecorator((ev) => {
+                    props.onClick && props.onClick(ev);
+                    const isLocalHref = href && !isURL(href);
+                    const isLocalTarget = !props.target || props.target === '_self';
+                    if (isLocalHref && isLocalTarget) {
+                        ev?.preventDefault();
+                        router.push(href);
+                    }
+                }, props),
+            };
         };
     }
 
@@ -575,10 +599,10 @@
 
     const ButtonInner = JSX((props) => {
         const { text, aboveText, appendLeft, appendRight, version = 'primary' } = props;
-        return (jsxs("div", { className: getButtonStyle(props), children: [appendLeft ? jsx("div", { className: iconStyleMap[version], children: appendLeft }) : null, isWithText(props) ? (jsxs("div", { children: [jsx("div", { className: "text-xs-light text-left", children: aboveText }), jsx("div", { className: `text-left ${aboveText ? 'text-s -mt-0.5' : 'text-l'}`, children: text })] })) : null, appendRight ? jsx("div", { className: iconStyleMap[version], children: appendRight }) : null] }));
+        return (jsxs("div", { className: getButtonStyle(props), children: [appendLeft ? jsx("div", { className: iconStyleMap[version], children: appendLeft }) : null, isWithText(props) ? (jsxs("div", { children: [aboveText ? jsx("div", { className: "text-xs-light text-left", children: aboveText }) : null, jsx("div", { className: `text-left ${aboveText ? 'text-s -mt-0.5' : 'text-l'}`, children: text })] })) : null, appendRight ? jsx("div", { className: iconStyleMap[version], children: appendRight }) : null] }));
     });
     const getButtonStyle = (props) => {
-        const { className = '', version, aboveText, rounded } = props;
+        const { version, aboveText, rounded } = props;
         if (version === 'link') {
             return '';
         }
@@ -587,7 +611,6 @@
             'group flex items-center justify-center',
             isWithText(props) ? withTextStyle : 'h-12 w-12',
             rounded ? 'rounded-full' : '',
-            className,
         ].join(' ');
     };
     const isWithText = ({ text, aboveText, appendLeft }) => Boolean(text || aboveText || !appendLeft);
@@ -608,22 +631,16 @@
         className,
     ].join(' ');
 
-    const Button = JSX(({ aboveText, appendLeft, appendRight, ariaLabel, children, className, disabled, href, onClick, rel, rounded, target, text, version, }) => {
-        const buttonInner = children ?? (jsx(ButtonInner, { aboveText: aboveText, appendLeft: appendLeft, appendRight: appendRight, rounded: rounded, text: text, version: version }));
-        return disabled ? (jsx(DisabledButton, { ariaLabel: ariaLabel, className: className, rounded: rounded, version: version, children: buttonInner })) : (jsx(RegularButton, { ariaLabel: ariaLabel, className: className, href: href, onClick: onClick, rel: rel, rounded: rounded, target: target, version: version, children: buttonInner }));
-    });
-    const RegularButton = JSX(({ className = '', ariaLabel, version, rounded, href, target, children, onClick, rel }) => {
-        return (jsx("a", { className: getRegularButtonClasses({ className, version, rounded }), href: href, target: target, onClick: onClick, "aria-label": ariaLabel, role: href ? 'link' : 'button', rel: rel, children: children }));
-    });
-    const DisabledButton = JSX(({ className, children, ariaLabel, version, rounded }) => {
-        return (jsx("div", { role: "button", "aria-disabled": "true", "aria-label": ariaLabel, tabIndex: -1, className: getDisabledButtonClasses({ className, rounded, version }), children: children }));
+    const Button = JSX(({ disabled, children, ...rest }) => {
+        const link = useLink();
+        const adjustedProps = link(rest);
+        const buttonInner = children ?? jsx(ButtonInner, { ...adjustedProps });
+        return disabled ? (jsx(DisabledButton, { ...adjustedProps, children: buttonInner })) : (jsx(RegularButton, { ...adjustedProps, children: buttonInner }));
     });
+    const RegularButton = JSX(({ className = '', href, rel, target, ariaLabel, version, rounded, onClick, children }) => (jsx("a", { className: getRegularButtonClasses({ className, version, rounded }), href: href, rel: rel, target: target, "aria-label": ariaLabel, role: href ? 'link' : 'button', onClick: onClick, children: children })));
+    const DisabledButton = JSX(({ className, ariaLabel, version, rounded, children }) => (jsx("div", { role: "button", "aria-disabled": "true", "aria-label": ariaLabel, tabIndex: -1, className: getDisabledButtonClasses({ className, rounded, version }), children: children })));
 
-    const ButtonSection = JSX(({ context, className = '', buttons }) => {
-        const { handlerDecorator } = context;
-        const router = context.useRouter();
-        return buttons && buttons?.length ? (jsx("div", { className: className, children: buttons.map((button, index) => renderButton({ button: useLink({ router, handlerDecorator }, button), index })) })) : null;
-    });
+    const ButtonSection = JSX(({ className = '', buttons }) => buttons && buttons?.length ? (jsx("div", { className: className, children: buttons.map((button, index) => renderButton({ button, index })) })) : null);
     function renderButton({ button, buttonClassName, index }) {
         const { icon, iconRight, version, ...rest } = button;
         const iconVersion = version === 'secondary' ? 'color' : 'white';
@@ -704,17 +721,17 @@
         XS: 'text-xs-light',
     };
 
-    const Headline = JSX(({ bgColorHeadline = 'transparent', align = 'center', className = '', title, description, headlineVersion = 'XL', as, ...rest }) => {
+    const Headline = JSX(({ className = '', bgColorHeadline = 'transparent', align = 'center', title, description, headlineVersion = 'XL', as, ...rest }) => {
         const STYLE_MAPS = HEADLINE_BLOCK_STYLE_MAPS[bgColorHeadline];
         const SIZE_MAPS = HEADLINE_VERSION[headlineVersion];
         return (jsxs(BlockWrapper, { className: `font-sans flex flex-col p-[50px] ${SIZE_MAPS.gap} ${STYLE_MAPS.background} ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: SIZE_MAPS?.headingType, as: as || SIZE_MAPS?.as, className: `whitespace-pre-wrap ${STYLE_MAPS.text} ${AlignText[align]}`, title: title })) : null, description ? (jsx(Description, { className: `${SIZE_MAPS.descriptionFont} ${STYLE_MAPS.text} ${AlignText[align]}`, description: description })) : null] }));
     });
 
     const Bonus = JSX((props) => {
-        const { context, className = '', title, description, bonusItems, ...rest } = props;
-        return (jsx(BlockWrapper, { className: `font-sans bg-white p-[50px] pb-9 ${className}`, context: context, ...rest, children: jsxs("div", { className: "container", children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: description, headlineVersion: "M", align: "center" }), jsx("div", { className: "flex flex-wrap w-full mt-9", children: bonusItems?.length
+        const { className = '', title, description, bonusItems, ...rest } = props;
+        return (jsx(BlockWrapper, { className: `font-sans bg-white p-[50px] pb-9 ${className}`, ...rest, children: jsxs("div", { className: "container", children: [jsx(Headline, { className: "!p-0", title: title, description: description, headlineVersion: "M", align: "center", ...rest }), jsx("div", { className: "flex flex-wrap w-full mt-9", children: bonusItems?.length
                             ? bonusItems.map((_, i) => {
-                                return (jsx("div", { className: "flex-grow w-[49%] border border-gray p-9 mb-3 mx-2 even:mr-0 odd:ml-0 last:odd:mx-0", children: jsxs("div", { className: "flex justify-between w-full", children: [jsxs("div", { className: "flex flex-col justify-between mr-4", children: [jsxs("div", { children: [jsx("div", { className: "text-h4", children: _.title }), jsx("div", { className: "text-xl-light mt-2 max-w-[488px]", children: _.description })] }), _?.buttons?.length ? (jsx(ButtonSection, { context: context, buttons: _?.buttons })) : null] }), _.bonusItemContent?.bonusType
+                                return (jsx("div", { className: "flex-grow w-[49%] border border-gray p-9 mb-3 mx-2 even:mr-0 odd:ml-0 last:odd:mx-0", children: jsxs("div", { className: "flex justify-between w-full", children: [jsxs("div", { className: "flex flex-col justify-between mr-4", children: [jsxs("div", { children: [jsx("div", { className: "text-h4", children: _.title }), jsx("div", { className: "text-xl-light mt-2 max-w-[488px]", children: _.description })] }), _?.buttons?.length ? jsx(ButtonSection, { buttons: _?.buttons }) : null] }), _.bonusItemContent?.bonusType
                                                 ? renderBonusItemContent(_.bonusItemContent)
                                                 : null] }) }, String(i)));
                             })
@@ -726,12 +743,23 @@
     const renderBonusCount = (_) => (jsxs("div", { className: "relative -bottom-3 h-auto flex items-end mt-14 shrink-0", children: [_.bonusCount ? (jsx("span", { className: "font-mohave -tracking-[5px] text-title-extra bg-clip-text text-transparent bg-green-to-yellow -mb-7", children: _.bonusCount })) : null, _.bonusName ? (jsx("span", { className: "text-h2 bg-clip-text text-transparent bg-green-to-yellow", children: _.bonusName })) : null] }));
     const renderBonusImage = (_) => _.image ? (jsx(ImgInner, { className: `w-[50px] h-[50px] min-w-[50px] p-3 rounded-full`, image: _.image })) : null;
 
-    const BonusBenefitsBlock = JSX(({ context, className = '', title, subtitle, bonusBenefits, columnsCount = '4', ...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(columnsCount)}`, children: bonusBenefits.map(renderBonusBenefit) })) : null] })));
+    const BonusBenefitsBlock = JSX(({ className = '', title, subtitle, bonusBenefits, columnsCount = '4', ...rest }) => (jsxs(BlockWrapper, { className: `font-sans text-primary-text bg-white p-[50px] flex flex-col text-center ${className}`, ...rest, children: [jsx(Headline, { className: "!p-0", title: title, description: subtitle, headlineVersion: "M", align: "center", ...rest }), bonusBenefits?.length ? (jsx("div", { className: `grid gap-1 mt-8 ${getElementsColsValue(columnsCount)}`, 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(ImgInner, { 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 getElementsColsValue = (colValue) => colValue === '4' ? 'grid-cols-4' : 'grid-cols-5';
 
+    const BusinessCard = JSX((props) => {
+        const { title, image, cardItems, button } = props;
+        return (jsxs("div", { className: "border-color-stroke border p-9 w-1/2", children: [image ? (jsxs("div", { className: "flex justify-center", children: [image?.src ? jsx(ImgInner, { className: "mb-5", image: image }) : null, image?.icon ? jsx(ImgInner, { image: image, asSVG: true }) : null] })) : null, title ? jsx(Heading, { headingType: "h4", title: title, className: "mb-6" }) : null, cardItems?.length ? jsx("ul", { children: cardItems.map((_, i) => renderItem(_, String(i))) }) : null, button?.text ? renderButton({ button, buttonClassName: 'mt-6' }) : null] }));
+    });
+    const renderItem = (item, key) => {
+        const { icon, text } = item;
+        return (jsxs("li", { className: "flex items-center gap-3.5 mb-3 last:mb-0", children: [icon?.icon ? (jsx(ImgInner, { className: `w-12 h-12 min-w-12 p-3 rounded-full bg-main-divider`, image: icon.icon, asSVG: true })) : null, icon?.src ? jsx(ImgInner, { image: icon.icon }) : null, jsx("span", { className: "text-xl-light", children: text })] }, key));
+    };
+
+    const BusinessBlock = JSX(({ className = '', title, cards, ...rest }) => (jsxs(BlockWrapper, { className: `font-sans bg-white p-[50px] pb-9 ${className}`, ...rest, children: [jsx(Heading, { headingType: "h3", title: title, className: "text-center mb-8" }), jsx("div", { className: "flex gap-5", children: cards?.length ? cards.map((_, i) => jsx(BusinessCard, { ..._ }, String(i))) : null })] })));
+
     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
         ? 'bg-secondary-light text-secondary-text'
         : 'bg-white text-primary-text hover:text-primary-main'} ${className || ''}`, disabled: disabled, ...rest, children: jsx(ImgInner, { className: "w-4 h-4 min-w-4 min-h-4 rounded-full box-border", image: { icon: 'ArrowLeftIcon', iconVersion: 'black' }, imageClassName: "group-hover:text-primary-main", width: "16", height: "16", asSVG: true }) })));
@@ -785,8 +813,8 @@
 
     const Rate = JSX(({ rate, title = 'Ставка', unit, rateBlockClassName }) => (jsxs("div", { children: [jsx("div", { className: "text-l-light text-secondary-text", children: title }), jsxs("div", { className: "flex justify-start", children: [jsx("span", { className: `block gradient-color-text font-mohave text-title-huge pr-6 -mt-4 ${rateBlockClassName}`, children: String(rate).replace('.', ',') }), unit ? jsx("span", { className: "gradient-color-text text-[65px] leading-[75px]", children: unit }) : ''] })] })));
 
-    function renderButtonSection(context, buttons) {
-        return buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex flex-col mt-7 gap-2" })) : null;
+    function renderButtonSection(buttons) {
+        return buttons?.length ? (jsx(ButtonSection, { buttons: buttons, className: "flex flex-col mt-7 gap-2" })) : null;
     }
 
     const renderFootnote = (text) => text ? jsx("p", { className: "text-s-light text-secondary-text mt-7", children: text }) : null;
@@ -933,7 +961,7 @@
         };
     };
 
-    const BonusCalculatorForm = JSX(({ context, className = '', sourceBookDir = '', buttons, footnote }) => {
+    const BonusCalculatorForm = JSX(({ className = '', sourceBookDir = '', buttons, footnote }) => {
         const [travelExpenseValue, setTravelExpenseValue] = useState(DEFAULT_TRAVEL_MIN_SUM);
         const [restExpenseValue, setRestExpenseValue] = useState(DEFAULT_REST_MIN_SUM);
         const userInputParams = {
@@ -954,7 +982,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-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)] })] }));
+                        }, 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(buttons), renderFootnote(footnote)] })] }));
     });
 
     const SVG = JSX(({ className, viewBox, fill = 'none', width, height, paths, ...commonOptions }) => {
@@ -973,11 +1001,11 @@
         return (jsx("div", { className: className, children: jsxs("label", { className: "flex items-center relative cursor-pointer group", children: [jsx("input", { className: `peer appearance-none w-5 h-5 border-solid cursor-pointer group-hover:border-checkbox-hover
         ${isRadio ? 'rounded-full border-2' : 'rounded checked:bg-primary-main border'}
         ${checked ? 'border-black' : 'border-main-stroke'}
-        checked:border-primary-main m-0`, type: "checkbox", onChange: (e) => {
-                            onChange(e.target.checked);
-                        }, checked: checked }), isRadio ? (jsx("div", { className: "left-1 w-3 h-3 rounded-full bg-primary-main hidden absolute peer-checked:block" })) : (jsx(SVG, { paths: CHECK_PATHS, className: "hidden absolute left-1 ml-px peer-checked:block", width: "11", height: "9", fill: "white", viewBox: "0 0 11 9" })), text ? jsx("span", { className: "font-sans ml-3 text-l-light", children: text }) : null] }) }));
+        checked:border-primary-main m-0`, type: "checkbox", onChange: (e) => onChange && onChange(e.target.checked), checked: checked }), isRadio ? (jsx("div", { className: "left-1 w-3 h-3 rounded-full bg-primary-main hidden absolute peer-checked:block" })) : (jsx(SVG, { paths: CHECK_PATHS, className: "hidden absolute left-1 ml-px peer-checked:block", width: "11", height: "9", fill: "white", viewBox: "0 0 11 9" })), text ? jsx("span", { className: "font-sans ml-3 text-l-light", children: text }) : null] }) }));
     });
 
+    const RadioButtonGroup = JSX(({ items, checkedItem, onChange: onChangeCheckedItem }) => (jsx("div", { className: "flex flex-col gap-3", children: items?.map(({ id, text }) => (jsx(Checkbox, { isRadio: true, text: text, checked: checkedItem === id, onChange: () => onChangeCheckedItem && onChangeCheckedItem(id) }, String(id)))) })));
+
     const STEP_MONTHS = 1;
     function renderMonthsInput(title, params, callback) {
         const { minMonths, maxMonths, monthsValue } = params;
@@ -988,14 +1016,6 @@
         return (jsx(InputRange, { className: "mt-7", title: title, items: [`От ${monthText(minMonths)}`, `До ${monthText(maxMonths)}`], min: minMonths, max: maxMonths, step: STEP_MONTHS, value: clamp(monthsValue, minMonths, maxMonths), onChange: callback }));
     }
 
-    const RadioButtonGroup = JSX(({ items, checkedItem, onChangeCheckedItem }) => {
-        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({ onChange, ...rest }) {
-        return jsx(RadioButtonGroup, { onChangeCheckedItem: onChange, ...rest });
-    }
-
     /**
      * Формулы расчёта аннуитетных и дифференцированных платежей:
      * https://finuslugi.ru/potrebitelskie_kredity/stat_annuitetnye_i_differentsirovannye_platezhi
@@ -1042,7 +1062,7 @@
             text: 'Дифференцированный',
         },
     ];
-    const CreditCalculatorForm = JSX(({ context, className = '', sourceBookDir, buttons, footnote }) => {
+    const CreditCalculatorForm = JSX(({ className = '', sourceBookDir, buttons, footnote }) => {
         const [isAnnuity, toggleIsAnnuity] = useState(false);
         const [isInsurance, toggleIsInsurance] = useState(true);
         const [isSalaryClient, toggleIsSalaryClient] = useState(false);
@@ -1058,12 +1078,7 @@
             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-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), renderFootnote(footnote)] })] }));
+        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" }), jsx(RadioButtonGroup, { items: paymentTypeItems, checkedItem: isAnnuity ? ANNUITY : DIFFERENTIAL, onChange: (text) => toggleIsAnnuity(text === ANNUITY) }), renderButtonSection(buttons), renderFootnote(footnote)] })] }));
     });
 
     const EVERY_MONTH = 'everyMonth';
@@ -1078,7 +1093,7 @@
             text: 'В конце срока',
         },
     ];
-    const DepositCalculatorForm = JSX(({ context, className = '', rate, buttons, footnote }) => {
+    const DepositCalculatorForm = JSX(({ className = '', rate, buttons, footnote }) => {
         const [moneyValue, setMoneyValue] = useState(DEFAULT_SUM);
         const [monthsValue, setMonthsValue] = useState(DEFAULT_MONTHS);
         const [isEveryMonth, toggleIsEveryMonth] = useState(false);
@@ -1092,12 +1107,7 @@
                             minMonths: DEFAULT_MIN_MONTHS,
                             maxMonths: DEFAULT_MAX_MONTHS,
                             monthsValue,
-                        }, 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)] })] }));
+                        }, 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" })) , jsx(RadioButtonGroup, { items: depositTypeItems, checkedItem: isEveryMonth ? EVERY_MONTH : AT_END_TERM, onChange: (text) => toggleIsEveryMonth(text === EVERY_MONTH) }), renderButtonSection(buttons), renderFootnote(footnote)] })] }));
     });
 
     const EmbeddableCalcBlocks = {
@@ -1106,16 +1116,16 @@
         BonusCalculatorForm,
     };
 
-    const renderCalculatorBlock = ({ context, className }) => (block, i) => {
+    const renderCalculatorBlock = (block, i) => {
         const type = block?.calcType;
         if (!type || !(type in EmbeddableCalcBlocks)) {
             return null;
         }
         const EmbeddedBlock = EmbeddableCalcBlocks[type];
-        return (jsx("section", { className: `box-border relative bg-white flex shrink-0 self-start basis-full ${className}`, role: "listitem", children: jsxs("div", { className: "box-border p-9 w-full", children: [block?.title ? jsx(Heading, { className: "text-center mb-6", title: block.title }) : null, jsx(EmbeddedBlock, { context: context, ...block, className: "flex justify-between" })] }) }, String(i)));
+        return (jsx("section", { className: "box-border relative bg-white flex shrink-0 self-start basis-full", role: "listitem", children: jsxs("div", { className: "box-border p-9 w-full", children: [block?.title ? jsx(Heading, { className: "text-center mb-6", title: block.title }) : null, jsx(EmbeddedBlock, { ...block, className: "flex justify-between" })] }) }, String(i)));
     };
 
-    const Calculator = JSX(({ className = '', context, calculatorTabs = [], ...rest }) => {
+    const Calculator = JSX(({ className = '', calculatorTabs = [], ...rest }) => {
         const tabsNav = calculatorTabs.map((_) => _.nav || {});
         const calculatorBlocks = calculatorTabs.map(({ calculatorBlock }) => calculatorBlock || {});
         const [activeSlideIndex, setActiveSlideIndex] = useState(0);
@@ -1125,16 +1135,14 @@
         const isGalleryScrollAvailable = calculatorTabs?.length > 3;
         const showNextButton = isGalleryScrollAvailable && calculatorTabs?.length > tabsShift + 3;
         const showPrevButton = tabsShift > 0;
-        return (jsxs(BlockWrapper, { context: context, className: `box-border overflow-hidden relative font-sans w-100 text-primary-text bg-white ${className}`, ...rest, children: [jsxs("div", { className: "bg-white", children: [tabsNav.length > 1
+        return (jsxs(BlockWrapper, { className: `box-border overflow-hidden relative font-sans w-100 text-primary-text bg-white ${className}`, ...rest, children: [jsxs("div", { className: "bg-white", children: [tabsNav.length > 1
                             ? renderTabs({ tabsShift, tabsNav, activeSlideIndex, setActiveSlideIndex })
                             : null, renderArrows({
                             handler: [handlePrevClick, handleNextClick],
                             isShown: [showPrevButton, showNextButton],
                             btnClass: ['left-3', 'right-3'],
                             className: 'top-8',
-                        })] }), jsx("div", { className: "flex", style: { transform: `translateX(-${activeSlideIndex}00%)` }, role: "list", children: calculatorBlocks?.length
-                        ? calculatorBlocks.map(renderCalculatorBlock({ context, className }))
-                        : null })] }));
+                        })] }), jsx("div", { className: "flex", style: { transform: `translateX(-${activeSlideIndex}00%)` }, role: "list", children: calculatorBlocks?.length ? calculatorBlocks.map(renderCalculatorBlock) : null })] }));
     });
     function renderNavButton$2({ tab, i, activeSlideIndex, onClick }) {
         const isActiveBtn = i === activeSlideIndex;
@@ -1224,61 +1232,56 @@
     const DEFAULT_TITLE = 'Укажите сумму перевода';
     const DEFAULT_LABEL = 'Сумма перевода';
     const DEFAULT_PLACEHOLDER = '1500';
-    const CardTransfer = JSX(({ className = '', title = DEFAULT_TITLE, label = DEFAULT_LABEL, placeholder = DEFAULT_PLACEHOLDER, button, context, ...rest }) => {
-        const router = context.useRouter();
-        const { handlerDecorator } = context;
+    const CardTransfer = JSX(({ className = '', title = DEFAULT_TITLE, label = DEFAULT_LABEL, placeholder = DEFAULT_PLACEHOLDER, button, ...rest }) => {
         const [value, setValue] = useState('');
         const isDisabled = !Number(getSanitizedValue(value));
         const buttonStyle = isDisabled
             ? getDisabledButtonClasses({ version: button?.version })
             : getRegularButtonClasses({ className: 'text-white', version: button?.version });
-        return (jsxs(BlockWrapper, { className: `p-[50px] flex flex-col items-center font-sans bg-white ${className}`, context: context, ...rest, children: [title ? jsx(Heading, { className: "max-w-[684px] pb-9", headingType: "h2", title: title }) : null, jsxs("form", { className: "w-[468px]", method: "POST", action: FORM_URL, children: [jsx(CurrencyInput, { name: AMOUNT_KEY, value: value, onChange: setValue, valid: value === '' || !isDisabled, placeholder: placeholder, label: label }), button?.text ? (jsx("button", { type: "submit", className: `w-full p-4 mt-6 ${buttonStyle} `, disabled: isDisabled, ...useLink({ router, handlerDecorator }, button), children: button.text })) : null] })] }));
+        const link = useLink();
+        return (jsxs(BlockWrapper, { className: `p-[50px] flex flex-col items-center font-sans bg-white ${className}`, ...rest, children: [title ? jsx(Heading, { className: "max-w-[684px] pb-9", headingType: "h2", title: title }) : null, jsxs("form", { className: "w-[468px]", method: "POST", action: FORM_URL, children: [jsx(CurrencyInput, { name: AMOUNT_KEY, value: value, onChange: setValue, valid: value === '' || !isDisabled, placeholder: placeholder, label: label }), button?.text ? (jsx("button", { type: "submit", className: `w-full p-4 mt-6 ${buttonStyle} `, disabled: isDisabled, ...link(button), children: button.text })) : null] })] }));
     });
 
     const cardStyleMap$1 = {
         black: 'bg-black',
         white: 'bg-white',
     };
-    const CatalogCard = JSX(({ className = '', title, description, image, price, button, colors }) => {
-        return (jsxs("section", { className: `border border-solid box-border border-main-stroke p-[30px] min-w-[402px] flex flex-col justify-left ${className}`, role: "listitem", children: [image?.src ? jsx(ImgInner, { className: "mb-5 flex justify-center", image: image }) : null, title ? (jsx(Heading, { headingType: "h6", as: "h4", className: "text-left mb-1.5", title: title })) : null, description ? jsx("div", { className: "text-m-light text-left mb-4", children: description }) : null, colors?.length ? (jsxs("div", { className: "flex mb-4 text-s-light text-secondary-text", children: [jsx("div", { className: "mr-1.5", children: "\u0414\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0435 \u0446\u0432\u0435\u0442\u0430: " }), colors.map(renderColorOption)] })) : null, price ? jsxs("div", { className: "text-h3 text-left", children: [price, "\u00A0\u20BD"] }) : null, button ? renderButton({ button, buttonClassName: 'mt-5 w-full' }) : null] }));
-    });
+    const CatalogCard = JSX(({ className = '', title, description, image, price, button, colors }) => (jsxs("section", { className: `border border-solid box-border border-main-stroke p-[30px] min-w-[402px] flex flex-col justify-left ${className}`, role: "listitem", children: [image?.src ? jsx(ImgInner, { className: "mb-5 flex justify-center", image: image }) : null, title ? (jsx(Heading, { headingType: "h6", as: "h4", className: "text-left mb-1.5", title: title })) : null, description ? jsx("div", { className: "text-m-light text-left mb-4", children: description }) : null, colors?.length ? (jsxs("div", { className: "flex mb-4 text-s-light text-secondary-text", children: [jsx("div", { className: "mr-1.5", children: "\u0414\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0435 \u0446\u0432\u0435\u0442\u0430: " }), colors.map(renderColorOption)] })) : null, price ? jsxs("div", { className: "text-h3 text-left", children: [price, "\u00A0\u20BD"] }) : null, button ? renderButton({ button, buttonClassName: 'mt-5 w-full' }) : null] })));
     const renderColorOption = (color, i) => (jsx("span", { className: `w-6 h-6 ml-3 border border-solid border-main-divider rounded-full ${cardStyleMap$1[color]}` }, String(i)));
 
     const BLUR_BLOCK_CLASSES$2 = 'absolute top-0 bottom-0 w-[84px]';
     const CARD_FULL_VIEW_COUNT$2 = 3;
     const CARD_SHIFT$1 = 430;
-    const Catalog = JSX(({ context, cards = [], className = '', title, description, ...rest }) => {
+    const Catalog = JSX(({ cards = [], className = '', title, description, ...rest }) => {
         const [activeCardIndex, setActiveCardIndex] = useState(0);
-        return (jsxs(BlockWrapper, { context: context, className: `bg-white relative font-sans p-[50px] overflow-hidden text-center ${className}`, ...rest, children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: description, headlineVersion: "M", align: "center" }), jsx("div", { className: "flex duration-1000 gap-3.5 mt-8", style: { transform: `translateX(-${activeCardIndex * CARD_SHIFT$1}px)` }, role: "list", children: cards?.length ? cards.map(renderCatalogCard(context)) : null }), renderNavButtons$2({
-                    cardsCount: cards.length,
-                    activeCardIndex,
-                    setActiveCardIndex,
+        const handleNextClick = useCallback(() => setActiveCardIndex((_) => _ + 1), []);
+        const handlePrevClick = useCallback(() => setActiveCardIndex((_) => _ - 1), []);
+        const isUseSlider = cards.length > CARD_FULL_VIEW_COUNT$2;
+        const showNextButton = isUseSlider && cards.length - activeCardIndex > CARD_FULL_VIEW_COUNT$2;
+        const showPrevButton = isUseSlider && activeCardIndex > 0;
+        return (jsxs(BlockWrapper, { className: `bg-white relative font-sans p-[50px] overflow-hidden text-center ${className}`, ...rest, children: [jsx(Headline, { className: "!p-0", title: title, description: description, headlineVersion: "M", align: "center", ...rest }), jsx("div", { className: "flex duration-1000 gap-3.5 mt-8", style: { transform: `translateX(-${activeCardIndex * CARD_SHIFT$1}px)` }, role: "list", children: cards?.length ? cards.map((card, i) => jsx(CatalogCard, { ...card }, String(i))) : null }), renderArrows({
+                    handler: [handlePrevClick, handleNextClick],
+                    isShown: [showPrevButton, showNextButton],
+                    btnClass: ['left-8', 'right-8'],
+                    className: 'top-1/2 z-10 mt-6',
                 }), jsx("div", { className: `${BLUR_BLOCK_CLASSES$2} left-0 bg-opacity-from-white` }), jsx("div", { className: `${BLUR_BLOCK_CLASSES$2} right-0 bg-opacity-to-white` })] }));
     });
-    const renderCatalogCard = (context) => (card, i) => {
-        return jsx(CatalogCard, { context: context, ...card }, String(i));
-    };
-    const renderNavButtons$2 = ({ cardsCount, activeCardIndex, setActiveCardIndex, }) => {
-        const handleNextClick = () => setActiveCardIndex(activeCardIndex + 1);
-        const handlePrevClick = () => setActiveCardIndex(activeCardIndex - 1);
-        const isUseSlider = cardsCount > CARD_FULL_VIEW_COUNT$2;
-        const showNextButton = isUseSlider && cardsCount - activeCardIndex > CARD_FULL_VIEW_COUNT$2;
-        const showPrevButton = isUseSlider && activeCardIndex > 0;
-        return renderArrows({
-            handler: [handlePrevClick, handleNextClick],
-            isShown: [showPrevButton, showNextButton],
-            btnClass: ['left-8', 'right-8'],
-            className: 'top-1/2 z-10 mt-6',
-        });
-    };
 
-    const useTableArrowScrollControl = ({ columnsLength, colsLengthForScroll, activeCardIndex, setActiveCardIndex, }) => {
-        const handleNextClick = () => setActiveCardIndex(activeCardIndex + 1);
-        const handlePrevClick = () => setActiveCardIndex(activeCardIndex - 1);
+    const useTableArrowScrollControl = ({ columnsLength, colsLengthForScroll, }) => {
+        const [activeCardIndex, setActiveCardIndex] = useState(0);
+        const onNextClick = useCallback(() => setActiveCardIndex((_) => _ + 1), []);
+        const onPrevClick = useCallback(() => setActiveCardIndex((_) => _ - 1), []);
         const isScrollAvailable = columnsLength > colsLengthForScroll;
         const showNextButton = isScrollAvailable && columnsLength - activeCardIndex > colsLengthForScroll;
         const showPrevButton = Boolean(isScrollAvailable && activeCardIndex > 0);
-        return { handleNextClick, handlePrevClick, isScrollAvailable, showNextButton, showPrevButton };
+        return {
+            activeCardIndex,
+            onNextClick,
+            onPrevClick,
+            isScrollAvailable,
+            showNextButton,
+            showPrevButton,
+        };
     };
 
     const GRADIENT = 'bg-gradient-to-r from-main-gradient-start to-main-gradient-end';
@@ -1298,13 +1301,11 @@
 
     const TableRowContainer = JSX(({ children }) => (jsx("div", { className: "self-start flex flex-col", role: "row", children: jsx("div", { className: "flex", children: children }) })));
 
-    const ComparisonTableColumnHeaders = JSX(({ colHeaders, activeCardIndex, router, handlerDecorator }) => {
-        return (jsxs(TableRowContainer, { children: [jsx("div", { className: FIRST_CELL_CLASSES$1, role: "columnheader" }), jsx(TableCarouselContainer, { activeCardIndex: activeCardIndex, columnWidth: COLUMN_WIDTH$2, children: colHeaders.map((header, i) => (jsx(HeaderCell, { ...header, link: header.link && useLink({ router, handlerDecorator }, header.link) }, String(i)))) })] }));
-    });
+    const ComparisonTableColumnHeaders = JSX(({ colHeaders, activeCardIndex }) => (jsxs(TableRowContainer, { children: [jsx("div", { className: FIRST_CELL_CLASSES$1, role: "columnheader" }), jsx(TableCarouselContainer, { activeCardIndex: activeCardIndex, columnWidth: COLUMN_WIDTH$2, children: colHeaders.map((header, i) => (jsx(HeaderCell, { ...header }, String(i)))) })] })));
 
-    const TableArrowScrollControl = JSX(({ isScrollAvailable, handleNextClick, handlePrevClick, showNextButton, showPrevButton }) => {
+    const TableArrowScrollControl = JSX(({ isScrollAvailable, onNextClick, onPrevClick, showNextButton, showPrevButton }) => {
         return isScrollAvailable ? (jsx("div", { children: renderArrows({
-                handler: [handlePrevClick, handleNextClick],
+                handler: [onPrevClick, onNextClick],
                 isShown: [showPrevButton, showNextButton],
                 btnClass: ['top-[108px]', 'top-11'],
                 className: 'right-7',
@@ -1324,13 +1325,11 @@
     const titleStyle = (isLastRow = false) => `text-s py-7 ${DIVIDER_CLASSES$1} ${FIRST_CELL_CLASSES$1} ${isLastRow ? 'border-b-0' : 'border-solid'}`;
     const TableRow = JSX(({ row: { header, data }, activeCardIndex, isColoredFirstColumn, isFirstRow, isLastRow }) => (jsxs(TableRowContainer, { children: [header?.title ? jsx("div", { className: titleStyle(isLastRow), children: header.title }) : null, data?.length ? (jsx(TableCarouselContainer, { activeCardIndex: activeCardIndex, columnWidth: COLUMN_WIDTH$2, children: data.map((cell, i) => (jsx(TableCell, { cell: cell, isFirstRow: isFirstRow, isLastRow: isLastRow, isFillGradient: isColoredFirstColumn && i === 0 }, String(i)))) })) : null] })));
 
-    const ComparisonTableRows = JSX(({ rowData, activeCardIndex, isColoredFirstColumn, ...tableArrowScrollProps }) => {
-        return (jsxs("div", { className: "relative", children: [rowData.map((row, i, { length }) => (jsx(TableRow, { row: row, isFirstRow: i === 0, isLastRow: i + 1 === length, activeCardIndex: activeCardIndex, isColoredFirstColumn: isColoredFirstColumn }, String(i)))), jsx(TableArrowScrollControl, { ...tableArrowScrollProps })] }));
+    const ComparisonTableRows = JSX(({ rowData, isColoredFirstColumn, ...tableArrowScrollProps }) => {
+        return (jsxs("div", { className: "relative", children: [rowData.map((row, i, { length }) => (jsx(TableRow, { row: row, isFirstRow: i === 0, isLastRow: i + 1 === length, activeCardIndex: tableArrowScrollProps.activeCardIndex, isColoredFirstColumn: isColoredFirstColumn }, String(i)))), jsx(TableArrowScrollControl, { ...tableArrowScrollProps })] }));
     });
 
-    const ComparisonTableBody = JSX(({ context, columns, rowHeaders, isShowAllRow, visibleRowLength, isColoredFirstColumn }) => {
-        const router = context.useRouter();
-        const { handlerDecorator } = context;
+    const ComparisonTableBody = JSX(({ columns, rowHeaders, isShowAllRow, visibleRowLength, isColoredFirstColumn }) => {
         const colHeaders = columns?.map(({ header }) => header || {});
         const colData = columns?.map(({ data }) => data) || [];
         const rowData = rowHeaders
@@ -1339,34 +1338,29 @@
             data: colData.map((col) => col?.[i] || [{}]),
         }))
             .slice(0, isShowAllRow ? rowHeaders.length : visibleRowLength);
-        const [activeCardIndex, setActiveCardIndex] = useState(0);
         const tableArrowScrollProps = useTableArrowScrollControl({
             columnsLength: colData.length,
             colsLengthForScroll: COLS_LENGTH_FOR_SCROLL$1,
-            activeCardIndex,
-            setActiveCardIndex,
         });
-        const { isScrollAvailable } = tableArrowScrollProps;
-        return (jsxs("div", { children: [jsxs("div", { role: "table", children: [colHeaders?.length ? (jsx(ComparisonTableColumnHeaders, { colHeaders: colHeaders, activeCardIndex: activeCardIndex, router: router, handlerDecorator: handlerDecorator })) : null, rowData?.length ? (jsx(ComparisonTableRows, { rowData: rowData, activeCardIndex: activeCardIndex, isColoredFirstColumn: isColoredFirstColumn, ...tableArrowScrollProps })) : null] }), isScrollAvailable ? (jsx("div", { className: "absolute top-0 right-0 bottom-0 w-[84px] bg-opacity-to-white" })) : null] }));
+        const { activeCardIndex, isScrollAvailable } = tableArrowScrollProps;
+        return (jsxs("div", { children: [jsxs("div", { role: "table", children: [colHeaders?.length ? (jsx(ComparisonTableColumnHeaders, { colHeaders: colHeaders, activeCardIndex: activeCardIndex })) : null, rowData?.length ? (jsx(ComparisonTableRows, { rowData: rowData, isColoredFirstColumn: isColoredFirstColumn, ...tableArrowScrollProps })) : null] }), isScrollAvailable ? (jsx("div", { className: "absolute top-0 right-0 bottom-0 w-[84px] bg-opacity-to-white" })) : null] }));
     });
 
-    const ComparisonTable = JSX(({ className = '', context, title, rowHeaders, columns, visibleRowLength = 0, isColoredFirstColumn = false, ...rest }) => {
+    const ComparisonTable = JSX(({ className = '', title, rowHeaders, columns, visibleRowLength = 0, isColoredFirstColumn = false, ...rest }) => {
         const [isShowAllRow, setIsShowAllRow] = useState(!visibleRowLength);
-        const showToggle = () => setIsShowAllRow(!isShowAllRow);
-        return (jsxs(BlockWrapper, { context: context, className: `bg-white font-sans py-[50px] pl-[50px] overflow-hidden text-primary-text relative ${className}`, ...rest, children: [jsx(Heading, { headingType: "h2", className: "max-w-[47rem] text-center mb-9 mx-auto", title: title }), jsx(ComparisonTableBody, { context: context, columns: columns, rowHeaders: rowHeaders, isShowAllRow: isShowAllRow, isColoredFirstColumn: isColoredFirstColumn, visibleRowLength: visibleRowLength }), visibleRowLength
+        const showToggle = useCallback(() => setIsShowAllRow((_) => !_), []);
+        return (jsxs(BlockWrapper, { className: `bg-white font-sans py-[50px] pl-[50px] overflow-hidden text-primary-text relative ${className}`, ...rest, children: [jsx(Heading, { headingType: "h2", className: "max-w-[47rem] text-center mb-9 mx-auto", title: title }), jsx(ComparisonTableBody, { columns: columns, rowHeaders: rowHeaders, isShowAllRow: isShowAllRow, isColoredFirstColumn: isColoredFirstColumn, visibleRowLength: visibleRowLength }), visibleRowLength
                     ? renderShowMoreToggleButton({ isShowAllRow, onClick: showToggle })
                     : null] }));
     });
-    const renderShowMoreToggleButton = ({ isShowAllRow, onClick, }) => {
-        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-3", children: !isShowAllRow ? 'Показать все параметры' : 'Скрыть' }) })] }) }));
-    };
+    const renderShowMoreToggleButton = ({ isShowAllRow, onClick, }) => (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-3", children: !isShowAllRow ? 'Показать все параметры' : 'Скрыть' }) })] }) }));
 
     const contactsBlockStyleMap = {
         primary: 'bg-white',
         secondary: 'bg-primary-main text-white',
     };
-    const ContactsBlock = JSX(({ className = '', contacts, context, info, version = 'secondary', ...rest }) => {
-        return (jsxs(BlockWrapper, { context: context, className: `${contactsBlockStyleMap[version]} flex p-12 ${className}`, ...rest, children: [info ? renderInfo(info) : null, contacts ? renderContacts(contacts) : null] }));
+    const ContactsBlock = JSX(({ className = '', contacts, info, version = 'secondary', ...rest }) => {
+        return (jsxs(BlockWrapper, { className: `${contactsBlockStyleMap[version]} flex p-12 ${className}`, ...rest, children: [info ? renderInfo(info) : null, contacts ? renderContacts(contacts) : null] }));
     });
     const renderInfo = (info) => (jsx("div", { className: "flex grow basis-0 pr-11", children: info.map(({ title, description, button }, index) => (jsxs("div", { className: "grow basis-0 pr-11 last:pr-0", children: [jsx(Heading, { as: "h5", headingType: "h5", title: title, className: "pb-2.5" }), jsx(Description, { className: "text-l-light pb-6", description: description }), button ? jsx(Button, { ...button }) : null] }, String(index)))) }));
     const renderContacts = (contacts) => (jsx("div", { className: "flex grow basis-0", children: contacts.map((contactsColumn, index) => renderContactsColumn({ contactsColumn, index })) }));
@@ -1381,15 +1375,9 @@
         }
         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}`, 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 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 ErrorBlock = JSX(({ className = '', title, subtitle, error, button }) => (jsxs("section", { className: `flex flex-col justify-center items-center mt-12 ${className}`, 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 mb-7 max-w-[613px] text-center", children: subtitle })) : null, button?.text ? (jsx(Button, { className: "py-4 px-9", version: button?.version, ...button, children: button.text })) : null] })));
 
-    const BaseTile = JSX(({ className = '', title = '', children, buttons, image }) => {
-        return (jsxs("div", { className: `font-sans flex flex-col grow h-full items-start ${className}`, children: [title, jsxs("div", { className: "flex grow w-full justify-between", children: [jsxs("div", { className: "flex flex-col justify-between w-full", children: [jsx("div", { className: "h-full", children: children }), buttons ? jsx("div", { className: "mt-auto pt-8", children: buttons }) : null] }), image] })] }));
-    });
+    const BaseTile = JSX(({ className = '', title = '', buttons, image, children }) => (jsxs("div", { className: `font-sans flex flex-col grow h-full items-start ${className}`, children: [title, jsxs("div", { className: "flex grow w-full justify-between", children: [jsxs("div", { className: "flex flex-col justify-between w-full", children: [jsx("div", { className: "h-full", children: children }), buttons ? jsx("div", { className: "mt-auto pt-8", children: buttons }) : null] }), image] })] })));
 
     var Currency;
     (function (Currency) {
@@ -1501,9 +1489,7 @@
         return (jsxs("div", { className: "relative flex", children: [jsx(Input, { className: "shrink-0 text-l w-full appearance-none mr-[-90px]", placeholder: placeholder, type: "text", value: value, onChange: setValue }), ratesOptions.length ? (jsx(Select, { isBorder: false, onChange: (_) => setSelected(_.key), options: ratesOptions, value: selectedValue })) : null] }));
     }
 
-    const ExchangeCurrencyCalculator = JSX(({ context, className = '', currencyRatesBuy, currencyRatesSell, button }) => {
-        const { useRouter, handlerDecorator } = context;
-        const router = useRouter();
+    const ExchangeCurrencyCalculator = JSX(({ className = '', currencyRatesBuy, currencyRatesSell, button }) => {
         const [calcState, setCalcState] = useState({
             inputSell: '',
             inputBuy: '',
@@ -1527,7 +1513,7 @@
                     setSelected: handleSelectBuy(calcState, handleSetCalcState, currencyRatesBuy),
                     value: calcState.inputBuy,
                     setValue: (value) => handleInputBuy(handleSetCalcState, currencyRatesBuy)(value, calcState.selectBuy, calcState.selectSell),
-                }), button?.text ? (jsx(Button, { className: "py-4 mr-1", version: button?.version, ...useLink({ router, handlerDecorator }, button), children: button.text })) : null] }));
+                }), button?.text ? (jsx(Button, { className: "py-4 mr-1", version: button?.version, ...button, children: button.text })) : null] }));
     });
     const handleSelectSell = (calcState, setCalcState, currencyRatesSell) => (value) => {
         setCalcState({ selectSell: value });
@@ -1601,19 +1587,26 @@
         }
     };
 
-    const ExchangeRateTile = JSX(({ className = '', context, title = 'Курсы обмена валют', button, ...rest }) => {
+    const ExchangeRateTile = JSX(({ className = '', title = 'Курсы обмена валют', button, ...rest }) => {
         const { exchangeRates } = useFetchExchangeRateData();
         const currencyRates = getCurrencyRates(exchangeRates?.exchangeRate?.currencies);
         const currencyRatesBuy = currencyRates.filter((_) => _.buyExchangeRate);
         currencyRatesBuy.unshift({ currency: { currency: Currency.RUB } });
         const currencyRatesSell = currencyRates.filter((_) => _.saleExchangeRate);
         currencyRatesSell.push({ currency: { currency: Currency.RUB } });
-        return (jsx(BlockWrapper, { context: context, className: `bg-white text-primary-text font-sans p-9 box-border min-h-[320px] ${className}`, ...rest, children: jsx(BaseTile, { context: context, title: jsx(Heading, { headingType: "h4", title: title, className: "whitespace-pre-wrap text-h4 mb-5" }), children: jsxs("div", { className: "flex", children: [jsxs("div", { className: "mr-14 pt-4", children: [currencyRates ? (jsx(CurrencyTable, { className: "mb-[30px]", exchangeCurrencyItems: currencyRates })) : null, jsx(CurrentLocation, { address: exchangeRates?.address })] }), currencyRates.length && currencyRatesBuy.length && currencyRatesSell.length ? (jsx(ExchangeCurrencyCalculator, { className: "grow", context: context, currencyRatesBuy: currencyRatesBuy, currencyRatesSell: currencyRatesSell, button: button })) : null] }) }) }));
+        return (jsx(BlockWrapper, { className: `bg-white text-primary-text font-sans p-9 box-border min-h-[320px] ${className}`, ...rest, children: jsx(BaseTile, { title: jsx(Heading, { headingType: "h4", title: title, className: "whitespace-pre-wrap text-h4 mb-5" }), children: jsxs("div", { className: "flex", children: [jsxs("div", { className: "mr-14 pt-4", children: [currencyRates ? (jsx(CurrencyTable, { className: "mb-[30px]", exchangeCurrencyItems: currencyRates })) : null, jsx(CurrentLocation, { address: exchangeRates?.address })] }), currencyRates.length && currencyRatesBuy.length && currencyRatesSell.length ? (jsx(ExchangeCurrencyCalculator, { className: "grow", currencyRatesBuy: currencyRatesBuy, currencyRatesSell: currencyRatesSell, button: button })) : null] }) }) }));
     });
     const getCurrencyRates = (currencies) => {
         return currencies?.filter((_) => _?.currency?.id === 1 || _?.currency?.id === 2) || [];
     };
 
+    function useSWRResource(fileName, fallback = {}) {
+        const { data } = useAsyncData(`/wcms-resources/${fileName}.json`, fetchJSONUnsafe, {
+            fallback,
+        });
+        return data || {};
+    }
+
     const ICON_VERSION_MAP = {
         'bg-white': 'color',
         transparent: 'white',
@@ -1658,19 +1651,9 @@
                     }, children: jsx("div", { className: "text-s px-9 py-2.5", children: "\u041D\u0430\u0439\u0442\u0438" }) }))] }));
     });
 
-    const SearchBar = JSX(({ className = '' }) => {
-        return jsx(SearchBarInner, { className: className });
-    });
+    const SearchBar = JSX((props) => jsx(SearchBarInner, { ...props }));
 
-    const Contacts = JSX(({ className = '', items, hasButton, context }) => {
-        const router = context.useRouter();
-        const { handlerDecorator } = context;
-        return (jsxs("div", { className: className, children: [items?.length ? items.map(renderContact) : null, hasButton ? (jsx(Button, { version: "primary", className: "mb-6 w-full", ...useLink({ router, handlerDecorator }, {
-                        text: 'Обратная связь',
-                        href: '/',
-                        target: '_blank',
-                    }), ariaLabel: "\u041E\u0431\u0440\u0430\u0442\u043D\u0430\u044F \u0441\u0432\u044F\u0437\u044C" })) : null] }));
-    });
+    const Contacts = JSX(({ className = '', items, hasButton }) => (jsxs("div", { className: className, children: [items?.length ? items.map(renderContact) : null, hasButton ? (jsx(Button, { version: "primary", className: "mb-6 w-full", href: "/", target: "_blank", ariaLabel: "\u041E\u0431\u0440\u0430\u0442\u043D\u0430\u044F \u0441\u0432\u044F\u0437\u044C", text: "\u041E\u0431\u0440\u0430\u0442\u043D\u0430\u044F \u0441\u0432\u044F\u0437\u044C" })) : null] })));
     const renderContact = (item, index) => {
         const { type, text, description } = item;
         return (jsxs("div", { className: "mb-4", children: [jsx("div", { children: renderText(type, text) }), jsx("div", { className: "mt-1 text-s-light text-secondary-text", children: description })] }, String(index)));
@@ -1687,12 +1670,14 @@
     };
     const formatTel = (s) => s.replaceAll(/\D/g, '');
 
-    const HorizontalNavigationLink = JSX(({ className = '', index, text, href, target, onClick }) => (jsx("a", { className: `text-secondary-text hover:text-primary-main inline-block no-underline ${className}`, href: href, target: target, onClick: onClick, children: text || `Документ ${index}` })));
+    const HorizontalNavigationLink = JSX(({ className = '', index, text, ...rest }) => {
+        const link = useLink();
+        const { href, target, onClick } = link(rest);
+        return (jsx("a", { className: `text-secondary-text hover:text-primary-main inline-block no-underline ${className}`, href: href, target: target, onClick: onClick, children: text || `Документ ${index}` }));
+    });
 
-    const HorizontalNavigation = JSX(({ links, className = '', context }) => {
-        const router = context.useRouter();
-        const { handlerDecorator } = context;
-        return (jsx("div", { className: className, children: links?.length ? (jsx("div", { className: "flex justify-between items-center gap-5 py-5 border-solid border-x-0 border-y border-y-main-divider", children: links.map((_, i) => (jsx(HorizontalNavigationLink, { index: i, className: "text-l-light max-w-[292px]", ...useLink({ router, handlerDecorator }, _) }, String(i)))) })) : null }));
+    const HorizontalNavigation = JSX(({ className = '', links }) => {
+        return (jsx("div", { className: className, children: links?.length ? (jsx("div", { className: "flex justify-between items-center gap-5 py-5 border-solid border-x-0 border-y border-y-main-divider", children: links.map((_, i) => (jsx(HorizontalNavigationLink, { index: i, className: "text-l-light max-w-[292px]", ..._ }, String(i)))) })) : null }));
     });
 
     const cmp = (a) => (b) => a?.href === b?.href;
@@ -1700,25 +1685,21 @@
     const subtract = (minuend, subtrahend) => (minuend || []).filter((_) => !subtrahend?.find(cmp(_)));
     const mergeTopItems = (left, right) => substitute(left, right).concat(subtract(right, left));
 
-    function useSitemap(fallback = {}) {
-        const { data } = useAsyncData(`/wcms-resources/${projectSettings.SITEMAP || 'sitemap'}.json`, fetchJSONUnsafe, { fallback });
-        return data || {};
-    }
-
-    const Sitemap = JSX(({ className = '', items, fallback, context }) => {
-        const sitemap = useSitemap(fallback);
+    const Sitemap = JSX(({ className = '', items, fallback }) => {
+        const link = useLink();
+        const sitemap = useSWRResource(projectSettings.SITEMAP || 'sitemap', fallback);
         const mergedItems = mergeTopItems(sitemap.topItems, items);
-        const linkParams = {
-            router: context.useRouter(),
-            handlerDecorator: context.handlerDecorator,
-        };
-        return (jsx("div", { className: `flex flex-grow items-start justify-between gap-[54px] xl:gap-5 ${className}`, children: mergedItems?.map((_, i) => renderColumn({ menuItem: _, index: i, ...linkParams })) }));
+        return (jsx("div", { className: `flex flex-grow items-start justify-between gap-[54px] xl:gap-5 ${className}`, children: mergedItems?.map((_, i) => renderColumn(link(_), i)) }));
     });
-    const renderColumn = ({ menuItem, index, router, handlerDecorator }) => {
-        const { text, href, items, target } = menuItem;
-        return (jsxs("div", { className: "flex flex-col w-1/5 last:w-1/4 gap-3.5", children: [jsx("a", { className: "block leading-5 text-l text-primary-text hover:text-primary-main no-underline", href: href, target: target || '_self', children: text || `Раздел ${index}` }), items?.map((_, i) => (jsx(ColumnItem, { ...useLink({ router, handlerDecorator }, _), index: i }, String(i))))] }, String(index)));
+    const renderColumn = (menuItem, index) => {
+        const { text, items, href, target, onClick } = menuItem;
+        return (jsxs("div", { className: "flex flex-col w-1/5 last:w-1/4 gap-3.5", children: [jsx("a", { className: "block leading-5 text-l text-primary-text hover:text-primary-main no-underline", href: href, target: target || '_self', onClick: onClick, children: text || `Раздел ${index}` }), items?.map((_, i) => (jsx(ColumnItem, { ..._, index: i }, String(i))))] }, String(index)));
     };
-    const ColumnItem = JSX(({ text, href, target, index }) => (jsx("a", { className: "block text-l-light text-secondary-text hover:text-primary-main no-underline", href: href, target: target || '_self', children: text || `Раздел ${index}` })));
+    const ColumnItem = JSX(({ text, index, ...rest }) => {
+        const link = useLink();
+        const { href, target, onClick } = link(rest);
+        return (jsx("a", { className: "block text-l-light text-secondary-text hover:text-primary-main no-underline", href: href, target: target || '_self', onClick: onClick, children: text || `Раздел ${index}` }));
+    });
 
     const ICONS_MAP = [
         {
@@ -1747,7 +1728,9 @@
             label: 'Google Play',
         },
     ];
-    const MediaButton = JSX(({ href, version = 'primary' }) => {
+    const MediaButton = JSX(({ version = 'primary', ...rest }) => {
+        const link = useLink();
+        const { href, onClick } = link(rest);
         const { icon, label } = ICONS_MAP.find(({ origins }) => origins.some((_) => href?.includes(_))) || {};
         if (!icon) {
             return null;
@@ -1756,27 +1739,24 @@
             ? 'bg-white hover:bg-secondary-hover'
             : 'border-solid border-[1px] border-main-divider hover:border-transparent hover:bg-primary-main';
         const isPrimary = version === 'primary';
-        return (jsx("a", { className: `flex items-center justify-center rounded-md w-14 h-14 group box-border ${classes} ${isPrimary ? 'hover:text-black' : ''}`, href: href, "aria-label": label, target: "_blank", rel: "noopener noreferrer", children: icon ? (jsx(ImgInner, { image: getIconWithVersion(icon), imageClassName: "group-hover:text-white", width: "24", height: "24", asSVG: true })) : null }));
+        return (jsx("a", { className: `flex items-center justify-center rounded-md w-14 h-14 group box-border ${classes} ${isPrimary ? 'hover:text-black' : ''}`, href: href, "aria-label": label, target: "_blank", rel: "noopener noreferrer", onClick: onClick, children: icon ? (jsx(ImgInner, { image: getIconWithVersion(icon), imageClassName: "group-hover:text-white", width: "24", height: "24", asSVG: true })) : null }));
     });
 
-    const SocialMedia = JSX(({ className = '', media, version, context, children }) => {
-        const router = context.useRouter();
-        const { handlerDecorator } = context;
-        return (jsxs("div", { className: "font-sans", children: [jsx("div", { className: `flex gap-2.5 ${className}`, children: media?.map((_, index) => (jsx(MediaButton, { version: version, ...useLink({ router, handlerDecorator }, _) }, String(index)))) }), jsx("span", { className: "text-s-light text-secondary-text", children: children })] }));
-    });
-
-    const TextInformationLink = JSX(({ className = '', index, text, href, target, onClick }) => (jsx("a", { className: `text-xs-light text-secondary-text visited:text-secondary-text hover:text-primary-main inline-block no-underline max-w-[292px] ${className}`, href: href, target: target, onClick: onClick, children: text || `Документ ${index}` })));
+    const SocialMedia = JSX(({ className = '', media, version, children }) => (jsxs("div", { className: "font-sans", children: [jsx("div", { className: `flex gap-2.5 ${className}`, children: media?.map((_, index) => (jsx(MediaButton, { version: version, ..._ }, String(index)))) }), jsx("span", { className: "text-s-light text-secondary-text", children: children })] })));
 
-    const TextInformation = JSX(({ className, links, context }) => {
-        const router = context.useRouter();
-        const { handlerDecorator } = context;
-        return (jsxs("div", { className: `${className || ''}`, children: [jsx("div", { className: "pt-5", children: jsx("span", { className: "text-xs-light text-secondary-text", children: `\u00a9\u00A02000-${new Date().getFullYear()}\u00A0АО \u00ABРоссельхозбанк\u00BB Генеральная лицензия Банка России \u2116\u00A03349 от\u00A012.08.2015\u00A0г.` }) }), links?.length ? (jsx("div", { className: "flex justify-start items-start gap-5 pt-2.5", children: links.map((_, i) => (jsx(TextInformationLink, { index: i, ...useLink({ router, handlerDecorator }, _) }, String(i)))) })) : null] }));
+    const TextInformationLink = JSX(({ className = '', index, ...rest }) => {
+        const link = useLink();
+        const { href, target, text, onClick } = link(rest);
+        return (jsx("a", { className: `text-xs-light text-secondary-text visited:text-secondary-text hover:text-primary-main inline-block no-underline max-w-[292px] ${className}`, href: href, target: target, onClick: onClick, children: text || `Документ ${index}` }));
     });
 
+    const TextInformation = JSX(({ className = '', links }) => (jsxs("div", { className: className, children: [jsx("div", { className: "pt-5", children: jsx("span", { className: "text-xs-light text-secondary-text", children: `\u00a9\u00A02000-${new Date().getFullYear()}\u00A0АО \u00ABРоссельхозбанк\u00BB Генеральная лицензия Банка России \u2116\u00A03349 от\u00A012.08.2015\u00A0г.` }) }), links?.length ? (jsx("div", { className: "flex justify-start items-start gap-5 pt-2.5", children: links.map((_, i) => (jsx(TextInformationLink, { index: i, ..._ }, String(i)))) })) : null] })));
+
     const LEFT_COL_WIDTH_FULL_HD = 'w-[204px]';
-    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 Footer = JSX(({ className, ...rest }) => {
+        const fallback = rest.page?.fallback;
+        const { documents, relatedEnterprises, contacts, socialMedia, mobileApps, topItems } = useSWRResource(projectSettings.FOOTER || 'footer', fallback);
+        return (jsxs(BlockWrapper, { tag: "footer", 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, { 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, hasButton: true }), jsx(SocialMedia, { media: socialMedia, children: "\u0421\u043E\u0446\u0441\u0435\u0442\u0438" }), jsx(SocialMedia, { className: "mt-6", media: mobileApps, 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]", items: topItems, fallback: fallback })] }), jsx(HorizontalNavigation, { className: "mt-[98px]", links: relatedEnterprises }), jsx(TextInformation, { links: documents })] }));
     });
 
     const galleryLengthForScrollMap = {
@@ -1838,15 +1818,15 @@
     const renderAdditionalDescription$1 = (additionalDescription) => additionalDescription ? (jsx("div", { className: "text-m-light text-secondary-text mt-auto", children: additionalDescription })) : null;
     const renderItems$1 = (items, isDotted, version = 'primary') => (jsx(List, { className: `max-w-[308px] mt-2 text-s ${version === 'primary' ? '!text-secondary-text' : ''}`, itemClassName: "text-left", items: items.filter((item) => item?.text).map((item) => item.text), isDotted: isDotted, version: version }));
 
-    const GalleryContainer = JSX(({ context, title, headlineVersion = 'M', description, cards = [], version = 'normal', activeCardIndex, }) => {
-        return (jsxs("div", { children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: description, headlineVersion: headlineVersion, align: "center" }), jsx("div", { className: `flex mt-8 ${cards?.length <= galleryLengthForScrollMap[version] ? 'justify-center' : ''} duration-1000`, style: { transform: `translateX(-${activeCardIndex * cardWidthMap[version]}px)` }, role: "list", children: cards?.map((card, i) => renderCard({ card, version, context }, i)) })] }));
+    const GalleryContainer = JSX(({ headlineVersion = 'M', cards = [], version = 'normal', activeCardIndex, ...rest }) => {
+        return (jsxs("div", { children: [jsx(Headline, { ...rest, className: "!p-0", headlineVersion: headlineVersion, align: "center" }), jsx("div", { className: `flex mt-8 ${cards?.length <= galleryLengthForScrollMap[version] ? 'justify-center' : ''} duration-1000`, style: { transform: `translateX(-${activeCardIndex * cardWidthMap[version]}px)` }, role: "list", children: cards?.map((card, i) => renderCard({ card, version }, i)) })] }));
     });
     function renderCard({ card, version }, i) {
         return (jsx("section", { className: `box-border border-solid border border-main-stroke p-6 mx-2 flex flex-col justify-between
         items-stretch ${cardStyleMap[version]} ${VersionStyleMap[card.version ?? 'primary']} w-full col-span-4`, role: "listitem", children: jsx(GalleryCardInner, { ...card }) }, String(i)));
     }
 
-    const GalleryInner = JSX(({ context, cards = [], className = '', version = 'normal', button, ...rest }) => {
+    const GalleryInner = JSX(({ cards = [], className = '', version = 'normal', button, ...rest }) => {
         const [activeCardIndex, setActiveCardIndex] = useState(0);
         const handleNextClick = () => setActiveCardIndex(activeCardIndex + 1);
         const handlePrevClick = () => setActiveCardIndex(activeCardIndex - 1);
@@ -1854,7 +1834,7 @@
         const showNextButton = isGalleryScrollAvailable &&
             cards?.length - activeCardIndex > galleryLengthForScrollMap[version];
         const showPrevButton = isGalleryScrollAvailable && activeCardIndex > 0;
-        return (jsxs(BlockWrapper, { context: context, className: `relative font-sans text-primary-text bg-white p-[42px] overflow-hidden flex flex-col ${className}`, ...rest, children: [jsx(GalleryContainer, { context: context, cards: cards, version: version, activeCardIndex: activeCardIndex, ...rest }), renderArrows({
+        return (jsxs(BlockWrapper, { className: `relative font-sans text-primary-text bg-white p-[42px] overflow-hidden flex flex-col ${className}`, ...rest, children: [jsx(GalleryContainer, { cards: cards, version: version, activeCardIndex: activeCardIndex, ...rest }), renderArrows({
                     handler: [handlePrevClick, handleNextClick],
                     isShown: [showPrevButton, showNextButton],
                     btnClass: ['left-8', 'right-8'],
@@ -1864,9 +1844,7 @@
 
     const Gallery = JSX((props) => jsx(GalleryInner, { ...props, version: "normal" }));
 
-    const GracePeriod = JSX(({ context, className = '', title, description, calendar, ...rest }) => {
-        return (jsxs(BlockWrapper, { className: `font-sans bg-white p-[50px] ${className}`, context: context, ...rest, children: [jsx(Headline, { context: context, className: "!p-0 mb-4", title: title, description: description, headlineVersion: "M", align: "center" }), calendar ? renderCalendar(calendar) : null] }));
-    });
+    const GracePeriod = JSX(({ className = '', title, description, calendar, ...rest }) => (jsxs(BlockWrapper, { className: `font-sans bg-white p-[50px] ${className}`, ...rest, children: [jsx(Headline, { className: "!p-0 mb-4", title: title, description: description, headlineVersion: "M", align: "center", ...rest }), calendar ? renderCalendar(calendar) : null] })));
     const renderCalendar = (calendar) => {
         const colCount = calendar.reduce((accumulator, currentValue) => currentValue?.month?.length ? accumulator + currentValue.month.length : accumulator, 0) || 1;
         const colSize = 100 / colCount;
@@ -1885,7 +1863,7 @@
     const checkIsHrefSameOrigin = (href, router) => getOrigin(href) === getOrigin(router.href);
 
     const isHrefActive = (href, router, cmp = (targetHref, baseHref) => baseHref.startsWith(targetHref)) => {
-        return cmp(withoutQuery(href), withoutMobilePath(withoutQuery(isURL(href) ? router.href : router.pathname)));
+        return cmp(withoutQuery(href), withoutQuery(isURL(href) ? router.href : router.pathname));
     };
 
     const isSubItemActive = (router) => (subItem) => isHrefActive(subItem.href, router);
@@ -1896,7 +1874,11 @@
 
     const TEXT_CLASSES$2 = 'font-sans text-s-light';
     const LINK_CLASSES$1 = 'inline-block border border-solid bg-transparent text-center no-underline';
-    const TopItem = JSX(({ className = '', text, href, target, active, flat, onClick, children, ariaLabel, bgColor = 'bg-white', }) => (jsx("a", { className: `${getLinkClasses(bgColor, active, flat)} ${className}`, href: href, target: target, onClick: onClick, rel: "noopener noreferrer", "aria-label": ariaLabel, children: jsx("span", { className: getTextClasses$1(bgColor, active, flat), children: text || children }) })));
+    const TopItem = JSX(({ className = '', active, flat, ariaLabel, bgColor = 'bg-white', children, ...rest }) => {
+        const link = useLink();
+        const { href, target, text, onClick } = link(rest);
+        return (jsx("a", { className: `${getLinkClasses(bgColor, active, flat)} ${className}`, href: href, target: target, onClick: onClick, rel: "noopener noreferrer", "aria-label": ariaLabel, children: jsx("span", { className: getTextClasses$1(bgColor, active, flat), children: text || children }) }));
+    });
     const getLinkClasses = (bgColor, active = false, flat = false) => {
         let classes = 'border-transparent';
         if (active) {
@@ -1960,20 +1942,23 @@
         'bg-white': 'bg-primary-text',
         transparent: 'bg-white',
     };
-    const DropdownMenu = JSX(({ context, className, items, activeItem, bgColor }) => {
-        const { useRouter, handlerDecorator } = context;
-        const router = useRouter();
+    const DropdownMenu = JSX(({ className, items, activeItem, bgColor }) => {
+        const link = useLink();
         const [visible, setVisible] = useState(false);
         const handleToggle = useCallback(() => setVisible((_) => !_), []);
         const handleClickOutside = useCallback(() => setVisible(false), []);
         const ref = useOutsideClick(handleClickOutside);
-        return (jsxs("div", { className: `${visible ? 'bg-white rounded-md shadow-blue-gray/24' : ''} ${className || ''}`, ref: ref, children: [jsx("button", { className: "flex justify-between items-center cursor-pointer h-6 ml-6", "aria-label": `${visible ? 'Скрыть другие разделы' : 'Показать другие разделы'}`, onClick: handleToggle, children: Array(3).fill(bgColor).map(renderDot) }), jsx("div", { className: `flex flex-col rounded-md bg-white p-6 pb-2 ${visible ? '' : 'hidden'}`, "aria-hidden": !visible, children: items?.map((item, i) => (jsx("a", { className: `text-l-light pb-4 hover:text-primary-main ${item === activeItem ? 'text-primary-main' : ''}`, ...useLink({ router, handlerDecorator }, item), children: item.text }, item.href || String(i)))) })] }));
+        return (jsxs("div", { className: `${visible ? 'bg-white rounded-md shadow-blue-gray/24' : ''} ${className || ''}`, ref: ref, children: [jsx("button", { className: "flex justify-between items-center cursor-pointer h-6 ml-6", "aria-label": `${visible ? 'Скрыть другие разделы' : 'Показать другие разделы'}`, onClick: handleToggle, children: Array(3).fill(bgColor).map(renderDot) }), jsx("div", { className: `flex flex-col rounded-md bg-white p-6 pb-2 ${visible ? '' : 'hidden'}`, "aria-hidden": !visible, children: items?.map((item, i) => (jsx("a", { className: `text-l-light pb-4 hover:text-primary-main ${item === activeItem ? 'text-primary-main' : ''}`, ...link(item), children: item.text }, item.href || String(i)))) })] }));
     });
     const renderDot = (bgColor, i) => (jsx("div", { className: `w-[3px] h-[3px] rounded mr-1 ${DOT_BG_COLORS_MAP[bgColor]}` }, String(i)));
 
     const TEXT_CLASSES$1 = 'font-sans text-l-light';
     const BORDER_CLASSES = 'absolute left-0 -bottom-3 w-full h-[2px]';
-    const HeaderItem = JSX(({ className = '', text, href, target, active, bgColor = 'bg-white', dataItemName, children, onClick, }) => (jsxs("a", { className: `relative inline-block bg-transparent text-center no-underline ${className}`, href: href, target: target, "data-item-name": dataItemName, onClick: onClick, children: [jsx("span", { className: getTextClasses(bgColor, active), children: text || children }), active ? jsx("div", { className: getBorderClasses(bgColor, active) }) : null] })));
+    const HeaderItem = JSX(({ className = '', active, bgColor = 'bg-white', dataItemName, children, ...rest }) => {
+        const link = useLink();
+        const { href, target, text, onClick } = link(rest);
+        return (jsxs("a", { className: `relative inline-block bg-transparent text-center no-underline ${className}`, href: href, target: target, "data-item-name": dataItemName, onClick: onClick, children: [jsx("span", { className: getTextClasses(bgColor, active), children: text || children }), active ? jsx("div", { className: getBorderClasses(bgColor, active) }) : null] }));
+    });
     const getTextClasses = (bgColor, active = false) => {
         let classes = 'text-white';
         if (bgColor === 'bg-white') {
@@ -1988,9 +1973,7 @@
         return `${bgColor === 'bg-white' ? 'bg-primary-main' : bgColor} ${BORDER_CLASSES}`;
     };
 
-    const HeaderSubMenuItem = JSX(({ context, className, active, bgColor, observerOptions, onVisibilityChange, children, ...linkProps }) => {
-        const { handlerDecorator } = context;
-        const router = context.useRouter();
+    const HeaderSubMenuItem = JSX(({ className, active, bgColor, observerOptions, onVisibilityChange, children, ...linkProps }) => {
         const observerCallback = useCallback((entries) => {
             if (!entries.length || !onVisibilityChange) {
                 return;
@@ -2000,11 +1983,11 @@
             onVisibilityChange(entry.isIntersecting);
         }, [onVisibilityChange]);
         const ref = useIntersectionObserver(observerCallback, observerOptions);
-        return (jsx("span", { ref: ref, children: jsx(HeaderItem, { className: className, active: active, bgColor: bgColor, ...useLink({ router, handlerDecorator }, linkProps), children: children }) }));
+        return (jsx("span", { ref: ref, children: jsx(HeaderItem, { className: className, active: active, bgColor: bgColor, ...linkProps, children: children }) }));
     });
 
-    const HeaderSubMenu = JSX(({ context, subItems = [], bgColor }) => {
-        const router = context.useRouter();
+    const HeaderSubMenu = JSX(({ subItems = [], bgColor }) => {
+        const router = useRouter();
         const activeSubItem = findActiveSubItem(router)(subItems);
         const [visibleItemsCount, setVisibleItemsCount] = useState(subItems.length);
         const dropDownMenuItems = subItems.slice(visibleItemsCount);
@@ -2015,7 +1998,7 @@
                 ? handleIntersectionActivation(index)
                 : handleIntersectionDeactivation(index));
         }), [subItems]);
-        return (jsxs("nav", { className: "relative mt-6", children: [jsx("div", { ref: subItemsListRef, className: "overflow-hidden whitespace-nowrap mr-52 pb-3", children: subItems.map((_, i) => (jsx(HeaderSubMenuItem, { context: context, className: `mr-8 ${visibleItemsCount - 1 < i ? 'invisible' : ''}`, active: _ === activeSubItem, bgColor: bgColor, observerOptions: observerOptions, onVisibilityChange: subItemsVisibilityHandlers[i], ..._ }, String(i)))) }), dropDownMenuItems.length ? (jsx(DropdownMenu, { context: context, className: "absolute w-52 -top-4 right-0 pt-4 z-40", items: dropDownMenuItems, activeItem: activeSubItem, bgColor: bgColor })) : null] }));
+        return (jsxs("nav", { className: "relative mt-6", children: [jsx("div", { ref: subItemsListRef, className: "overflow-hidden whitespace-nowrap mr-52 pb-3", children: subItems.map((_, i) => (jsx(HeaderSubMenuItem, { className: `mr-8 ${visibleItemsCount - 1 < i ? 'invisible' : ''}`, active: _ === activeSubItem, bgColor: bgColor, observerOptions: observerOptions, onVisibilityChange: subItemsVisibilityHandlers[i], ..._ }, String(i)))) }), dropDownMenuItems.length ? (jsx(DropdownMenu, { className: "absolute w-52 -top-4 right-0 pt-4 z-40", items: dropDownMenuItems, activeItem: activeSubItem, bgColor: bgColor })) : null] }));
     });
     const handleIntersectionActivation = (index) => (prev) => Math.max(prev, index + 1);
     const handleIntersectionDeactivation = (index) => (prev) => Math.min(prev, index);
@@ -2024,14 +2007,12 @@
         'bg-white': 'bg-main-divider',
         transparent: 'bg-main-divider opacity-30',
     };
-    const Header = JSX(({ bgColor = 'bg-white', className = '', context, defaultLocation = 'Москва', logo, page, showSubMenu = true, ...rest }) => {
-        const router = context.useRouter();
-        const fallback = page?.fallback;
-        const { handlerDecorator } = context;
-        const { topItems } = useSitemap(fallback);
+    const Header = JSX(({ bgColor = 'bg-white', className = '', defaultLocation = 'Москва', logo, showSubMenu = true, ...rest }) => {
+        const router = useRouter();
+        const { topItems } = useSWRResource(projectSettings.SITEMAP || 'sitemap', rest.page?.fallback);
         const activeTopItem = showSubMenu ? getActiveItem(topItems, router) : null;
-        const topMenu = topItems?.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 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 topMenu = topItems?.map((_, i) => (jsx(TopItem, { active: _ === activeTopItem, "aria-label": _.text, bgColor: bgColor, ..._ }, String(i))));
+        return (jsx(BlockWrapper, { tag: "header", 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, { subItems: activeTopItem.items, bgColor: bgColor })) : null] }) }));
     });
     const getActiveItem = (topItems, router) => {
         const [firstPortal] = topItems || [];
@@ -2089,24 +2070,22 @@
         return isActive ? (jsx(ImgInner, { className: `h-6 w-6 min-w-6 min-h-6 absolute right-4 top-4`, image: "DoneIcon", width: "24", height: "24" })) : null;
     }
 
-    const InsuranceAmountBlock = JSX(({ className = '', context, title, insuranceTabs = [], button, ...rest }) => {
+    const InsuranceAmountBlock = JSX(({ className = '', title, insuranceTabs = [], button, ...rest }) => {
         const [activeSlideIndex, setActiveSlideIndex] = useState(0);
-        return (jsxs(BlockWrapper, { context: context, className: `box-border py-[50px] overflow-hidden relative font-sans w-100 bg-white ${className}`, ...rest, children: [title ? jsx(Heading, { className: "text-center mb-8", title: title, headingType: "h3" }) : null, insuranceTabs?.length > 1 ? (jsx("div", { className: "p-1.5 bg-secondary-light w-fit mx-auto mb-7 rounded-md", children: insuranceTabs.map((item, i) => renderNavButton$1({
+        return (jsxs(BlockWrapper, { className: `box-border py-[50px] overflow-hidden relative font-sans w-100 bg-white ${className}`, ...rest, children: [title ? jsx(Heading, { className: "text-center mb-8", title: title, headingType: "h3" }) : null, insuranceTabs?.length > 1 ? (jsx("div", { className: "p-1.5 bg-secondary-light w-fit mx-auto mb-7 rounded-md", children: insuranceTabs.map((item, i) => renderNavButton$1({
                         title: item?.title,
                         i,
                         activeSlideIndex,
                         onClick: () => setActiveSlideIndex(i),
                     })) })) : null, jsx("div", { className: "flex", style: { transform: `translateX(-${activeSlideIndex}00%)` }, role: "list", children: renderInsuranceGalleries({
-                        context,
-                        className,
                         insuranceTabs,
                         button,
                     }) })] }));
     });
-    const renderInsuranceGalleries = ({ insuranceTabs, button, context, className = '', }) => {
+    const renderInsuranceGalleries = ({ insuranceTabs, button }) => {
         const insuranceGalleries = insuranceTabs?.map((_) => _.cards);
         return insuranceGalleries?.length
-            ? insuranceGalleries.map((cards, i) => (jsx(InsuranceAmountBlockInner, { context: context, className: className, button: button, cards: cards }, String(i))))
+            ? insuranceGalleries.map((cards, i) => (jsx(InsuranceAmountBlockInner, { button: button, cards: cards }, String(i))))
             : null;
     };
     function renderNavButton$1({ title, i, activeSlideIndex, onClick }) {
@@ -2135,12 +2114,12 @@
         XL: 'h-[204px]',
     };
     const InvestmentInfo = JSX((props) => {
-        const { context, className = '', items, isDotted, investmentZeroColumn, investmentColumns, ...rest } = props;
+        const { className = '', items, isDotted, investmentZeroColumn, investmentColumns, ...rest } = props;
         const colums = investmentColumns ? [...investmentColumns] : [];
         if (investmentZeroColumn) {
             colums.unshift(investmentZeroColumn);
         }
-        return (jsx(BlockWrapper, { className: `font-sans bg-white px-9 py-12 ${className}`, context: context, ...rest, children: jsxs("div", { className: "container text-m-light", children: [colums?.length ? (jsxs("div", { children: [jsxs("div", { className: "flex items-end relative pl-9 pr-5 text-white", children: [joinList(jsx("div", { className: "w-px h-4 bg-main-stroke" }))(colums.map(renderInvestmentColumn)), jsx("div", { className: "absolute right-[30px] w-px h-4 bg-main-stroke" })] }), jsx("div", { className: "border-t border-main-stroke -mt-2 ml-9 mr-8" }), jsx("div", { className: "flex justify-between text-primary-text mt-3 -mx-10", children: colums.map(renderInvestmentColumnTitle) })] })) : null, items?.length ? (jsx(List, { className: "mt-9 text-l-light max-w-[657px]", items: items, itemClassName: "mb-[7px]", isDotted: isDotted })) : null] }) }));
+        return (jsx(BlockWrapper, { className: `font-sans bg-white px-9 py-12 ${className}`, ...rest, children: jsxs("div", { className: "container text-m-light", children: [colums?.length ? (jsxs("div", { children: [jsxs("div", { className: "flex items-end relative pl-9 pr-5 text-white", children: [joinList(jsx("div", { className: "w-px h-4 bg-main-stroke" }))(colums.map(renderInvestmentColumn)), jsx("div", { className: "absolute right-[30px] w-px h-4 bg-main-stroke" })] }), jsx("div", { className: "border-t border-main-stroke -mt-2 ml-9 mr-8" }), jsx("div", { className: "flex justify-between text-primary-text mt-3 -mx-10", children: colums.map(renderInvestmentColumnTitle) })] })) : null, items?.length ? (jsx(List, { className: "mt-9 text-l-light max-w-[657px]", items: items, itemClassName: "mb-[7px]", isDotted: isDotted })) : null] }) }));
     });
     const renderInvestmentColumn = (column, i, arr) => {
         const isSecondColumn = i === 1;
@@ -2191,9 +2170,7 @@
         double: 'flex gap-x-5 gap-y-[26px] flex-wrap',
         single: 'flex gap-3.5 flex-col',
     };
-    const LinkDocs = JSX(({ context, className = '', title, description, align = 'center', documents, icon = { icon: 'DocIcon' }, columnsMode = 'double', ...rest }) => {
-        return (jsxs(BlockWrapper, { className: `font-sans text-primary-text p-[50px] bg-white ${className}`, context: context, ...rest, children: [jsx(Headline, { className: "!p-0", title: title, description: description, context: context, align: align, headlineVersion: "M", as: "h2" }), jsx(LinkDocsList, { className: `mt-8 ${linkColumnsModeStyleMap[columnsMode]}`, columnsMode: columnsMode, documents: documents, icon: icon })] }));
-    });
+    const LinkDocs = JSX(({ className = '', title, description, align = 'center', documents, icon = { icon: 'DocIcon' }, columnsMode = 'double', ...rest }) => (jsxs(BlockWrapper, { className: `font-sans text-primary-text p-[50px] bg-white ${className}`, ...rest, children: [jsx(Headline, { className: "!p-0", title: title, description: description, align: align, headlineVersion: "M", as: "h2", ...rest }), jsx(LinkDocsList, { className: `mt-8 ${linkColumnsModeStyleMap[columnsMode]}`, columnsMode: columnsMode, documents: documents, icon: icon })] })));
 
     const MiniGallery = JSX((props) => (jsx(GalleryInner, { ...props, version: "mini" })));
 
@@ -2216,15 +2193,15 @@
         }
     }
 
-    const MobileAppTile = JSX(({ className = '', context, title = 'Мобильное приложение', qr, buttons, version = 'primary', items, image, headingType = 'h4', alignTitle = 'left', description, ...rest }) => {
+    const MobileAppTile = JSX(({ className = '', title = 'Мобильное приложение', qr, buttons, version = 'primary', items, image, headingType = 'h4', alignTitle = 'left', description, ...rest }) => {
         const textColorClass = version === 'primary' ? 'text-primary-text' : '';
         const containerStyle = version === 'secondary' ? 'p-3.5 min-w-[120px]' : 'min-w-[92px]';
         const buttonsWithClass = buttons?.map((_) => ({ ..._, className: 'min-w-[168px]' }));
-        return (jsxs(BlockWrapper, { context: context, className: `flex justify-between font-sans p-9 box-border relative min-h-[320px]
+        return (jsxs(BlockWrapper, { className: `flex justify-between font-sans p-9 box-border relative min-h-[320px]
         ${getTileMinHeight(className)}
         ${VersionStyleMap[version]}
-        ${className}`, ...rest, children: [jsxs(BaseTile, { context: context, className: "z-10", title: title ? (jsx(Heading, { headingType: headingType, as: "h3", title: title, className: `whitespace-pre-wrap max-w-[509px] mb-6
-                  ${textColorClass} ${AlignText[alignTitle]}` })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttonsWithClass, className: "flex gap-4" })) : null, children: [renderDescription$1(description), jsxs("div", { className: "flex flex-1 items-center", children: [qr?.src ? (jsx("div", { className: `flex justify-center mr-5 bg-white rounded-md ${containerStyle}`, children: jsx(ImgInner, { className: "w-fit", image: qr }) })) : null, renderList$1(version, items)] })] }), image?.src ? (jsx("div", { className: "absolute right-0 bottom-0", children: jsx(ImgInner, { image: image }) })) : null] }));
+        ${className}`, ...rest, children: [jsxs(BaseTile, { className: "z-10", title: title ? (jsx(Heading, { headingType: headingType, as: "h3", title: title, className: `whitespace-pre-wrap max-w-[509px] mb-6
+                  ${textColorClass} ${AlignText[alignTitle]}` })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { buttons: buttonsWithClass, className: "flex gap-4", ...rest })) : null, children: [renderDescription$1(description), jsxs("div", { className: "flex flex-1 items-center", children: [qr?.src ? (jsx("div", { className: `flex justify-center mr-5 bg-white rounded-md ${containerStyle}`, children: jsx(ImgInner, { className: "w-fit", image: qr }) })) : null, renderList$1(version, items)] })] }), image?.src ? (jsx("div", { className: "absolute right-0 bottom-0", children: jsx(ImgInner, { image: image }) })) : null] }));
     });
     const renderList$1 = (version, items) => {
         return items?.length ? (jsx(List, { items: items, itemClassName: "text-l-light mb-2 last:mb-0", version: version })) : (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" }));
@@ -2485,6 +2462,25 @@
     const getArraySumAndAverage = (arr) => arr.reduce((a, b) => a + b) / arr.length;
     const normalizePoints = (points) => (points ? points.map((_) => _.coords) : null);
 
+    // Добавлено для проверки
+    const nearbyOffices = [
+        { title: 'Деловой центр', time: '1 мин', distance: '~30 м.', icon: 'MetroIcon' },
+        { title: 'Выставочная', time: '5 мин', distance: '~120 м.', icon: 'MetroIcon' },
+        { title: 'Деловой центр', time: '8 мин', distance: '~350 м.', icon: 'MetroIcon' },
+    ];
+
+    const renderCurrentDaySchedule = ({ lunchHour, status, workTime }) => {
+        const hasTime = /\d+/gi.test(lunchHour);
+        const lunchHourText = hasTime ? `Перерыв ${lunchHour}` : lunchHour;
+        return status ? (jsxs("div", { className: "flex", children: [jsx("div", { className: "p-3 border rounded-md text-m flex items-center cursor-pointer text-primary-main border-green-light mr-4", children: workTime ? workTime : null }), jsx("div", { className: "p-3 border rounded-md text-m flex items-center cursor-pointer text-golden border-golden", children: lunchHour ? lunchHourText : null })] })) : (jsx("div", { className: "flex", children: jsx("div", { className: "p-3 border rounded-md text-m flex items-center cursor-pointer text-error border-error", children: "\u0412\u044B\u0445\u043E\u0434\u043D\u043E\u0439" }) }));
+    };
+    const renderNearbyOffice = ({ icon, title, distance, time }, index) => (jsxs("div", { className: "flex mr-4", children: [jsx(Icon, { name: icon, width: "16", height: "16", asSVG: true, className: "mr-1" }), title ? jsxs("span", { className: "text-m", children: [title, "\u00A0"] }) : null, jsxs("span", { className: "text-m-light", children: [distance ? ` (${distance})` : null, time ? `, ${time}` : null] })] }, `nearbyOffice${index}`));
+    const renderDay = ({ title, status, workTime, lunchHour, description }, inx) => (jsxs("div", { className: "flex flex-col pb-3 border-b border-solid border-main-divider mb-3 last:border-0", children: [jsxs("div", { className: "flex justify-between items-center w-full pb-1 text-l text-primary-text", children: [jsx("div", { children: title }), status ? null : jsx("div", { className: "text-m-light text-error", children: "\u0412\u044B\u0445\u043E\u0434\u043D\u043E\u0439" }), status && workTime ? jsx("div", { children: workTime }) : null] }), status && lunchHour ? renderLunchHour(lunchHour) : null, description ? (jsx("div", { className: "pb-1 text-s-light text-secondary-text", children: description })) : null] }, `day${inx}`));
+    const renderLunchHour = (lunchHour) => {
+        const hasTime = /\d+/gi.test(lunchHour);
+        return hasTime ? (jsxs("div", { className: "flex justify-between items-center w-full pb-1 text-m-light text-error", children: [jsx("div", { children: "\u041F\u0435\u0440\u0435\u0440\u044B\u0432" }), jsx("div", { children: lunchHour })] })) : (jsx("div", { className: "flex justify-between items-center w-full pb-1 text-m-light text-primary-main", children: jsx("div", { children: lunchHour }) }));
+    };
+
     const OFFICE_MAP = {
         id: 123,
         branchType: {
@@ -2565,31 +2561,14 @@
         safeBoxCaseVolumes: null,
     };
 
-    // Добавлено для проверки
-    const nearbyOffices = [
-        { title: 'Деловой центр', time: '1 мин', distance: '~30 м.', icon: 'MetroIcon' },
-        { title: 'Выставочная', time: '5 мин', distance: '~120 м.', icon: 'MetroIcon' },
-        { title: 'Деловой центр', time: '8 мин', distance: '~350 м.', icon: 'MetroIcon' },
-    ];
-
-    const renderCurrentDaySchedule = ({ lunchHour, status, workTime }) => {
-        const hasTime = /\d+/gi.test(lunchHour);
-        const lunchHourText = hasTime ? `Перерыв ${lunchHour}` : lunchHour;
-        return status ? (jsxs("div", { className: "flex", children: [jsx("div", { className: "p-3 border rounded-md text-m flex items-center cursor-pointer text-primary-main border-green-light mr-4", children: workTime ? workTime : null }), jsx("div", { className: "p-3 border rounded-md text-m flex items-center cursor-pointer text-golden border-golden", children: lunchHour ? lunchHourText : null })] })) : (jsx("div", { className: "flex", children: jsx("div", { className: "p-3 border rounded-md text-m flex items-center cursor-pointer text-error border-error", children: "\u0412\u044B\u0445\u043E\u0434\u043D\u043E\u0439" }) }));
-    };
-    const renderNearbyOffice = ({ icon, title, distance, time }, index) => (jsxs("div", { className: "flex mr-4", children: [jsx(Icon, { name: icon, width: "16", height: "16", asSVG: true, className: "mr-1" }), title ? jsxs("span", { className: "text-m", children: [title, "\u00A0"] }) : null, jsxs("span", { className: "text-m-light", children: [distance ? ` (${distance})` : null, time ? `, ${time}` : null] })] }, `nearbyOffice${index}`));
-    const renderDay = ({ title, status, workTime, lunchHour, description }, inx) => (jsxs("div", { className: "flex flex-col pb-3 border-b border-solid border-main-divider mb-3 last:border-0", children: [jsxs("div", { className: "flex justify-between items-center w-full pb-1 text-l text-primary-text", children: [jsx("div", { children: title }), status ? null : jsx("div", { className: "text-m-light text-error", children: "\u0412\u044B\u0445\u043E\u0434\u043D\u043E\u0439" }), status && workTime ? jsx("div", { children: workTime }) : null] }), status && lunchHour ? renderLunchHour(lunchHour) : null, description ? (jsx("div", { className: "pb-1 text-s-light text-secondary-text", children: description })) : null] }, `day${inx}`));
-    const renderLunchHour = (lunchHour) => {
-        const hasTime = /\d+/gi.test(lunchHour);
-        return hasTime ? (jsxs("div", { className: "flex justify-between items-center w-full pb-1 text-m-light text-error", children: [jsx("div", { children: "\u041F\u0435\u0440\u0435\u0440\u044B\u0432" }), jsx("div", { children: lunchHour })] })) : (jsx("div", { className: "flex justify-between items-center w-full pb-1 text-m-light text-primary-main", children: jsx("div", { children: lunchHour }) }));
-    };
-
     const OFFICE_MAP_URL = '/api/v1/branches';
     // TODO: regionCode - внутренний идентификатор банка. Не соответствует государственной нумерации регионов РФ
     // TODO: Список регионов можно получить через api/v1/regions
     function useOfficeMap(regionCode) {
         const { data } = useAsyncData(regionCode ? `${OFFICE_MAP_URL}?regionCode=${regionCode}` : undefined, fetchOfficeMap);
-        return data;
+        console.warn('WARNING!!!  Hook useOfficeMap RETURN MOCK object for testing!');
+        console.log('Hook useOfficeMap get this data:', data);
+        return OFFICE_MAP;
     }
     const fetchOfficeMap = (url) => {
         if (!url) {
@@ -2599,7 +2578,10 @@
     };
 
     const OfficeMap = JSX(({ className = '' }) => {
-        const resultOfficeMap = useOfficeMap('063') || OFFICE_MAP;
+        // TODO: useOfficeMap endpoint had use /api/v1/branches. This endpoint now is`t correct/
+        // TODO: useOfficeMap has return MOCK OBJECT!
+        // TODO: Fix this when endpoint /api/v1/branches (or new endpoint) had returning right data
+        const resultOfficeMap = useOfficeMap('000');
         const { name, address, gpsLatitude, gpsLongitude, workSchedule } = resultOfficeMap;
         const { workingMonday, workingTuesday, workingWednesday, workingThursday, workingFriday, workingSaturday, workingSunday, } = workSchedule;
         const { workTime, lunchHour, workTimeSaturday, lunchHourSaturday } = workSchedule;
@@ -2629,12 +2611,10 @@
         return (jsxs("div", { className: `flex flex-col font-sans bg-white w-full ${className}`, children: [jsxs("div", { className: "flex flex-col px-12 pt-12", children: [jsxs("div", { className: "flex justify-between", children: [jsx("div", { className: "text-h2", children: name }), renderCurrentDaySchedule(currentWeekDay)] }), jsxs("div", { className: "flex text-l-light pt-4", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24", asSVG: true, className: "pr-1" }), address] }), jsx("div", { className: "flex pt-4", children: nearbyOffices.map(renderNearbyOffice) })] }), jsxs("div", { className: "flex justify-between pt-8", children: [jsx("div", { className: "flex-grow h-full w-full overflow-hidden", children: point ? jsx(YandexMap, { points: [point], className: "h-full" }) : null }), jsx("div", { className: "w-[434px] min-w-[434px] pl-9 pr-12 pb-14 flex flex-col", children: workScheduleWeek.map(renderDay) })] })] }));
     });
 
-    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 ? (jsx("ul", { className: "list-none m-0 p-0", children: servicesList.map(renderListItems) })) : null] }));
-    });
+    const OfficeServicesBlock = JSX(({ className = '', title, servicesList, ...rest }) => (jsxs(BlockWrapper, { 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 ? (jsx("ul", { className: "list-none m-0 p-0", children: servicesList.map(renderListItems) })) : null] })));
     const renderListItems = (itemList, i) => (jsxs("li", { className: "flex mb-5 last:mb-0 list-none", children: [itemList.icon ? (jsx(ImgInner, { className: "mr-3 min-w-6 min-h-6 w-6 h-6", width: "24", height: "24", asSVG: true, image: getIconWithVersion(itemList.icon) })) : null, itemList.label ? jsx("span", { className: "text-l-light", children: itemList.label }) : null] }, `list_item_${String(i)}`));
 
-    const OtherProducts = JSX(({ context, className = '', children, ...rest }) => (jsx(BlockWrapper, { context: context, className: `font-sans text-primary-text ${className}`, ...rest, children: children })));
+    const OtherProducts = JSX(({ className = '', children, ...rest }) => (jsx(BlockWrapper, { className: `font-sans text-primary-text ${className}`, ...rest, children: children })));
     OtherProducts.childrenTypes = ['OtherProductsItem'];
 
     function getParentBlockDef(ancestors, type) {
@@ -2701,9 +2681,7 @@
         return `w-[50px] h-[50px] min-w-[50px] rounded-full p-2.5 box-border flex items-center justify-center ${bgColorStyle}`;
     }
 
-    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-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(ImgInner, { 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(Number(sum), Number(monthLimit))] })] })] }));
-    });
+    const PictureText = JSX(({ className = '', title, description, image, benefits, version = 'primary', sum, monthLimit, directionRight = false, ...rest }) => (jsxs(BlockWrapper, { className: `relative font-sans py-12 px-24 ${VersionStyleMap[version]} ${className}`, ...rest, children: [jsx(Headline, { className: "!p-0", title: title, description: description, headlineVersion: "M", bgColorHeadline: version, align: "center", ...rest }), jsxs("div", { className: 'flex justify-center gap-[122px] mt-[30px]', children: [image?.src ? jsx(ImgInner, { 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(Number(sum), Number(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) {
         return sum || monthLimit ? (jsxs("div", { className: "bg-main-divider rounded-md flex mt-7 gap-6 px-5 py-4", children: [Number(sum) > 0 ? renderValueBlock('Страховая сумма:', sum, Boolean(monthLimit)) : null, Number(monthLimit) > 0
@@ -2742,8 +2720,8 @@
     }
 
     const GOLDEN_RATIO = 1.618;
-    const Placeholder = JSX(({ className, context, title, description = 'Блок в разработке...', ...rest }) => {
-        return (jsxs(BlockWrapper, { context: context, className: `bg-white text-primary-text font-sans p-9 box-border ${className} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: [jsx(Headline, { context: context, className: "!p-0 max-w-[600px]", title: title, description: description, headlineVersion: getTileHeadingType(className) }), jsx("figure", { className: "m-0 min-w-[80%]", children: renderShimmer() })] }));
+    const Placeholder = JSX(({ className, title, description = 'Блок в разработке...', ...rest }) => {
+        return (jsxs(BlockWrapper, { className: `bg-white text-primary-text font-sans p-9 box-border ${className} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: [jsx(Headline, { className: "!p-0 max-w-[600px]", title: title, description: description, headlineVersion: getTileHeadingType(className), ...rest }), jsx("figure", { className: "m-0 min-w-[80%]", children: renderShimmer() })] }));
     });
     const renderShimmer = (size = 3) => goldenSequence(100, size)
         .map((_) => Math.floor(_))
@@ -2751,24 +2729,26 @@
     const renderShimmerItem = (width, index) => (jsx("div", { style: { width: `${width || 100}%` }, className: "h-4 mt-2 bg-secondary-light" }, String(index)));
     const goldenSequence = (first, size) => [first].concat(size > 0 ? goldenSequence(first / GOLDEN_RATIO, size - 1) : []);
 
-    const Breadcrumb = JSX(({ text, href, target, onClick, className = '', children }) => href ? (jsx("a", { className: `no-underline ${className}`, href: href, target: target, onClick: onClick, children: jsx("span", { className: className, children: text || children }) })) : (jsx("span", { className: className, children: text || children })));
+    const Breadcrumb = JSX(({ className = '', children, ...props }) => {
+        const link = useLink();
+        const { text, href, target, onClick } = link(props);
+        return href ? (jsx("a", { className: `no-underline ${className}`, href: href, target: target, onClick: onClick, children: jsx("span", { className: className, children: text || children }) })) : (jsx("span", { className: className, children: text || children }));
+    });
 
     const renderBenefit$1 = (version = 'primary', benefitsVersion = 'normal') => ({ icon, label, description }, i) => (jsx(BenefitItem, { icon: icon, label: label, description: description, version: version, benefitsVersion: benefitsVersion }, String(i)));
 
-    const ProductBlockInner = JSX(({ className = '', context, title, headlineVersion = 'L', description, benefits, benefitsVersion, buttons, image, items, version = 'primary', isDotted = true, textBlockClassName = '', }) => {
+    const ProductBlockInner = JSX(({ className = '', title, headlineVersion = 'L', description, benefits, benefitsVersion, buttons, image, items, version = 'primary', isDotted = true, textBlockClassName = '', ...rest }) => {
         const benefitsCount = benefits?.filter((_) => _.label)?.length;
         const benefitsContainerStyles = getBenefitsContainerStyles(benefitsCount);
-        return (jsxs("div", { className: `flex grow justify-between items-stretch h-full ${className}`, children: [jsxs("div", { className: `flex flex-col ${textBlockClassName}`, children: [jsx(Headline, { context: context, title: title, description: description, className: `!p-0 max-w-[600px]`, bgColorHeadline: version, headlineVersion: headlineVersion, align: "left" }), jsxs(BaseTile, { context: context, buttons: getButtons(context, buttons), children: [benefitsCount ? (jsx("div", { className: benefitsContainerStyles, children: benefits.map(renderBenefit$1(version, benefitsVersion)) })) : null, items?.length ? (jsx(List, { className: "mt-5 text-h6", items: items, itemClassName: "mb-[7px]", version: version, isDotted: isDotted })) : null] })] }), image?.src && jsx(ImgInner, { className: "mt-[-50px]", image: image })] }));
+        return (jsxs("div", { className: `flex grow justify-between items-stretch h-full ${className}`, children: [jsxs("div", { className: `flex flex-col ${textBlockClassName}`, children: [jsx(Headline, { title: title, description: description, className: `!p-0 max-w-[600px]`, bgColorHeadline: version, headlineVersion: headlineVersion, align: "left", ...rest }), jsxs(BaseTile, { buttons: buttons?.length ? (jsx(ButtonSection, { buttons: buttons, className: "flex gap-4", ...rest })) : null, children: [benefitsCount ? (jsx("div", { className: benefitsContainerStyles, children: benefits.map(renderBenefit$1(version, benefitsVersion)) })) : null, items?.length ? (jsx(List, { className: "mt-5 text-h6", items: items, itemClassName: "mb-[7px]", version: version, isDotted: isDotted })) : null] })] }), image?.src && jsx(ImgInner, { className: "mt-[-50px]", image: image })] }));
     });
-    const getButtons = (context, buttons) => {
-        return buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex gap-4" })) : null;
-    };
     const getBenefitsContainerStyles = (benefitsCount = 0) => `gap-6 mt-6 ${benefitsCount > 3 ? 'inline-grid grid-cols-[auto_auto]' : 'flex'}`;
 
     function renderBackwardButton(button, version, className) {
         const { text, href, target, onClick } = button;
         const iconVersion = version === 'primary' ? 'white' : 'black';
         const backwardIcon = button?.icon || { icon: 'ArrowLeftIcon' };
+        // TODO Move click handler to Button
         return (jsxs("div", { className: `flex items-center cursor-pointer ${className}`, onClick: onClick, children: [jsx(Button, { version: version, rounded: true, className: "w-12 h-12 min-h-12 min-w-12 flex items-center justify-center mr-3", ariaLabel: text, href: href, target: target, children: jsx(ImgInner, { className: "w-4 h-4", image: { ...backwardIcon, iconVersion: backwardIcon.iconVersion || iconVersion }, asSVG: true }) }), text ? jsx("span", { className: "text-m", children: text }) : null] }));
     }
 
@@ -2777,13 +2757,11 @@
         secondary: 'text-white/80',
     };
     const ProductBlock = JSX((props) => {
-        const { context, className = '', breadcrumbs, backwardButton, version = 'primary', ...otherProps } = props;
-        const router = context.useRouter();
-        const { handlerDecorator } = context;
+        const { className = '', breadcrumbs, backwardButton, version = 'primary', ...rest } = props;
         const buttonVersion = version === 'primary' ? version : 'white';
-        return (jsxs(BlockWrapper, { context: context, className: `font-sans overflow-hidden p-[50px] flex flex-col box-border min-h-[454px] ${VersionStyleMap[version]} ${className}`, ...otherProps, children: [backwardButton?.text
-                    ? renderBackwardButton(useLink({ router, handlerDecorator }, backwardButton), buttonVersion, 'mb-10 -mt-2.5')
-                    : null, breadcrumbs?.length ? (jsx("div", { className: "text-xs-light mb-6", children: joinList(jsx("span", { className: `mx-2 ${breadcrumbsStyleMap[version]}`, children: "/" }))(breadcrumbs.map((breadcrumb, i) => (jsx(Breadcrumb, { ...useLink({ router, handlerDecorator }, { className: breadcrumbsStyleMap[version], ...breadcrumb }) }, String(i))))) })) : null, jsx(ProductBlockInner, { context: context, version: version, ...otherProps })] }));
+        return (jsxs(BlockWrapper, { className: `font-sans overflow-hidden p-[50px] flex flex-col box-border min-h-[454px] ${VersionStyleMap[version]} ${className}`, ...rest, children: [backwardButton?.text
+                    ? renderBackwardButton(backwardButton, buttonVersion, 'mb-10 -mt-2.5')
+                    : null, breadcrumbs?.length ? (jsx("div", { className: "text-xs-light mb-6", children: joinList(jsx("span", { className: `mx-2 ${breadcrumbsStyleMap[version]}`, children: "/" }))(breadcrumbs.map((breadcrumb, i) => (jsx(Breadcrumb, { className: breadcrumbsStyleMap[version], ...breadcrumb }, String(i))))) })) : null, jsx(ProductBlockInner, { version: version, ...rest })] }));
     });
 
     const BorderVersionStyleMap = {
@@ -2795,12 +2773,12 @@
         primary: { title: 'text-secondary-text', text: 'text-secondary-text' },
         secondary: { title: 'text-white', text: 'text-white/80' },
     };
-    const ProductGallery = JSX(({ className = '', context, slides = [], version = 'primary', ...rest }) => {
+    const ProductGallery = JSX(({ className = '', slides = [], version = 'primary', ...rest }) => {
         const galleryNav = slides.map((s) => s.nav);
         const galleryBlocks = slides.map((s) => s.productBlock);
         const [activeSlideIndex, setActiveSlideIndex] = useState(0);
-        return (jsxs(BlockWrapper, { context: context, className: `box-border pt-[50px] overflow-hidden relative font-sans w-100 mb-6 ${className}
-        ${VersionStyleMap[version]}`, ...rest, children: [jsx("div", { className: "flex duration-1000 pb-14", style: { transform: `translateX(-${activeSlideIndex}00%)` }, role: "list", children: galleryBlocks.map((_, i) => renderProductBlock({ ..._, version }, i, context)) }), jsx("div", { className: "flex items-center absolute bottom-6 left-0 right-0 px-[26px] box-border h-28", children: galleryNav.map((slide, i) => renderNavButton({
+        return (jsxs(BlockWrapper, { className: `box-border pt-[50px] overflow-hidden relative font-sans w-100 mb-6 ${className}
+        ${VersionStyleMap[version]}`, ...rest, children: [jsx("div", { className: "flex duration-1000 pb-14", style: { transform: `translateX(-${activeSlideIndex}00%)` }, role: "list", children: galleryBlocks.map((_, i) => renderProductBlock({ ..._, ...rest, version }, i)) }), jsx("div", { className: "flex items-center absolute bottom-6 left-0 right-0 px-[26px] box-border h-28", children: galleryNav.map((slide, i) => renderNavButton({
                         slide,
                         i,
                         activeSlideIndex,
@@ -2808,10 +2786,10 @@
                         version,
                     })) })] }));
     });
-    function renderProductBlock(block, i, context) {
+    function renderProductBlock(block, i) {
         const { version } = block;
         const additionalClass = version ? productBlockStyleMap[version].title : '';
-        return (jsx("section", { className: "box-border relative flex grow-0 shrink-0 basis-full", role: "listitem", children: jsx("div", { className: "flex grow", children: jsx(ProductBlockInner, { className: `pl-[50px] z-10 ${additionalClass}`, context: context, textBlockClassName: "mb-[154px]", ...block, headlineVersion: "XXL" }) }) }, String(i)));
+        return (jsx("section", { className: "box-border relative flex grow-0 shrink-0 basis-full", role: "listitem", children: jsx("div", { className: "flex grow", children: jsx(ProductBlockInner, { className: `pl-[50px] z-10 ${additionalClass}`, textBlockClassName: "mb-[154px]", headlineVersion: "XXL", ...block }) }) }, String(i)));
     }
     function renderNavButton({ slide, i, activeSlideIndex, onClick, version }) {
         const isActiveBtn = i === activeSlideIndex;
@@ -2830,12 +2808,10 @@
       `, children: jsxs("div", { className: "border-0 px-6", children: [jsx("div", { className: `last:pb-0 ${btnTitleClassName}`, children: slide?.title }), jsx("div", { className: `text-secondary-text  ${btnDescClassName}`, children: slide?.description })] }) }, String(i)));
     }
 
-    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 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(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(ImgInner, { className: "absolute right-0 bottom-0", image: image }) : null] }));
-    });
+    const ProductTile = JSX(({ className = '', title, headlineVersion = 'S', description, additionalDescription, benefits = [], buttons, image, version = 'primary', ...rest }) => (jsxs(BlockWrapper, { 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, { className: `!p-0 !bg-transparent z-10 ${title || description ? 'mb-3.5' : ''}`, as: "h2", title: title, description: description, headlineVersion: headlineVersion, bgColorHeadline: version, align: "left", ...rest }), renderBenefits(benefits, version, image), additionalDescription
+                ? renderAdditionalDescription(additionalDescription, image, version)
+                : null, buttons?.length ? (jsx(ButtonSection, { buttons: buttons, className: "flex self-end mt-5 gap-4 z-10 text-l" })) : null, image?.src ? jsx(ImgInner, { className: "absolute right-0 bottom-0", image: image }) : null] })));
     function renderBenefits(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%';
@@ -2865,9 +2841,7 @@
         return (jsx("div", { className: `text-m-light mt-2.5 z-10 ${DESCRIPTION_WIDTH} ${descStyleMap[version]}`, children: additionalDescription }));
     }
 
-    const PromoTile = JSX(({ className = '', context, title = 'Акции и спецпредложения', date, description, buttons = [], version = 'primary', ...rest }) => {
-        return (jsx(BlockWrapper, { context: context, className: `bg-white text-primary-text font-sans p-9 box-border ${className} ${VersionStyleMap[version]} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: jsx(BaseTile, { context: context, title: title ? (jsx(Headline, { context: context, title: title, className: `!p-0 max-w-[600px]`, headlineVersion: getTileHeadingType(className), bgColorHeadline: version, align: "left", as: "h2" })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex gap-3" })) : null, children: jsxs("div", { className: "mt-1.5", children: [date ? jsx("div", { className: "text-s mb-2", children: formatDate(date) }) : null, jsx("div", { className: "text-l", children: description })] }) }) }));
-    });
+    const PromoTile = JSX(({ className = '', title = 'Акции и спецпредложения', date, description, buttons = [], version = 'primary', ...rest }) => (jsx(BlockWrapper, { className: `bg-white text-primary-text font-sans p-9 box-border ${className} ${VersionStyleMap[version]} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: jsx(BaseTile, { title: title ? (jsx(Headline, { title: title, className: `!p-0 max-w-[600px]`, headlineVersion: getTileHeadingType(className), bgColorHeadline: version, align: "left", as: "h2", ...rest })) : null, buttons: buttons?.length ? jsx(ButtonSection, { buttons: buttons, className: "flex gap-3" }) : null, children: jsxs("div", { className: "mt-1.5", children: [date ? jsx("div", { className: "text-s mb-2", children: formatDate(date) }) : null, jsx("div", { className: "text-l", children: description })] }) }) })));
     function formatDate(date) {
         const dateObj = new Date(date);
         const dateFormat = {
@@ -2878,30 +2852,25 @@
         return dateObj.toLocaleString('ru-RU', dateFormat).replace('г.', '');
     }
 
-    const RecommendationCard = JSX(({ context, className = '', title, description, items, image, version, socialMedia }) => {
+    const RecommendationCard = JSX(({ className = '', title, description, items, image, version, socialMedia }) => {
         const tileTitle = title ? (jsx(Heading, { headingType: "h5", as: "h3", className: "mb-3.5 z-10", title: title })) : null;
         const tileImage = image?.src ? (jsx(ImgInner, { className: "absolute bottom-0 right-0 m-0", image: image })) : null;
-        return (jsx("section", { className: `relative overflow-hidden text-left border border-solid box-border p-7 min-w-[524px] min-h-[218px] ${className}`, role: "listitem", children: jsx(BaseTile, { context: context, className: "flex justify-between", title: tileTitle, image: tileImage, children: jsxs("div", { className: "h-full flex flex-col justify-between", children: [description ? jsx(Description, { className: "mb-2", description: description }) : null, items?.length ? (jsx(List, { className: "text-xl-light flex flex-col flex-1 gap-2 max-w-[236px]", items: items, version: version })) : null, socialMedia ? (jsx(SocialMedia, { className: "pt-10 pb-0", media: socialMedia, version: version, context: context })) : null] }) }) }));
+        return (jsx("section", { className: `relative overflow-hidden text-left border border-solid box-border p-7 min-w-[524px] min-h-[218px] ${className}`, role: "listitem", children: jsx(BaseTile, { className: "flex justify-between", title: tileTitle, image: tileImage, children: jsxs("div", { className: "h-full flex flex-col justify-between", children: [description ? jsx(Description, { className: "mb-2", description: description }) : null, items?.length ? (jsx(List, { className: "text-xl-light flex flex-col flex-1 gap-2 max-w-[236px]", items: items, version: version })) : null, socialMedia ? (jsx(SocialMedia, { className: "pt-10 pb-0", media: socialMedia, version: version })) : null] }) }) }));
     });
 
     const BLUR_BLOCK_CLASSES$1 = 'absolute top-0 bottom-0 w-[84px]';
     const CARD_FULL_VIEW_COUNT$1 = 2;
     const CARD_SHIFT = 525;
-    const Recommendation = JSX(({ context, recommendations = [], className = '', title, version = 'primary', ...rest }) => {
+    const Recommendation = JSX(({ recommendations = [], className = '', title, version = 'primary', ...rest }) => {
         const [activeCardIndex, setActiveCardIndex] = useState(0);
-        return (jsxs(BlockWrapper, { context: context, className: `relative font-sans p-9 overflow-hidden text-center 
-          ${VersionStyleMap[version]} 
-          ${className}`, ...rest, children: [title ? jsx(Heading, { headingType: "h3", className: "mb-6", title: title }) : null, jsxs("div", { children: [jsx("div", { className: "flex duration-1000 gap-3.5", style: { transform: `translateX(-${activeCardIndex * CARD_SHIFT}px)` }, role: "list", children: recommendations?.length
-                                ? recommendations.map(renderRecommendationCard(context, BorderVersionStyleMap[version], version))
+        return (jsxs(BlockWrapper, { className: `relative font-sans p-9 overflow-hidden text-center ${VersionStyleMap[version]} ${className}`, ...rest, children: [title ? jsx(Heading, { headingType: "h3", className: "mb-6", title: title }) : null, jsxs("div", { children: [jsx("div", { className: "flex duration-1000 gap-3.5", style: { transform: `translateX(-${activeCardIndex * CARD_SHIFT}px)` }, role: "list", children: recommendations?.length
+                                ? recommendations.map((card, i) => (jsx(RecommendationCard, { version: version, className: BorderVersionStyleMap[version], ...card }, String(i))))
                                 : null }), renderNavButtons$1({
                             cardsCount: recommendations.length,
                             activeCardIndex,
                             setActiveCardIndex,
                         })] }), jsx("div", { className: `${BLUR_BLOCK_CLASSES$1} left-0 ${version === 'secondary' ? 'bg-opacity-from-main' : 'bg-opacity-from-white'}` }), jsx("div", { className: `${BLUR_BLOCK_CLASSES$1} right-0 ${version === 'secondary' ? 'bg-opacity-to-main' : 'bg-opacity-to-white'}` })] }));
     });
-    const renderRecommendationCard = (context, className, version) => (card, i) => {
-        return (jsx(RecommendationCard, { context: context, ...card, version: version, className: className }, String(i)));
-    };
     const renderNavButtons$1 = ({ cardsCount, activeCardIndex, setActiveCardIndex, }) => {
         const handleNextClick = () => setActiveCardIndex(activeCardIndex + 1);
         const handlePrevClick = () => setActiveCardIndex(activeCardIndex - 1);
@@ -3031,7 +3000,7 @@
     }
 
     const DEFAULT_DAYS = 26;
-    const SafeDepositRental = JSX(({ title, footnote, context, className = '', ...rest }) => {
+    const SafeDepositRental = JSX(({ title, footnote, className = '', ...rest }) => {
         const [showMap, setShowMap] = useState(false);
         const [safeDepositState, setStateDepositState] = useState({
             selectedRegion: '',
@@ -3048,7 +3017,7 @@
             setShowMap(!showMap);
         };
         const points = getCoordinates(getBranch(branches, safeDepositState.selectedBranch) || branches);
-        return (jsxs(BlockWrapper, { context: context, className: className, ...rest, children: [jsxs("div", { className: "font-sans bg-white px-8 py-12", children: [title ? (jsx(Heading, { title: title, headingType: "h3", as: "h2", className: "text-primary-text mb-2.5 text-center" })) : null, jsx(SafeDepositRentalForm, { regions: regions, branches: branches, data: { ...safeDepositState, selectedRegion }, onShowMapToggle: onShowMapToggle, onChange: handleChangeSafeDepositState }), footnote ? jsx("p", { className: "text-s-light text-secondary-text", children: footnote }) : null] }), points.length && showMap ? jsx(YandexMap, { points: points, className: "h-[640px]" }) : null] }));
+        return (jsxs(BlockWrapper, { className: className, ...rest, children: [jsxs("div", { className: "font-sans bg-white px-8 py-12", children: [title ? (jsx(Heading, { title: title, headingType: "h3", as: "h2", className: "text-primary-text mb-2.5 text-center" })) : null, jsx(SafeDepositRentalForm, { regions: regions, branches: branches, data: { ...safeDepositState, selectedRegion }, onShowMapToggle: onShowMapToggle, onChange: handleChangeSafeDepositState }), footnote ? jsx("p", { className: "text-s-light text-secondary-text", children: footnote }) : null] }), points.length && showMap ? jsx(YandexMap, { points: points, className: "h-[640px]" }) : null] }));
     });
     const normalizeSelectedRegion = (selectedRegion, regions) => !selectedRegion && regions?.length && regions[0]?.code ? regions[0].code : selectedRegion;
 
@@ -3056,7 +3025,7 @@
 
     const renderItems = ({ items, isDotted = true, version = 'primary', className = '', }) => items ? (jsx(List, { className: className, version: version, items: items, listItemSize: "M", isDotted: isDotted })) : null;
 
-    const renderStepContent = ({ styleMap, isMainButton, version, router, handlerDecorator, }) => (step, i, { length }) => {
+    const renderStepContent = ({ styleMap, isMainButton, version, }) => (step, i, { length }) => {
         const { label, description, button, items, isDotted } = step;
         const contentMarginClass = label && (description || items) ? 'mt-2' : '';
         return (jsxs("div", { className: `relative flex flex-col items-center text-center whitespace-pre-line overflow-hidden ${getContainerWidth(length)}`, children: [jsxs("div", { className: `${button?.text ? 'mb-8' : ''}  text-center`, children: [renderStepLabel(label), jsxs("div", { className: `${contentMarginClass} flex flex-col items-center`, children: [renderStepDescription({
@@ -3067,7 +3036,7 @@
                                     isDotted,
                                     version,
                                     className: getItemsClasses({ className: 'text-left', description, styleMap }),
-                                })] })] }), button?.text && !isMainButton ? (jsx(Button, { className: "box-border py-3 h-12 w-full max-w-[240px] mt-auto", ...useLink({ router, handlerDecorator }, button), version: version, children: button?.text })) : null] }, String(i)));
+                                })] })] }), button?.text && !isMainButton ? (jsx(Button, { className: "box-border py-3 h-12 w-full max-w-[240px] mt-auto", version: version, ...button, children: button?.text })) : null] }, String(i)));
     };
     const renderStepLabel = (label) => label ? jsx("div", { className: "text-h6", children: label }) : null;
     const renderStepDescription = ({ description, className = '', }) => (description ? jsx("div", { className: className, children: description }) : null);
@@ -3097,9 +3066,7 @@
 
     const getLineOpacity = (showLines) => (showLines ? '' : 'opacity-0');
     const getPaddingX = (steps) => (steps < 5 ? 'px-[88px]' : 'px-[55px]');
-    const StepsBlock = JSX(({ className = '', showLines = true, steps = [], button, version = 'primary', context, ...rest }) => {
-        const router = context.useRouter();
-        const { handlerDecorator } = context;
+    const StepsBlock = JSX(({ className = '', showLines = true, steps = [], button, version = 'primary', ...rest }) => {
         const { title } = rest;
         const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
         const shortGaps = steps.length > 3;
@@ -3113,13 +3080,7 @@
                 styleMap.background,
                 styleMap.title,
                 className,
-            ].join(' '), context: context, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", className: "max-w-[752px] text-center", title: title })) : null, steps?.length ? (jsxs("div", { className: `box-border ${titleMargin}`, children: [jsx("div", { className: `flex items-center ${paddingX}`, children: joinList(jsx("div", { className: `h-0.5 w-full bg-secondary-light ${lineOpacity}` }))(steps.map(renderStepIcon(styleMap, version))) }), jsx("div", { className: `flex justify-between mt-4 ${shortGaps ? 'gap-x-3' : 'gap-x-[101px]'}`, children: steps.map(renderStepContent({
-                                styleMap,
-                                isMainButton: Boolean(button?.text),
-                                version,
-                                router,
-                                handlerDecorator,
-                            })) })] })) : null, button?.text ? (jsx(Button, { className: "mt-8 min-w-[240px]", version: "primary", ...useLink({ router, handlerDecorator }, button) })) : null] }));
+            ].join(' '), ...rest, children: [title ? (jsx(Heading, { headingType: "h3", className: "max-w-[752px] text-center", title: title })) : null, steps?.length ? (jsxs("div", { className: `box-border ${titleMargin}`, children: [jsx("div", { className: `flex items-center ${paddingX}`, children: joinList(jsx("div", { className: `h-0.5 w-full bg-secondary-light ${lineOpacity}` }))(steps.map(renderStepIcon(styleMap, version))) }), jsx("div", { className: `flex justify-between mt-4 ${shortGaps ? 'gap-x-3' : 'gap-x-[101px]'}`, children: steps.map(renderStepContent({ styleMap, isMainButton: Boolean(button?.text), version })) })] })) : null, button?.text ? (jsx(Button, { className: "mt-8 min-w-[240px]", version: "primary", ...button })) : null] }));
     });
     const renderStepIcon = (styleMap, version) => ({ icon }, i) => {
         return (jsx("div", { className: "flex flex-col items-center text-center", children: jsx("div", { className: `h-[100px] w-[100px] min-w-[100px] min-h-[100px] rounded-full p-[26px] box-border z-10 flex justify-center items-center
@@ -3137,10 +3098,22 @@
     const ACTIVE_TEXT_CLASSES = 'text-white';
     const INACTIVE_TEXT_CLASSES = 'text-secondary-text group-hover:text-primary-main';
 
+    const LinkTab = JSX((props) => {
+        const { tab, currentTab, onClick } = props;
+        const active = currentTab?.type === 'link' && currentTab.href === tab.href;
+        const handleClick = useCallback(() => {
+            onClick && onClick(tab);
+            EventBus.inst.fire('anchorClick', { isScrolling: true, label: tab.href });
+        }, [tab, onClick]);
+        const link = useLink();
+        const adjustedProps = link({ ...tab, onClick: handleClick });
+        return (jsx("a", { role: "tab", className: `${LINK_CLASSES} ${active ? ACTIVE_LINK_CLASSES : INACTIVE_LINK_CLASSES}`, target: tab.target, href: adjustedProps.href, onClick: adjustedProps.onClick, children: jsx("span", { className: `${TEXT_CLASSES} ${active ? ACTIVE_TEXT_CLASSES : INACTIVE_TEXT_CLASSES}`, children: tab.text }) }));
+    });
+
     const BADGE_CLASSES = 'min-w-[22px] h-[22px] rounded-full text-xs ml-2 flex justify-center items-center';
     const ACTIVE_BADGE_CLASSES = 'bg-white/30 text-white';
     const INACTIVE_BADGE_CLASSES = 'bg-main-divider text-secondary-text group-hover:text-primary-main';
-    const renderGroupTab = ({ onClick, currentTab, showCounter, page }) => (tab, i) => {
+    const renderGroupTab = ({ page, currentTab, showCounter, onClick }) => (tab, i) => {
         const active = currentTab === tab;
         const count = tab.ref && page?.blocks
             ? page.blocks.filter((block) => block?.labels?.includes(tab.ref)).length
@@ -3150,37 +3123,19 @@
     const renderTitle$1 = (title, active) => (jsx("h3", { className: `${TEXT_CLASSES} ${active ? ACTIVE_TEXT_CLASSES : INACTIVE_TEXT_CLASSES}`, children: title }));
     const renderCount = (count, active) => (jsx("div", { className: `${BADGE_CLASSES} ${active ? ACTIVE_BADGE_CLASSES : INACTIVE_BADGE_CLASSES}`, children: count }));
 
-    const renderLinkTab = ({ text, currentTab, onClick, href, target = '_self', i, }) => {
-        const active = currentTab?.type === 'link' && currentTab.href === href;
-        return (jsx("a", { role: "tab", className: `${LINK_CLASSES} ${active ? ACTIVE_LINK_CLASSES : INACTIVE_LINK_CLASSES}`, target: target, href: href, onClick: onClick, children: jsx("span", { className: `${TEXT_CLASSES} ${active ? ACTIVE_TEXT_CLASSES : INACTIVE_TEXT_CLASSES}`, children: text }) }, String(i)));
-    };
-
-    const renderTab = ({ onClick, currentTab, showCounter, page, context }) => 
+    const renderTab = ({ page, currentTab, showCounter, onClick }) => 
     // Linter doesn't understand that switch processes all cases
     // eslint-disable-next-line consistent-return
     (tab, i) => {
-        const { useRouter, handlerDecorator } = context;
-        const router = useRouter();
         const type = tab.type;
         if (!(type === 'group' || type === 'link')) {
             return null;
         }
         switch (type) {
             case 'group':
-                return renderGroupTab({ onClick, currentTab, showCounter, page, context })(tab, i);
+                return renderGroupTab({ page, currentTab, showCounter, onClick })(tab, i);
             case 'link': {
-                const link = useLink({ router, handlerDecorator }, tab);
-                const linkClick = link.onClick;
-                return renderLinkTab({
-                    ...link,
-                    onClick: (ev) => {
-                        linkClick(ev);
-                        onClick(tab);
-                        EventBus.inst.fire('anchorClick', { isScrolling: true, label: tab.href });
-                    },
-                    currentTab,
-                    i,
-                });
+                return jsx(LinkTab, { tab: tab, currentTab: currentTab }, String(i));
             }
             default:
                 assertUnreachable(type);
@@ -3188,7 +3143,7 @@
     };
 
     const Tabs = JSX((props) => {
-        const { context, className = '', tabs, page, showCounter, isSticky } = props;
+        const { className = '', tabs, showCounter, isSticky, ...rest } = props;
         const [currentTab, setCurrentTab] = useState(tabs ? tabs[0] : undefined);
         useEffect(() => EventBus.inst.subscribe('tab', (event) => {
             if (!tabs) {
@@ -3211,7 +3166,7 @@
             }
             setCurrentTab(selectedTab);
         };
-        return (jsx(BlockWrapper, { context: context, className: `${isSticky ? 'sticky top-1 z-20 ' : ''}box-border flex gap-x-1 ${className}`, role: "tablist", children: tabs?.map(renderTab({ onClick: handleClick, currentTab, page, showCounter, context })) }));
+        return (jsx(BlockWrapper, { className: `${isSticky ? 'sticky top-1 z-20 ' : ''}box-border flex gap-x-1 ${className}`, role: "tablist", ...rest, children: tabs?.map(renderTab({ onClick: handleClick, currentTab, showCounter, ...rest })) }));
     });
     const checkTab = (event) => (_) => _.type === 'link' && _.href === `#${event.label}`;
 
@@ -3234,11 +3189,9 @@
     };
     const renderImgCellData = ({ image }) => (image?.src ? jsx(ImgInner, { image: image }) : null);
     const renderListCellData = ({ isDotted, ...rest }) => (jsx(List, { className: "flex flex-col justify-between items-start text-h6", version: "primary", isDotted: isDotted ?? true, ...rest }));
-    const renderTableCellData = JSX(({ isVisible, displayTable, dataUrl, pdfUrl, isOpen, context }) => {
-        return isVisible ? (jsx(TableInnerButton, { isOpen: isOpen, context: context, onClick: () => {
-                displayTable({ dataUrl, pdfUrl });
-            } })) : null;
-    });
+    const renderTableCellData = JSX(({ isVisible, displayTable, dataUrl, pdfUrl, isOpen }) => isVisible ? (jsx(TableInnerButton, { isOpen: isOpen, onClick: () => {
+            displayTable({ dataUrl, pdfUrl });
+        } })) : null);
     const EmbeddableCellData = {
         Buttons: renderButtonsCellData,
         Img: renderImgCellData,
@@ -3247,7 +3200,7 @@
         Table: renderTableCellData,
     };
 
-    const renderCellInner = ({ rowIdx, context, cellIdx, setTableInner, tableInner, openTableInnerIdx, setOpenTableInnerIdx, }) => (cell, i) => {
+    const renderCellInner = ({ rowIdx, cellIdx, setTableInner, tableInner, openTableInnerIdx, setOpenTableInnerIdx, }) => (cell, i) => {
         const [isVisible, setVisibility] = useState(true);
         useEffect(() => {
             if (cellIdx !== openTableInnerIdx || !tableInner) {
@@ -3267,7 +3220,6 @@
                         fieldIdx: i,
                         displayTable,
                         isVisible,
-                        context,
                     },
                 })] }, String(i)));
     };
@@ -3283,11 +3235,10 @@
         return jsx(EmbeddableCellInner, { ...cellProps, ...rest });
     };
 
-    const TariffsTableCell = JSX(({ context, cells, rowIdx, cellIdx, setTableInner, tableInner, openTableInnerIdx, setOpenTableInnerIdx, }) => {
+    const TariffsTableCell = JSX(({ cells, rowIdx, cellIdx, setTableInner, tableInner, openTableInnerIdx, setOpenTableInnerIdx, }) => {
         return (jsx("div", { className: "first:pl-0 w-80 flex-grow flex flex-col border-solid border-main-divider border border-t-0 border-x-0", role: "cell", children: cells?.length
                 ? cells.map(renderCellInner({
                     rowIdx,
-                    context,
                     cellIdx,
                     setTableInner,
                     tableInner,
@@ -3340,41 +3291,38 @@
     };
     const renderCols = (cols, rowIndex) => cols?.length > 0 ? (jsx("div", { className: `flex ${rowIndex} ${rowIndex === 0 ? 'text-secondary-text' : ''} last:mr-3`, children: cols.map((data, i) => (jsx("div", { className: `w-[76px] text-h6 mr-5 first:ml-8`, children: data }, String(i)))) })) : null;
 
-    const InnerTableBody = JSX(({ context, activeTabIndex, items }) => {
+    const InnerTableBody = JSX(({ activeTabIndex, items }) => {
         const [hiddenTables, setHiddenTables] = useState({});
         const toggleTable = (key) => {
             setHiddenTables((oldState) => ({ ...oldState, [key]: !oldState[key] }));
         };
         return (jsx("div", { children: items.map((_, tableIdx) => {
                 const key = `activeTabIdx:${activeTabIndex}-tableIdx:${tableIdx}`;
-                return (jsxs("div", { className: "w-full", children: [jsxs("div", { className: "flex p-4 bg-main-stroke text-xl-light text-center justify-center cursor-pointer relative", onClick: () => toggleTable(key), children: [_.title, jsx(ImgInner, { image: hiddenTables[key] ? 'PlusIcon' : 'MinusIcon', className: "absolute right-[22px]", width: "24", height: "24" })] }), jsx("div", { className: `w-full pl-2 overflow-hidden transition-height duration-500 ease-in-out ${hiddenTables[key] ? 'h-0' : ''}`, children: jsx("div", { className: "relative", children: jsx(InnerTableBodyItem, { context: context, rows: _.rowsData }) }) })] }, key));
+                return (jsxs("div", { className: "w-full", children: [jsxs("div", { className: "flex p-4 bg-main-stroke text-xl-light text-center justify-center cursor-pointer relative", onClick: () => toggleTable(key), children: [_.title, jsx(ImgInner, { image: hiddenTables[key] ? 'PlusIcon' : 'MinusIcon', className: "absolute right-[22px]", width: "24", height: "24" })] }), jsx("div", { className: `w-full pl-2 overflow-hidden transition-height duration-500 ease-in-out ${hiddenTables[key] ? 'h-0' : ''}`, children: jsx("div", { className: "relative", children: jsx(InnerTableBodyItem, { rows: _.rowsData }) }) })] }, key));
             }) }));
     });
 
     const InnerTableHeader = JSX(({ currencies, linkToPDF, activeTabIndex, setActiveTabIndex }) => (jsxs("div", { className: "flex justify-between w-full pt-2.5 pb-3", children: [currencies && currencies.length > 1 ? (jsx("div", { className: "flex bg-secondary-light p-1.5 rounded-md", children: currencies.map((currency, idx) => (jsx("div", { className: `rounded-md text-xl-light px-4 py-3 cursor-pointer ${idx === activeTabIndex ? 'bg-primary-main text-white' : 'text-secondary-text'}`, onClick: () => setActiveTabIndex(idx), children: currency || idx + 1 }, currency))) })) : null, linkToPDF ? (jsx(Button, { href: linkToPDF, version: "secondary", target: "_blank", appendLeft: jsx(ImgInner, { image: "DocDownloadIcon", className: "mr-0.5", width: "20", height: "20", asSVG: true }), text: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0432 PDF" })) : null] })));
 
     const EMPTY_DATA = 'Данных нет';
-    const InnerTable = JSX(({ context, dataUrl, pdfUrl, onClick }) => {
+    const InnerTable = JSX(({ dataUrl, pdfUrl, onClick }) => {
         const { tableData } = useTariffsInnerTableData(dataUrl);
         const [activeTabIndex, setActiveTabIndex] = useState(0);
         const items = tableData?.[activeTabIndex]?.items ?? [];
         const currencies = tableData?.map((item) => item.currency ?? '');
-        return tableData ? (jsxs("div", { className: "bg-white z-10", children: [jsx(InnerTableHeader, { currencies: currencies, activeTabIndex: activeTabIndex, setActiveTabIndex: setActiveTabIndex, linkToPDF: pdfUrl }), jsx(InnerTableBody, { context: context, activeTabIndex: activeTabIndex, items: items }), jsx(TableInnerButton, { context: context, onClick: onClick, isOpen: true })] })) : (jsxs("div", { className: "my-5 text-h6 text-center", children: [jsx("p", { children: EMPTY_DATA }), jsx(TableInnerButton, { context: context, onClick: onClick, isOpen: true })] }));
+        return tableData ? (jsxs("div", { className: "bg-white z-10", children: [jsx(InnerTableHeader, { currencies: currencies, activeTabIndex: activeTabIndex, setActiveTabIndex: setActiveTabIndex, linkToPDF: pdfUrl }), jsx(InnerTableBody, { activeTabIndex: activeTabIndex, items: items }), jsx(TableInnerButton, { onClick: onClick, isOpen: true })] })) : (jsxs("div", { className: "my-5 text-h6 text-center", children: [jsx("p", { children: EMPTY_DATA }), jsx(TableInnerButton, { onClick: onClick, isOpen: true })] }));
     });
 
-    const TariffsTableRowContainer = JSX(({ context, children, tableInner, onHideContentClick }) => {
-        return (jsxs("div", { className: "self-start flex flex-col", role: "row", children: [jsx("div", { className: "flex", children: children }), tableInner ? (jsx("div", { className: "origin-top animate-expansion", children: jsx(InnerTable, { context: context, ...tableInner, onClick: onHideContentClick }) })) : null] }));
-    });
+    const TariffsTableRowContainer = JSX(({ children, tableInner, onHideContentClick }) => (jsxs("div", { className: "self-start flex flex-col", role: "row", children: [jsx("div", { className: "flex", children: children }), tableInner ? (jsx("div", { className: "origin-top animate-expansion", children: jsx(InnerTable, { ...tableInner, onClick: onHideContentClick }) })) : null] })));
 
-    const TariffsTableRow = JSX(({ row: { header, data }, activeCardIndex, context, rowIdx }) => {
+    const TariffsTableRow = JSX(({ row: { header, data }, activeCardIndex, rowIdx, ...rest }) => {
         const [tableInner, setTableInner] = useState(undefined);
         const [openTableInnerIdx, setOpenTableInnerIdx] = useState(undefined);
         const onHideContentClick = () => setTableInner(undefined);
-        return (jsxs(TariffsTableRowContainer, { context: context, onHideContentClick: onHideContentClick, tableInner: tableInner, children: [jsx("div", { className: `text-s py-5 ${FIRST_CELL_CLASSES} ${DIVIDER_CLASSES}`, children: jsxs("div", { className: "flex items-center text-primary-text", role: "cell", children: [header?.icon ? (jsx(ImgInner, { className: "mr-[14px] max-w-6 max-h-6", image: getIconWithVersion(header.icon), width: "24px", height: "24px", asSVG: true })) : null, header?.title ? jsx("div", { className: "text-m-light", children: header?.title }) : null] }) }), data?.length ? (jsx(TableCarouselContainer, { activeCardIndex: activeCardIndex, columnWidth: COLUMN_WIDTH$1, version: "tariff", children: data.map((cells, i) => (jsx(TariffsTableCell, { cells: cells, rowIdx: rowIdx, cellIdx: i, context: context, setTableInner: setTableInner, tableInner: tableInner, openTableInnerIdx: openTableInnerIdx, setOpenTableInnerIdx: setOpenTableInnerIdx }, String(i)))) })) : null] }));
+        return (jsxs(TariffsTableRowContainer, { onHideContentClick: onHideContentClick, tableInner: tableInner, ...rest, children: [jsx("div", { className: `text-s py-5 ${FIRST_CELL_CLASSES} ${DIVIDER_CLASSES}`, children: jsxs("div", { className: "flex items-center text-primary-text", role: "cell", children: [header?.icon ? (jsx(ImgInner, { className: "mr-[14px] max-w-6 max-h-6", image: getIconWithVersion(header.icon), width: "24px", height: "24px", asSVG: true })) : null, header?.title ? jsx("div", { className: "text-m-light", children: header?.title }) : null] }) }), data?.length ? (jsx(TableCarouselContainer, { activeCardIndex: activeCardIndex, columnWidth: COLUMN_WIDTH$1, version: "tariff", children: data.map((cells, i) => (jsx(TariffsTableCell, { cells: cells, rowIdx: rowIdx, cellIdx: i, setTableInner: setTableInner, tableInner: tableInner, openTableInnerIdx: openTableInnerIdx, setOpenTableInnerIdx: setOpenTableInnerIdx, ...rest }, String(i)))) })) : null] }));
     });
 
-    const TariffsTable = JSX(({ className = '', context, title, description, rowHeaders, tariffsColumns: columns, hiddenRowsNum = 0, ...rest }) => {
-        const [activeCardIndex, setActiveCardIndex] = useState(0);
+    const TariffsTable = JSX(({ className = '', title, description, rowHeaders, tariffsColumns: columns, hiddenRowsNum = 0, ...rest }) => {
         const colData = columns?.map(({ data }) => data) || [];
         const rowData = rowHeaders?.map((header, i) => ({
             header,
@@ -3384,12 +3332,11 @@
         const tableArrowScrollControlProps = useTableArrowScrollControl({
             columnsLength,
             colsLengthForScroll: COLS_LENGTH_FOR_SCROLL,
-            activeCardIndex,
-            setActiveCardIndex,
         });
-        const rows = (rowData || []).map((row, i) => (jsx(TariffsTableRow, { context: context, row: row, activeCardIndex: activeCardIndex, rowIdx: i }, String(i))));
+        const { activeCardIndex } = tableArrowScrollControlProps;
+        const rows = (rowData || []).map((row, i) => (jsx(TariffsTableRow, { row: row, activeCardIndex: activeCardIndex, rowIdx: i, ...rest }, String(i))));
         const [visibleRows, hiddenRows] = hiddenRowsNum > 0 ? [rows.slice(0, -hiddenRowsNum), rows.slice(-hiddenRowsNum)] : [rows, []];
-        return (jsxs(BlockWrapper, { className: `bg-white font-sans p-[50px] overflow-hidden text-primary-text relative ${columnsLength > 1 ? 'pr-0' : ''} ${className}`, context: context, ...rest, children: [renderTitle({ title, description }), renderDescription(description), hiddenRowsNum > 0 ? (jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs(Wrapper, { tableArrowScrollControlProps: tableArrowScrollControlProps, children: [visibleRows, jsx(FoldableSection, { isUnfolded: isUnfolded, children: hiddenRows })] })), renderFoldButton: renderDefaultFoldButton })) : (jsx(Wrapper, { tableArrowScrollControlProps: tableArrowScrollControlProps, children: rows }))] }));
+        return (jsxs(BlockWrapper, { className: `bg-white font-sans p-[50px] overflow-hidden text-primary-text relative ${columnsLength > 1 ? 'pr-0' : ''} ${className}`, ...rest, children: [renderTitle({ title, description }), renderDescription(description), hiddenRowsNum > 0 ? (jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs(Wrapper, { tableArrowScrollControlProps: tableArrowScrollControlProps, children: [visibleRows, jsx(FoldableSection, { isUnfolded: isUnfolded, children: hiddenRows })] })), renderFoldButton: renderDefaultFoldButton })) : (jsx(Wrapper, { tableArrowScrollControlProps: tableArrowScrollControlProps, children: rows }))] }));
     });
     function renderTitle({ title, description }) {
         return title ? (jsx(Heading, { headingType: "h3", className: `text-center ${description ? 'mb-2.5' : 'mb-8'}`, title: title })) : null;
@@ -3440,45 +3387,71 @@
     const renderTag = (tag, key) => (jsx("span", { className: "text-m-light py-2 px-2.5 border-solid border rounded-md border-color-stroke", children: tag }, String(key)));
 
     const Tile = JSX((props) => {
-        const { context, title, headingType = 'h3', description, items, children, buttons, image, isDotted = true, listItemSize = 'M', className = '', version = 'primary', tags, ...rest } = props;
+        const { title, headingType = 'h3', description, items, buttons, image, isDotted = true, listItemSize = 'M', className = '', version = 'primary', tags, children, ...rest } = props;
         const headingClassName = version === 'primary' ? 'text-primary-text' : '';
-        return (jsx(BlockWrapper, { context: context, className: `overflow-hidden font-sans p-9 pr-3 box-border ${className} ${VersionStyleMap[version]} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: jsxs(BaseTile, { context: context, title: title ? (jsx(Heading, { headingType: headingType, as: "h2", title: title, className: `whitespace-pre-wrap max-w-[600px] ${headingClassName}` })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons.map((button) => ({ ...button, className: 'min-w-[158px]' })), className: "flex mt-8 gap-3" })) : null, image: image?.src ? jsx(ImgInner, { className: "mt-auto ml-7", image: image }) : null, children: [description ? (jsx(Description, { className: "max-w-[600px] text-xl-light mt-2.5", description: description })) : null, children, renderList({ version, isDotted, listItemSize }, items), tags?.length ? jsx(Tags, { tags: tags, className: "mt-5" }) : null] }) }));
+        return (jsx(BlockWrapper, { className: `overflow-hidden font-sans p-9 pr-3 box-border ${className} ${VersionStyleMap[version]} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: jsxs(BaseTile, { title: title ? (jsx(Heading, { headingType: headingType, as: "h2", title: title, className: `whitespace-pre-wrap max-w-[600px] ${headingClassName}` })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { buttons: buttons.map((button) => ({ ...button, className: 'min-w-[158px]' })), className: "flex mt-8 gap-3", ...rest })) : null, image: image?.src ? jsx(ImgInner, { className: "mt-auto ml-7", image: image }) : null, children: [description ? (jsx(Description, { className: "max-w-[600px] text-xl-light mt-2.5", description: description })) : null, children, renderList({ version, isDotted, listItemSize }, items), tags?.length ? jsx(Tags, { tags: tags, className: "mt-5" }) : null] }) }));
     });
     function renderList({ version, isDotted, listItemSize }, items) {
         return items?.length ? (jsx(List, { items: items, isDotted: isDotted, className: "mt-2.5", listItemSize: listItemSize, itemClassName: "mb-1.5", version: version })) : null;
     }
 
+    const alignStyle = {
+        left: 'items-start',
+        center: 'items-center',
+        right: 'items-end',
+    };
+    const gapStyleMap = {
+        XXL: 'gap-10',
+        XL: 'gap-8',
+        L: 'gap-4',
+        M: 'gap-3',
+        S: 'gap-2',
+        XS: 'gap-1',
+        '': '',
+    };
+    const backgroundStyleMap = {
+        transparent: '',
+        primary: 'bg-white',
+        secondary: 'bg-primary-main',
+    };
+    const VerticalLayout = JSX(({ className = '', children, gap = '', align = 'left', version = 'primary', ...rest }) => (jsx(BlockWrapper, { className: [
+            'flex flex-col',
+            gapStyleMap[gap],
+            alignStyle[align],
+            backgroundStyleMap[version],
+            className,
+        ].join(' '), ...rest, children: children })));
+    VerticalLayout.childrenTypes = {
+        exclude: ['VerticalLayout'],
+    };
+
     const getItemListFontSize = (colValue) => (colValue === 'single' ? 'text-h6' : 'text-l');
     const cardColumnsModeStyleMap = {
         double: 'flex gap-y-2 gap-x-10 flex-wrap',
         single: 'flex gap-y-2 flex-col',
     };
-    const InvestmentGalleryCard = JSX(({ className = '', columnsMode = 'double', context, description, additionalDescription, image, cardList, title, version = 'primary', }) => {
+    const InvestmentGalleryCard = JSX(({ className = '', columnsMode = 'double', description, additionalDescription, image, cardList, title, version = 'primary', }) => {
         const tileTitle = title ? (jsx(Heading, { headingType: "h4", as: "h3", className: "mb-3.5 z-10", title: title })) : null;
         const tileImage = image?.src ? (jsx(ImgInner, { className: "absolute bottom-0 right-0 m-0", image: image })) : null;
         return (jsx("section", { className: `relative overflow-hidden text-left border border-solid box-border
           p-9 min-w-[697px] min-h-[319px]
           ${BorderVersionStyleMap[version]}
-          ${className}`, role: "listitem", children: jsx(BaseTile, { context: context, className: "flex justify-between", title: tileTitle, image: tileImage, children: jsxs("div", { className: "flex flex-col justify-between", children: [jsxs("div", { className: "flex itens-center justify-between mb-4", children: [description ? jsx(Description, { className: "text-h6", description: description }) : null, additionalDescription ? (jsxs("div", { className: "text-m-light text-secondary-text", children: [" ", additionalDescription, " "] })) : null] }), cardList?.length ? (jsx("div", { className: `${cardColumnsModeStyleMap[columnsMode]}`, role: "list", children: renderCardList(cardList, columnsMode) })) : null] }) }) }));
+          ${className}`, role: "listitem", children: jsx(BaseTile, { className: "flex justify-between", title: tileTitle, image: tileImage, children: jsxs("div", { className: "flex flex-col justify-between", children: [jsxs("div", { className: "flex itens-center justify-between mb-4", children: [description ? jsx(Description, { className: "text-h6", description: description }) : null, additionalDescription ? (jsxs("div", { className: "text-m-light text-secondary-text", children: [" ", additionalDescription, " "] })) : null] }), cardList?.length ? (jsx("div", { className: `${cardColumnsModeStyleMap[columnsMode]}`, role: "list", children: renderCardList(cardList, columnsMode) })) : null] }) }) }));
     });
     const renderCardList = (cardList, columnsMode) => cardList.map((item, i) => (jsxs("div", { className: columnsMode === 'double' ? 'basis-[calc(50%-20px)]' : '', role: "listitem", children: [item?.parameter ? (jsx("span", { className: `pr-2.5 ${getItemListFontSize(columnsMode)}`, children: item.parameter })) : null, item?.parameterDesccription ? (jsx("span", { className: "text-m-light text-secondary-text", children: item.parameterDesccription })) : null] }, String(i))));
 
     const BLUR_BLOCK_CLASSES = 'absolute top-0 bottom-0 w-[84px]';
     const CARD_FULL_VIEW_COUNT = 1;
-    const InvestmentGallery = JSX(({ context, cards = [], className = '', title, version = 'primary', ...rest }) => {
+    const InvestmentGallery = JSX(({ cards = [], className = '', title, version = 'primary', ...rest }) => {
         const [activeCardIndex, setActiveCardIndex] = useState(0);
         const cardWidth = 525;
-        return (jsxs(BlockWrapper, { context: context, className: `relative font-sans p-9 overflow-hidden text-center 
-        ${VersionStyleMap[version]} 
-        ${className}`, ...rest, children: [title ? jsx(Heading, { headingType: "h3", className: "mb-9", title: title }) : null, jsxs("div", { children: [jsx("div", { className: "flex duration-1000 gap-3.5", style: { transform: `translateX(-${activeCardIndex * cardWidth}px)` }, role: "list", children: cards?.length
-                                ? cards.map(renderInvestmentGalleryCard(context, className, version))
-                                : null }), renderNavButtons({
+        return (jsxs(BlockWrapper, { className: `relative font-sans p-9 overflow-hidden text-center ${VersionStyleMap[version]} ${className}`, ...rest, children: [title ? jsx(Heading, { headingType: "h3", className: "mb-9", title: title }) : null, jsxs("div", { children: [jsx("div", { className: "flex duration-1000 gap-3.5", style: { transform: `translateX(-${activeCardIndex * cardWidth}px)` }, role: "list", children: cards?.length ? cards.map(renderInvestmentGalleryCard(className, version)) : null }), renderNavButtons({
                             cardsCount: cards.length,
                             activeCardIndex,
                             setActiveCardIndex,
                         })] }), jsx("div", { className: `${BLUR_BLOCK_CLASSES} left-0 ${version === 'secondary' ? 'bg-opacity-from-main' : 'bg-opacity-from-white'}` }), jsx("div", { className: `${BLUR_BLOCK_CLASSES} right-0 ${version === 'secondary' ? 'bg-opacity-to-main' : 'bg-opacity-to-white'}` })] }));
     });
-    const renderInvestmentGalleryCard = (context, className, version) => (card, i) => (jsx(InvestmentGalleryCard, { className: className, context: context, version: version, ...card }, String(i)));
+    const renderInvestmentGalleryCard = (className, version) => (card, i) => jsx(InvestmentGalleryCard, { className: className, version: version, ...card }, String(i));
     const renderNavButtons = ({ cardsCount, activeCardIndex, setActiveCardIndex }) => {
         const isUseSlider = cardsCount > CARD_FULL_VIEW_COUNT;
         const showNextButton = isUseSlider && cardsCount - activeCardIndex > CARD_FULL_VIEW_COUNT;
@@ -3497,12 +3470,15 @@
         Accordion,
         AccordionItem,
         BenefitsBlock,
+        BusinessBlock,
         Bonus,
+        BonusBenefitsBlock,
         CardTransfer,
         ComparisonTable,
         Calculator,
         Catalog,
         ContactsBlock,
+        ErrorBlock,
         ExchangeRateTile,
         Footer,
         Gallery,
@@ -3511,10 +3487,12 @@
         Headline,
         InsuranceAmountBlock,
         InvestmentInfo,
+        InvestmentGallery,
         LinkDocs,
         MiniGallery,
         MobileAppTile,
         PictureText,
+        Placeholder,
         ProductBlock,
         ProductGallery,
         ProductTile,
@@ -3524,16 +3502,13 @@
         OtherProducts,
         OtherProductsItem,
         Recommendation,
+        SafeDepositRental,
         StepsBlock,
+        Tabs,
         TariffsTable,
         TextBlock,
         Tile,
-        Placeholder,
-        BonusBenefitsBlock,
-        SafeDepositRental,
-        Tabs,
-        ErrorBlock,
-        InvestmentGallery,
+        VerticalLayout,
     };
 
     function style2className(style) {
@@ -3575,30 +3550,27 @@
                     d: "M21.48 11.95c.5-1.4-.4-2.6-1.9-2.6h-4c-.6 0-1.1-.5-1-1.2l.5-3.2c.2-.9-.4-1.9-1.3-2.2-.8-.3-1.8.1-2.2.7l-4.1 6.1M7.48 18.35l3.1 2.4c.4.4 1.3.6 1.9.6h3.8c1.2 0 2.5-.9 2.8-2.1l1.24-3.77" }), jsx("path", { ...params, d: "M2.38 18.35v-9.8c0-1.4.6-1.9 2-1.9h1c1.4 0 2 .5 2 1.9v9.8c0 1.4-.6 1.9-2 1.9h-1c-1.4 0-2-.5-2-1.9Z" })] }));
     };
 
-    const LikeControl = JSX(({ className, context, ...rest }) => {
-        const { useRouter, handlerDecorator = defaultHandlerDecorator } = context;
+    const LikeControl = JSX(({ className = '' }) => {
         const router = useRouter();
         const likeService = useLikeService(router.pathname);
-        return (jsxs(BlockWrapper, { tag: "div", context: context, className: `border-main border-2 border-solid bg-white flex w-[125px] items-center justify-center gap-3 p-2 font-sans ${className || ''}`, ...rest, children: [jsx(LikeButton, { onClick: handlerDecorator(likeService.like), ariaLabel: "\u041F\u043E\u0441\u0442\u0430\u0432\u0438\u0442\u044C \u043E\u0442\u043C\u0435\u0442\u043A\u0443 \u00AB\u043B\u0430\u0439\u043A\u00BB" }), jsx(LikeButton, { onClick: handlerDecorator(likeService.dislike), className: "rotate-180", ariaLabel: "\u041F\u043E\u0441\u0442\u0430\u0432\u0438\u0442\u044C \u043E\u0442\u043C\u0435\u0442\u043A\u0443 \u00AB\u0434\u0438\u0437\u043B\u0430\u0439\u043A\u00BB" }), jsx("span", { className: "select-none", children: likeService.likeCount })] }));
+        return (jsxs("div", { className: `border-main border-2 border-solid bg-white flex w-[125px] items-center justify-center gap-3 p-2 font-sans ${className}`, children: [jsx(LikeButton, { onClick: handlerDecorator(likeService.like), ariaLabel: "\u041F\u043E\u0441\u0442\u0430\u0432\u0438\u0442\u044C \u043E\u0442\u043C\u0435\u0442\u043A\u0443 \u00AB\u043B\u0430\u0439\u043A\u00BB" }), jsx(LikeButton, { onClick: handlerDecorator(likeService.dislike), className: "rotate-180", ariaLabel: "\u041F\u043E\u0441\u0442\u0430\u0432\u0438\u0442\u044C \u043E\u0442\u043C\u0435\u0442\u043A\u0443 \u00AB\u0434\u0438\u0437\u043B\u0430\u0439\u043A\u00BB" }), jsx("span", { className: "select-none", children: likeService.likeCount })] }));
     });
 
     const DEFAULT_SLOT_NAME = null;
 
-    function renderSlots({ slots = {}, parent, options, ancestors = [], }) {
-        return Object.entries(slots).reduce((res, [slotName, slotBlocks]) => ({
-            ...res,
-            [slotName]: renderBlocksList({
-                blocks: slotBlocks,
-                parent,
-                slotName,
-                options,
-                ancestors,
-            }),
-        }), {});
-    }
+    const renderSlots = ({ slots, parent, options, ancestors = [], }) => Object.entries(slots || {}).reduce((res, [slotName, slotBlocks]) => ({
+        ...res,
+        [slotName]: renderBlocksList({
+            blocks: slotBlocks,
+            parent,
+            slotName,
+            options,
+            ancestors,
+        }),
+    }), {});
 
     function renderBlock({ block = {}, options, ancestors = [] }) {
-        const { key, page, blockDecorator, blocksRegistry = {}, context } = options;
+        const { key, page, blockDecorator, blocksRegistry = {} } = options;
         const { type, slots, blocks: childBlocks } = block;
         if (!(type && type in blocksRegistry)) {
             console.warn(`No block with "${type}" is registered`);
@@ -3613,57 +3585,51 @@
             ancestors,
             // Adjusted by decorator block and blockClassName
             render: ({ block: adjustedBlock, blockClassName: adjustedBlockClassName }) => {
-                const { version, anchor, labels, content } = adjustedBlock;
-                return BlockComponent ? (jsx(BlockComponent, { className: adjustedBlockClassName, context: context, page: page, ancestors: ancestors, version: version, anchor: anchor, labels: labels, slots: blockSlots, ...content, children: children }, key)) : null;
+                const { content } = adjustedBlock;
+                return BlockComponent ? (jsx(BlockComponent, { page: page, block: adjustedBlock, className: adjustedBlockClassName, ancestors: ancestors, slots: blockSlots, ...content, children: children }, key)) : null;
             },
         }, key);
     }
 
-    const defaultChildRenderer = (_) => _;
-    function renderBlocksList({ blocks = [], parent, slotName = DEFAULT_SLOT_NAME, options, ancestors = [], }) {
-        const { blocksRegistry = {} } = options;
-        const { type } = parent;
-        const BlockComponent = type && blocksRegistry[type];
-        const { renderChild = defaultChildRenderer } = BlockComponent || {};
-        return blocks.map((_, j) => renderChild(renderBlock({
-            block: _,
-            options: { ...options, key: `${options.key ? options.key : _.type}-${j}` },
-            ancestors: [...ancestors, [parent, slotName]],
-        }), j));
-    }
+    const renderBlocksList = ({ blocks, parent, slotName = DEFAULT_SLOT_NAME, options, ancestors = [], }) => (blocks || []).map((_, j) => renderBlock({
+        block: _,
+        options: { ...options, key: `${options.key ? options.key : _.type}-${j}` },
+        ancestors: [...ancestors, [parent, slotName]],
+    }));
 
     const defaultBlockDecorator = ({ blockClassName, block, render }) => render({ blockClassName, block });
     const ContentPage = JSX((props) => {
-        const { className = '', blocksRegistry, blockDecorator, context, data = {} } = props;
+        const { className = '', blocksRegistry, blockDecorator, data = {} } = props;
         const { style: pageStyle, blocks, slots, likeControl, colorPalette = 'pc' } = data;
         const options = {
             key: '',
             blocksRegistry,
             page: data,
             blockDecorator: blockDecorator || defaultBlockDecorator,
-            context,
         };
         const pageSlots = renderSlots({ slots, parent: data, options });
-        return (jsxs("section", { className: `relative ${style2className(pageStyle)} ${className}`, "data-theme": colorPalette, children: [pageSlots?.header ? (jsx("div", { className: "mb-5 shadow-[0_8px_32px_0px_#00000014]", children: pageSlots.header })) : null, blocks?.length ? (jsxs("div", { className: "container grid grid-cols-12 gap-1", children: [renderBlocksList({ blocks, parent: data, options }), pageSlots?.footer ? pageSlots.footer : null] })) : null, likeControl ? renderLikeControl(context) : null] }));
+        return (jsxs("section", { className: `relative ${style2className(pageStyle)} ${className}`, "data-theme": colorPalette, children: [pageSlots?.header ? (jsx("div", { className: "mb-5 shadow-[0_8px_32px_0px_#00000014]", children: pageSlots.header })) : null, blocks?.length ? (jsxs("div", { className: "container grid grid-cols-12 gap-1", children: [renderBlocksList({ blocks, parent: data, options }), pageSlots?.footer ? pageSlots.footer : null] })) : null, likeControl ? renderLikeControl() : null] }));
     });
     ContentPage.childrenTypes = [];
     ContentPage.slots = () => ['header', 'footer'];
-    function renderLikeControl(context) {
-        return (jsx("div", { className: "flex items-end absolute bottom-0 right-0 h-full pointer-events-none", children: jsx(LikeControl, { className: "rounded-tl-lg sticky bottom-0 pointer-events-auto", context: context }, "LikeControl") }));
+    function renderLikeControl() {
+        return (jsx("div", { className: "flex items-end absolute bottom-0 right-0 h-full pointer-events-none", children: jsx(LikeControl, { className: "rounded-tl-lg sticky bottom-0 pointer-events-auto" }) }));
     }
 
-    const packageVersion = "0.6.26";
+    const packageVersion = "0.6.28";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;
     exports.DaDataAPI = DaDataAPI;
     exports.LikeAPI = LikeAPI;
+    exports.handlerDecorator = handlerDecorator;
     exports.joinList = joinList;
     exports.packageVersion = packageVersion;
     exports.projectSettings = projectSettings;
     exports.setup = setup;
     exports.setupHooks = setupHooks;
     exports.url = url;
+    exports.useRouter = useRouter;
 
     Object.defineProperty(exports, '__esModule', { value: true });