npm - @redneckz/wildless-cms-uni-blocks - Versions diffs - 0.14.531 → 0.14.532 - Mend

@redneckz/wildless-cms-uni-blocks 0.14.531 → 0.14.532

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (53) hide show

package/lib/components/StepsBlock/StepsBlock.mobile.js CHANGED Viewed

@@ -1,33 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
 import { JSX } from '@redneckz/uni-jsx';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper.js';
-import { Img } from '../../ui-kit/Img/Img.js';
 import { renderButtonsSection } from '../../ui-kit/LinkButton/renderButtonsSection.js';
-import { Paragraph } from '../../ui-kit/Paragraph/Paragraph.js';
-import { RichText } from '../../ui-kit/RichText/RichText.js';
-import { isIcon } from '../../utils/isIcon.js';
 import { style } from '../../utils/style.js';
 import { Headline } from '../Headline/Headline.js';
-import { getIconTextStyle } from './getIconTextStyle.js';
-import { STEPS_BLOCK_STYLE } from './StepsBlockStyleMaps.js';
-const STEPS_SIZE_MAP = {
-    normal: { icon: 'h-11 w-11', image: 'h-14 w-14' },
-    small: { icon: 'h-12 w-12', image: 'h-14 w-14' },
-};
-const STEPS_TILE_DESCRIPTION_HEIGHT_MAP = {
-    normal: '',
-    small: 'min-h-6xl',
-};
-const styleMap = STEPS_BLOCK_STYLE;
-export const StepsBlock = JSX(({ className = '', title, description, steps, buttons, size = 'normal', stepVersion = 'gray', version = 'primary', ...rest }) => (_jsxs(BlockWrapper, { className: style('box-border flex flex-col gap-xl', className), defaultPadding: "p-6xl", version: version, ...rest, children: [_jsx(Headline, { title: title, description: description, headlineVersion: "M", isEmbedded: true, align: "text-left" }), steps?.length ? (_jsx("div", { className: "box-border", children: _jsx("div", { className: "flex flex-col gap-6xl justify-between", children: steps.map(renderStep(size, stepVersion)) }) })) : null, renderButtonsSection(buttons, { isVertical: true })] })));
-// TODO: Create universal function for this case
-const renderStep = (size, stepVersion) => (step, i) => (_jsx("div", { className: "contents", children: _jsxs("div", { className: "flex flex-row items-center relative", children: [_jsx("div", { className: "overflow-hidden flex flex-shrink-0 items-center", children: renderIconArea(size, stepVersion)(step, i) }), _jsxs("div", { className: style('flex flex-col justify-center h-fit', STEPS_TILE_DESCRIPTION_HEIGHT_MAP[size]), children: [step.label ? (_jsx(Paragraph, { size: "text-l", align: "text-left", children: step.label })) : null, step.description ? (_jsx("div", { className: style('text-s font-light text-left', styleMap.description), children: step.description })) : null, _jsx(RichText, { __html: step.__html })] })] }) }, String(i)));
-const renderIconArea = (size, stepVersion) => (step, i) => {
-    const iconVersion = stepVersion === 'secondary' ? 'white' : 'color';
-    const isImg = Boolean(step?.icon?.src);
-    const iconAreaSize = STEPS_SIZE_MAP[size][isImg ? 'image' : 'icon'];
-    const containerVersion = isImg ? stepVersion === 'transparent' : stepVersion;
-    return (_jsx(BlockWrapper, { className: style(iconAreaSize, 'z-10 mr-s flex justify-center content-center rounded-md'), defaultPadding: "", version: containerVersion, children: _jsx("span", { className: "flex max-w-full max-h-full items-center justify-center", children: isIcon(step?.icon) ? (_jsx(Img, { image: { ...step.icon, iconVersion: step.icon?.iconVersion || iconVersion }, imageClassName: "max-w-full max-h-full", width: getIconSizeStyle(size), height: getIconSizeStyle(size) })) : (_jsx("span", { className: style('text-h4', stepVersion === 'transparent' ? styleMap.iconText : getIconTextStyle(stepVersion)), children: i + 1 })) }) }));
-};
-const getIconSizeStyle = (size) => (size === 'normal' ? '38' : '24');
+import { renderStepMobile } from './renderStepMobile.js';
+export const StepsBlock = JSX(({ className = '', title, description, steps = [], buttons, stepVersion = 'gray', version = 'primary', ...rest }) => {
+    const isBigSizeSteps = steps.length > 3;
+    return (_jsxs(BlockWrapper, { className: style('box-border flex flex-col gap-xl', className), defaultPadding: "p-6xl", version: version, ...rest, children: [_jsx(Headline, { title: title, description: description, headlineVersion: "M", isEmbedded: true, align: "text-left" }), steps?.length ? (_jsx("div", { className: "flex flex-col gap-6xl justify-between box-border", children: steps.map(renderStepMobile(isBigSizeSteps, version, stepVersion)) })) : null, renderButtonsSection(buttons, { isVertical: true })] }));
+});
 //# sourceMappingURL=StepsBlock.mobile.js.map

package/lib/components/StepsBlock/StepsBlock.mobile.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepsBlock.mobile.js","sourceRoot":"","sources":["../../../src/components/StepsBlock/StepsBlock.mobile.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;~~AAGxC~~,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,~~GAAG,EAAE,MAAM,sBAAsB,CAAC;AAC3C,OAAO,EAAE,~~oBAAoB,EAAE,MAAM,8CAA8C,CAAC;~~AACpF~~,OAAO,EAAE,~~SAAS,EAAE,MAAM,kCAAkC,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE1D,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,~~KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;~~AAEtD~~,~~OAAO,EAAE,iBAAiB,EAAE,~~MAAM,~~uBAAuB,~~CAAC~~;AAI1D~~,MAAM,cAAc,GAAyC;IAC3D,MAAM,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE;IACjD,KAAK,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE;CACjD,CAAC;AAEF,MAAM,iCAAiC,GAAgC;IACrE,MAAM,EAAE,EAAE;IACV,KAAK,EAAE,WAAW;CACnB,CAAC;AAEF,MAAM,QAAQ,GAAG,iBAAiB,CAAC;AAInC,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAC3B,CAAC,EACC,SAAS,GAAG,EAAE,EACd,KAAK,EACL,WAAW,EACX,KAAK,~~EACL~~,OAAO,EACP,~~IAAI,GAAG,QAAQ,EACf,~~WAAW,GAAG,MAAM,EACpB,OAAO,GAAG,SAAS,EACnB,GAAG,IAAI,EACR,EAAE,EAAE,CAAC,~~CACJ~~,MAAC,YAAY,IACX,SAAS,EAAE,KAAK,CAAC,iCAAiC,EAAE,SAAS,CAAC,EAC9D,cAAc,EAAC,OAAO,EACtB,OAAO,EAAE,OAAO,KACZ,IAAI,aAER,KAAC,QAAQ,IACP,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,eAAe,EAAC,GAAG,EACnB,UAAU,EAAE,IAAI,EAChB,KAAK,EAAC,WAAW,GACjB,EACD,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CACf,cAAK,SAAS,EAAC,~~YAAY~~,~~YACzB~~,~~cAAK,SAAS,EAAC,uCAAuC,YACnD,~~KAAK,CAAC,GAAG,CAAC,~~UAAU~~,CAAC,~~IAAI~~,EAAE,WAAW,CAAC,CAAC,~~GACrC~~,~~GACF,~~CACP,CAAC,CAAC,CAAC,IAAI,EACP,oBAAoB,CAAC,OAAO,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,IACvC,CAChB,~~CACF,~~CAAC;~~AAEF~~,~~gDAAgD;AAChD,MAAM,UAAU,GAAG,~~CAAC,IAAiB,EAAE,WAAyB,EAAE,EAAE,CAAC,CAAC,IAAe,EAAE,CAAS,EAAE,EAAE,CAClG,CACE,cAAqB,SAAS,EAAC,UAAU,YACvC,eAAK,SAAS,EAAC,qCAAqC,aAClD,cAAK,SAAS,EAAC,iDAAiD,YAC7D,cAAc,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,GACvC,EACN,eACE,SAAS,EAAE,KAAK,CACd,oCAAoC,EACpC,iCAAiC,CAAC,IAAI,CAAC,CACxC,aAEA,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CACZ,KAAC,SAAS,IAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,WAAW,YACvC,IAAI,CAAC,KAAK,GACD,CACb,CAAC,CAAC,CAAC,IAAI,EACP,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAClB,cAAK,SAAS,EAAE,KAAK,CAAC,6BAA6B,EAAE,QAAQ,CAAC,WAAW,CAAC,YACvE,IAAI,CAAC,WAAW,GACb,CACP,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,QAAQ,IAAC,MAAM,EAAE,IAAI,CAAC,MAAM,GAAI,IAC7B,IACF,IAvBE,MAAM,CAAC,CAAC,CAAC,CAwBb,CACP,CAAC;AAEJ,MAAM,cAAc,GAClB,CAAC,IAAiB,EAAE,WAAyB,EAAE,EAAE,CAAC,CAAC,IAAe,EAAE,CAAS,EAAE,EAAE;IAC/E,MAAM,WAAW,GAAG,WAAW,KAAK,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC;IACpE,MAAM,KAAK,GAAG,OAAO,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC;IACvC,MAAM,YAAY,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IACpE,MAAM,gBAAgB,GAAG,KAAK,CAAC,CAAC,CAAC,WAAW,KAAK,aAAa,CAAC,CAAC,CAAC,WAAW,CAAC;IAE7E,OAAO,CACL,KAAC,YAAY,IACX,SAAS,EAAE,KAAK,CAAC,YAAY,EAAE,yDAAyD,CAAC,EACzF,cAAc,EAAC,EAAE,EACjB,OAAO,EAAE,gBAAgC,YAEzC,eAAM,SAAS,EAAC,wDAAwD,YACrE,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CACpB,KAAC,GAAG,IACF,KAAK,EAAE,EAAE,GAAG,IAAI,CAAC,IAAI,EAAE,WAAW,EAAE,IAAI,CAAC,IAAI,EAAE,WAAW,IAAI,WAAW,EAAE,EAC3E,cAAc,EAAC,uBAAuB,EACtC,KAAK,EAAE,gBAAgB,CAAC,IAAI,CAAC,EAC7B,MAAM,EAAE,gBAAgB,CAAC,IAAI,CAAC,GAC9B,CACH,CAAC,CAAC,CAAC,CACF,~~eACE,SAAS,EAAE,KAAK,CACd,SAAS,EACT,WAAW,KAAK,aAAa,~~CAAC,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAClF,YAEA,CAAC,GAAG,CAAC,GACD,CACR,GACI,GACM,CAChB,CAAC;AACJ,CAAC,CAAC;AAEJ,MAAM,gBAAgB,GAAG,CAAC,IAAY,EAAE,EAAE,CAAC,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC"}
1	+ {"version":3,"file":"StepsBlock.mobile.js","sourceRoot":"","sources":["../../../src/components/StepsBlock/StepsBlock.mobile.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,8CAA8C,CAAC;AAEpF,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAKtD,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAC3B,CAAC,EACC,SAAS,GAAG,EAAE,EACd,KAAK,EACL,WAAW,EACX,KAAK,GAAG,EAAE,EACV,OAAO,EACP,WAAW,GAAG,MAAM,EACpB,OAAO,GAAG,SAAS,EACnB,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;IAExC,OAAO,CACL,MAAC,YAAY,IACX,SAAS,EAAE,KAAK,CAAC,iCAAiC,EAAE,SAAS,CAAC,EAC9D,cAAc,EAAC,OAAO,EACtB,OAAO,EAAE,OAAO,KACZ,IAAI,aAER,KAAC,QAAQ,IACP,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,eAAe,EAAC,GAAG,EACnB,UAAU,EAAE,IAAI,EAChB,KAAK,EAAC,WAAW,GACjB,EACD,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CACf,cAAK,SAAS,EAAC,kDAAkD,YAC9D,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,cAAc,EAAE,OAAO,EAAE,WAAW,CAAC,CAAC,GAC9D,CACP,CAAC,CAAC,CAAC,IAAI,EACP,oBAAoB,CAAC,OAAO,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,IACvC,CAChB,CAAC;AACJ,CAAC,CACF,CAAC"}

package/lib/components/StepsBlock/StepsBlockContent.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import { type BlockVersion } from '../../model/BlockVersion';
 import { type BulletsProps } from '../../model/Bullets';
 import { type DescriptionProps, type LabelProps, type TitleProps } from '../../model/HeadlineType';
 import { type IconProps } from '../../model/Picture';
-import { type SizeVersion } from '../../model/SizeVersion';
+import { type ImageContent } from '../../ui-kit/Img/ImgProps';
 import { type ButtonsSectionContent } from '../../ui-kit/LinkButton/ButtonsSectionContent';
 import { type LinkButtonContent } from '../../ui-kit/LinkButton/LinkButtonContent';
 import type { RichTextProps } from '../../ui-kit/RichText/RichTextProps';
@@ -10,7 +10,7 @@ import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
 /**
  * @title Шаг
  */
-export declare type StepProps = DescriptionProps & LabelProps & RichTextProps & IconProps & BulletsProps & {
+export declare type StepProps = DescriptionProps & ImageContent & LabelProps & RichTextProps & IconProps & BulletsProps & {
     button?: LinkButtonContent;
 };
 /**
@@ -25,10 +25,6 @@ export declare type StepsBlockContent = UniBlockContent & TitleProps & Descripti
      * @maxItems 5
      */
     steps?: StepProps[];
-    /**
-     * @title Тема шагов
-     */
+    /** @title Тема шагов */
     stepVersion?: BlockVersion;
-    /** @title Размер шагов */
-    size?: SizeVersion;
 };

package/lib/components/StepsBlock/renderStepMobile.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+import { type BlockVersion } from '../../model/BlockVersion';
+import { type StepProps } from './StepsBlockContent';
+export declare const renderStepMobile: (stepsSize: boolean, version: BlockVersion, stepVersion: BlockVersion) => (step: StepProps, i: number) => JSX.Element;

package/lib/components/StepsBlock/renderStepMobile.js ADDED Viewed

@@ -0,0 +1,45 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
+import { BlockWrapper } from '../../ui-kit/BlockWrapper.js';
+import { Img } from '../../ui-kit/Img/Img.js';
+import { LinkButton } from '../../ui-kit/LinkButton/LinkButton.js';
+import { Paragraph } from '../../ui-kit/Paragraph/Paragraph.js';
+import { RichText } from '../../ui-kit/RichText/RichText.js';
+import { isIcon } from '../../utils/isIcon.js';
+import { style } from '../../utils/style.js';
+import { getIconTextStyle } from './getIconTextStyle.js';
+import { STEPS_BLOCK_STYLE } from './StepsBlockStyleMaps.js';
+const styleMap = STEPS_BLOCK_STYLE;
+export const renderStepMobile = (stepsSize, version, stepVersion) => (step, i) => {
+    const { button, image } = step;
+    const styleStepMobile = button?.text && image?.src;
+    return (_jsx("div", { className: "contents", children: _jsxs("div", { className: style('flex items-center relative', image?.src ? 'flex-col' : 'flex-row'), children: [image?.src ? renderText(step) : null, _jsx("div", { className: "overflow-hidden flex flex-shrink-0 items-center", children: renderIconArea(stepsSize, stepVersion)(step, i) }), _jsxs("div", { className: style('flex flex-col justify-center h-fit w-full', {
+                        'min-h-6xl': stepsSize,
+                    }), children: [image?.src ? null : renderText(step), styleStepMobile ? (_jsx(LinkButton, { className: "box-border py-s w-full max-w-60 mt-lg", version: version, ...button, children: button?.text })) : null] })] }) }, String(i)));
+};
+const renderIconArea = (stepsSize, stepVersion) => (step, i) => {
+    const iconVersion = stepVersion === 'secondary' ? 'white' : 'color';
+    const isImg = Boolean(step?.icon?.src);
+    const iconAreaSize = getIconAreaSize(stepsSize, isImg);
+    const containerVersion = isImg ? stepVersion === 'transparent' : stepVersion;
+    const isImgSrc = step.image?.src;
+    return (_jsx(BlockWrapper, { className: style({ 'w-32': Boolean(isImgSrc) }, 'z-10 mr-s flex justify-center content-center rounded-md', !isImgSrc && iconAreaSize), defaultPadding: "", version: containerVersion, children: _jsx("div", { className: "flex max-w-full max-h-full items-center justify-center", children: renderIcon({ step, iconVersion, i, stepVersion }) }) }));
+};
+const renderText = (step) => {
+    const visibleStyle = Boolean(step.button?.text && step.image?.src);
+    return (_jsxs("div", { className: style({
+            'mb-lg w-full': visibleStyle,
+        }), children: [step?.label ? (_jsx(Paragraph, { size: "text-l", align: "text-left", children: step.label })) : null, step?.description ? (_jsx("div", { className: style('text-s font-light text-left', styleMap.description), children: step.description })) : null, _jsx(RichText, { __html: step.__html })] }));
+};
+const getIconAreaSize = (stepsSize, isImg) => {
+    return stepsSize && isImg ? 'h-14 w-14' : 'h-11 w-11';
+};
+const renderIcon = ({ step, iconVersion, i, stepVersion, }) => {
+    if (isIcon(step?.icon)) {
+        return (_jsx(Img, { image: { ...step.icon, iconVersion: step.icon?.iconVersion || iconVersion }, imageClassName: "max-w-full max-h-full", width: "24", height: "24" }));
+    }
+    else if (isIcon(step.image)) {
+        return _jsx(Img, { image: { ...step.image, size: { width: 120, height: 120 } } });
+    }
+    return (_jsx("span", { className: style('text-h4', stepVersion === 'transparent' ? styleMap.iconText : getIconTextStyle(stepVersion)), children: i + 1 }));
+};
+//# sourceMappingURL=renderStepMobile.js.map

package/lib/components/StepsBlock/renderStepMobile.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"renderStepMobile.js","sourceRoot":"","sources":["../../../src/components/StepsBlock/renderStepMobile.tsx"],"names":[],"mappings":"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"}

package/mobile/bundle/bundle.umd.js CHANGED Viewed

@@ -1179,9 +1179,9 @@
             onChange && onChange(!value);
         }, [onChange, disabled, value]);
         const icon = isRadio ? (jsx("div", { className: "absolute left-1 w-3 h-3 rounded-full bg-primary-main" })) : (jsx(SVG, { paths: CHECK_PATHS, className: "absolute left-1 ml-px block", width: "11", height: "9", fill: "white", viewBox: "0 0 11 9" }));
-        return (jsx("div", { className: className, children: jsxs("label", { className: style('flex items-center relative group/box', getCursorStyle(disabled)), onClick: handleChange, children: [jsx("div", { className: style(defaultCheckStyle, 'm-0', isRadio ? 'rounded-full border-2' : checkboxStyle(value), !disabled && value ? 'border-primary-main' : 'border-gray', disabled ? 'bg-main-disabled' : 'group-hover/box:border-primary-hover'), role: role(isRadio), "aria-checked": Boolean(value), "aria-disabled": Boolean(disabled) }), value ? icon : null, renderText$1(text)] }) }));
+        return (jsx("div", { className: className, children: jsxs("label", { className: style('flex items-center relative group/box', getCursorStyle(disabled)), onClick: handleChange, children: [jsx("div", { className: style(defaultCheckStyle, 'm-0', isRadio ? 'rounded-full border-2' : checkboxStyle(value), !disabled && value ? 'border-primary-main' : 'border-gray', disabled ? 'bg-main-disabled' : 'group-hover/box:border-primary-hover'), role: role(isRadio), "aria-checked": Boolean(value), "aria-disabled": Boolean(disabled) }), value ? icon : null, renderText$2(text)] }) }));
     });
-    const renderText$1 = (text) => text ? (jsx("div", { className: "ml-s", children: jsx(Text, { size: "text-l", font: "font-light", children: text }) })) : null;
+    const renderText$2 = (text) => text ? (jsx("div", { className: "ml-s", children: jsx(Text, { size: "text-l", font: "font-light", children: text }) })) : null;
     const getCursorStyle = (disabled = false) => (disabled ? 'cursor-not-allowed' : 'cursor-pointer');
     const role = (isRadio = false) => (isRadio ? 'radio' : 'checkbox');
     const checkboxStyle = (value = false) => style('rounded border', value ? 'bg-primary-main' : '');
@@ -1309,9 +1309,9 @@
             onClose: handleClose,
             iconVersion,
         });
-        return (jsxs("div", { className: style('space-y-xs', className), children: [renderLabel(label), jsxs("div", { className: style('relative', hasOpen ? 'z-20' : 'z-10'), ref: inputRef, children: [jsxs("div", { className: style('h-14 [&>*]:p-m pr-8 text-l flex items-center justify-between text-primary-text relative z-10 overflow-hidden', getStyle(isBorder, valid, isDisabled)), onClick: hasOpen ? handleClose : open, children: [jsx("p", { className: "line-clamp-2 text-ellipsis", children: formatOption(value) || placeholder }), renderIcon$1(hasOpen, iconVersion)] }), isSearch && hasOpen ? (jsx("div", { className: style('absolute top-0 w-full z-20'), children: jsx(Input, { type: "text", autoFocus: true, value: query, onChange: setQuery }) })) : null] })] }));
+        return (jsxs("div", { className: style('space-y-xs', className), children: [renderLabel(label), jsxs("div", { className: style('relative', hasOpen ? 'z-20' : 'z-10'), ref: inputRef, children: [jsxs("div", { className: style('h-14 [&>*]:p-m pr-8 text-l flex items-center justify-between text-primary-text relative z-10 overflow-hidden', getStyle(isBorder, valid, isDisabled)), onClick: hasOpen ? handleClose : open, children: [jsx("p", { className: "line-clamp-2 text-ellipsis", children: formatOption(value) || placeholder }), renderIcon$2(hasOpen, iconVersion)] }), isSearch && hasOpen ? (jsx("div", { className: style('absolute top-0 w-full z-20'), children: jsx(Input, { type: "text", autoFocus: true, value: query, onChange: setQuery }) })) : null] })] }));
     });
-    const renderIcon$1 = (isOpen, iconVersion) => (jsx(Icon, { className: style('absolute right-3 flex self-center', isOpen ? '' : 'rotate-180'), iconVersion: iconVersion, name: "ArrowUpIcon", width: "16", height: "16" }));
+    const renderIcon$2 = (isOpen, iconVersion) => (jsx(Icon, { className: style('absolute right-3 flex self-center', isOpen ? '' : 'rotate-180'), iconVersion: iconVersion, name: "ArrowUpIcon", width: "16", height: "16" }));
     const getStyle = (isBorder, valid, disabled) => style(isBorder ? 'border rounded-md ' : '', isBorder && !disabled ? 'hover:border-primary-hover' : '', disabled ? 'bg-main-divider' : 'cursor-pointer ', valid ? 'border-gray' : 'border-error');
     const noop = () => {
@@ -4041,8 +4041,8 @@
     const Contacts = JSX(({ className = '', items = [] }) => items?.length ? (jsx("div", { className: style('space-y-m', className), children: items.map(renderContactsGroup) })) : null);
     const renderContactsGroup = (item, i) => (jsxs("div", { className: "space-y-m", children: [jsx("div", { children: jsx(Text, { size: "text-l", font: "font-medium", children: item?.title }) }), jsx("div", { className: "space-y-m", children: item.items?.map(renderContact) })] }, String(i)));
-    const renderContact = (item, i) => (jsxs("div", { className: "space-y-2xs", children: [jsx("div", { children: renderText(item.type, item.text) }), jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: item.description })] }, String(i)));
-    const renderText = (type, text = '') => {
+    const renderContact = (item, i) => (jsxs("div", { className: "space-y-2xs", children: [jsx("div", { children: renderText$1(item.type, item.text) }), jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: item.description })] }, String(i)));
+    const renderText$1 = (type, text = '') => {
         switch (type) {
             case 'tel':
                 return (jsx("a", { className: "text-primary-text hover:text-primary-main no-underline", href: `tel:${formatTel(text)}`, children: jsx(Text, { size: "text-h6", children: text }) }));
@@ -5254,26 +5254,45 @@
         dot: 'bg-white/80 group-data-primary:bg-secondary-text',
     };
-    const STEPS_SIZE_MAP = {
-        normal: { icon: 'h-11 w-11', image: 'h-14 w-14' },
-        small: { icon: 'h-12 w-12', image: 'h-14 w-14' },
-    };
-    const STEPS_TILE_DESCRIPTION_HEIGHT_MAP = {
-        normal: '',
-        small: 'min-h-6xl',
-    };
     const styleMap = STEPS_BLOCK_STYLE;
-    const StepsBlock = JSX(({ className = '', title, description, steps, buttons, size = 'normal', stepVersion = 'gray', version = 'primary', ...rest }) => (jsxs(BlockWrapper, { className: style('box-border flex flex-col gap-xl', className), defaultPadding: "p-6xl", version: version, ...rest, children: [jsx(Headline, { title: title, description: description, headlineVersion: "M", isEmbedded: true, align: "text-left" }), steps?.length ? (jsx("div", { className: "box-border", children: jsx("div", { className: "flex flex-col gap-6xl justify-between", children: steps.map(renderStep(size, stepVersion)) }) })) : null, renderButtonsSection(buttons, { isVertical: true })] })));
-    // TODO: Create universal function for this case
-    const renderStep = (size, stepVersion) => (step, i) => (jsx("div", { className: "contents", children: jsxs("div", { className: "flex flex-row items-center relative", children: [jsx("div", { className: "overflow-hidden flex flex-shrink-0 items-center", children: renderIconArea(size, stepVersion)(step, i) }), jsxs("div", { className: style('flex flex-col justify-center h-fit', STEPS_TILE_DESCRIPTION_HEIGHT_MAP[size]), children: [step.label ? (jsx(Paragraph, { size: "text-l", align: "text-left", children: step.label })) : null, step.description ? (jsx("div", { className: style('text-s font-light text-left', styleMap.description), children: step.description })) : null, jsx(RichText, { __html: step.__html })] })] }) }, String(i)));
-    const renderIconArea = (size, stepVersion) => (step, i) => {
+    const renderStepMobile = (stepsSize, version, stepVersion) => (step, i) => {
+        const { button, image } = step;
+        const styleStepMobile = button?.text && image?.src;
+        return (jsx("div", { className: "contents", children: jsxs("div", { className: style('flex items-center relative', image?.src ? 'flex-col' : 'flex-row'), children: [image?.src ? renderText(step) : null, jsx("div", { className: "overflow-hidden flex flex-shrink-0 items-center", children: renderIconArea(stepsSize, stepVersion)(step, i) }), jsxs("div", { className: style('flex flex-col justify-center h-fit w-full', {
+                            'min-h-6xl': stepsSize,
+                        }), children: [image?.src ? null : renderText(step), styleStepMobile ? (jsx(LinkButton, { className: "box-border py-s w-full max-w-60 mt-lg", version: version, ...button, children: button?.text })) : null] })] }) }, String(i)));
+    };
+    const renderIconArea = (stepsSize, stepVersion) => (step, i) => {
         const iconVersion = stepVersion === 'secondary' ? 'white' : 'color';
         const isImg = Boolean(step?.icon?.src);
-        const iconAreaSize = STEPS_SIZE_MAP[size][isImg ? 'image' : 'icon'];
+        const iconAreaSize = getIconAreaSize(stepsSize, isImg);
         const containerVersion = isImg ? stepVersion === 'transparent' : stepVersion;
-        return (jsx(BlockWrapper, { className: style(iconAreaSize, 'z-10 mr-s flex justify-center content-center rounded-md'), defaultPadding: "", version: containerVersion, children: jsx("span", { className: "flex max-w-full max-h-full items-center justify-center", children: isIcon(step?.icon) ? (jsx(Img, { image: { ...step.icon, iconVersion: step.icon?.iconVersion || iconVersion }, imageClassName: "max-w-full max-h-full", width: getIconSizeStyle(size), height: getIconSizeStyle(size) })) : (jsx("span", { className: style('text-h4', stepVersion === 'transparent' ? styleMap.iconText : getIconTextStyle(stepVersion)), children: i + 1 })) }) }));
+        const isImgSrc = step.image?.src;
+        return (jsx(BlockWrapper, { className: style({ 'w-32': Boolean(isImgSrc) }, 'z-10 mr-s flex justify-center content-center rounded-md', !isImgSrc && iconAreaSize), defaultPadding: "", version: containerVersion, children: jsx("div", { className: "flex max-w-full max-h-full items-center justify-center", children: renderIcon$1({ step, iconVersion, i, stepVersion }) }) }));
+    };
+    const renderText = (step) => {
+        const visibleStyle = Boolean(step.button?.text && step.image?.src);
+        return (jsxs("div", { className: style({
+                'mb-lg w-full': visibleStyle,
+            }), children: [step?.label ? (jsx(Paragraph, { size: "text-l", align: "text-left", children: step.label })) : null, step?.description ? (jsx("div", { className: style('text-s font-light text-left', styleMap.description), children: step.description })) : null, jsx(RichText, { __html: step.__html })] }));
+    };
+    const getIconAreaSize = (stepsSize, isImg) => {
+        return stepsSize && isImg ? 'h-14 w-14' : 'h-11 w-11';
     };
-    const getIconSizeStyle = (size) => (size === 'normal' ? '38' : '24');
+    const renderIcon$1 = ({ step, iconVersion, i, stepVersion, }) => {
+        if (isIcon(step?.icon)) {
+            return (jsx(Img, { image: { ...step.icon, iconVersion: step.icon?.iconVersion || iconVersion }, imageClassName: "max-w-full max-h-full", width: "24", height: "24" }));
+        }
+        else if (isIcon(step.image)) {
+            return jsx(Img, { image: { ...step.image, size: { width: 120, height: 120 } } });
+        }
+        return (jsx("span", { className: style('text-h4', stepVersion === 'transparent' ? styleMap.iconText : getIconTextStyle(stepVersion)), children: i + 1 }));
+    };
+    const StepsBlock = JSX(({ className = '', title, description, steps = [], buttons, stepVersion = 'gray', version = 'primary', ...rest }) => {
+        const isBigSizeSteps = steps.length > 3;
+        return (jsxs(BlockWrapper, { className: style('box-border flex flex-col gap-xl', className), defaultPadding: "p-6xl", version: version, ...rest, children: [jsx(Headline, { title: title, description: description, headlineVersion: "M", isEmbedded: true, align: "text-left" }), steps?.length ? (jsx("div", { className: "flex flex-col gap-6xl justify-between box-border", children: steps.map(renderStepMobile(isBigSizeSteps, version, stepVersion)) })) : null, renderButtonsSection(buttons, { isVertical: true })] }));
+    });
     const StickyBottomMenuItem = JSX(({ isActive, item, onClick }) => {
         return (jsxs("div", { className: style(isActive ? 'text-primary-main' : 'text-primary-text', `w-10 m-4 flex justify-center items-center flex-col text-xs cursor-pointer`), title: item?.title || '', onClick: onClick, children: [jsx(Icon, { className: "w-6 h-6", name: item?.icon?.icon, iconVersion: isActive ? 'color' : 'black' }), item?.title || ''] }));
@@ -6078,7 +6097,7 @@
         slots: () => [HEADER_SLOT, FOOTER_SLOT, STICKY_FOOTER_SLOT],
     });
-    const packageVersion = "0.14.530";
+    const packageVersion = "0.14.531";
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;