@redneckz/wildless-cms-uni-blocks 0.12.6 → 0.12.8

package/mobile/bundle/bundle.umd.js

@@ -357,39 +357,56 @@
         XXL: {
             title: { headingType: 'h0', as: 'h1' },
             descriptionSize: 'text-h5',
+            descriptionWeight: 'font-normal',
             descriptionStyle: 'mt-m',
         },
         XL: {
             title: { headingType: 'h1', as: 'h1' },
-            descriptionSize: 'text-xl-light',
+            descriptionSize: 'text-xl',
+            descriptionWeight: 'font-light',
             descriptionStyle: 'mt-s',
         },
         L: {
             title: { headingType: 'h2', as: 'h2' },
-            descriptionSize: 'text-xl-light',
+            descriptionSize: 'text-xl',
+            descriptionWeight: 'font-light',
             descriptionStyle: 'mt-s',
         },
         M: {
             title: { headingType: 'h3', as: 'h2' },
-            descriptionSize: 'text-xl-light',
+            descriptionSize: 'text-xl',
+            descriptionWeight: 'font-light',
             descriptionStyle: 'mt-text',
         },
         S: {
             title: { headingType: 'h4', as: 'h2' },
-            descriptionSize: 'text-xl-light',
+            descriptionSize: 'text-xl',
+            descriptionWeight: 'font-light',
             descriptionStyle: 'mt-xs',
         },
         XS: {
             title: { headingType: 'h5', as: 'h2' },
-            descriptionSize: 'text-l-light',
+            descriptionSize: 'text-l',
+            descriptionWeight: 'font-light',
             descriptionStyle: 'mt-xs',
         },
     };
+    // TODO Move to Gallery and rename
+    const HEADLINE_SMALL_VERSION = {
+        H6: 'text-h6',
+        XL_L: 'text-xl-light',
+        XL_R: 'text-xl',
+        L_L: 'text-l-light',
+        L_R: 'text-l',
+        M: 'text-m-light',
+        S: 'text-s-light',
+        XS: 'text-xs-light',
+    };
 
     const Headline = JSX(({ className, version = '', headlineVersion = 'XL', title, description, align = 'text-center', as, isPadding = true, isTheme = false, ...rest }) => {
         const versionStyle = headlineVersionStyles[headlineVersion];
         const descriptionStyle = { marginTop: versionStyle.descriptionStyle };
-        return (jsxs(BlockWrapper, { className: className, defaultPadding: isPadding ? 'p-default' : '', version: version, isTheme: isTheme, ...rest, children: [title ? (jsx(Heading, { className: style('whitespace-pre-wrap', align), ...versionStyle?.title, as: as || versionStyle?.title.as, title: title })) : null, description ? (jsx(Paragraph, { size: versionStyle.descriptionSize, align: align, ...descriptionStyle, children: description })) : null] }));
+        return (jsxs(BlockWrapper, { className: className, defaultPadding: isPadding ? 'p-default' : '', version: version, isTheme: isTheme, ...rest, children: [title ? (jsx(Heading, { className: style('whitespace-pre-wrap', align), ...versionStyle?.title, as: as || versionStyle?.title.as, title: title })) : null, description ? (jsx(Paragraph, { size: versionStyle.descriptionSize, font: versionStyle.descriptionWeight, align: align, ...descriptionStyle, children: description })) : null] }));
     });
 
     const mapChildren = (mapper) => (children) => {
@@ -574,6 +591,9 @@
         replace: () => {
             // Do nothing
         },
+        back: () => {
+            // Do nothing
+        },
     });
     useRouter.setup = (impl) => {
         useRouter._impl = impl;
@@ -736,7 +756,7 @@
 
     const ButtonInner = JSX((props) => {
         const { text, aboveText, appendLeft, appendRight, version = 'primary' } = props;
-        return (jsxs("div", { className: style(getButtonStyle(props), 'flex gap-2'), 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] }));
+        return (jsxs("div", { className: style(getButtonStyle(props), 'flex gap-2'), children: [appendLeft ? jsx("div", { className: iconStyleMap[version], children: appendLeft }) : null, isWithText(props) ? (jsxs("div", { children: [aboveText ? jsx("div", { className: "text-xs font-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 { version, aboveText, rounded } = props;
@@ -946,6 +966,8 @@
             : null;
     }
 
+    const ITEMS_GAP = 16;
+
     const ArrowButton = JSX(({ className, disabled, ...rest }) => (jsx(Button, { rounded: true, className: `group/btn 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(Img, { className: "w-4 h-4 min-w-4 min-h-4 rounded-full box-border", image: { icon: 'ArrowLeftIcon', iconVersion: 'black' }, imageClassName: "group-hover/btn:text-primary-main", width: "16", height: "16" }) })));
@@ -980,12 +1002,17 @@
     });
     const renderBlur = (isBlur, scroll) => isBlur ? (jsxs("div", { children: [scroll.canScrollLeft ? (jsx("div", { className: style(blurBaseStyle, 'left-0 bg-opacity-from-white') })) : null, scroll.canScrollRight ? (jsx("div", { className: style(blurBaseStyle, 'right-0 bg-opacity-to-white') })) : null] })) : null;
 
-    const ITEMS_GAP = 16;
+    const renderControlButtons = ({ showArrows, showDots, scrollButtonsProps, dotsProps, }) => {
+        return [
+            showArrows ? jsx(CarouselScrollButtons, { ...scrollButtonsProps }, "0") : null,
+            showDots ? jsx(SwipeListControlDots, { ...dotsProps, listType: "horizontal-list" }, "1") : null,
+        ];
+    };
 
-    const Carousel = JSX(({ className = '', itemCount, visibleItemCount, isBlur = true, isCyclic = false, arrowsPadded = true, isPadding = true, showDots = false, isAlignCenter = false, ...rest }) => {
+    const Carousel = JSX(({ className = '', itemCount, visibleItemCount = 0, isBlur = true, isCyclic = false, arrowsPadded = true, isPadding = true, showDots = false, isAlignCenter = false, showArrows = true, isGap = true, ...rest }) => {
         const { blocks: childBlocks = [] } = rest.block || {};
         const count = itemCount || childBlocks?.length;
-        const [activeIndex, setActiveIndex] = useState(Math.floor((visibleItemCount || 0) / 2));
+        const [activeIndex, setActiveIndex] = useState(Math.floor(visibleItemCount / 2));
         const increaseActiveIndex = useCallback(() => setActiveIndex((_) => _ + 1), []);
         const decreaseActiveIndex = useCallback(() => setActiveIndex((_) => _ - 1), []);
         const [containerRef, scroll] = useSwipeListScroll({
@@ -994,7 +1021,7 @@
         });
         const [dotsActiveIndex] = scroll.visibleIndicesRange;
         const isBankHistoryCarousel = childBlocks && childBlocks[0]?.type === 'CarouselBankHistoryCard';
-        return (jsx(BlockWrapper, { className: className, defaultPadding: getPaddingStyle$1(isPadding), ...rest, children: jsxs("div", { className: style(getAlignStyle(isAlignCenter), 'relative max-w-full'), children: [jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: visibleItemCount, snapAlign: "snap-start", gap: ITEMS_GAP, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: renderChildren({
+        return (jsx(BlockWrapper, { className: className, defaultPadding: getPaddingStyle$1(isPadding), ...rest, children: jsxs("div", { className: style(getAlignStyle(isAlignCenter), 'relative max-w-full'), children: [jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: visibleItemCount, snapAlign: "snap-start", gap: isGap ? ITEMS_GAP : undefined, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: renderChildren({
                             ...rest,
                             renderProps: isBankHistoryCarousel
                                 ? (block, options) => renderBlock(block, options, {
@@ -1002,7 +1029,21 @@
                                     activeIndex: activeIndex,
                                 })
                                 : renderBlock,
-                        }) }), jsx(CarouselScrollButtons, { scroll: scroll, isBlur: isBlur, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count }), showDots ? renderDots(containerRef, dotsActiveIndex, count) : null] }) }));
+                        }) }), renderControlButtons({
+                        showArrows,
+                        showDots,
+                        scrollButtonsProps: {
+                            scroll,
+                            arrowsPadded,
+                            isBlur,
+                            onScrollLeft: decreaseActiveIndex,
+                            onScrollRight: increaseActiveIndex,
+                            hasEdgeBlocks: isBankHistoryCarousel,
+                            activeIndex,
+                            itemCount: count,
+                        },
+                        dotsProps: { containerRef, activeIndex: dotsActiveIndex, dotCount: count },
+                    })] }) }));
     });
     Carousel.childrenTypes = [
         'CarouselCard',
@@ -1019,7 +1060,8 @@
     ];
     const getPaddingStyle$1 = (isPadding) => (isPadding ? 'p-default' : '');
     const getAlignStyle = (isAlignCenter) => isAlignCenter ? 'flex justify-center' : '';
-    const renderDots = (containerRef, dotsActiveIndex, itemCount) => (jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: dotsActiveIndex, dotCount: itemCount, listType: 'horizontal-list' }));
+
+    const CarouselBankHistoryCard = JSX(({ title, description, className }) => (jsx(BlockWrapper, { className: style(className), defaultPadding: "p-default", children: jsx(Headline, { headlineVersion: "S", title: title, description: description, align: "text-left", className: "text-primary-text", isPadding: false }) })));
 
     const LinkWrapper = JSX(({ className = '', href, target, isRemote = false, children }) => {
         const link = useLink({ isRemote });
@@ -1044,7 +1086,7 @@
     const ListItem = JSX(({ className, isDotted = true, children, size = 'M' }) => (jsxs("div", { className: style('font-sans flex', className), role: "listitem", children: [isDotted ? (jsx("div", { className: "shrink-0", children: jsx("div", { className: style('align-middle inline-block rounded-full bg-primary-text group-data-secondary:bg-white', DOT_SIZE_MAP[size]) }) })) : null, jsx("span", { children: children })] })));
 
     const TEXT_SIZE_MAP = {
-        S: 'text-l-light',
+        S: 'text-l font-light',
         M: 'text-h6',
         L: 'text-h5',
     };
@@ -1154,6 +1196,53 @@
     const renderFoldButton$1 = ({ isUnfolded, onToggle }) => (jsxs("button", { className: "w-full cursor-pointer text-primary-main pt-5 flex justify-between items-center", onClick: onToggle, children: [jsx("div", { children: isUnfolded ? 'Скрыть' : 'Подробнее о тарифе' }), jsx(Icon, { className: "text-primary-text", name: isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon', width: "16", height: "16" })] }));
     const renderHitIcon = () => (jsxs("div", { className: "absolute -top-7 -right-4 h-[60px] w-[60px] bg-white flex flex-col items-center justify-center rounded-md shadow-[0_4px_25px_rgba(0,0,0,0.07)]", children: [jsx(Icon, { iconVersion: "black", name: "HeartIcon", width: "23", height: "22" }), jsx(Paragraph, { size: "text-s", font: "font-normal", align: "text-center", color: "text-primary-text", children: "\u0425\u0418\u0422" })] }));
 
+    const getColSpan = (className) => {
+        const colSpanPrefix = 'col-span-';
+        const colSpanStr = className?.split(/\s+/).find((_) => _.startsWith(colSpanPrefix));
+        return colSpanStr ? parseInt(colSpanStr.substring(colSpanPrefix.length), 10) : 12;
+    };
+
+    const CARD_WIDTH_MAP = {
+        normal: 'min-w-[970px]',
+        small: 'min-w-[355px]',
+    };
+    function getCardWidth(className = '', carouselVersion = 'normal') {
+        const colSpan = getColSpan(className);
+        if (colSpan <= 4) {
+            return 'w-[375px]';
+        }
+        else {
+            return CARD_WIDTH_MAP[carouselVersion];
+        }
+    }
+
+    const titleSize = 'XS';
+
+    const BLOCK_CLASSES = 'absolute border border-solid border-gray w-full h-full sm:hidden';
+    const CarouselCard = JSX(({ className = '', button, description, title, carouselVersion = 'normal', version = '' }) => (jsx("section", { className: style('flex pb-9 pl-12 sm:p-5 border-box h-full sm:max-w-[375px]', getCardWidth(className, carouselVersion), className), children: jsxs("div", { className: "relative w-full", children: [jsx("div", { className: `${BLOCK_CLASSES} z-10 top-9 right-12 bg-green-dark` }), jsx("div", { className: `${BLOCK_CLASSES} z-10 top-6 right-8 bg-green` }), jsx("div", { className: `${BLOCK_CLASSES} z-10 top-3 right-4 bg-green-light` }), jsxs("div", { className: "relative h-full bg-white z-10 p-10 border border-solid border-green-light", children: [jsx(Headline, { className: "!p-0", title: title, description: description, headlineVersion: titleSize, align: "text-left", version: version }), renderButtonsSection([button], {
+                            className: 'mt-14 sm:justify-center',
+                            isVertical: true,
+                        })] })] }) })));
+
+    const cardStyleMap = {
+        black: 'bg-black',
+        white: 'bg-white',
+    };
+    const CarouselCatalogCard = JSX(({ className = '', title, description, image, price, button, colors, ...rest }) => (jsxs(BlockWrapper, { className: style('border box-border border-gray p-default sm:p-7 h-full flex flex-col justify-left', className), ...rest, children: [image?.src ? jsx(Img, { 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: "mb-4", children: jsx(Paragraph, { size: "text-m", align: "text-left", font: "font-light", children: description }) })) : null, colors?.length ? (jsxs("div", { className: "flex mb-4 text-secondary-text", children: [jsx("div", { className: "mr-1.5", children: jsx(Text, { size: "text-s", align: "text-left", font: "font-light", children: "\u0426\u0432\u0435\u0442\u0430:" }) }), colors.map(renderColorOption)] })) : null, price ? (jsxs(Text, { size: "text-h3", align: "text-left", children: [price, "\u00A0\u20BD"] })) : null, renderButtonsSection([button], { buttonClassName: 'mt-5 w-full' })] })));
+    const renderColorOption = (color, i) => (jsx("div", { role: "figure", className: `w-6 h-6 ml-1 sm:ml-3 border border-solid border-main-divider rounded-full ${cardStyleMap[color]}` }, String(i)));
+
+    const CarouselProductCard = JSX(({ additionalDescription, align = 'text-center', button = {}, className = '', description, headlineSmallVersion = 'H6', href, icon, isDotted = true, isFullWidth = true, items = [], target, title, version = 'primary', ...rest }) => {
+        return (jsxs(BlockWrapper, { className: style('h-full flex flex-col justify-between min-w-[260px]', 'box-border border-solid border border-gray', align, className), defaultPadding: "p-0", version: version, ...rest, children: [jsxs(LinkWrapper, { className: "p-s", href: href, target: target, children: [renderImage$2(icon), renderCardTitle(headlineSmallVersion, title), renderDescription$3(description, title), renderItems(items, isDotted, version), renderAdditionalDescription(additionalDescription)] }), renderButtonsSection([button], {
+                    className: style('p-s pt-0', isFullWidth ? '' : 'self-center min-w-[158px]'),
+                    isVertical: isFullWidth,
+                })] }));
+    });
+    const renderImage$2 = (image) => (jsxs("div", { className: "flex justify-center", children: [image?.src ? jsx(Img, { className: "mb-5", image: image }) : null, image?.icon ? jsx(Img, { className: `w-8 h-8 min-w-8 mb-5`, image: image }) : null] }));
+    const renderCardTitle = (headlineSmallVersion, title) => title ? (jsx("div", { children: jsx(Text, { size: HEADLINE_SMALL_VERSION[headlineSmallVersion], children: title }) })) : null;
+    const renderDescription$3 = (description, title) => description ? (jsx("div", { className: title ? 'mt-2' : '', children: jsx(Paragraph, { size: "text-l", children: description }) })) : null;
+    const renderAdditionalDescription = (additionalDescription) => additionalDescription ? (jsx("div", { className: "mt-auto", children: jsx(Text, { size: "text-m", font: "font-light", color: "text-secondary-text group-data-secondary:text-white/80", children: additionalDescription }) })) : null;
+    const renderItems = (items, isDotted, version = 'primary') => items?.length ? (jsx(List, { className: style('max-w-[308px] mt-2 text-s', version === 'primary' ? '!text-secondary-text' : ''), items: items.filter((item) => item?.text).map((item) => item.text), isDotted: isDotted })) : null;
+
     const GRADIENT = 'bg-gradient-to-r from-main-gradient-start to-main-gradient-end';
     const DIVIDER_CLASSES = 'border-main-divider border border-t-0 border-x-0';
 
@@ -1345,13 +1434,13 @@
 
     const Contacts = JSX(({ className = '', items, hasButton }) => (jsxs("div", { className: className, children: [items?.length ? items.map(renderContactsGroup) : null, hasButton ? (jsx(Button, { version: "primary", className: "mb-6 w-full", href: "https://www.rshb.ru/feedback/question/", 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 renderContactsGroup = (item, i) => (jsxs("div", { className: "mb-6", children: [jsx("div", { className: "mb-4", children: jsx(Text, { size: "text-l", font: "font-medium", children: item?.title }) }), jsx("div", { children: item.items?.map(renderContact) })] }, String(i)));
-    const renderContact = (item, index) => (jsxs("div", { className: "mb-4", children: [jsx("div", { children: renderText(item.type, item.text) }), jsx("div", { className: "mt-1 text-s-light text-secondary-text", children: item.description })] }, String(index)));
+    const renderContact = (item, index) => (jsxs("div", { className: "mb-4", children: [jsx("div", { children: renderText(item.type, item.text) }), jsx("div", { className: "mt-1 text-s font-light text-secondary-text", children: item.description })] }, String(index)));
     const renderText = (type, text = '') => {
         switch (type) {
             case 'tel':
                 return (jsx("a", { className: "text-h6 text-primary-text hover:text-primary-main no-underline", href: `tel:${formatTel(text)}`, children: text }));
             case 'email':
-                return (jsx("a", { className: "text-xl-light text-primary-text no-underline", href: `mailto:${text}`, children: text }));
+                return (jsx("a", { className: "text-xl font-light text-primary-text no-underline", href: `mailto:${text}`, children: text }));
             default:
                 return jsx("span", { children: text });
         }
@@ -1371,12 +1460,10 @@
     const TextInformationLink = JSX(({ className = '', index, ...rest }) => {
         const link = useLink({ isRemote: true });
         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}` }));
+        return (jsx("a", { className: `text-xs font-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 textInformationTextSize = 'text-s';
-
-    const TextInformation = JSX(({ className = '', links }) => (jsxs("div", { className: className, children: [jsx("div", { className: "pt-4 xl:pt-5", children: jsx(Text, { size: textInformationTextSize, color: "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-4", children: links.map((_, i) => (jsx(TextInformationLink, { index: i, ..._ }, String(i)))) })) : null] })));
+    const TextInformation = JSX(({ className = '', links }) => (jsxs("div", { className: className, children: [jsx("div", { className: "pt-4 xl:pt-5", children: jsx(Text, { size: "text-xs", font: "font-light", color: "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-4", children: links.map((_, i) => (jsx(TextInformationLink, { index: i, ..._ }, String(i)))) })) : null] })));
 
     const Footer = JSX(({ className = '', ...rest }) => {
         const fallback = rest.options?.page?.fallback;
@@ -1416,23 +1503,26 @@
         default: 'px-5 bg-main-divider rounded hover:text-primary-main',
         transparent: 'text-white hover:text-primary-hover',
     };
-    const HeaderTop = JSX(({ bgColor, logo, internetBankUrl, version, mobileHeaderType, mobileTitle, mobileBackwardButtonTitle, }) => {
-        const isTypeNone = mobileHeaderType === 'none';
-        const isTypeWithTitle = mobileHeaderType === 'withTitle';
-        return (jsxs("div", { className: "flex items-center justify-between w-full", children: [isTypeNone || isTypeWithTitle ? (jsx(Logo, { bgColor: bgColor, logo: logo, showTitle: isTypeNone })) : null, isTypeWithTitle ? mobileTitle : null, mobileHeaderType === 'backwardButton' ? (jsxs(Button, { className: "flex items-center text-l", children: [jsx(Img, { className: "w-6 h-6", image: {
+    const HeaderTop = JSX(({ bgColor, logo, internetBankUrl, version }) => {
+        const router = useRouter();
+        const isRootLocation = router.pathname === '/';
+        const onClick = useCallback(() => {
+            router.back();
+        }, []);
+        return (jsxs("div", { className: "flex items-center justify-between w-full", children: [isRootLocation ? (jsx(Logo, { bgColor: bgColor, logo: logo })) : (jsxs(Button, { className: "flex items-center text-l", ariaLabel: "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434", onClick: onClick, children: [jsx(Img, { className: "w-6 h-6", image: {
                                 icon: 'ChevronLeft',
                                 iconVersion: 'black',
-                            } }), mobileBackwardButtonTitle] })) : null, internetBankUrl ? (jsx(Button, { href: internetBankUrl, ariaLabel: "\u0412\u043E\u0439\u0442\u0438", target: "_blank", className: style('p-3 my-1 text-s whitespace-nowrap text-primary-main hover:text-primary-hover', BUTTON_STYLE[version === 'transparent' ? 'transparent' : 'default']), children: "\u0412\u043E\u0439\u0442\u0438" })) : null] }));
+                            } }), "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434"] })), internetBankUrl ? (jsx(Button, { href: internetBankUrl, ariaLabel: "\u0412\u043E\u0439\u0442\u0438", target: "_blank", className: style('p-3 my-1 text-s whitespace-nowrap text-primary-main hover:text-primary-hover', BUTTON_STYLE[version === 'transparent' ? 'transparent' : 'default']), children: "\u0412\u043E\u0439\u0442\u0438" })) : null] }));
     });
 
     const BG_COLOR_TO_BLOCK_VERSION = {
         'bg-white': 'primary',
         transparent: 'transparent',
     };
-    const Header = JSX(({ bgColor = 'bg-white', version = BG_COLOR_TO_BLOCK_VERSION[bgColor], mobileHeaderType = 'none', ...rest }) => {
+    const Header = JSX(({ bgColor = 'bg-white', version = BG_COLOR_TO_BLOCK_VERSION[bgColor], ...rest }) => {
         const fallback = rest.options?.page?.fallback;
         const { logo, internetBankUrl } = useSWRResource(projectSettings.SITEMAP || 'sitemap', fallback);
-        return (jsx(BlockWrapper, { tag: "header", defaultPadding: "", version: version, ...rest, children: jsx("div", { className: "container px-4 py-1 box-border", children: jsx(HeaderTop, { bgColor: bgColor, logo: logo, internetBankUrl: internetBankUrl, version: version, mobileHeaderType: mobileHeaderType, ...rest }) }) }));
+        return (jsx(BlockWrapper, { tag: "header", defaultPadding: "", version: version, ...rest, children: jsx("div", { className: "container px-4 py-1 box-border", children: jsx(HeaderTop, { bgColor: bgColor, logo: logo, internetBankUrl: internetBankUrl, version: version, ...rest }) }) }));
     });
 
     const ImgBlock = JSX((props) => {
@@ -1440,10 +1530,7 @@
         return (jsx(BlockWrapper, { className: className, defaultPadding: "p-0", ...rest, children: jsx(Img, { image: image }) }));
     });
 
-    const LinkDocsListItem = JSX(({ doc, icon }) => {
-        const { text, fileSize, ...linkProps } = doc;
-        return (jsxs("a", { className: "flex box-border gap-3 group/item h-fit w-fit text-primary-text no-underline hover:text-primary-main", role: "link", ...linkProps, children: [icon, text ? (jsxs(Text, { size: "text-l", font: "font-light", children: [text, jsx(Text, { color: "text-secondary-text", children: linkProps?.href && formatSuffix(getExtFromHref(linkProps.href), fileSize) })] })) : null] }));
-    });
+    const LinkDocItem = JSX(({ icon, text, fileSize, ...linkProps }) => (jsxs("a", { className: "flex box-border gap-3 group/item h-fit w-fit text-primary-text no-underline hover:text-primary-main", role: "link", ...linkProps, children: [icon, text ? (jsxs(Text, { size: "text-l", font: "font-light", children: [text, jsx(Text, { color: "text-secondary-text", children: linkProps?.href && formatSuffix(getExtFromHref(linkProps.href), fileSize) })] })) : null] })));
     const formatSuffix = (ext, fileSize) => {
         const prefix = ext || fileSize ? ',' : '';
         const extension = ext ? ` ${ext}` : '';
@@ -1458,7 +1545,22 @@
         return index !== -1 ? href.substring(index + 1) : '';
     };
 
-    const LinkDocs = JSX(({ className = '', title, description, icon = { icon: 'DocDownloadIcon', iconVersion: 'black' }, documents, align, ...rest }) => (jsxs(BlockWrapper, { className: className, defaultPadding: "p-default", ...rest, children: [jsx(Headline, { isPadding: false, title: title, description: description, align: align, headlineVersion: "M" }), documents?.length ? (jsx("div", { className: "mt-5 flex flex-col gap-6", role: "list", children: documents.map((doc, i) => (jsx("div", { role: "listitem", children: jsx(LinkDocsListItem, { doc: doc, icon: icon ? (jsx(Img, { className: "min-w-11 min-h-11 h-fit p-2.5 bg-main-divider rounded-md", image: icon, width: "24", height: "24" })) : null }) }, String(i)))) })) : null] })));
+    const linkIconStyle = 'min-w-11 min-h-11 h-fit p-2.5 bg-main-divider rounded-md';
+
+    const linkColumnsModeStyleMap = {
+        double: 'sm:flex-wrap sm:flex-row',
+        single: 'sm:flex-col',
+    };
+    const LinkDocs = JSX(({ className = '', title, description, align = 'text-center', documents, icon = { icon: 'DocIcon' }, columnsMode = 'double', ...rest }) => {
+        const router = useRouter();
+        return (jsxs(BlockWrapper, { className: className, defaultPadding: "p-default", ...rest, children: [jsx(Headline, { className: "!p-0", title: title, description: description, align: align, headlineVersion: "M", as: "h2" }), documents?.length ? (jsx("div", { className: style('mt-5 sm:mt-8 flex flex-col gap-6', linkColumnsModeStyleMap[columnsMode]), role: "list", children: documents.map(renderLinkDocItem(router, columnsMode, icon)) })) : null] }));
+    });
+    const renderLinkDocItem = (router, columnsMode, icon) => (docBlockDef, i) => {
+        const href = docBlockDef?.docType === 'Attachment'
+            ? adjustHref(router)(docBlockDef?.attachment?.src)
+            : docBlockDef?.href;
+        return (jsx("div", { className: columnsMode === 'double' ? 'basis-[calc(50%-20px)]' : '', role: "listitem", children: jsx(LinkDocItem, { ...docBlockDef, href: href, icon: icon ? jsx(Img, { className: linkIconStyle, image: icon, width: "24", height: "24" }) : null }) }, String(i)));
+    };
 
     /**
      * @deprecated
@@ -1480,7 +1582,7 @@
     const renderDescription$2 = (description) => description ? (jsx("div", { className: "mb-5 pt-0.5 sm:mb-0 sm:pt-0", children: jsx(Text, { size: "text-xl", "font-weight": "light", children: description }) })) : null;
 
     const renderList$1 = (items) => {
-        return items?.length ? (jsx(List, { items: items, className: "text-l-light mb-2 last:mb-0" })) : (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" }));
+        return items?.length ? (jsx(List, { items: items, className: "text-l font-light mb-2 last:mb-0" })) : (jsx("span", { className: "text-m font-light text-secondary-text", children: "\u041D\u0430\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u0430\u043C\u0435\u0440\u0443 \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u0430 \u043D\u0430 QR-\u043A\u043E\u0434 \u0438 \u0441\u043A\u0430\u0447\u0430\u0439\u0442\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435" }));
     };
 
     const MobileAppTile = JSX(({ className, padding, alignTitle = 'left', buttons = [], description, headingType = 'h4', image, items, qr, title = 'Мобильное приложение', version = 'primary', ...rest }) => {
@@ -1526,7 +1628,7 @@
     const BenefitsList = JSX(({ isTabularBenefits, ...rest }) => isTabularBenefits ? jsx(TabularBenefitsList, { ...rest }) : jsx(DefaultBenefitsList, { ...rest }));
 
     const Tags = JSX(({ className, tags }) => tags?.length ? (jsx("div", { className: style('flex flex-wrap gap-xs', className), role: "list", children: tags.map(renderTag) })) : null);
-    const renderTag = (tag, key) => (jsx("div", { className: "py-2 px-2.5 border-solid border rounded-md border-gray", role: "listitem", children: jsx(Text, { size: "text-m-light", children: tag }) }, String(key)));
+    const renderTag = (tag, key) => (jsx("div", { className: "py-2 px-2.5 border-solid border rounded-md border-gray", role: "listitem", children: jsx(Text, { size: "text-m", font: "font-light", children: tag }) }, String(key)));
 
     const BaseProductTile = JSX(({ className, padding, defaultPadding, title, description, headlineVersion = 'L', align = 'text-left', isInsetTitle = true, benefitsVersion, isTabularBenefits, benefits, __html, items, isDotted = true, listItemSize, tags, buttons, image, imageOptions: { imageAlign = 'end', directionRight = true, isBackground } = {}, children, }) => {
         const img = image?.src ? jsx(Img, { image: image }) : null;
@@ -1578,7 +1680,7 @@
     const checkCanRenderIcon = (icon) => Boolean(icon?.icon || icon?.src);
 
     const STEPS_BLOCK_STYLE = {
-        description: 'text-white/80 text-l-light group-data-primary:text-secondary-text group-data-gray:text-secondary-text',
+        description: 'text-white/80 text-l font-light group-data-primary:text-secondary-text group-data-gray:text-secondary-text',
         iconText: 'text-white group-data-primary:text-secondary-text group-data-gray:text-secondary-text',
         iconBackground: 'bg-white/30 group-data-primary:bg-main-divider',
         iconConnector: 'bg-white group-data-primary:bg-secondary-light',
@@ -1775,7 +1877,7 @@
         LabelDescription: renderLabelDescriptionCellData,
     };
 
-    const TableTileHeader = JSX(({ title, icon }) => (jsxs("div", { className: "mb-2", children: [title ? jsx(Text, { size: "text-l-light", children: title }) : null, icon ? jsx(Img, { className: "ml-auto min-w-6", image: icon, width: "24", height: "24" }) : null] })));
+    const TableTileHeader = JSX(({ title, icon }) => (jsxs("div", { className: "mb-2", children: [title ? (jsx(Text, { size: "text-l", font: "font-light", children: title })) : null, icon ? jsx(Img, { className: "ml-auto min-w-6", image: icon, width: "24", height: "24" }) : null] })));
 
     const TariffsTableTileCell = JSX(({ tile, ...rest }) => (jsxs("div", { className: "h-full", children: [jsx(TableTileHeader, { title: tile?.header?.title }), tile?.data?.length
                 ? tile.data.map((cell, i) => (jsx("div", { className: "mb-2", children: renderCell(cell, rest) }, String(i))))
@@ -1804,7 +1906,7 @@
     }));
 
     const TextBlock = JSX(({ className = '', title, description, iconVersion, image, __html, items = [], ...rest }) => (jsxs(BlockWrapper, { className: style('flex gap-3 bg-white group-data-secondary:bg-primary-main/10', className), ...rest, children: [iconVersion === 'small' ? jsx("div", { className: "mt-1", children: renderIcon() }) : null, iconVersion === 'big' ? renderImage(image) : null, jsxs("div", { className: "flex flex-col w-fit gap-3", children: [title ? (jsx(Text, { size: "text-l", font: "font-medium", color: "text-primary-text group-data-secondary:text-white", children: title })) : null, description ? renderDescription$1(description) : null, items?.length ? renderList(items, true) : null, __html ? jsx(RichText, { __html: __html }) : null] })] })));
-    const renderIcon = () => (jsx("div", { className: `rounded-full h-4 w-4 text-center text-xs-light bg-primary-main text-white group-data-secondary:bg-white group-data-secondary:text-primary-main`, children: "i" }));
+    const renderIcon = () => (jsx("div", { className: `rounded-full h-4 w-4 text-center text-xs font-light bg-primary-main text-white group-data-secondary:bg-white group-data-secondary:text-primary-main`, children: "i" }));
     const renderImage = (image) => image?.src ? jsx(Img, { className: "h-fit", image: image }) : null;
     const renderDescription$1 = (description) => (jsx(Paragraph, { size: "text-s", color: "text-secondary-text group-data-secondary:text-white", children: description }));
     const renderList = (items, bullets) => {
@@ -1843,7 +1945,7 @@
     const renderBenefit = (benefit, i) => (jsxs("div", { className: "flex items-center sm:basis-1/2 sm:max-w-[400px] mb-14", role: "listitem", children: [benefit?.icon?.icon ? (jsx(Img, { className: style('p-3 mr-5 shrink-0 bg-main-divider text-primary-main group-data-secondary:bg-white/30 group-data-secondary:text-black', benefitImageStyles), image: benefit.icon })) : null, benefit?.icon?.src ? jsx(Img, { className: "mr-5 shrink-0", image: benefit.icon }) : null, benefit?.label ? (jsxs("div", { className: "sm:h-full", children: [jsx(Heading, { headingType: "h6", children: benefit.label }), renderDescription(benefit.description)] })) : null] }, String(i)));
     const renderDescription = (description) => {
         const benefitType = description?.benefitType || null;
-        return description && benefitType ? (jsx("div", { className: "mt-2 text-l-light text-secondary-text group-data-secondary:text-white/80", children: benefitType === 'list'
+        return description && benefitType ? (jsx("div", { className: "mt-2 text-l font-light text-secondary-text group-data-secondary:text-white/80", children: benefitType === 'list'
                 ? renderListBenefit(description)
                 : renderTextBenefit(description) })) : null;
     };
@@ -1858,6 +1960,10 @@
         BonusBenefitsBlock,
         CardTransfer,
         Carousel,
+        CarouselCard,
+        CarouselCatalogCard,
+        CarouselProductCard,
+        CarouselBankHistoryCard,
         CarouselTariffsCard,
         ComparisonTable,
         Footer,
@@ -2014,7 +2120,7 @@
             globalThis.localStorage?.setItem(COOKIE_DIALOG_ID, 'true');
             close();
         }, [close]);
-        return isOpened ? (jsx("div", { className: "container z-40 fixed bottom-0 left-0 right-0 pointer-events-none", children: jsxs("div", { className: "bg-white m-6 p-6 rounded-md flex items-center pointer-events-auto shadow-[0_4px_25px_rgba(0,0,0,0.07)]", children: [jsx("div", { className: "flex-1", children: jsxs(Paragraph, { size: "text-s-light", color: "text-primary-text", children: ["\u0410\u041E \u00AB\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A\u00BB \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442", jsx(LinkWrapper, { isRemote: true, className: style(getStyleLinkWrapper(termLink?.href)), ...termLink, children: "cookie" }), "(\u0444\u0430\u0439\u043B\u044B \u0441 \u0434\u0430\u043D\u043D\u044B\u043C\u0438 \u043E \u043F\u0440\u043E\u0448\u043B\u044B\u0445 \u043F\u043E\u0441\u0435\u0449\u0435\u043D\u0438\u044F\u0445 \u0441\u0430\u0439\u0442\u0430) \u0434\u043B\u044F \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u043E\u0432 \u0438 \u0443\u0434\u043E\u0431\u0441\u0442\u0432\u0430 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u0435\u0439. \u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0437\u0430\u043F\u0440\u0435\u0442\u0438\u0442\u044C \u0441\u043E\u0445\u0440\u0430\u043D\u0435\u043D\u0438\u0435 cookie \u0432 \u043D\u0430\u0441\u0442\u0440\u043E\u0439\u043A\u0430\u0445 \u0441\u0432\u043E\u0435\u0433\u043E \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.", jsx(LinkWrapper, { isRemote: true, className: style(getStyleLinkWrapper(personalDataPolicyLink?.href)), ...personalDataPolicyLink, children: "\u041E\u0431\u0440\u0430\u0431\u043E\u0442\u043A\u0430 \u0412\u0430\u0448\u0438\u0445 \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445" }), "\u043F\u0440\u043E\u0438\u0437\u0432\u043E\u0434\u0438\u0442\u0441\u044F \u0432 \u0441\u043E\u043E\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u0442\u0440\u0435\u0431\u043E\u0432\u0430\u043D\u0438\u044F\u043C\u0438 \u0424\u0435\u0434\u0435\u0440\u0430\u043B\u044C\u043D\u043E\u0433\u043E \u0437\u0430\u043A\u043E\u043D\u0430 \u043E\u0442 27.07.2006 \u2116 152-\u04243 \u00AB\u041E \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445\u00BB."] }) }), jsx("div", { className: "w-24 flex justify-end", children: jsx(CloseButton, { className: "bg-main-gray rounded-md", onClick: handleClose }) })] }) })) : null;
+        return isOpened ? (jsx("div", { className: "container z-40 fixed bottom-0 left-0 right-0 pointer-events-none", children: jsxs("div", { className: "bg-white m-6 p-6 rounded-md flex items-center pointer-events-auto shadow-[0_4px_25px_rgba(0,0,0,0.07)]", children: [jsx("div", { className: "flex-1", children: jsxs(Paragraph, { size: "text-s", font: "font-light", color: "text-primary-text", children: ["\u0410\u041E \u00AB\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A\u00BB \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442", jsx(LinkWrapper, { isRemote: true, className: style(getStyleLinkWrapper(termLink?.href)), ...termLink, children: "cookie" }), "(\u0444\u0430\u0439\u043B\u044B \u0441 \u0434\u0430\u043D\u043D\u044B\u043C\u0438 \u043E \u043F\u0440\u043E\u0448\u043B\u044B\u0445 \u043F\u043E\u0441\u0435\u0449\u0435\u043D\u0438\u044F\u0445 \u0441\u0430\u0439\u0442\u0430) \u0434\u043B\u044F \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u043E\u0432 \u0438 \u0443\u0434\u043E\u0431\u0441\u0442\u0432\u0430 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u0435\u0439. \u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0437\u0430\u043F\u0440\u0435\u0442\u0438\u0442\u044C \u0441\u043E\u0445\u0440\u0430\u043D\u0435\u043D\u0438\u0435 cookie \u0432 \u043D\u0430\u0441\u0442\u0440\u043E\u0439\u043A\u0430\u0445 \u0441\u0432\u043E\u0435\u0433\u043E \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.", jsx(LinkWrapper, { isRemote: true, className: style(getStyleLinkWrapper(personalDataPolicyLink?.href)), ...personalDataPolicyLink, children: "\u041E\u0431\u0440\u0430\u0431\u043E\u0442\u043A\u0430 \u0412\u0430\u0448\u0438\u0445 \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445" }), "\u043F\u0440\u043E\u0438\u0437\u0432\u043E\u0434\u0438\u0442\u0441\u044F \u0432 \u0441\u043E\u043E\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u0442\u0440\u0435\u0431\u043E\u0432\u0430\u043D\u0438\u044F\u043C\u0438 \u0424\u0435\u0434\u0435\u0440\u0430\u043B\u044C\u043D\u043E\u0433\u043E \u0437\u0430\u043A\u043E\u043D\u0430 \u043E\u0442 27.07.2006 \u2116 152-\u04243 \u00AB\u041E \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445\u00BB."] }) }), jsx("div", { className: "w-24 flex justify-end", children: jsx(CloseButton, { className: "bg-main-gray rounded-md", onClick: handleClose }) })] }) })) : null;
     });
     const getStyleLinkWrapper = (href) => ['inline mx-1', href ? 'text-green-dark' : ''];
 
@@ -2093,7 +2199,7 @@
 
     const joinList = (sep) => (list) => list.reduce((acc, el, i) => (acc.length ? acc.concat({ ...sep, key: `sep-${i}` }, el) : [el]), []);
 
-    const packageVersion = "0.12.6";
+    const packageVersion = "0.12.8";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;