@redneckz/wildless-cms-uni-blocks 0.8.14 → 0.8.16

package/bundle/bundle.umd.js

@@ -245,7 +245,7 @@
     const DEFAULT_ANCESTORS = [];
     const defaultStyle = 'col-span-12';
     function renderBlock(block, options) {
-        const { key, blockDecorator = defaultBlockDecorator, blocksRegistry = {}, ancestors = DEFAULT_ANCESTORS, className = '', } = options;
+        const { key, blockDecorator = defaultBlockDecorator, blocksRegistry = {}, ancestors = DEFAULT_ANCESTORS, className = '', extraProps = {}, } = options;
         const { type } = block;
         if (!(type && type in blocksRegistry)) {
             console.warn(`No block with "${type}" is registered`);
@@ -259,13 +259,13 @@
             // Adjusted by decorator block and blockClassName
             render: ({ block: adjustedBlock, blockClassName: adjustedBlockClassName }) => {
                 const { content } = adjustedBlock;
-                return BlockComponent ? (jsx(BlockComponent, { className: adjustedBlockClassName, block: block, options: options, ...content }, key)) : null;
+                return BlockComponent ? (jsx(BlockComponent, { className: adjustedBlockClassName, block: block, options: options, ...content, ...extraProps }, key)) : null;
             },
         }, key);
     }
 
     const EMPTY_ANCESTORS = [];
-    const renderBlocksList = (blocks, { key, ancestors = EMPTY_ANCESTORS, slotName = DEFAULT_SLOT_NAME, renderChild = renderBlock, ...options }) => (blocks || []).map((_, j) => renderChild(_, {
+    const renderBlocksList = (blocks, { key, ancestors = EMPTY_ANCESTORS, slotName = DEFAULT_SLOT_NAME, renderProps = renderBlock, ...options }) => (blocks || []).map((_, j) => renderProps(_, {
         ...options,
         key: `${key ? key : _.type}-${j}`,
         ancestors: options.parent
@@ -273,12 +273,12 @@
             : ancestors,
     }));
 
-    function renderChildren({ children, block, options, renderChild, }) {
+    function renderChildren({ children, block, options, renderProps, }) {
         if (children) {
             return children;
         }
         return block && options
-            ? renderBlocksList(block.blocks, { ...options, parent: block, renderChild })
+            ? renderBlocksList(block.blocks, { ...options, parent: block, renderProps })
             : null;
     }
 
@@ -483,9 +483,9 @@
                     ? image.sources
                         .filter((_) => _?.src)
                         .sort(sourcesComparator)
-                        .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}`)))
+                        .map(({ src, format, media }, index) => (jsx("source", { srcSet: adjustSrc(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)
+                    ? renderImg({ ...image, src: adjustSrc(router, pathPrefix)(image.src) }, imageClassName, isMobile)
                     : null] }));
     });
     const renderImg = (image, imageClassName = '', isMobile = false) => {
@@ -498,13 +498,7 @@
         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 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(', ');
+    const adjustSrc = (router, pathPrefix) => (src) => src && !isURL(src) ? adjustHref(router)(joinPath(pathPrefix, src)) : src;
     const formatToMimeType = (format) => format ? `image/${String(format)}` : undefined;
 
     const ImgInner = JSX(({ className = '', image, imageClassName = '', isMobile, pathPrefix, ...iconProps }) => {
@@ -1095,9 +1089,9 @@
     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)));
+        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$4(description)] })] }, String(i)));
     };
-    const renderDescription$5 = (description) => {
+    const renderDescription$4 = (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'
                 ? renderListBenefit(description)
@@ -1912,7 +1906,7 @@
     const renderBlur = (isBlur, scroll) => (scroll.canScrollLeft || scroll.canScrollRight) && isBlur ? (jsxs("div", { children: [jsx("div", { className: style(blurBaseStyle, 'left-0 bg-opacity-from-white') }), jsx("div", { className: style(blurBaseStyle, 'right-0 bg-opacity-to-white') })] })) : null;
 
     const ITEMS_GAP = 4;
-    const Carousel = JSX(({ className = '', itemCount, visibleItemCount, isBlur = true, isCyclic = false, arrowsPadded = true, isPadding = true, ...rest }) => {
+    const Carousel = JSX(({ className = '', itemCount, visibleItemCount, isBlur = true, isCyclic = false, arrowsPadded = true, isPadding = true, options, ...rest }) => {
         const { blocks: childBlocks } = rest.block || {};
         const count = itemCount || childBlocks?.length || 0;
         const [activeIndex, setActiveIndex] = useState(Math.floor((visibleItemCount || 0) / 2));
@@ -1926,9 +1920,15 @@
         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) },
+                                options: {
+                                    ...options,
+                                    extraProps: {
+                                        blocksLength: childBlocks?.length,
+                                        activeIndex: activeIndex,
+                                    },
+                                },
                             })
-                            : renderChildren(rest) }), jsx(CarouselScrollButtons, { scroll: scroll, isBlur: isBlur, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count })] }) }));
+                            : renderChildren({ ...rest, options }) }), jsx(CarouselScrollButtons, { scroll: scroll, isBlur: isBlur, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count })] }) }));
     });
     Carousel.childrenTypes = [
         'CarouselCard',
@@ -1941,24 +1941,11 @@
         'CarouselTariffsCard',
         'CarouselInvestmentCard',
     ];
-    const buildBlocks = (blocks, activeIndex) => {
-        return blocks && blocks[0]?.type === 'CarouselBankHistoryCard'
-            ? blocks.map((_, i) => {
-                return {
-                    ..._,
-                    content: {
-                        ..._.content,
-                        orderNumber: i,
-                        isActive: activeIndex === i,
-                        blocksLength: blocks.length,
-                    },
-                };
-            })
-            : blocks;
-    };
     const getPaddingStyle = (isPadding) => (isPadding ? 'p-12' : '');
 
-    const CarouselBankHistoryCard = JSX(({ title, description, isActive, orderNumber = 0, blocksLength = 0 }) => {
+    const CarouselBankHistoryCard = JSX(({ title, description, blocksLength = 0, activeIndex, options, ...rest }) => {
+        const orderNumber = Number(options?.key?.split('-').slice(-1)[0]) || 0;
+        const isActive = orderNumber === activeIndex;
         return (jsx(BlockWrapper, { className: "flex h-[485px]", children: isActive ? (jsx("div", { className: "relative flex items-center w-full", children: jsx(Headline, { headlineVersion: "S", title: title, description: description, align: "text-left", className: style('absolute z-10 h-[385px] w-[440px] text-white shadow-dark-blue', getActiveBlockPosition(orderNumber, blocksLength), getBackgroundColor(orderNumber)) }) })) : (jsx("div", { className: "flex w-full items-center justify-center", children: jsx("div", { className: style('flex justify-center items-center h-[300px] w-[340px] font-mohave text-title-large tracking-[-0.03em]', getBackgroundColor(orderNumber)), children: jsx("span", { className: getTextColor(orderNumber), children: title }) }) })) }));
     });
     const getBackgroundColor = (orderNumber) => {
@@ -2004,12 +1991,12 @@
     };
     const CarouselCard = JSX(({ className = '', button, description, title, carouselVersion = 'normal' }) => (jsx("section", { className: `flex pb-9 pl-12 border-box h-full ${CARD_WIDTH_MAP[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: "L", align: "text-left" }), renderButtonsSection([button], { className: 'mt-14' })] })] }) })));
 
-    const cardStyleMap$2 = {
+    const cardStyleMap = {
         black: 'bg-black',
         white: 'bg-white',
     };
-    const CarouselCatalogCard = JSX(({ className = '', title, description, image, price, button, colors, ...rest }) => (jsxs(BlockWrapper, { className: `border box-border border-gray p-7 min-w-[392px] h-full flex flex-col justify-left ${className}`, ...rest, 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: "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-s-light text-secondary-text", children: [jsx("div", { className: "mr-1.5", children: jsx(Text, { children: "\u0414\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0435 \u0446\u0432\u0435\u0442\u0430: " }) }), colors.map(renderColorOption$1)] })) : null, price ? (jsxs(Text, { size: "text-h3", align: "text-left", children: [price, "\u00A0\u20BD"] })) : null, renderButtonsSection([button], { buttonClassName: 'mt-5 w-full' })] })));
-    const renderColorOption$1 = (color, i) => (jsx("span", { className: `w-6 h-6 ml-3 border border-solid border-main-divider rounded-full ${cardStyleMap$2[color]}` }, String(i)));
+    const CarouselCatalogCard = JSX(({ className = '', title, description, image, price, button, colors, ...rest }) => (jsxs(BlockWrapper, { className: `border box-border border-gray p-7 min-w-[392px] h-full flex flex-col justify-left ${className}`, ...rest, 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: "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-s-light text-secondary-text", children: [jsx("div", { className: "mr-1.5", children: jsx(Text, { children: "\u0414\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0435 \u0446\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("span", { className: `w-6 h-6 ml-3 border border-solid border-main-divider rounded-full ${cardStyleMap[color]}` }, String(i)));
 
     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] })] })));
 
@@ -2075,13 +2062,13 @@
     const List = JSX(({ className = '', hasIndent, isDotted, itemClassName = '', items, listItemSize = 'M' }) => items?.length ? (jsx("section", { className: `text-primary-text group-data-secondary:text-white group-data-gray:text-secondary-text ${TEXT_SIZE_MAP[listItemSize]} ${hasIndent ? ITEM_INDENT_MAP[listItemSize] : ''} ${className}`, role: "list", children: items.map((item, i) => (jsx(ListItem, { className: `${itemClassName} mb-1.5`, isDotted: isDotted, size: listItemSize, children: item }, String(i)))) })) : null);
 
     const CarouselProductCard = JSX(({ className = '', title, headlineSmallVersion = 'H6', description, additionalDescription, icon, items = [], button = {}, version = 'primary', isDotted = true, align = 'text-center', ...rest }) => {
-        return (jsxs(BlockWrapper, { className: style('flex flex-col justify-between items-stretch min-w-[260px] h-full w-full p-6', 'box-border border-solid border border-gray', align, className), version: version, ...rest, children: [jsxs("div", { className: "flex flex-col h-full", children: [renderImage$4(icon), renderCardTitle$1(headlineSmallVersion, title), renderDescription$4(description, title), renderItems$1(items, isDotted, version), renderAdditionalDescription$2(additionalDescription)] }), renderButtonsSection([button], { buttonClassName: 'mt-6 w-full' })] }));
+        return (jsxs(BlockWrapper, { className: style('flex flex-col justify-between items-stretch min-w-[260px] h-full w-full p-6', 'box-border border-solid border border-gray', align, className), version: version, ...rest, children: [jsxs("div", { className: "flex flex-col h-full", children: [renderImage$3(icon), renderCardTitle(headlineSmallVersion, title), renderDescription$3(description, title), renderItems(items, isDotted, version), renderAdditionalDescription$1(additionalDescription)] }), renderButtonsSection([button], { buttonClassName: 'mt-6 w-full' })] }));
     });
-    const renderImage$4 = (image) => (jsxs("div", { className: "flex justify-center", children: [image?.src ? jsx(ImgInner, { className: "mb-5", image: image }) : null, image?.icon ? (jsx(ImgInner, { className: `w-[32px] h-[32px] min-w-[32px] mb-5 rounded-full`, image: image, asSVG: true })) : null] }));
-    const renderCardTitle$1 = (headlineSmallVersion, title) => title ? jsx(Text, { size: HEADLINE_SMALL_VERSION[headlineSmallVersion], children: title }) : null;
-    const renderDescription$4 = (description, title) => description ? (jsx("div", { className: title ? 'mt-2' : '', children: jsx(Paragraph, { size: "text-l", children: description }) })) : null;
-    const renderAdditionalDescription$2 = (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$1 = (items, isDotted, version = 'primary') => items?.length ? (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 })) : null;
+    const renderImage$3 = (image) => (jsxs("div", { className: "flex justify-center", children: [image?.src ? jsx(ImgInner, { className: "mb-5", image: image }) : null, image?.icon ? (jsx(ImgInner, { className: `w-[32px] h-[32px] min-w-[32px] mb-5 rounded-full`, image: image, asSVG: true })) : null] }));
+    const renderCardTitle = (headlineSmallVersion, title) => title ? 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$1 = (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: `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 })) : null;
 
     const getIconWithVersion = (icon, version = 'primary') => ({
         ...icon,
@@ -2156,28 +2143,6 @@
     const renderCardInfo = (cell, i) => (jsxs("div", { className: "py-5 border-b border-main-divider", children: [cell?.title ? (jsx("div", { className: "text-secondary-text text-m-light opacity-80", children: cell.title })) : null, cell?.description ? (jsx("div", { className: "text-primary-text text-h6 mt-1", children: cell.description })) : null] }, String(i)));
     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", asSVG: true }), jsx(Paragraph, { size: "text-s", font: "font-normal", align: "text-center", color: "text-primary-text", children: "\u0425\u0418\u0422" })] }));
 
-    const cardStyleMap$1 = {
-        black: 'bg-black',
-        white: 'bg-white',
-    };
-    const CatalogCard = JSX(({ className = '', title, description, image, price, button, colors }) => (jsxs("section", { className: `border border-solid box-border border-gray 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, renderButtonsSection([button], { buttonClassName: 'mt-5 w-full' })] })));
-    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$1 = 'absolute top-0 bottom-0 w-[84px]';
-    const CARD_VIEW_COUNT$1 = 3;
-    const CARD_SHIFT$1 = 430;
-    const Catalog = JSX(({ cards = [], className = '', title, description, ...rest }) => {
-        const [activeIndex, controls] = useCarouselControls({
-            itemCount: cards?.length,
-            visibleItemCount: CARD_VIEW_COUNT$1,
-        });
-        return (jsxs(BlockWrapper, { className: `p-12 overflow-hidden text-center ${className}`, ...rest, children: [jsx(Headline, { className: "!p-0", title: title, description: description, headlineVersion: "M", ...rest }), jsx("div", { className: "flex duration-1000 gap-3.5 mt-8", style: { transform: `translateX(-${activeIndex * CARD_SHIFT$1}px)` }, role: "list", children: cards?.length ? cards.map((card, i) => jsx(CatalogCard, { ...card }, String(i))) : null }), renderArrows({
-                    ...controls,
-                    btnClass: ['left-8', 'right-8'],
-                    className: 'top-1/2 z-10 mt-6',
-                }), jsx("div", { className: `${BLUR_BLOCK_CLASSES$1} left-0 bg-opacity-from-white` }), jsx("div", { className: `${BLUR_BLOCK_CLASSES$1} right-0 bg-opacity-to-white` })] }));
-    });
-
     const GRADIENT = 'bg-gradient-to-r from-main-gradient-start to-main-gradient-end';
     const BORDER_CLASSES = 'border-gray border-solid border';
     const DIVIDER_CLASSES$1 = 'border-main-divider border border-t-0 border-x-0';
@@ -2452,7 +2417,7 @@
         'bg-white': 'text-primary-main',
         transparent: 'text-white',
     };
-    const renderImage$3 = (bgColor, image, size) => {
+    const renderImage$2 = (bgColor, image, size) => {
         return image?.src ? (jsx(ImgInner, { image: image, className: SVG_COLOR[bgColor], width: size?.width, height: size?.height, pathPrefix: "/wcms-resources/", asSVG: true })) : (jsx(ImgInner, { image: {
                 icon: image?.icon || 'LogoIcon',
                 iconVersion: ICON_VERSION_MAP[bgColor],
@@ -2468,7 +2433,7 @@
     };
 
     const Logo = JSX(({ className = '', href, logo, children = logo?.title, targetBlank, bgColor = 'bg-white', showTitle = true, }) => {
-        return (jsxs("a", { className: `inline-flex items-center font-sans no-underline ${className}`, href: href || '/', target: targetBlank ? '_blank' : '_self', "aria-label": logo?.title || 'Россельхозбанк', children: [renderImage$3(bgColor, logo?.image, { width: '40', height: '45' }), showTitle ? renderTitle$3(children || logo?.title, bgColor) : null] }));
+        return (jsxs("a", { className: `inline-flex items-center font-sans no-underline ${className}`, href: href || '/', target: targetBlank ? '_blank' : '_self', "aria-label": logo?.title || 'Россельхозбанк', children: [renderImage$2(bgColor, logo?.image, { width: '40', height: '45' }), showTitle ? renderTitle$3(children || logo?.title, bgColor) : null] }));
     });
 
     const useSearch = () => {
@@ -2554,50 +2519,6 @@
         return (jsxs(BlockWrapper, { tag: "footer", className: `p-9 ${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, logo: logo }), jsx(SearchBar$1, { 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]", fallback: fallback })] }), jsx(HorizontalNavigation, { className: "mt-[98px]", links: relatedEnterprises }), jsx(TextInformation, { links: documents })] }));
     });
 
-    const galleryLengthForScrollMap = {
-        normal: 3,
-        mini: 4,
-    };
-    const cardStyleMap = {
-        normal: 'min-w-[364px] w-[364px]',
-        mini: 'min-w-[260px] w-[260px]',
-    };
-    const cardWidthMap = {
-        normal: 380,
-        mini: 276,
-    };
-
-    const GalleryCardInner = JSX(({ title, headlineSmallVersion = 'H6', description, additionalDescription, icon, items, button, isFullWidth = true, isDotted = true, align = 'center', ...rest }) => (jsxs(BlockWrapper, { className: `h-full flex flex-col justify-between ${AlignText[align]}`, tag: "div", ...rest, children: [jsxs("div", { className: "flex flex-col h-full", children: [renderImage$2(icon), renderCardTitle(headlineSmallVersion, title), renderDescription$3(description, title), items?.length ? renderItems(items, isDotted) : null, renderAdditionalDescription$1(additionalDescription)] }), renderButtonsSection([button], {
-                buttonClassName: `mt-6 ${isFullWidth ? 'w-full' : 'self-center'}`,
-            })] })));
-    const renderImage$2 = (image) => (jsxs("div", { className: "flex justify-center", children: [image?.src ? jsx(ImgInner, { className: "mb-5", image: image }) : null, image?.icon ? (jsx(ImgInner, { className: `w-8 h-8 min-w-8 mb-5 rounded-full`, image: getIconWithVersion(image), asSVG: true })) : null] }));
-    const renderCardTitle = (headlineSmallVersion, title) => title ? jsx("div", { className: HEADLINE_SMALL_VERSION[headlineSmallVersion], children: title }) : null;
-    const renderDescription$3 = (description, title) => description ? jsx("div", { className: `text-l ${title ? 'mt-2' : ''}`, children: description }) : null;
-    const renderAdditionalDescription$1 = (additionalDescription) => additionalDescription ? (jsx("div", { className: `text-m-light mt-auto group-data-primary:text-secondary-text`, children: additionalDescription })) : null;
-    const renderItems = (items, isDotted) => (jsx(List, { className: "max-w-[308px] mt-2 text-s group-data-primary:text-secondary-text", itemClassName: "text-left", items: items.filter((item) => item?.text).map((item) => item.text), isDotted: isDotted }));
-
-    const GalleryContainer = JSX(({ headlineVersion = 'M', cards = [], galleryVersion = 'normal', activeIndex, title, description, }) => (jsxs("div", { children: [jsx(Headline, { className: "!p-0", title: title, description: description, headlineVersion: headlineVersion }), jsx("div", { className: `flex mt-8 ${cards?.length <= galleryLengthForScrollMap[galleryVersion] ? 'justify-center' : ''} duration-1000`, style: { transform: `translateX(-${activeIndex * cardWidthMap[galleryVersion]}px)` }, role: "list", children: cards?.map((card, i) => renderCard({ card, galleryVersion }, i)) })] })));
-    function renderCard({ card, galleryVersion }, i) {
-        return (jsx("section", { className: `box-border border-solid border border-gray p-6 mx-2 flex flex-col justify-between
-        items-stretch ${cardStyleMap[galleryVersion]} ${blockStyles[card.version ?? 'primary'] // TODO Replace with direct BlockWrapper usage
-        } w-full col-span-4`, role: "listitem", children: jsx(GalleryCardInner, { ...card }) }, String(i)));
-    }
-
-    const GalleryInner = JSX(({ cards = [], className = '', galleryVersion = 'normal', button, ...rest }) => {
-        const [activeIndex, controls] = useCarouselControls({
-            itemCount: cards?.length,
-            visibleItemCount: galleryLengthForScrollMap[galleryVersion],
-        });
-        const { isScrollAvailable } = controls;
-        return (jsxs(BlockWrapper, { className: `relative p-[42px] overflow-hidden flex flex-col ${className}`, ...rest, children: [jsx(GalleryContainer, { cards: cards, galleryVersion: galleryVersion, activeIndex: activeIndex, ...rest }), renderArrows({
-                    ...controls,
-                    btnClass: ['left-8', 'right-8'],
-                    className: 'top-1/2',
-                }), isScrollAvailable ? (jsxs("div", { children: [jsx("div", { className: "absolute top-0 left-0 bottom-0 w-[82px] bg-opacity-from-white" }), jsx("div", { className: "absolute top-0 right-0 bottom-0 w-[82px] bg-opacity-to-white" })] })) : null, renderButtonsSection([button], { className: 'mt-8 mx-auto' })] }));
-    });
-
-    const Gallery = JSX((props) => (jsx(GalleryInner, { ...props, galleryVersion: "normal" })));
-
     const GracePeriod = JSX(({ className = '', title, description, calendar, ...rest }) => (jsxs(BlockWrapper, { className: `p-12 ${className}`, ...rest, children: [jsx(Headline, { className: "!p-0 mb-4", title: title, description: description, headlineVersion: "M" }), calendar ? renderCalendar(calendar) : null] })));
     const renderCalendar = (calendar) => {
         const colCount = calendar.reduce((accumulator, currentValue) => currentValue?.month?.length ? accumulator + currentValue.month.length : accumulator, 0) || 1;
@@ -3041,8 +2962,6 @@
     };
     const LinkDocs = JSX(({ className = '', title, description, align = 'text-center', documents, icon = { icon: 'DocIcon' }, columnsMode = 'double', ...rest }) => (jsxs(BlockWrapper, { className: style('p-12', className), ...rest, children: [jsx(Headline, { className: "!p-0", title: title, description: description, align: align, headlineVersion: "M", as: "h2" }), jsx(LinkDocsList, { className: `mt-8 ${linkColumnsModeStyleMap[columnsMode]}`, columnsMode: columnsMode, documents: documents, icon: icon })] })));
 
-    const MiniGallery = JSX((props) => (jsx(GalleryInner, { ...props, galleryVersion: "mini" })));
-
     const getColSpan = (className) => {
         const colSpanPrefix = 'col-span-';
         const colSpanStr = className?.split(/\s+/).find((_) => _.startsWith(colSpanPrefix));
@@ -3587,10 +3506,10 @@
 
     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 = '', title, headlineVersion = 'L', description, benefitsCountOfRow = 3, benefits, benefitsVersion, buttons, footnote, image, items, version = 'primary', isDotted = true, textBlockClassName = '', }) => {
+    const ProductBlockInner = JSX(({ className = '', title, headlineVersion = 'L', description, benefitsCountOfRow = 3, benefits, benefitsVersion, buttons, footnote, image, __html, items, version = 'primary', isDotted = true, textBlockClassName = '', }) => {
         const benefitsCount = benefits?.filter((_) => _.label)?.length;
         const benefitsContainerStyles = getBenefitsContainerStyles(benefitsCountOfRow);
-        return (jsxs("div", { className: style('flex grow justify-between items-stretch h-full', className), children: [jsxs("div", { className: style('flex flex-col', textBlockClassName), children: [jsx(Headline, { className: "!p-0 max-w-[600px]", title: title, description: description, headlineVersion: headlineVersion, align: "text-left" }), jsxs("div", { className: "flex flex-col justify-between h-full", children: [jsxs(BaseTile, { buttons: renderButtonsSection(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]", isDotted: isDotted })) : null] }), footnote ? jsx("p", { className: "text-m-light pt-12", children: footnote }) : null] })] }), image?.src && jsx(ImgInner, { className: "mt-[-50px]", image: image })] }));
+        return (jsxs("div", { className: style('flex grow justify-between items-stretch h-full', className), children: [jsxs("div", { className: style('flex flex-col', textBlockClassName), children: [jsx(Headline, { className: "!p-0 max-w-[600px]", title: title, description: description, headlineVersion: headlineVersion, align: "text-left" }), jsxs("div", { className: "flex flex-col justify-between h-full", children: [jsxs(BaseTile, { buttons: renderButtonsSection(buttons), children: [benefitsCount ? (jsx("div", { className: benefitsContainerStyles, children: benefits.map(renderBenefit$1(version, benefitsVersion)) })) : null, __html ? (jsx("div", { className: "mt-5", children: jsx(RichText, { __html: __html }) })) : null, items?.length ? (jsx(List, { className: "mt-5 text-h6", items: items, itemClassName: "mb-[7px]", isDotted: isDotted })) : null] }), footnote ? jsx("p", { className: "text-m-light pt-12", children: footnote }) : null] })] }), image?.src && jsx(ImgInner, { className: "mt-[-50px]", image: image })] }));
     });
     const getBenefitsContainerStyles = (benefitsCountOfRow = 2) => `gap-6 mt-6 ${benefitsCountOfRow > 2
     ? 'inline-grid grid-cols-[auto_auto_auto]'
@@ -4115,7 +4034,7 @@
             }
             setCurrentTab(selectedTab);
         }, []);
-        return (jsx(BlockWrapper, { className: `relative box-border flex gap-x-1 w-full ${isSticky ? 'sticky top-1 z-20 ' : ''} ${className}`, role: "tablist", ...rest, children: tabsMode === 'scrollable' ? (jsx(ScrollableTabs, { tabs: tabs, onClick: handleClick, currentTab: currentTab, showCounter: showCounter, ...rest })) : (tabs?.map(renderTab({
+        return (jsx(BlockWrapper, { className: `relative box-border flex gap-x-1 w-full ${isSticky ? 'sticky top-1 z-20' : ''} ${className}`, role: "tablist", ...rest, children: tabsMode === 'scrollable' ? (jsx(ScrollableTabs, { tabs: tabs, onClick: handleClick, currentTab: currentTab, showCounter: showCounter, ...rest })) : (tabs?.map(renderTab({
                 onClick: handleClick,
                 currentTab,
                 showCounter,
@@ -4366,13 +4285,11 @@
         CarouselProgramsCard,
         CarouselRecommendationCard,
         CarouselTariffsCard,
-        Catalog,
         ComparisonTable,
         ContactsBlock,
         ErrorBlock,
         ExchangeRateTile,
         Footer,
-        Gallery,
         GracePeriod,
         Header,
         Headline,
@@ -4381,7 +4298,6 @@
         InsuranceAmountBlock,
         InvestmentInfo,
         LinkDocs,
-        MiniGallery,
         MobileAppTile,
         OfficeMap,
         OfficeServicesBlock,
@@ -4531,7 +4447,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.14";
+    const packageVersion = "0.8.16";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;