@redneckz/wildless-cms-uni-blocks 0.14.70 → 0.14.72

package/bundle/bundle.umd.js

@@ -481,15 +481,15 @@
                     ? image.sources
                         .filter((_) => _?.src)
                         .sort(sourcesComparator)
-                        .map(({ src, format, media }, index) => (jsx("source", { srcSet: adjustSrc(router, pathPrefix)(src), type: formatToMimeType(format), media: media ? `(max-width: ${media}px)` : '', width: image.size?.width, height: image.size?.height }, `${index}_${src}`)))
+                        .map(({ src, format, media }, index) => (jsx("source", { srcSet: adjustSrc(router, pathPrefix)(src), type: formatToMimeType(format), media: media ? `(max-width: ${media}px)` : '', width: image?.size?.width, height: image?.size?.height }, `${index}_${src}`)))
                     : null, image?.src
                     ? renderImg({ ...image, src: adjustSrc(router, pathPrefix)(image.src) }, imageClassName)
                     : null] }));
     });
-    const renderImg = (image, imageClassName = '') => (jsx("img", { src: image.src, className: style('object-contain', imageClassName), alt: image.alt || image.title, title: image.title || '', style: {
-            width: image.size?.width ? `${image.size?.width}px` : '100%',
-            height: image.size?.height ? `${image.size?.height}px` : 'auto',
-        }, width: image.size?.width, height: image.size?.height }));
+    const renderImg = (image, imageClassName = '') => (jsx("img", { src: image.src, className: style('object-contain', imageClassName), alt: image?.alt || image?.title || '', title: image?.title || '', style: {
+            width: image?.size?.width ? `${image.size?.width}px` : '100%',
+            height: image?.size?.height ? `${image.size?.height}px` : 'auto',
+        }, width: image?.size?.width, height: image?.size?.height }));
     const adjustSrc = (router, pathPrefix) => (src) => src && !isURL(src) ? adjustHref(router)(joinPath(pathPrefix, src)) : src;
     const formatToMimeType = (format) => format ? `image/${String(format)}` : undefined;
 
@@ -737,7 +737,7 @@
     };
     const renderButtonIcon = (icon) => isIcon(icon) ? (jsx(Img, { image: icon, width: String(icon?.size?.width || DEFAULT_ICON_W), height: String(DEFAULT_ICON_W) })) : null;
 
-    const ListItem = JSX(({ className, isDotted, dotClassName, children }) => (jsxs("div", { className: style('font-sans flex', className), role: "listitem", children: [isDotted ? (jsx("div", { className: "shrink-0", children: jsx("div", { className: style('align-middle inline-block rounded-full bg-primary-text group-data-secondary:bg-white', dotClassName) }) })) : null, jsx("span", { children: children })] })));
+    const ListItem = JSX(({ className, isDotted, dotClassName, children }) => (jsxs("div", { className: style('font-sans flex', className), role: "listitem", children: [isDotted ? (jsx("div", { className: "shrink-0", children: jsx("div", { className: style('align-middle inline-block rounded-full group-data-secondary:bg-white', dotClassName) }) })) : null, jsx("span", { children: children })] })));
 
     const LIST_VERSION_STYLE = {
         S: {
@@ -756,9 +756,9 @@
             dotStyle: 'w-1.5 h-1.5 mr-m',
         },
     };
-    const List = JSX(({ className, isDotted = true, items = [], listItemSize = 'M' }) => {
+    const List = JSX(({ className, isDotted = true, items = [], listItemSize = 'M', dotClassName = '' }) => {
         const versionStyle = LIST_VERSION_STYLE[listItemSize];
-        return items?.length ? (jsx("section", { className: style('flex flex-col gap-xs text-left text-primary-text group-data-secondary:text-white group-data-gray:text-secondary-text', versionStyle.textSize, className), role: "list", children: items.map((item, i) => (jsx(ListItem, { isDotted: isDotted, dotClassName: versionStyle.dotStyle, children: item }, String(i)))) })) : null;
+        return items?.length ? (jsx("section", { className: style('flex flex-col gap-xs text-left text-primary-text group-data-secondary:text-white group-data-gray:text-secondary-text', versionStyle.textSize, className), role: "list", children: items.map((item, i) => (jsx(ListItem, { isDotted: isDotted, dotClassName: style(dotClassName || 'bg-primary-text', versionStyle.dotStyle), children: item }, String(i)))) })) : null;
     });
 
     const toLocalNumberFormat = (fractionDigits = 0) => (_ = 0) => new Intl.NumberFormat('ru-RU', {
@@ -990,7 +990,7 @@
         return data || EMPTY_VALUE$4;
     }
 
-    const Footnote = JSX(({ text, link }) => (jsxs(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: [jsx(Text, { children: text || 'Нажимая кнопку, вы подтверждаете согласие с ' }), link ? (jsx(LinkButton, { href: link.href, ariaLabel: "\u0443\u0441\u043B\u043E\u0432\u0438\u044F \u043F\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0434\u0430\u043D\u043D\u044B\u0445", target: link.target, className: "text-primary-main", children: jsx(Text, { children: link.text }) })) : null] })));
+    const Footnote = JSX(({ text, link }) => (jsxs(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: [jsx(Text, { children: text || 'Нажимая кнопку, вы подтверждаете согласие с ' }), link ? (jsx(LinkButton, { href: link.href, ariaLabel: "\u0443\u0441\u043B\u043E\u0432\u0438\u044F \u043F\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0434\u0430\u043D\u043D\u044B\u0445", target: link.target || '', className: "text-primary-main", children: jsx(Text, { children: link.text }) })) : null] })));
 
     const withValidator = (props, validator) => {
         const { value, isDirty } = props;
@@ -1178,7 +1178,7 @@
 
     const renderAcquiringRegion = ({ regions, field }) => (jsxs("div", { className: "border-b border-b-main-divider @xl:border-none @xl:flex @xl:justify-between gap-lg ", children: [jsx("div", { className: "@xl:w-1/2", children: jsx(SelectControl, { label: "\u0412\u0438\u0434 \u044D\u043A\u0432\u0430\u0439\u0440\u0438\u043D\u0433\u0430", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u044D\u043A\u0432\u0430\u0439\u0440\u0438\u043D\u0433", options: ACQUIRING_TYPES.map(({ name: key = '' }) => ({ key, text: key })), ...withValidator(field('acquiringType'), defaultValidator) }) }), jsx("div", { className: "@xl:w-1/2", children: jsx(SelectControl, { label: "\u0410\u0434\u0440\u0435\u0441", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0430\u0434\u0440\u0435\u0441", options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }) })] }));
 
-    const SlideCheckbox = JSX(({ value = false, text, type = 'checkbox', onChange }) => (jsxs("div", { role: type, "aria-checked": value, className: "flex justify-start items-center w-full cursor-pointer mb-s", onClick: () => onChange && onChange(!value), children: [jsx("div", { className: style('relative flex-shrink-0 duration-300 w-9 h-5 mr-s rounded-2xl', value ? 'bg-primary-main' : 'bg-main-divider'), children: jsx("div", { className: style('absolute opacity-80 duration-500 top-0.5 w-4 h-4 bg-white rounded-full', value ? 'left-1/2' : 'left-[5%]') }) }), jsx(Text, { size: "text-l", font: "font-light", color: "text-primary-text", children: text })] })));
+    const SlideCheckbox = JSX(({ value = false, text, type = 'checkbox', onChange }) => (jsxs("div", { role: type, "aria-checked": value, className: "flex justify-start items-center w-full cursor-pointer mb-s", onClick: () => onChange && onChange(!value), children: [jsx("div", { className: style('relative flex-shrink-0 duration-300 w-9 h-5 mr-s rounded-2xl', value ? 'bg-primary-main' : 'bg-main-divider'), children: jsx("div", { className: style('absolute opacity-80 duration-500 top-0.5 w-4 h-4 bg-white rounded-full', value ? 'left-1/2' : 'left-[5%]') }) }), text ? (jsx(Text, { size: "text-l", font: "font-light", color: "text-primary-text", children: text })) : null] })));
 
     const renderSlideCheckboxes = (field) => (jsxs("div", { children: [jsx(SlideCheckbox, { text: "\u0425\u043E\u0447\u0443 \u043A\u0443\u043F\u0438\u0442\u044C \u043E\u043D\u043B\u0430\u0439\u043D-\u043A\u0430\u0441\u0441\u0443", ...field('onlineCheckout') }), jsx(SlideCheckbox, { text: "\u0425\u043E\u0447\u0443 \u043A\u0443\u043F\u0438\u0442\u044C POS-\u0442\u0435\u0440\u043C\u0438\u043D\u0430\u043B", ...field('posTerminal') })] }));
 
@@ -1796,7 +1796,7 @@
     const defaultIconSize = 44;
 
     const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => (jsxs(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: [title ? jsx(Heading, { headingType: "h3", as: "h2", className: AlignStyles, title: title }) : null, benefitList?.length ? (jsx("div", { className: "flex flex-col @md:flex-row flex-wrap w-full @md:justify-center mt-xl gap-5xl", role: "list", children: benefitList.map(renderBenefit) })) : null] })));
-    const renderBenefit = ({ label, description, items, icon, iconBgVersion, isDotted = false }, i) => (jsxs("div", { className: "flex gap-m items-center @md:basis-1/2 @md:max-w-[500px]", role: "listitem", children: [icon?.icon ? (jsx(RoundedIcon, { className: "shrink-0", defaultIconSize: defaultIconSize, iconBgVersion: iconBgVersion || '', ...icon })) : null, icon?.src ? jsx(Img, { className: "shrink-0", image: icon }) : null, label ? (jsxs("div", { className: "@sm:h-full space-y-xs", children: [jsx(Heading, { headingType: "h6", children: label }), jsx(Text, { size: "text-l", color: "text-secondary-text group-data-secondary:text-white/80", font: "font-light", children: description }), jsx(List, { className: "text-secondary-text", listItemSize: "S", items: items, isDotted: isDotted })] })) : null] }, String(i)));
+    const renderBenefit = ({ label, description, items, icon, iconBgVersion, isDotted = false }, i) => (jsxs("div", { className: "flex gap-m items-center @md:basis-1/2 @md:max-w-[500px]", role: "listitem", children: [icon?.icon ? (jsx(RoundedIcon, { className: "shrink-0", defaultIconSize: defaultIconSize, iconBgVersion: iconBgVersion || '', ...icon })) : null, icon?.src ? jsx(Img, { className: "shrink-0", image: icon }) : null, label ? (jsxs("div", { className: "@sm:h-full space-y-xs", children: [jsx(Heading, { headingType: "h6", children: label }), jsx(Text, { size: "text-l", color: "text-secondary-text group-data-secondary:text-white/80", font: "font-light", children: description }), jsx(List, { dotClassName: "bg-secondary-text", listItemSize: "S", items: items, isDotted: isDotted })] })) : null] }, String(i)));
 
     const Bonus = JSX(({ className = '', title, description, bonusItems = [], align = AlignStyles, ...rest }) => (jsx(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: jsxs("div", { className: "container", children: [jsx(Headline, { className: "mb-xl", isEmbedded: true, title: title, description: description, headlineVersion: "M", align: align }), jsx("div", { className: "flex flex-wrap gap-3xl gap-x-m w-full", children: bonusItems.length > 0
                         ? bonusItems.map((_, i) => (jsxs("div", { className: "w-full @xl:w-[48%] sm:space-y-xs flex flex-col grow p-xl sm:p-m border border-gray", children: [jsx("div", { className: "grow", children: jsx(Headline, { title: _?.title, description: _?.description, headlineVersion: "S", isEmbedded: true, align: "text-left" }) }), jsxs("div", { className: "flex justify-center sm:justify-between sm:items-end", children: [jsx("div", { className: "hidden sm:block", children: renderButtonsSection(_?.buttons) }), _.bonusItemContent?.bonusType
@@ -3118,9 +3118,7 @@
     const ImageAlwaysOnRight = true;
 
     //TODO: replace SocialMedia with renderButtonSection
-    const CarouselRecommendationCard = JSX(({ className, padding, description, additionalDescription, href, icon, items = [], isDotted, socialMedia = [], target, title, align = 'text-left', benefits, imageOptions: { directionRight = true, isImageAlwaysOnRight = ImageAlwaysOnRight, isImageSecondary = false, } = {}, ...rest }) => {
-        return (jsx(BlockWrapper, { className: style('relative min-h-28 group-data-gray:bg-main-divider/50', className), defaultPadding: "p-0", ...rest, children: jsx(LinkWrapper, { href: href, target: target, className: "h-full", children: jsxs(BaseTile, { className: "h-full", defaultPadding: "p-2xl", padding: padding, insetTitle: jsx(Headline, { title: title, description: description, headlineVersion: "XS", isEmbedded: true, align: align }), ...leftOrRightImage(isIcon(icon) ? jsx(Img, { image: icon }) : null, directionRight), buttons: socialMedia.length ? (jsx(SocialMedia, { media: socialMedia, showButtonText: true, version: rest?.version })) : null, isImageAlwaysOnRight: isImageAlwaysOnRight, isImageSecondary: isImageSecondary, imageAlign: "center", children: [jsx(BenefitsList, { benefits: benefits }), jsx(List, { items: items, isDotted: isDotted, listItemSize: "S" }), renderAdditionalDescription(additionalDescription, align)] }) }) }));
-    });
+    const CarouselRecommendationCard = JSX(({ className, padding, description, additionalDescription, href, icon, items = [], isDotted, socialMedia = [], target, title, align = 'text-left', benefits, imageOptions: { directionRight = true, isImageAlwaysOnRight = ImageAlwaysOnRight, isImageSecondary = false, } = {}, ...rest }) => (jsx(BlockWrapper, { className: style('relative min-h-28 group-data-gray:bg-main-divider/50', className), defaultPadding: "p-0", ...rest, children: jsx(LinkWrapper, { href: href, target: target, className: "h-full", children: jsxs(BaseTile, { className: "h-full", defaultPadding: "p-2xl", padding: padding, insetTitle: jsx(Headline, { title: title, description: description, headlineVersion: "XS", isEmbedded: true, align: align }), ...leftOrRightImage(isIcon(icon) ? jsx(Img, { image: icon }) : null, directionRight), buttons: socialMedia.length ? (jsx(SocialMedia, { media: socialMedia, showButtonText: true, version: rest?.version })) : null, isImageAlwaysOnRight: isImageAlwaysOnRight, isImageSecondary: isImageSecondary, imageAlign: "center", children: [jsx(BenefitsList, { benefits: benefits }), jsx(List, { items: items, isDotted: isDotted, listItemSize: "S" }), renderAdditionalDescription(additionalDescription, align)] }) }) })));
     const renderAdditionalDescription = (additionalDescription, align) => additionalDescription ? (jsx(Paragraph, { size: "text-m", font: "font-light", color: "text-secondary-text group-data-secondary:text-white/80", align: align, children: additionalDescription })) : null;
 
     const Foldable = JSX(({ className = '', isFoldButtonOnTop = false, unfoldedByDefault = false, renderFoldableSection, renderFoldButton, }) => {
@@ -3184,7 +3182,7 @@
     const COLS_LENGTH_FOR_SCROLL$1 = 3;
     const COLUMN_WIDTH$2 = 4 * 80 + 4 * 4; // w-80 + gap-4 = 336px
 
-    const HeaderCell = JSX(({ icon, image, title, link }) => (jsxs("div", { className: style('w-80 box-border flex flex-col gap-m items-center rounded-t-md border-b-0 p-2xl', borderStyle, gradientStyle), role: "columnheader", children: [icon && !image?.src && (jsx(Img, { className: "h-16 w-16 min-w-16 min-h-16", image: icon, width: "64", height: "64" })), image?.src && jsx(Img, { image: image }), title ? (jsx(Heading, { headingType: "h4", as: "h3", className: "text-center text-white", title: title })) : null, link?.text && (jsx("div", { className: "mt-auto w-full", children: jsx(LinkButton, { href: link.href, target: link.target, className: "w-full text-primary-main bg-white hover:bg-secondary-hover active:bg-secondary-active", children: jsx("div", { className: "text-xs font-light font-medium py-s", children: link.text }) }) }))] })));
+    const HeaderCell = JSX(({ icon, image, title, link }) => (jsxs("div", { className: style('w-80 box-border flex flex-col gap-m items-center rounded-t-md border-b-0 p-2xl', borderStyle, gradientStyle), role: "columnheader", children: [icon && !image?.src && (jsx(Img, { className: "h-16 w-16 min-w-16 min-h-16", image: icon, width: "64", height: "64" })), image?.src && jsx(Img, { image: image }), title ? (jsx(Heading, { headingType: "h4", as: "h3", className: "text-center text-white", title: title })) : null, link?.text && (jsx("div", { className: "mt-auto w-full", children: jsx(LinkButton, { href: link.href, target: link.target || '', className: "w-full text-primary-main bg-white hover:bg-secondary-hover active:bg-secondary-active", children: jsx("div", { className: "text-xs font-light font-medium py-s", children: link.text }) }) }))] })));
 
     const carouselContainerClassesMap = {
         comparison: 'flex gap-m duration-1000',
@@ -3332,7 +3330,7 @@
                 onChange(value === newValue ? '' : newValue);
             }
         };
-        return items.map((item) => (jsx(SlideCheckbox, { text: item.title, value: [value].flatMap((_) => _).includes(item.value), onChange: () => handleChange(item.value), type: multiple ? 'checkbox' : 'radio' }, item.value)));
+        return items.map((item) => (jsx(SlideCheckbox, { text: item?.title, value: [value].flatMap((_) => _).includes(item.value), onChange: () => handleChange(item.value), type: multiple ? 'checkbox' : 'radio' }, item.value)));
     });
 
     const renderFiltrationForm$1 = ({ field, reset, filtrationSchema, resetButton, children, }) => (jsxs("form", { className: "flex flex-col @4xl:flex-row justify-between bg-white p-4xl gap-s @4xl:gap-0", children: [jsxs("div", { className: "flex flex-col @4xl:flex-row gap-5xl", children: [children, Object.entries(filtrationSchema).map(renderFormItem(field))] }), resetButton ? (jsx("div", { children: jsx(Button, { className: "w-full @4xl:w-72 @4xl:ml-s", onClick: reset, children: resetButton?.text }) })) : null] }));
@@ -4418,9 +4416,7 @@
         const cellColor = cell.cellColor || 'green';
         return cell.text ? (jsx("div", { className: `flex-1 flex items-center justify-center relative py-xs ${investmentCellSizeMap[cellSize]} ${investmentCellColorMap[cellColor]} ${cellSize === 'XS' ? 'px-s' : 'px-5xl'}`, children: jsx(Text, { align: "text-center", children: cell.text }) }, `cell_${i}`)) : null;
     };
-    const renderInvestmentColumnTitle = (column, i) => {
-        return (jsx("div", { className: `flex-1 max-w-[180px] text-center px-xs last:pr-3xl`, children: column.title }, `title_${i}`));
-    };
+    const renderInvestmentColumnTitle = (column, i) => column?.title ? (jsx("div", { className: `flex-1 max-w-[180px] text-center px-xs last:pr-3xl`, children: column.title }, `title_${i}`)) : null;
 
     const KILO = 1024;
     const KILO_SIZES = ['байт', 'Кб', 'Мб', 'Гб', 'Тб', 'Пб'];
@@ -5230,13 +5226,13 @@
 
     const getLineOpacity = (showLines) => (showLines ? '' : 'opacity-0');
     const getPaddingX = (steps) => (steps < 5 ? 'px-24' : 'px-16');
-    const StepsBlock = JSX(({ align = AlignStyles, buttons, className = '', description, showLines = true, size = 'normal', steps = [], stepVersion = 'gray', title, version = 'primary', ...rest }) => {
+    const StepsBlock = JSX(({ buttons, className = '', description, showLines = true, size = 'normal', steps = [], stepVersion = 'gray', title, version = 'primary', ...rest }) => {
         const shortGaps = steps.length > 3;
         const styleMap = STEPS_BLOCK_STYLE;
         const lineOpacity = getLineOpacity(showLines);
         const paddingX = getPaddingX(steps.length);
         const isMainButton = Boolean(buttons?.every((b) => b?.text));
-        return (jsxs(BlockWrapper, { className: style('box-border flex flex-col items-center overflow-hidden gap-y-3xl', className), defaultPadding: "p-6xl", version: version, ...rest, children: [jsx(Headline, { headlineVersion: "S", title: title, description: description, isEmbedded: true, className: "w-full", align: align }), steps?.length ? (jsxs("div", { className: "box-border space-y-lg", 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', shortGaps ? 'gap-x-s' : 'gap-x-20'), children: steps.map(renderStep({ styleMap, isMainButton, version })) })] })) : null, renderButtonsSection(buttons)] }));
+        return (jsxs(BlockWrapper, { className: style('box-border flex flex-col items-center overflow-hidden gap-y-3xl', className), defaultPadding: "p-6xl", version: version, ...rest, children: [jsx(Headline, { headlineVersion: "S", title: title, description: description, isEmbedded: true, className: "w-full", align: AlignStyles }), steps?.length ? (jsxs("div", { className: "box-border space-y-lg", 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', shortGaps ? 'gap-x-s' : 'gap-x-20'), children: steps.map(renderStep({ styleMap, isMainButton, version })) })] })) : null, renderButtonsSection(buttons)] }));
     });
     const renderStepIcon = (styleMap, size, stepVersion) => ({ icon }, i) => {
         const iconVersion = stepVersion === 'secondary' ? 'white' : 'color';
@@ -5831,7 +5827,7 @@
         return (jsx("div", { className: "flex items-end absolute bottom-0 right-0 h-full pointer-events-none", children: jsx(LikeControl, { className: "rounded-tl-3xl sticky bottom-0 pointer-events-auto" }) }));
     }
 
-    const packageVersion = "0.14.69";
+    const packageVersion = "0.14.71";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;