@redneckz/wildless-cms-uni-blocks 0.6.42 → 0.6.43

package/bundle/bundle.umd.js

@@ -519,11 +519,7 @@
         return (jsx(ImgAsPicture, { className: className, imageClassName: imageClassName, image: image, isMobile: isMobile }));
     });
 
-    const Text = JSX((props) => {
-        const { size = '', color = '', align = '', font = '', children } = props;
-        const textClasses = `font-sans ${size} ${color} ${align} ${font}`;
-        return jsx("span", { className: textClasses, children: children });
-    });
+    const Text = JSX(({ size, color, align, font, children }) => (jsx("span", { className: ['font-sans', size, color, align, font].filter(Boolean).join(' '), children: children })));
 
     const icons$1 = ['PlusIcon', 'MinusIcon'];
     const AccordionItem = JSX(({ className = '', label = '', isExpanded, ...rest }) => (jsx("li", { className: `border-0 border-b border-solid border-main-divider last:border-b-0 ${className}`, children: jsx(Foldable, { isFoldButtonOnTop: true, unfoldedByDefault: isExpanded, renderFoldableSection: ({ isUnfolded }) => (jsx(FoldableSection, { className: "grid grid-cols-12 gap-5 [&>*]:p-0", isUnfolded: isUnfolded, children: renderChildren(rest) })), renderFoldButton: ({ isUnfolded, onToggle }) => (jsx(FoldButton$1, { label: label, icon: icons$1[Number(isUnfolded)], onClick: onToggle })) }) })));
@@ -559,9 +555,9 @@
     const BenefitsBlock = JSX(({ className = '', title, benefitList, version = 'primary', ...rest }) => (jsxs(BlockWrapper, { className: `font-sans text-primary-text p-12 flex flex-col items-center ${className} ${VersionStyleMap[version]}`, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", as: "h2", className: `max-w-[47rem] text-center ${benefitsTextStyleMap[version]}`, title: title })) : null, benefitList?.length ? (jsx("div", { className: "flex flex-wrap w-full justify-center gap-x-20 mt-8", children: benefitList.map(renderStep(version)) })) : null] })));
     const renderStep = (version) => (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 ${benefitsIconStyleMap[version]}`, image: getIconWithVersion(benefit.icon, version), asSVG: true })) : null, benefit?.icon?.src ? jsx(ImgInner, { image: benefit.icon }) : null, jsxs("div", { className: "ml-5", children: [benefit?.label ? (jsx("h3", { className: `text-h6 m-0 ${benefitsTextStyleMap[version]}`, children: benefit.label })) : null, renderDescription$4(description, version)] })] }, 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 ${benefitsIconStyleMap[version]}`, image: getIconWithVersion(benefit.icon, version), asSVG: true })) : null, benefit?.icon?.src ? jsx(ImgInner, { image: benefit.icon }) : null, jsxs("div", { className: "ml-5", children: [benefit?.label ? (jsx("h3", { className: `text-h6 m-0 ${benefitsTextStyleMap[version]}`, children: benefit.label })) : null, renderDescription$5(description, version)] })] }, String(i)));
     };
-    const renderDescription$4 = (description, version) => {
+    const renderDescription$5 = (description, version) => {
         const benefitType = description?.benefitType || null;
         return description && benefitType ? (jsx("div", { className: `text-l-light mt-2 ${benefitsDescriptionStyleMap[version]}`, children: benefitType === 'list'
                 ? renderListBenefit(description)
@@ -1676,11 +1672,11 @@
                 BORDER_STYLE,
                 AlignText[align],
                 VersionStyleMap[version],
-            ].join(' '), role: "listitem", children: [jsxs("div", { className: "flex flex-col h-full", children: [renderImage$4(icon, version), renderCardTitle$1(headlineSmallVersion, title), renderDescription$3(description, title), renderItems$2(items, isDotted, version), renderAdditionalDescription$2(additionalDescription, version)] }), renderButton({ button, buttonClassName: 'mt-6' })] }));
+            ].join(' '), role: "listitem", children: [jsxs("div", { className: "flex flex-col h-full", children: [renderImage$4(icon, version), renderCardTitle$1(headlineSmallVersion, title), renderDescription$4(description, title), renderItems$2(items, isDotted, version), renderAdditionalDescription$2(additionalDescription, version)] }), renderButton({ button, buttonClassName: 'mt-6' })] }));
     });
     const renderImage$4 = (image, version) => (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: getIconWithVersion(image, version), asSVG: true })) : null] }));
     const renderCardTitle$1 = (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 renderDescription$4 = (description, title) => description ? (jsx("div", { className: title ? 'mt-2' : '', children: jsx(Paragraph, { size: "text-l", children: description }) })) : null;
     const renderAdditionalDescription$2 = (additionalDescription, version = 'primary') => additionalDescription ? (jsx("div", { className: "mt-auto", children: jsx(Text, { size: "text-m", font: "font-light", color: descriptionStyleMap[version], children: additionalDescription }) })) : null;
     const renderItems$2 = (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, version: version })) : null;
 
@@ -2050,12 +2046,12 @@
         'bg-white': 'text-primary-text',
         transparent: 'text-white',
     };
-    const renderTitle$2 = (title, bgColor, className) => {
+    const renderTitle$3 = (title, bgColor, className) => {
         return (jsx("span", { className: `${TEXT_COLOR[bgColor]} ml-2.5 font-medium ${className || ''}`, children: title || 'Россельхозбанк' }));
     };
 
     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$2(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$3(bgColor, logo?.image, { width: '40', height: '45' }), showTitle ? renderTitle$3(children || logo?.title, bgColor) : null] }));
     });
 
     const useSearch = () => {
@@ -2203,7 +2199,7 @@
         mini: 276,
     };
 
-    const GalleryCardInner = JSX(({ title, headlineSmallVersion = 'H6', description, additionalDescription, icon, items, button, version, isFullWidth = true, isDotted = true, align = 'center', }) => (jsxs("div", { className: `h-full flex flex-col justify-between ${AlignText[align]}`, children: [jsxs("div", { className: "flex flex-col h-full", children: [renderImage$2(icon, version), renderCardTitle(headlineSmallVersion, title), renderDescription$2(description, title), items?.length ? renderItems$1(items, isDotted, version) : null, renderAdditionalDescription$1(additionalDescription, version)] }), button?.text
+    const GalleryCardInner = JSX(({ title, headlineSmallVersion = 'H6', description, additionalDescription, icon, items, button, version, isFullWidth = true, isDotted = true, align = 'center', }) => (jsxs("div", { className: `h-full flex flex-col justify-between ${AlignText[align]}`, children: [jsxs("div", { className: "flex flex-col h-full", children: [renderImage$2(icon, version), renderCardTitle(headlineSmallVersion, title), renderDescription$3(description, title), items?.length ? renderItems$1(items, isDotted, version) : null, renderAdditionalDescription$1(additionalDescription, version)] }), button?.text
                 ? renderButton({
                     button,
                     buttonClassName: `mt-6 ${isFullWidth ? '' : 'self-center'}`,
@@ -2211,7 +2207,7 @@
                 : null] })));
     const renderImage$2 = (image, version) => (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, version), asSVG: true })) : null] }));
     const renderCardTitle = (headlineSmallVersion, title) => title ? jsx("div", { className: HEADLINE_SMALL_VERSION[headlineSmallVersion], children: title }) : null;
-    const renderDescription$2 = (description, title) => description ? jsx("div", { className: `text-l ${title ? 'mt-2' : ''}`, children: description }) : null;
+    const renderDescription$3 = (description, title) => description ? jsx("div", { className: `text-l ${title ? 'mt-2' : ''}`, children: description }) : null;
     const renderAdditionalDescription$1 = (additionalDescription, version) => additionalDescription ? (jsx("div", { className: `text-m-light mt-auto ${VersionAdditionalStyleMap[version ?? 'primary']}`, children: additionalDescription })) : null;
     const renderItems$1 = (items, isDotted, version = 'primary') => (jsx(List, { className: `max-w-[308px] mt-2 text-s ${version === 'primary' ? '!text-secondary-text' : ''}`, itemClassName: "text-left", items: items.filter((item) => item?.text).map((item) => item.text), isDotted: isDotted, version: version }));
 
@@ -2675,12 +2671,12 @@
         ${getTileMinHeight(className)}
         ${VersionStyleMap[version]}
         ${className}`, ...rest, children: [jsxs(BaseTile, { className: "z-10", title: title ? (jsx(Heading, { headingType: headingType, as: "h3", title: title, className: `whitespace-pre-wrap mb-7 w-full
-                  ${textColorClass} ${AlignText[alignTitle]}` })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { buttons: buttonsWithClass, className: "flex gap-4 mt-8", ...rest })) : null, children: [renderDescription$1(description), jsxs("div", { className: "flex flex-1 items-center mb-3", children: [qr?.src ? (jsx("div", { className: `flex justify-center mr-5 bg-white rounded-md ${containerStyle}`, children: jsx(ImgInner, { className: "w-fit", image: qr }) })) : null, renderList$1(version, items)] })] }), image?.src ? (jsx("div", { className: "absolute right-0 bottom-0", children: jsx(ImgInner, { image: image }) })) : null] }));
+                  ${textColorClass} ${AlignText[alignTitle]}` })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { buttons: buttonsWithClass, className: "flex gap-4 mt-8", ...rest })) : null, children: [renderDescription$2(description), jsxs("div", { className: "flex flex-1 items-center mb-3", children: [qr?.src ? (jsx("div", { className: `flex justify-center mr-5 bg-white rounded-md ${containerStyle}`, children: jsx(ImgInner, { className: "w-fit", image: qr }) })) : null, renderList$1(version, items)] })] }), image?.src ? (jsx("div", { className: "absolute right-0 bottom-0", children: jsx(ImgInner, { image: image }) })) : null] }));
     });
     const renderList$1 = (version, items) => {
         return items?.length ? (jsx(List, { items: items, itemClassName: "text-l-light mb-2 last:mb-0", version: version })) : (jsx("span", { className: "text-m-light text-secondary-text", children: "\u041D\u0430\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u0430\u043C\u0435\u0440\u0443 \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u0430 \u043D\u0430 QR-\u043A\u043E\u0434 \u0438 \u0441\u043A\u0430\u0447\u0430\u0439\u0442\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435" }));
     };
-    const renderDescription$1 = (description) => description ? jsx("p", { className: "text-xl-light mb-5 pt-0.5", children: description }) : null;
+    const renderDescription$2 = (description) => description ? jsx("p", { className: "text-xl-light mb-5 pt-0.5", children: description }) : null;
 
     function renderClusterer(yandexMaps, map, points) {
         map.geoObjects.removeAll();
@@ -3279,26 +3275,53 @@
       `, children: jsxs("div", { className: "border-0 px-6", children: [jsx("div", { className: `last:pb-0 ${btnTitleClassName}`, children: slide?.title }), jsx("div", { className: `text-secondary-text  ${btnDescClassName}`, children: slide?.description })] }) }, String(i)));
     }
 
-    const ProductTile = JSX(({ className = '', title, headlineVersion = 'S', description, additionalDescription, benefits = [], buttons, image, isImageOnRightSide = true, version = 'primary', ...rest }) => (jsxs(BlockWrapper, { className: `overflow-hidden font-sans p-9 box-border relative min-h-[364px]
-          ${VersionStyleMap[version]} ${getTileRightPadding(className)} ${className}`, ...rest, children: [jsxs("div", { className: `flex flex-col ${isImageOnRightSide ? '' : 'items-end'}`, children: [jsx(Headline, { className: `!p-0 !bg-transparent z-10 ${title || description ? 'mb-3.5' : ''}`, as: "h2", title: title, description: description, headlineVersion: headlineVersion, bgColorHeadline: version, align: "left", ...rest }), renderBenefits(benefits, version, image), additionalDescription ? renderAdditionalDescription(additionalDescription, image) : null, buttons?.length ? (jsx(ButtonSection, { buttons: buttons, className: "mt-5 gap-4 z-10 text-l" })) : null] }), renderImage$1(image, isImageOnRightSide)] })));
-    function renderBenefits(benefits, version, image) {
-        // picture width = 242px. Text can overlay picture 20px deep. Outer paddings_x = 36px. 242-36-20 = 186px
-        const BENEFITS_WIDTH = image?.src ? 'max-w-[calc(100%-186px)]' : '100%';
-        return (jsx("div", { className: `z-10 grid grid-cols-[max-content_1fr] auto-rows-auto gap-x-6 gap-y-2.5 items-baseline
-        ${BENEFITS_WIDTH}`, children: benefits.length ? benefits.map(renderBenefit(version)) : null }));
-    }
-    const renderBenefit = (version = 'primary') => (benefit, i) => {
-        const { label = '', description = '' } = benefit;
-        return [
-            jsx("div", { className: "text-h6", children: label }, `label-${i}`),
-            jsx("div", { className: `text-m-light ${VersionAdditionalStyleMap[version]}`, children: description }, `desc-${i}`),
-        ];
+    const DESCRIPTION_STYLE_MAP = {
+        primary: 'text-secondary-text',
+        secondary: 'text-white',
     };
-    function renderAdditionalDescription(additionalDescription, image) {
+    function renderAdditionalDescription(additionalDescription, image, version = 'primary') {
+        if (!additionalDescription) {
+            return null;
+        }
         // picture width = 242px. Text can overlay picture 20px deep. Outer paddings_x = 36px. 242-36-20 = 186px
-        const DESCRIPTION_WIDTH = image?.src ? 'max-w-[calc(100%-186px)]' : '100%';
-        return (jsx("div", { className: `text-m-light mt-2.5 z-10 ${DESCRIPTION_WIDTH}`, children: additionalDescription }));
+        const descriptionWidth = image?.src ? 'max-w-[calc(100%-186px)]' : '100%';
+        return (jsx("div", { className: `mt-2.5 z-10 ${descriptionWidth}`, children: jsx(Paragraph, { size: "text-m", font: "font-light", color: DESCRIPTION_STYLE_MAP[version], children: additionalDescription }) }));
+    }
+
+    const MarkdownText = JSX((props) => {
+        const { md = '' } = props;
+        return jsx("div", { className: "md-container", dangerouslySetInnerHTML: { __html: md } });
+    });
+
+    function assertUnreachable(x) {
+        throw new Error(x);
     }
+
+    const LABEL_STYLE_MAP = {
+        primary: 'text-secondary-text',
+        secondary: 'text-white',
+    };
+    const renderBenefit = (version = 'primary') => 
+    // Linter doesn't understand that switch processes all cases
+    // eslint-disable-next-line consistent-return
+    (benefit, i) => {
+        const { type } = benefit;
+        if (!(type === 'default' || type === 'md')) {
+            return null;
+        }
+        switch (type) {
+            case 'default':
+                return [
+                    jsx(Text, { size: "text-h6", children: benefit.label }, `label-${i}`),
+                    jsx(Text, { size: "text-m-light", color: LABEL_STYLE_MAP[version], children: benefit.description }, `desc-${i}`),
+                ];
+            case 'md':
+                return jsx(MarkdownText, { md: benefit.md });
+            default:
+                assertUnreachable(benefit);
+        }
+    };
+
     function renderImage$1(image, isImageOnRightSide) {
         if (!image?.src) {
             return null;
@@ -3306,6 +3329,18 @@
         return (jsx(ImgInner, { className: `absolute ${isImageOnRightSide ? 'right-0' : 'left-0'} bottom-0`, image: image }));
     }
 
+    const ProductTile = JSX(({ className = '', title, headlineVersion = 'S', description, additionalDescription, benefits = [], buttons, image, isImageOnRightSide = true, version = 'primary', ...rest }) => (jsxs(BlockWrapper, { className: `overflow-hidden font-sans p-9 box-border relative min-h-[364px]
+          ${VersionStyleMap[version]} ${getTileRightPadding(className)} ${className}`, ...rest, children: [jsxs("div", { className: `flex flex-col ${isImageOnRightSide ? '' : 'items-end'}`, children: [jsx(Headline, { className: `!p-0 !bg-transparent z-10 ${title || description ? 'mb-3.5' : ''}`, as: "h2", title: title, description: description, headlineVersion: headlineVersion, bgColorHeadline: version, align: "left", ...rest }), renderBenefits(benefits, version, image), renderAdditionalDescription(additionalDescription, image), buttons?.length ? (jsx(ButtonSection, { buttons: buttons, className: "mt-5 gap-4 z-10 text-l" })) : null] }), renderImage$1(image, isImageOnRightSide)] })));
+    function renderBenefits(benefits, version, image) {
+        if (!benefits.length) {
+            return null;
+        }
+        // picture width = 242px. Text can overlay picture 20px deep. Outer paddings_x = 36px. 242-36-20 = 186px
+        const benefitsWidth = image?.src ? 'max-w-[calc(100%-186px)]' : '100%';
+        return (jsx("div", { className: `z-10 grid grid-cols-[max-content_1fr] auto-rows-auto gap-x-6 gap-y-2.5 items-baseline
+        ${benefitsWidth}`, children: benefits.length ? benefits.map(renderBenefit(version)) : null }));
+    }
+
     const PromoTile = JSX(({ className = '', title = 'Акции и спецпредложения', date, description, buttons = [], version = 'primary', ...rest }) => (jsx(BlockWrapper, { className: `bg-white text-primary-text font-sans p-9 box-border ${className} ${VersionStyleMap[version]} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: jsx(BaseTile, { title: title ? (jsx(Headline, { title: title, className: `!p-0 max-w-[600px]`, headlineVersion: getTileHeadingType(className), bgColorHeadline: version, align: "left", as: "h2", ...rest })) : null, buttons: buttons?.length ? jsx(ButtonSection, { buttons: buttons, className: "flex gap-3" }) : null, children: jsxs("div", { className: "mt-1.5", children: [date ? jsx("div", { className: "text-s mb-2", children: formatDate(date) }) : null, jsx("div", { className: "text-l", children: description })] }) }) })));
     function formatDate(date) {
         const dateObj = new Date(date);
@@ -3564,10 +3599,6 @@
     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} ${styleMap.title}`, 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)));
 
-    function assertUnreachable(x) {
-        throw new Error(x);
-    }
-
     const LINK_CLASSES = 'h-12 flex-1 flex items-center justify-center cursor-pointer';
     const ACTIVE_LINK_CLASSES = 'bg-primary-main';
     const INACTIVE_LINK_CLASSES = 'group bg-white';
@@ -3591,9 +3622,9 @@
         const count = tab.ref && page?.blocks
             ? page.blocks.filter((block) => block?.labels?.includes(tab.ref)).length
             : 0;
-        return (jsx("div", { className: `${LINK_CLASSES} ${active ? ACTIVE_LINK_CLASSES : INACTIVE_LINK_CLASSES}`, role: "tab", "aria-selected": active, onClick: () => onClick(tab), children: jsxs("div", { className: "flex flex-1 items-center justify-center", children: [tab?.title ? renderTitle$1(tab.title, active) : null, showCounter && count ? renderCount(count, active) : null] }) }, String(i)));
+        return (jsx("div", { className: `${LINK_CLASSES} ${active ? ACTIVE_LINK_CLASSES : INACTIVE_LINK_CLASSES}`, role: "tab", "aria-selected": active, onClick: () => onClick(tab), children: jsxs("div", { className: "flex flex-1 items-center justify-center", children: [tab?.title ? renderTitle$2(tab.title, active) : null, showCounter && count ? renderCount(count, active) : null] }) }, String(i)));
     };
-    const renderTitle$1 = (title, active) => (jsx("h3", { className: `${TEXT_CLASSES} ${active ? ACTIVE_TEXT_CLASSES : INACTIVE_TEXT_CLASSES}`, children: title }));
+    const renderTitle$2 = (title, active) => (jsx("h3", { className: `${TEXT_CLASSES} ${active ? ACTIVE_TEXT_CLASSES : INACTIVE_TEXT_CLASSES}`, children: title }));
     const renderCount = (count, active) => (jsx("div", { className: `${BADGE_CLASSES} ${active ? ACTIVE_BADGE_CLASSES : INACTIVE_BADGE_CLASSES}`, children: count }));
 
     const renderTab = ({ page, currentTab, showCounter, onClick }) => 
@@ -3802,12 +3833,12 @@
         });
         const rows = (rowData || []).map((row, i) => (jsx(TariffsTableRow, { row: row, activeIndex: activeIndex, rowIdx: i, ...rest }, String(i))));
         const [visibleRows, hiddenRows] = hiddenRowsNum > 0 ? [rows.slice(0, -hiddenRowsNum), rows.slice(-hiddenRowsNum)] : [rows, []];
-        return (jsxs(BlockWrapper, { className: `bg-white font-sans p-12 overflow-hidden text-primary-text relative ${itemCount > 1 ? 'pr-0' : ''} ${className}`, ...rest, children: [renderTitle({ title, description }), renderDescription(description), hiddenRowsNum > 0 ? (jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs(Wrapper, { controls: controls, children: [visibleRows, jsx(FoldableSection, { isUnfolded: isUnfolded, children: hiddenRows })] })), renderFoldButton: renderDefaultFoldButton })) : (jsx(Wrapper, { controls: controls, children: rows }))] }));
+        return (jsxs(BlockWrapper, { className: `bg-white font-sans p-12 overflow-hidden text-primary-text relative ${itemCount > 1 ? 'pr-0' : ''} ${className}`, ...rest, children: [renderTitle$1({ title, description }), renderDescription$1(description), hiddenRowsNum > 0 ? (jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs(Wrapper, { controls: controls, children: [visibleRows, jsx(FoldableSection, { isUnfolded: isUnfolded, children: hiddenRows })] })), renderFoldButton: renderDefaultFoldButton })) : (jsx(Wrapper, { controls: controls, children: rows }))] }));
     });
-    function renderTitle({ title, description }) {
+    function renderTitle$1({ title, description }) {
         return title ? (jsx(Heading, { headingType: "h3", className: `text-center ${description ? 'mb-2.5' : 'mb-8'}`, title: title })) : null;
     }
-    function renderDescription(description) {
+    function renderDescription$1(description) {
         return description ? jsx("div", { className: "mb-9 text-center text-l", children: description }) : null;
     }
     const Wrapper = JSX(({ children, controls }) => {
@@ -3819,36 +3850,19 @@
                         })] }), isScrollAvailable ? (jsx("div", { className: "absolute top-0 right-0 bottom-0 w-[84px] bg-opacity-to-white" })) : null] }));
     });
 
-    const textBlockStyleMaps = {
-        primary: {
-            background: 'bg-white',
-            icon: 'bg-primary-main text-white',
-            title: 'text-primary-text',
-            description: 'text-secondary-text',
-        },
-        secondary: {
-            background: 'bg-primary-main',
-            icon: 'bg-white text-primary-main',
-            title: 'text-white',
-            description: 'text-white',
-        },
-        'secondary-light': {
-            background: 'bg-primary-main/10',
-            icon: 'bg-primary-main text-white',
-            title: 'text-primary-text',
-            description: 'text-secondary-text',
-        },
+    const textBlockBack = {
+        primary: 'bg-white',
+        secondary: 'bg-primary-main',
+        'secondary-light': 'bg-primary-main/10',
     };
-    const TextBlock = JSX(({ title, description, blockVersion = 'primary', iconVersion, image, className, ...rest }) => {
-        const textBlockStyleMap = textBlockStyleMaps[blockVersion];
-        return (jsxs(BlockWrapper, { className: `font-sans px-9 py-4 flex ${textBlockStyleMap.background} ${className || ''}`, ...rest, children: [iconVersion === 'small' ? renderIcon(textBlockStyleMap.icon) : null, iconVersion === 'big' ? renderImage(image) : null, jsxs("div", { className: "py-0.5", children: [title ? (jsx("div", { className: `text-l font-medium mb-1 ${textBlockStyleMap.title}`, children: title })) : null, description ? (jsx("div", { className: `text-s ${textBlockStyleMap.description}`, children: description })) : null] })] }));
+    const TextBlock = JSX(({ className = '', title, description, blockVersion = 'primary', iconVersion, image, ...rest }) => {
+        const isSecondaryBlock = blockVersion === 'secondary';
+        return (jsxs(BlockWrapper, { className: `px-9 py-4 flex gap-3 ${textBlockBack[blockVersion]} ${className}`, ...rest, children: [iconVersion === 'small' ? (jsx("div", { className: "mt-1", children: renderIcon(isSecondaryBlock) })) : null, iconVersion === 'big' ? renderImage(image) : null, jsxs("div", { children: [title ? renderTitle(title, isSecondaryBlock) : null, description ? (jsx("div", { className: "mt-1", children: renderDescription(description, isSecondaryBlock) })) : null] })] }));
     });
-    function renderIcon(className) {
-        return (jsx("div", { className: "pt-1.5 pl-1 pr-4", children: jsx("div", { className: `rounded-full h-4 w-4 text-center text-xs-light ${className}`, children: "i" }) }));
-    }
-    function renderImage(image) {
-        return image?.src ? jsx(ImgInner, { className: "pt-0.5 pr-3", image: image }) : null;
-    }
+    const renderIcon = (isSecondaryBlock) => (jsx("div", { className: `rounded-full h-4 w-4 text-center text-xs-light ${isSecondaryBlock ? 'bg-white text-primary-main' : 'bg-primary-main text-white'}`, children: "i" }));
+    const renderImage = (image) => (image?.src ? jsx(ImgInner, { image: image }) : null);
+    const renderTitle = (title, isSecondaryBlock) => (jsx(Text, { size: "text-l", font: "font-medium", color: isSecondaryBlock ? 'text-white' : 'text-primary-text', children: title }));
+    const renderDescription = (description, isSecondaryBlock) => (jsx(Paragraph, { size: "text-s", color: isSecondaryBlock ? 'text-white' : 'text-secondary-text', children: description }));
 
     const Tags = JSX((props) => {
         const { tags, className = '' } = props;
@@ -4093,7 +4107,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.6.42";
+    const packageVersion = "0.6.43";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;