@redneckz/wildless-cms-uni-blocks 0.8.9 → 0.8.11

package/bundle/bundle.umd.js

@@ -81,12 +81,10 @@
             return this._.FOOTER;
         }
         get CDN() {
-            return this._.CDN;
+            return appendSlash(this._.CDN);
         }
         get BASE_PATH() {
-            return this._.BASE_PATH && !this._.BASE_PATH.endsWith('/')
-                ? `${this._.BASE_PATH}/`
-                : this._.BASE_PATH;
+            return appendSlash(this._.BASE_PATH);
         }
         get YANDEX_MAP_API_KEY() {
             return this._.YANDEX_MAP_API_KEY;
@@ -95,6 +93,7 @@
             return this._.YANDEX_METRIKA_ID;
         }
     })();
+    const appendSlash = (url) => (url && !url.endsWith('/') ? `${url}/` : url);
 
     const AUTH_PREFIX = 'guest';
     const STORAGE_KEY = 'likesToken';
@@ -419,6 +418,49 @@
         return (jsx("div", { ref: containerRef, className: `transition-max-h duration-300 overflow-hidden ${containerRef.current || !isUnfolded ? 'max-h-0' : ''} ${className}`, children: children }));
     });
 
+    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;
+    };
+
+    const dirname = (path) => path?.split('/').slice(0, -1).join('/');
+
+    const isURL = (href) => Boolean(href?.includes(':'));
+    const isLocalURL = (href, target) => Boolean(href && !isURL(href) && (!target || target === '_self'));
+    const isHash = (href) => Boolean(href?.startsWith('#'));
+    const withoutQuery = (href) => (href || '').replace(/\?.*/, '').replace(/\/$/, '');
+    const joinPath = (...path) => path.filter(Boolean).join('/').replace(/\/+/g, '/');
+
+    var url = /*#__PURE__*/Object.freeze({
+        __proto__: null,
+        isURL: isURL,
+        isLocalURL: isLocalURL,
+        isHash: isHash,
+        withoutQuery: withoutQuery,
+        joinPath: joinPath
+    });
+
+    const adjustHref = (router) => (href) => {
+        if (!href || isURL(href) || (projectSettings.CDN && href.startsWith(projectSettings.CDN))) {
+            return href;
+        }
+        const isRelativeToBase = href.startsWith('/');
+        return joinPath(projectSettings.BASE_PATH, isRelativeToBase ? '/' : dirname(router.pathname), href);
+    };
+
     const svgUseStyleMap = {
         normal: '',
         color: 'text-primary-main',
@@ -426,7 +468,8 @@
         white: 'text-black',
     };
     const Icon = JSX(({ className = '', imageClassName = '', name = '', alt = `Иконка ${name}`, title = alt, iconVersion = 'color', asSVG, ...imgProps }) => {
-        const href = `${projectSettings.CDN || ''}icons/${name}.svg`;
+        const router = useRouter();
+        const href = adjustHref(router)(joinPath(projectSettings.CDN, '/icons', `${name}.svg`));
         if (asSVG && iconVersion !== 'normal') {
             return (jsx(Background, { className: className, children: jsxs("svg", { className: style(getSvgSize(imgProps.width), svgUseStyleMap[iconVersion], iconVersion === 'white' ? 'invert' : '', imageClassName), ...imgProps, "aria-hidden": "true", children: [title ? jsx("title", { children: title }) : null, alt ? jsx("desc", { children: alt }) : null, jsx("use", { href: `${href}#icon`, xlinkHref: `${href}#icon` })] }) }));
         }
@@ -435,22 +478,18 @@
     const getSvgSize = (width) => (width ? '' : 'w-full h-full');
     const Background = JSX(({ className, children }) => className ? jsx("div", { className: className, children: children }) : children);
 
-    const sourcesComparator = (a, b) => {
-        if (a.media && b.media) {
-            return a.media - b.media;
-        }
-        return 0;
-    };
+    const sourcesComparator = (a, b) => a?.media && b?.media ? a.media - b.media : 0;
     const ImgAsPicture = JSX(({ className = '', image, imageClassName = '', isMobile = false, pathPrefix }) => {
-        if (!image || (!image?.sources && !image?.src)) {
-            return null;
-        }
+        const router = useRouter();
         const pictureStyles = isMobile ? 'flex' : 'flex-none';
         return (jsxs("picture", { className: `${pictureStyles} ${className}`, children: [image?.sources?.length
                     ? image.sources
+                        .filter((_) => _?.src)
                         .sort(sourcesComparator)
-                        .map(({ src, format, media }, index) => (jsx("source", { srcSet: addPathPrefixToSrcSet(src, pathPrefix), type: formatToMimeType(format), media: media ? `(max-width: ${media}px)` : '', ...image.size }, `${index}_${src}`)))
-                    : null, renderImg({ ...image, src: addPathPrefixToSrc(image.src, pathPrefix) }, imageClassName, isMobile)] }));
+                        .map(({ src, format, media }, index) => (jsx("source", { srcSet: adjustSrcset(router, pathPrefix)(src), type: formatToMimeType(format), media: media ? `(max-width: ${media}px)` : '', ...image.size }, `${index}_${src}`)))
+                    : null, image?.src
+                    ? renderImg({ ...image, src: adjustSrcset(router, pathPrefix)(image.src) }, imageClassName, isMobile)
+                    : null] }));
     });
     const renderImg = (image, imageClassName = '', isMobile = false) => {
         const style = {
@@ -462,15 +501,14 @@
         const imgStyle = isMobile ? 'm-auto' : 'm-0';
         return (jsx("img", { src: image.src, className: `${imgStyle} ${imageClassName}`, alt: alt, title: title, style: style, ...image.size }));
     };
-    const normalizePathPrefix = (pathPrefix = '') => pathPrefix && !pathPrefix.endsWith('/') ? `${pathPrefix}/` : pathPrefix;
-    const addPathPrefixToSrc = (src, pathPrefix) => !src || src?.startsWith('data:image') ? src : `${normalizePathPrefix(pathPrefix)}${src}`;
-    const addPathPrefixToSrcSet = (srcset, pathPrefix) => srcset
-        ?.split(',')
-        .map((src) => addPathPrefixToSrc(src.trim(), pathPrefix))
+    const adjustSrcset = (router, pathPrefix) => (srcset) => srcset
+        ?.split(/\s*,\s*/)
+        .map((src) => src.trim())
+        .filter(Boolean)
+        .map((src) => (isURL(src) ? src : joinPath(pathPrefix, src)))
+        .map(adjustHref(router))
         .join(', ');
-    function formatToMimeType(format) {
-        return format ? `image/${String(format)}` : undefined;
-    }
+    const formatToMimeType = (format) => format ? `image/${String(format)}` : undefined;
 
     const ImgInner = JSX(({ className = '', image, imageClassName = '', isMobile, pathPrefix, ...iconProps }) => {
         if (!image?.src && !image?.icon) {
@@ -614,31 +652,6 @@
         },
     ];
 
-    const normalizeAnchor = (anchor) => anchor?.replace('#', '') || '';
-    function gotoBlock(router, anchor) {
-        router.replace(`#${normalizeAnchor(anchor)}`);
-    }
-    function trackBlock(router, block) {
-        router.replace(`#${normalizeAnchor(block?.anchor)}`, undefined, {
-            scroll: false,
-        });
-    }
-
-    const isURL = (href) => Boolean(href?.includes('//'));
-    const isLocalURL = (href, target) => Boolean(href && !isURL(href) && (!target || target === '_self'));
-    const isHash = (href) => Boolean(href?.startsWith('#'));
-    const withoutQuery = (href) => (href || '').replace(/\?.*/, '').replace(/\/$/, '');
-    const joinPath = (...path) => path.filter(Boolean).join('/').replace(/\/+/g, '/');
-
-    var url = /*#__PURE__*/Object.freeze({
-        __proto__: null,
-        isURL: isURL,
-        isLocalURL: isLocalURL,
-        isHash: isHash,
-        withoutQuery: withoutQuery,
-        joinPath: joinPath
-    });
-
     /* eslint-disable @typescript-eslint/ban-types */
     const handlerDecorator = (handler, targetContent) => {
         return handlerDecorator._impl(handler, targetContent);
@@ -648,53 +661,24 @@
         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(isRemote) {
         const router = useRouter();
         return (props) => ({
             ...props,
-            href: adjustHref(props.href),
+            href: isRemote ? props.href : adjustHref(router)(props.href),
             'aria-label': props.text,
             onClick: handlerDecorator(handleHref(props), props),
         });
-        function adjustHref(href) {
-            const isRelativeToBase = !isRemote && href?.startsWith('/');
-            return projectSettings.BASE_PATH && href && isRelativeToBase
-                ? joinPath(projectSettings.BASE_PATH, href)
-                : href;
-        }
         function handleHref({ href, target, onClick }) {
             return (ev) => {
                 onClick && onClick(ev);
-                if (isRemote || !isLocalURL(href, target)) {
+                if (!href || isRemote || !isLocalURL(href, target)) {
                     // Default routing
                     return;
                 }
                 // Client routing
                 ev?.preventDefault();
-                if (isHash(href)) {
-                    gotoBlock(router, href);
-                }
-                else if (href) {
-                    router.push(href);
-                }
+                router.push(href);
             };
         }
     }
@@ -1111,8 +1095,8 @@
         return (jsx(BlockWrapper, { className: `font-sans bg-white p-[50px] pb-9 ${className}`, ...rest, children: jsxs("div", { className: "container max-w-[978px]", children: [title ? jsx(Heading, { headingType: "h3", title: title, className: "text-center mb-8" }) : null, COMPONENTS_MAP[typeForm]({ button, link, handleSubmit }), responceType ? jsx(ResponseNotification, { responceType: responceType }) : null] }) }));
     });
 
-    const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => (jsxs(BlockWrapper, { className: `p-12 flex flex-col items-center ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", as: "h2", className: "max-w-[47rem] text-center", title: title })) : null, benefitList?.length ? (jsx("div", { className: "flex flex-wrap w-full justify-center gap-x-20 mt-8", children: benefitList.map(renderStep) })) : null] })));
-    const renderStep = (benefit, i) => {
+    const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => (jsxs(BlockWrapper, { className: `p-12 flex flex-col items-center ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", as: "h2", className: "max-w-[47rem] text-center", title: title })) : null, benefitList?.length ? (jsx("div", { className: "flex flex-wrap w-full justify-center gap-x-20 mt-8", children: benefitList.map(renderStep$1) })) : null] })));
+    const renderStep$1 = (benefit, i) => {
         const description = benefit.description;
         return (jsxs("div", { className: "flex items-center basis-1/2 max-w-[500px] mb-14", children: [benefit?.icon?.icon ? (jsx(ImgInner, { className: "w-12 h-12 min-w-12 p-3 rounded-full bg-main-divider text-primary-main group-data-secondary:bg-white/30 group-data-secondary:text-black", image: benefit.icon, asSVG: true })) : null, benefit?.icon?.src ? jsx(ImgInner, { image: benefit.icon }) : null, jsxs("div", { className: "ml-5", children: [benefit?.label ? jsx(Heading, { headingType: "h6", children: benefit.label }) : null, renderDescription$5(description)] })] }, String(i)));
     };
@@ -1320,7 +1304,7 @@
         maxSum: 5000000,
         minMonths: 2,
         maxMonths: 120,
-        rate: 5.9,
+        rate: 7,
         isMonthlyInterestPayment: true,
     };
     const DEFAULT_BUSINESS_DEPOSIT_CALCULATOR_PARAMS = {
@@ -1328,7 +1312,7 @@
         maxSum: 500000,
         minDays: BUSINESS_MIN_DAYS,
         maxDays: BUSINESS_MAX_DAYS,
-        rate: 5.9,
+        rate: 6.6,
         isMonthlyInterestPayment: true,
         isReplenished: false,
         isPartialWithdrawal: false,
@@ -1340,7 +1324,7 @@
     const DEPOSIT_CALC_DEFAULT_DIR = 'deposit-calculator-data';
     const BUSINESS_DEPOSIT_CALC_DEFAULT_DIR = 'business-calculator-data';
 
-    const Rate = JSX(({ rate, title = 'Ставка', unit, depositeName, isShowDepositeName, rateBlockClassName }) => (jsxs("div", { children: [jsx(Text, { size: "text-l-light", color: "text-secondary-text", children: title }), jsxs("div", { className: "relative", children: [jsxs("div", { className: "flex justify-start", children: [jsx("span", { className: style('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 })) : ('')] }), depositeName && isShowDepositeName ? (jsx("div", { className: "absolute bottom-7 w-full text-center whitespace-nowrap", children: depositeName })) : null] })] })));
+    const Rate = JSX(({ rate, title = 'Ставка', unit, depositeName, isShowDepositeName, rateBlockClassName }) => (jsxs("div", { children: [jsx(Text, { size: "text-l-light", color: "text-secondary-text", children: title }), jsxs("div", { className: "relative", children: [jsxs("div", { className: "flex justify-start", children: [jsx("span", { className: style('block gradient-color-text font-mohave text-title-huge pr-6 -mt-4', rateBlockClassName), children: String(rate.toFixed(2)).replace('.', ',') }), unit ? (jsx("span", { className: "gradient-color-text text-[65px] leading-[75px]", children: unit })) : ('')] }), depositeName && isShowDepositeName ? (jsx("div", { className: "absolute bottom-7 w-full text-center whitespace-nowrap", children: depositeName })) : null] })] })));
 
     const renderFootnote = (text) => text ? (jsx(Paragraph, { size: "text-s-light", color: "text-secondary-text", children: text })) : null;
 
@@ -1440,6 +1424,17 @@
 
     const UnknownRate = JSX(({ title = 'Ставка' }) => (jsxs("div", { children: [jsx(Text, { size: "text-l-light", color: "text-secondary-text", children: title }), jsx("div", { className: "mt-1 pt-1 pl-5 pb-1.5", children: jsx(ImgInner, { image: { icon: 'PercentIcon' }, width: "90", height: "85", asSVG: true }) }), jsx("div", { className: "w-[250px] mt-3.5", children: jsxs(Paragraph, { size: "text-xl-light", color: "text-primary-text", children: ["\u041F\u0440\u043E\u0446\u0435\u043D\u0442\u043D\u0430\u044F \u0441\u0442\u0430\u0432\u043A\u0430 \u0434\u043B\u044F \u0441\u0440\u043E\u043A\u0430 ", jsx("strong", { children: "1-30 \u0434\u043D\u0435\u0439" }), " \u0443\u0441\u0442\u0430\u043D\u0430\u0432\u043B\u0438\u0432\u0430\u0435\u0442\u0441\u044F \u043F\u0440\u0438 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0438 \u0432 \u0411\u0430\u043D\u043A"] }) })] })));
 
+    const defaultDiscriminator = (_) => _;
+    const maxBy = (discriminator = defaultDiscriminator) => (list) => list.reduceRight((a, b) => (discriminator(a) > discriminator(b) ? a : b));
+
+    const minBy = (discriminator = defaultDiscriminator) => maxBy((_) => -discriminator(_));
+
+    const getRangeByKeys = ([minKey, maxKey], rows = []) => ({
+        [minKey]: rows.length ? minBy()(rows.map((row) => row[minKey])) : 0,
+        [maxKey]: rows.length ? maxBy()(rows.map((row) => row[maxKey])) : 0,
+    });
+    const checkRangeByKeys = (value, [minKey, maxKey], sourceBookRow) => value >= sourceBookRow[minKey] && value < sourceBookRow[maxKey];
+
     const useBusinessDepositCalculatorParams = (userInputParams, sourceBookDir) => {
         const { daysValue, moneyValue, isPartialWithdrawal, isReplenished, isSmallBusiness, isMonthlyInterestPayment, } = userInputParams;
         const data = useCalculatorParams(sourceBookDir || BUSINESS_DEPOSIT_CALC_DEFAULT_DIR);
@@ -1456,21 +1451,27 @@
         const businessDepositCalculatorSourceBookParams = data?.rows?.find((_) => {
             return (isMonthlyInterestPayment === _.isMonthlyInterestPayment &&
                 isSmallBusiness === _.isSmallBusiness &&
-                (isOperatingDeposit
-                    ? _.isReplenished && _.isPartialWithdrawal
-                    : !_.isReplenished && !_.isPartialWithdrawal));
+                checkIsOperatingDeposit(isOperatingDeposit, _) &&
+                checkRangeByKeys(moneyValue, ['minSum', 'maxSum'], _) &&
+                checkRangeByKeys(daysValue, ['minDays', 'maxDays'], _));
         }) || DEFAULT_BUSINESS_DEPOSIT_CALCULATOR_PARAMS;
         const { rate } = businessDepositCalculatorSourceBookParams;
         const income = getDepositIncome$1(rate, userInputParams);
         const finalSum = moneyValue + income;
+        const sourceBookRows = data?.rows || [DEFAULT_BUSINESS_DEPOSIT_CALCULATOR_PARAMS];
         return {
             ...businessDepositCalculatorSourceBookParams,
+            ...getRangeByKeys(['minSum', 'maxSum'], sourceBookRows),
+            ...getRangeByKeys(['minDays', 'maxDays'], sourceBookRows),
             ...userInputParams,
             isDisabledOperatingDeposit,
             income,
             finalSum,
         };
     };
+    const checkIsOperatingDeposit = (isOperatingDeposit, sourceBookRow) => isOperatingDeposit
+        ? sourceBookRow.isReplenished && sourceBookRow.isPartialWithdrawal
+        : !sourceBookRow.isReplenished && !sourceBookRow.isPartialWithdrawal;
     const getDepositIncome$1 = (rate, userInputParams) => {
         const { isMonthlyInterestPayment, moneyValue, daysValue } = userInputParams;
         /*
@@ -1542,18 +1543,23 @@
     };
 
     const useCreditCalculatorParams = (userInputParams, sourceBookDir) => {
-        const { isInsurance, isSalaryClient, isStateEmployee, moneyValue } = userInputParams;
+        const { isInsurance, isSalaryClient, isStateEmployee, moneyValue, monthsValue } = userInputParams;
         const data = useCalculatorParams(sourceBookDir || CREDIT_CALC_DEFAULT_DIR);
         const creditCalculatorSourceBookParams = data?.rows?.find((_) => {
             return (isInsurance === _.isInsurance &&
                 isSalaryClient === _.isSalaryClient &&
-                isStateEmployee === _.isStateEmployee);
+                isStateEmployee === _.isStateEmployee &&
+                checkRangeByKeys(moneyValue, ['minSum', 'maxSum'], _) &&
+                checkRangeByKeys(monthsValue, ['minMonths', 'maxMonths'], _));
         }) || DEFAULT_CREDIT_CALCULATOR_PARAMS;
         const { rateBottomRange, rateTopRange, sumBorder } = creditCalculatorSourceBookParams;
         const finalRate = moneyValue <= sumBorder ? rateBottomRange : rateTopRange;
         const monthlyPayment = getMonthlyPayment(finalRate, userInputParams);
+        const sourceBookRows = data?.rows || [DEFAULT_CREDIT_CALCULATOR_PARAMS];
         return {
             ...creditCalculatorSourceBookParams,
+            ...getRangeByKeys(['minSum', 'maxSum'], sourceBookRows),
+            ...getRangeByKeys(['minMonths', 'maxMonths'], sourceBookRows),
             ...userInputParams,
             finalRate,
             monthlyPayment,
@@ -1594,14 +1600,23 @@
     });
 
     const useDepositCalculatorParams = (userInputParams, sourceBookDir) => {
-        const { isMonthlyInterestPayment, moneyValue } = userInputParams;
+        const { isMonthlyInterestPayment, moneyValue, monthsValue } = userInputParams;
         const data = useCalculatorParams(sourceBookDir || DEPOSIT_CALC_DEFAULT_DIR);
-        const depositCalculatorSourceBookParams = data?.rows?.find((_) => isMonthlyInterestPayment === _.isMonthlyInterestPayment) ||
-            DEFAULT_DEPOSIT_CALCULATOR_PARAMS;
+        const depositCalculatorSourceBookParams = data?.rows?.find((_) => isMonthlyInterestPayment === _.isMonthlyInterestPayment &&
+            checkRangeByKeys(moneyValue, ['minSum', 'maxSum'], _) &&
+            checkRangeByKeys(monthsValue, ['minMonths', 'maxMonths'], _)) || DEFAULT_DEPOSIT_CALCULATOR_PARAMS;
         const { rate } = depositCalculatorSourceBookParams;
         const income = getDepositIncome(rate, userInputParams);
         const finalSum = moneyValue + income;
-        return { ...depositCalculatorSourceBookParams, ...userInputParams, income, finalSum };
+        const sourceBookRows = data?.rows || [DEFAULT_DEPOSIT_CALCULATOR_PARAMS];
+        return {
+            ...depositCalculatorSourceBookParams,
+            ...getRangeByKeys(['minSum', 'maxSum'], sourceBookRows),
+            ...getRangeByKeys(['minMonths', 'maxMonths'], sourceBookRows),
+            ...userInputParams,
+            income,
+            finalSum,
+        };
     };
     const getDepositIncome = (rate, userInputParams) => {
         const { isMonthlyInterestPayment, moneyValue, monthsValue } = userInputParams;
@@ -1811,11 +1826,6 @@
 
     const areArraysEqual = (as, bs) => as === bs || Boolean(as && bs && as?.length === bs?.length && as.every((_, i) => _ === bs[i]));
 
-    const defaultDiscriminator = (_) => _;
-    const maxBy = (discriminator = defaultDiscriminator) => (list) => list.reduceRight((a, b) => (discriminator(a) > discriminator(b) ? a : b));
-
-    const minBy = (discriminator = defaultDiscriminator) => maxBy((_) => -discriminator(_));
-
     const getItemWidth = (container) => (itemCount) => container.scrollWidth / itemCount;
     const scrollBy = (container) => (itemCount, delta) => {
         container.scrollBy({ left: delta * getItemWidth(container)(itemCount), behavior: 'smooth' });
@@ -1916,10 +1926,12 @@
             isCyclic,
         });
         const isBankHistoryCarousel = childBlocks && childBlocks[0]?.type === 'CarouselBankHistoryCard';
-        return (jsx(BlockWrapper, { className: style(getPaddingStyle(isPadding), className), ...rest, children: jsxs("div", { className: "relative max-w-full", children: [jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: visibleItemCount, snapAlign: "snap-start", gap: ITEMS_GAP, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: renderChildren({
-                            ...rest,
-                            block: { ...rest.block, blocks: buildBlocks(childBlocks, activeIndex) },
-                        }) }), jsx(CarouselScrollButtons, { scroll: scroll, isBlur: isBlur, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count })] }) }));
+        return (jsx(BlockWrapper, { className: style(getPaddingStyle(isPadding), className), ...rest, children: jsxs("div", { className: "relative max-w-full", children: [jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: visibleItemCount, snapAlign: "snap-start", gap: ITEMS_GAP, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: isBankHistoryCarousel
+                            ? renderChildren({
+                                ...rest,
+                                block: { ...rest.block, blocks: buildBlocks(childBlocks, activeIndex) },
+                            })
+                            : renderChildren(rest) }), jsx(CarouselScrollButtons, { scroll: scroll, isBlur: isBlur, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count })] }) }));
     });
     Carousel.childrenTypes = [
         'CarouselCard',
@@ -3504,6 +3516,7 @@
         throw new Error(x);
     }
 
+    // TODO: Create universal function for this case
     const renderBenefit$2 = 
     // Linter doesn't understand that switch processes all cases
     // eslint-disable-next-line consistent-return
@@ -3640,6 +3653,7 @@
         return (jsx("div", { className: `mt-2.5 z-10 ${descriptionWidth}`, children: jsx(Paragraph, { size: "text-m", font: "font-light", color: "group-data-primary:text-secondary-text", children: additionalDescription }) }));
     }
 
+    // TODO: Create universal function for this case
     const renderBenefit = 
     // Linter doesn't understand that switch processes all cases
     // eslint-disable-next-line consistent-return
@@ -3842,19 +3856,30 @@
     });
     const normalizeSelectedRegion = (selectedRegion, regions) => !selectedRegion && regions?.length && regions[0]?.code ? regions[0].code : selectedRegion;
 
-    const checkIsIconRenderable = (icon) => Boolean(icon?.icon || icon?.src);
+    const checkCanRenderIcon = (icon) => Boolean(icon?.icon || icon?.src);
 
-    const renderStepContent = ({ styleMap, isMainButton, version, }) => (step, i, { length }) => {
+    // TODO: Create universal function for this case
+    const renderStep = (props) => 
+    // Linter doesn't understand that switch processes all cases
+    // eslint-disable-next-line consistent-return
+    (step, i, arr) => {
+        const { type } = step;
+        if (!(type === 'default' || type === 'rte')) {
+            return null;
+        }
+        switch (type) {
+            case 'default':
+                return renderDefaultStep(props)(step, i, arr);
+            case 'rte':
+                return jsx(RichText, { __html: step.__html });
+            default:
+                assertUnreachable(step);
+        }
+    };
+    const renderDefaultStep = ({ styleMap, isMainButton, version }) => (step, i, arr) => {
         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({
-                                    description,
-                                    className: styleMap.description,
-                                }), jsx(List, { className: getItemsClasses({ className: 'text-left', description, styleMap }), items: items, listItemSize: "M", isDotted: isDotted })] })] }), 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);
-    const getItemsClasses = ({ className, description, styleMap, }) => [description ? styleMap.description : 'text-h6', description ? 'mt-0.5' : '', className].join(' ');
+        return (jsxs("div", { className: style('relative flex flex-col items-center text-center whitespace-pre-line overflow-hidden', getContainerWidth(arr.length)), children: [jsxs("div", { className: style(button?.text ? 'mb-8' : '', 'text-center'), children: [label ? (jsx("div", { className: "mb-2", children: jsx(Text, { size: "text-h6", children: label }) })) : null, jsxs("div", { className: "flex flex-col items-center", children: [description ? jsx("div", { className: styleMap.description, children: description }) : null, jsx(List, { className: style(description ? `${styleMap.description} mt-0.5` : 'text-h6'), items: items, listItemSize: "M", isDotted: isDotted })] })] }), 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 getContainerWidth = (length) => (length < 5 ? 'w-[276px]' : 'w-[210px]');
 
     const STEPS_BLOCK_STYLE_MAPS = {
@@ -3899,21 +3924,14 @@
 
     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', ...rest }) => {
-        const { title } = rest;
-        const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
+    const StepsBlock = JSX(({ className = '', showLines = true, steps = [], button, version = 'primary', title, ...rest }) => {
         const shortGaps = steps.length > 3;
+        const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
         const lineOpacity = getLineOpacity(showLines);
-        const titleMargin = title ? 'mt-9' : '';
         const paddingX = getPaddingX(steps.length);
-        return (jsxs(BlockWrapper, { className: [
-                'box-border py-12',
-                shortGaps ? 'px-20' : 'px-[70px]',
-                'flex flex-col items-center overflow-hidden',
-                className,
-            ].join(' '), version: version, ...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-60", version: "primary", ...button }) : null] }));
+        return (jsxs(BlockWrapper, { className: style('box-border py-12', shortGaps ? 'px-20' : 'px-[70px]', 'flex flex-col items-center overflow-hidden', className), version: version, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", className: "max-w-[752px] text-center mb-9", title: title })) : null, steps?.length ? (jsxs("div", { className: "box-border", children: [jsx("div", { className: style('flex items-center', paddingX), children: joinList(jsx("div", { className: style('h-0.5 w-full bg-secondary-light', lineOpacity) }))(steps.map(renderStepIcon(styleMap, version))) }), jsx("div", { className: style('flex justify-between mt-4', shortGaps ? 'gap-x-3' : 'gap-x-[101px]'), children: steps.map(renderStep({ styleMap, isMainButton: Boolean(button?.text), version })) })] })) : null, button?.text ? jsx(Button, { className: "mt-8 min-w-60", version: "primary", ...button }) : null] }));
     });
-    const renderStepIcon = (styleMap, version) => ({ icon }, i) => (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 ${styleMap.iconBackground}`, children: checkIsIconRenderable(icon) ? (jsx(ImgInner, { image: getIconWithVersion(icon || {}, version), width: "48", height: "48", asSVG: true })) : (jsx("span", { className: `text-h4 ${styleMap.iconText}`, children: i + 1 })) }) }, String(i)));
+    const renderStepIcon = (styleMap, version) => ({ icon }, i) => (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 ${styleMap.iconBackground}`, children: checkCanRenderIcon(icon) ? (jsx(ImgInner, { image: getIconWithVersion(icon || {}, version), width: "48", height: "48", asSVG: true })) : (jsx("span", { className: `text-h4 ${styleMap.iconText}`, children: i + 1 })) }) }, String(i)));
 
     const containerStyles = {
         'horizontal-list': 'mx-auto mt-5 w-fit',
@@ -4315,10 +4333,10 @@
     });
     const renderTag = (tag, key) => (jsx("span", { className: "text-m-light py-2 px-2.5 border-solid border rounded-md border-gray", children: tag }, String(key)));
 
-    const Tile = JSX(({ title, headingType = 'h3', description, items, buttons, image, isDotted = true, listItemSize = 'M', className = '', tags, children, ...rest }) => (jsx(BlockWrapper, { className: `overflow-hidden p-9 pr-3 box-border ${getTileRightPadding(className)} ${getTileMinHeight(className)} ${className}`, ...rest, children: jsxs(BaseTile, { title: title ? (jsx(Heading, { headingType: headingType, as: "h2", title: title, className: `whitespace-pre-wrap max-w-[600px]` })) : null, buttons: renderButtonsSection(buttons, {
+    const Tile = JSX(({ title, headingType = 'h3', __html, items, buttons, image, isDotted = true, listItemSize = 'M', className = '', tags, children, ...rest }) => (jsx(BlockWrapper, { className: `overflow-hidden p-9 pr-3 box-border ${getTileRightPadding(className)} ${getTileMinHeight(className)} ${className}`, ...rest, children: jsxs(BaseTile, { title: title ? (jsx(Heading, { headingType: headingType, as: "h2", title: title, className: `whitespace-pre-wrap max-w-[600px]` })) : null, buttons: renderButtonsSection(buttons, {
                 className: 'mt-8',
                 buttonClassName: 'min-w-[158px]',
-            }), image: image?.src ? jsx(ImgInner, { className: "mt-auto ml-7", image: image }) : null, children: [description ? (jsx("div", { className: "max-w-[600px] mt-2.5", children: jsx(Paragraph, { size: "text-xl-light", children: description }) })) : null, children, jsx(List, { className: "mt-2.5", itemClassName: "mb-1.5", items: items, isDotted: isDotted, listItemSize: listItemSize }), tags?.length ? jsx(Tags, { tags: tags, className: "mt-5" }) : null] }) })));
+            }), image: image?.src ? jsx(ImgInner, { className: "mt-auto ml-7", image: image }) : null, children: [__html ? (jsx("div", { className: "max-w-[600px] mt-2.5", children: jsx(RichText, { __html: __html }) })) : null, children, jsx(List, { className: "mt-2.5", itemClassName: "mb-1.5", items: items, isDotted: isDotted, listItemSize: listItemSize }), tags?.length ? jsx(Tags, { tags: tags, className: "mt-5" }) : null] }) })));
 
     const alignStyle = {
         left: 'items-start',
@@ -4415,6 +4433,11 @@
         return debouncedCallback;
     };
 
+    const normalizeAnchor = (anchor) => anchor?.replace('#', '') || '';
+    function trackBlock(block) {
+        globalThis.history?.replaceState(globalThis.history?.state, '', `#${normalizeAnchor(block?.anchor)}`);
+    }
+
     const SPECIAL_BLOCK_TYPES = ['Header', 'Footer'];
     const EPS = 0.01;
     const topLineDelta = ([, { target }]) => Math.abs(target.getBoundingClientRect().top);
@@ -4428,7 +4451,6 @@
 
     const isScrolledEnough = () => globalThis.scrollY > (globalThis.innerHeight * 3) / 4;
     function useBlockRouterProvider(scrollTarget = globalThis) {
-        const router = useRouter();
         const intersectionsMapRef = useRef(new Map());
         useEffect(() => blockRouterEventBus.subscribe('intersection', ({ block, intersection }) => {
             if (intersectionsMapRef.current) {
@@ -4437,20 +4459,14 @@
         }), []);
         useEffect(() => {
             const handleScroll = debounce(() => {
-                if (isScrolledEnough()) {
-                    const activeBlock = findActiveBlock([...(intersectionsMapRef.current || [])]);
-                    trackBlock(router, activeBlock);
-                }
-                else {
-                    trackBlock(router);
-                }
+                trackBlock(isScrolledEnough() ? findActiveBlock([...(intersectionsMapRef.current || [])]) : undefined);
             }, 100);
             scrollTarget.addEventListener('scroll', handleScroll);
             return () => {
                 handleScroll.dispose();
                 scrollTarget.removeEventListener('scroll', handleScroll);
             };
-        }, [router, scrollTarget]);
+        }, [scrollTarget]);
     }
 
     const api = LikeAPI();
@@ -4521,7 +4537,7 @@
         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.8.9";
+    const packageVersion = "0.8.11";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;