@redneckz/wildless-cms-uni-blocks 0.8.21 → 0.8.22

package/bundle/bundle.umd.js

@@ -3916,56 +3916,27 @@
     };
     const getContainerWidth = (length) => (length < 5 ? 'w-[276px]' : 'w-[210px]');
 
-    const STEPS_BLOCK_STYLE_MAPS = {
-        primary: {
-            description: '!text-secondary-text text-l-light',
-            iconText: 'text-secondary-text',
-            iconBackground: 'bg-main-divider',
-            iconConnector: 'bg-secondary-light',
-            dot: 'bg-secondary-text',
-        },
-        secondary: {
-            description: '!text-white/80 text-l-light',
-            iconText: 'text-white',
-            iconBackground: 'bg-white/30',
-            iconConnector: 'bg-white',
-            dot: 'bg-white/80',
-        },
-        gray: {
-            // TODO Replace this Map with group-data-*
-            description: '!text-white/80 text-l-light',
-            iconText: 'text-white',
-            iconBackground: 'bg-white/30',
-            iconConnector: 'bg-white',
-            dot: 'bg-white/80',
-        },
-        transparent: {
-            description: '!text-white/80 text-l-light',
-            iconText: 'text-white',
-            iconBackground: 'bg-white/30',
-            iconConnector: 'bg-white',
-            dot: 'bg-white/80',
-        },
-        '': {
-            // TODO Replace this Map with group-data-*
-            description: '!text-white/80 text-l-light',
-            iconText: 'text-white',
-            iconBackground: 'bg-white/30',
-            iconConnector: 'bg-white',
-            dot: 'bg-white/80',
-        },
+    const STEPS_BLOCK_STYLE = {
+        description: 'text-white/80 text-l-light group-data-primary:text-secondary-text',
+        iconText: 'text-white group-data-primary:text-secondary-text',
+        iconBackground: 'bg-white/30 group-data-primary:bg-main-divider',
+        iconConnector: 'bg-white group-data-primary:bg-secondary-light',
+        dot: 'bg-white/80 group-data-primary:bg-secondary-text',
     };
 
     const getLineOpacity = (showLines) => (showLines ? '' : 'opacity-0');
     const getPaddingX = (steps) => (steps < 5 ? 'px-[88px]' : 'px-[55px]');
-    const StepsBlock = JSX(({ className = '', showLines = true, steps = [], button, version = 'primary', title, ...rest }) => {
+    const StepsBlock = JSX(({ className = '', showLines = true, steps = [], button, size = 'normal', version = 'primary', stepVersion = 'gray', title, ...rest }) => {
         const shortGaps = steps.length > 3;
-        const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
+        const styleMap = STEPS_BLOCK_STYLE;
         const lineOpacity = getLineOpacity(showLines);
         const paddingX = getPaddingX(steps.length);
-        return (jsxs(BlockWrapper, { className: style('box-border py-12', shortGaps ? 'px-20' : 'px-[70px]', 'flex flex-col items-center overflow-hidden', className), version: version, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", className: "max-w-[752px] text-center mb-9", title: title })) : null, steps?.length ? (jsxs("div", { className: "box-border", children: [jsx("div", { className: style('flex items-center', paddingX), children: joinList(jsx("div", { className: style('h-0.5 w-full bg-secondary-light', lineOpacity) }))(steps.map(renderStepIcon(styleMap, version))) }), jsx("div", { className: style('flex justify-between mt-4', shortGaps ? 'gap-x-3' : 'gap-x-[101px]'), children: steps.map(renderStep({ styleMap, isMainButton: Boolean(button?.text), version })) })] })) : null, button?.text ? jsx(Button, { className: "mt-8 min-w-60", version: "primary", ...button }) : null] }));
+        return (jsxs(BlockWrapper, { className: style('box-border py-12', shortGaps ? 'px-20' : 'px-[70px]', 'flex flex-col items-center overflow-hidden', className), version: version, ...rest, children: [title ? (jsx(Heading, { headingType: "h4", className: "max-w-[752px] text-center mb-9", title: title })) : null, steps?.length ? (jsxs("div", { className: "box-border", children: [jsx("div", { className: style('flex items-center', paddingX), children: joinList(jsx("div", { className: style('h-0.5 w-full bg-secondary-light flex-1', lineOpacity) }))(steps.map(renderStepIcon(styleMap, size, stepVersion))) }), jsx("div", { className: style('flex justify-between mt-4', shortGaps ? 'gap-x-3' : 'gap-x-[101px]'), children: steps.map(renderStep({ styleMap, isMainButton: Boolean(button?.text), version })) })] })) : null, button?.text ? renderButtonsSection([button], { className: 'mt-8 min-w-60' }) : null] }));
     });
-    const renderStepIcon = (styleMap, version) => ({ icon }, i) => (jsx("div", { className: "flex flex-col items-center text-center", children: jsx("div", { className: `h-[100px] w-[100px] min-w-[100px] min-h-[100px] rounded-full p-[26px] box-border z-10 flex justify-center items-center ${styleMap.iconBackground}`, children: checkCanRenderIcon(icon) ? (jsx(ImgInner, { image: getIconWithVersion(icon || {}, version), width: "48", height: "48", asSVG: true })) : (jsx("span", { className: `text-h4 ${styleMap.iconText}`, children: i + 1 })) }) }, String(i)));
+    const renderStepIcon = (styleMap, size, stepVersion) => ({ icon }, i) => {
+        const styleStepIconSize = size === 'normal' ? 'h-[100px] w-[100px]' : 'h-[63px] w-[63px]';
+        return (jsx(BlockWrapper, { className: `${styleStepIconSize} flex justify-center items-center text-center rounded-full p-[26px] box-border z-10`, version: stepVersion, children: checkCanRenderIcon(icon) ? (jsx(ImgInner, { image: getIconWithVersion(icon || {}, stepVersion), width: "48", height: "48", asSVG: true })) : (jsx("span", { className: `text-h4 group-data-transparent:${styleMap.iconText} text-primary-text`, children: i + 1 })) }, String(i)));
+    };
 
     const containerStyles = {
         'horizontal-list': 'mx-auto mt-5 w-fit',
@@ -4570,7 +4541,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.21";
+    const packageVersion = "0.8.22";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;