@redneckz/wildless-cms-uni-blocks 0.14.413 → 0.14.415

package/bundle/bundle.umd.js

@@ -386,21 +386,21 @@
         }
     }
 
-    const adjustSrc = (router, pathPrefix) => (src) => {
-        const basePath = pathPrefix ? '' : getBasePath(env.SITE_URL);
-        return src && !isURL(src) ? adjustHref(router)(joinPath(pathPrefix, src), basePath) : src;
+    const adjustSrc = (router) => (src) => {
+        const basePath = getBasePath(env.SITE_URL);
+        return src && !isURL(src) ? adjustHref(router)(src, basePath) : src;
     };
 
     const sourcesComparator = (a, b) => a?.media && b?.media ? a.media - b.media : 0;
-    const ImgAsPicture = JSX(({ className = '', image, imageClassName = '', pathPrefix }) => {
+    const ImgAsPicture = JSX(({ className = '', image, imageClassName = '' }) => {
         const router = useRouter();
         return (jsxs("picture", { className: className, children: [image?.sources?.length
                     ? 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)(src), type: formatToMimeType(format), media: media ? `(max-width: ${media}px)` : '', width: image?.size?.width, height: image?.size?.height }, `${index}_${src}`)))
                     : null, image?.src
-                    ? renderImg$1({ ...image, src: adjustSrc(router, pathPrefix)(image.src) }, imageClassName)
+                    ? renderImg$1({ ...image, src: adjustSrc(router)(image.src) }, imageClassName)
                     : null] }));
     });
     const renderImg$1 = (image, imageClassName = '') => (jsx("img", { src: image.src, className: style('object-contain', imageClassName), alt: image?.alt || image?.title || '', title: image?.title || '', style: {
@@ -409,11 +409,11 @@
         }, width: image?.size?.width, height: image?.size?.height }));
     const formatToMimeType = (format) => format ? `image/${String(format)}` : undefined;
 
-    const Img = JSX(({ className = '', image, imageClassName = '', pathPrefix, ...iconProps }) => {
+    const Img = JSX(({ className = '', image, imageClassName = '', ...iconProps }) => {
         if (!image?.src && !image?.icon) {
             return null;
         }
-        return image.icon ? (jsx(Icon, { className: className, imageClassName: imageClassName, iconVersion: image?.iconVersion, name: image.icon, ...iconProps })) : (jsx(ImgAsPicture, { className: className, imageClassName: imageClassName, image: image, pathPrefix: pathPrefix }));
+        return image.icon ? (jsx(Icon, { className: className, imageClassName: imageClassName, iconVersion: image?.iconVersion, name: image.icon, ...iconProps })) : (jsx(ImgAsPicture, { className: className, imageClassName: imageClassName, image: image }));
     });
 
     /** @deprecated */
@@ -3973,10 +3973,13 @@
         transparent: 'text-white',
     };
     const renderImage = (bgColor, image, size) => {
-        return image?.src ? (jsx(Img, { image: image, className: SVG_COLOR[bgColor], width: size?.width, height: size?.height })) : (jsx(Img, { image: {
+        const img = image?.src
+            ? image
+            : {
                 icon: image?.icon || 'LogoIcon',
                 iconVersion: ICON_VERSION_MAP[bgColor],
-            }, className: SVG_COLOR[bgColor], width: size?.width, height: size?.height }));
+            };
+        return (jsx(Img, { image: img, className: SVG_COLOR[bgColor], width: size?.width, height: size?.height }));
     };
 
     const TEXT_COLOR = {
@@ -4435,7 +4438,7 @@
     const ForeignOffice = JSX(({ icon, ...rest }) => {
         const link = useLink();
         const { text, target, href, onClick } = link(rest);
-        return (jsxs("div", { className: "flex gap-s items-center", children: [icon ? jsx(Img, { pathPrefix: "/wcms-resources/", image: icon }) : null, text ? (jsx("a", { className: "hover:text-primary-hover", href: href, target: target, onClick: onClick, children: jsx(Text, { size: "text-l", font: "font-light", color: "text-primary-text", children: text }) })) : null] }));
+        return (jsxs("div", { className: "flex gap-s items-center", children: [icon ? jsx(Img, { image: icon }) : null, text ? (jsx("a", { className: "hover:text-primary-hover", href: href, target: target, onClick: onClick, children: jsx(Text, { size: "text-l", font: "font-light", color: "text-primary-text", children: text }) })) : null] }));
     });
 
     const renderRegion = (data, onChangeLocation) => (region) => region.name ? (jsx(LinkWrapper, { href: `/branches/${region.slug}`, className: "mb-xs sm:mb-2xs hover:text-primary-hover", onClick: () => onChangeLocation?.(region), data: getAspectsWithInclude(data, region.name), children: jsx(Text, { size: "text-l", font: "font-light", children: region.name }) }, String(region.id))) : null;
@@ -4513,7 +4516,7 @@
         return (jsx("span", { ref: ref, className: className, role: "menuitem", children: jsx(TopItem, { ...rest, children: children }) }));
     });
 
-    const HeaderTopMenu = JSX(({ topItems = [], activeTopItem, dropdownMenuAriaLabel, version, sitemap, bgColor, logo, data, }) => {
+    const HeaderTopMenu = JSX(({ topItems = [], activeTopItem, dropdownMenuAriaLabel, version, sitemap, bgColor, logo }) => {
         const [visibleItemsCount, setVisibleItemsCount] = useState(topItems.length);
         const dropDownMenuItems = topItems.slice(visibleItemsCount);
         const topItemsListRef = useRef(null);
@@ -4523,7 +4526,9 @@
                 ? handleIntersectionActivation(index)
                 : handleIntersectionDeactivation(index));
         }), [topItems]);
-        return (jsxs("div", { className: "flex items-center justify-between", children: [jsx(Logo, { className: "mr-3xl", bgColor: bgColor, logo: logo, data: data }), jsx("div", { ref: topItemsListRef, className: "overflow-hidden min-w-[160px] pb-xs mt-xs", role: "menu", children: topItems.map((_, i) => (jsx(HeaderTopMenuItem, { className: visibleItemsCount - 1 < i ? 'invisible' : '', active: _ === activeTopItem, observerOptions: observerOptions, onVisibilityChange: topItemsVisibilityHandlers[i], data: _.dataHeader, ..._ }, String(i)))) }), dropDownMenuItems.length ? (jsx(DropdownMenu, { className: "mx-xs", items: dropDownMenuItems, activeItem: activeTopItem, ariaLabel: dropdownMenuAriaLabel })) : null, jsx(HeaderSecondaryMenu, { version: version, className: "ml-auto", ...sitemap })] }));
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        const { dataFooter, dataHeader, ...logoProps } = logo ?? {};
+        return (jsxs("div", { className: "flex items-center justify-between", children: [jsx(Logo, { className: "mr-3xl", bgColor: bgColor, logo: logoProps, data: dataHeader }), jsx("div", { ref: topItemsListRef, className: "overflow-hidden min-w-[160px] pb-xs mt-xs", role: "menu", children: topItems.map((_, i) => (jsx(HeaderTopMenuItem, { className: visibleItemsCount - 1 < i ? 'invisible' : '', active: _ === activeTopItem, observerOptions: observerOptions, onVisibilityChange: topItemsVisibilityHandlers[i], data: _.dataHeader, ..._ }, String(i)))) }), dropDownMenuItems.length ? (jsx(DropdownMenu, { className: "mx-xs", items: dropDownMenuItems, activeItem: activeTopItem, ariaLabel: dropdownMenuAriaLabel })) : null, jsx(HeaderSecondaryMenu, { version: version, className: "ml-auto", ...sitemap })] }));
     });
     const handleIntersectionActivation = (index) => (prev) => Math.max(prev, index + 1);
     const handleIntersectionDeactivation = (index) => (prev) => Math.min(prev, index);
@@ -4533,14 +4538,13 @@
         transparent: 'transparent',
     };
     const HEADER_AREA_KEYS = ['all', 'header'];
-    const Header = UniBlock(({ className, bgColor = 'bg-white', logo: customLogo, version = BG_COLOR_TO_BLOCK_VERSION[bgColor], portal, ...rest }) => {
+    const Header = UniBlock(({ className, bgColor = 'bg-white', logo: customLogo = {}, version = BG_COLOR_TO_BLOCK_VERSION[bgColor], portal, ...rest }) => {
         const sitemap = rest.options?.page?.sitemap ?? {};
-        const { topItems, logo } = sitemap;
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-        const { dataFooter, dataHeader, ...logoProps } = logo ?? {};
+        const { topItems, logo = {} } = sitemap;
         const [, activeTopItem] = useActiveRoute(topItems);
         const { internetBankButton } = portal || {};
-        return (jsx(BlockWrapper, { tag: "header", className: style('pt-3xl px-20', activeTopItem?.items?.length ? 'pb-m' : 'pb-lg', className), defaultPadding: "", version: version, ...rest, children: jsxs("div", { className: "container", children: [jsx("div", { className: "whitespace-nowrap", children: jsx(HeaderTopMenu, { activeTopItem: activeTopItem, topItems: topItems?.filter(isVisibleItem(HEADER_AREA_KEYS)), version: version, sitemap: sitemap, bgColor: bgColor, logo: customLogo ?? logoProps, data: dataHeader }) }), jsx("div", { className: style('mt-xl h-px bg-main-divider', getVersionStyle(version)) }), activeTopItem?.items?.length ? (jsx(HeaderSubMenu, { subItems: activeTopItem?.items?.filter(isVisibleItem(HEADER_AREA_KEYS)), version: version, internetBankButton: internetBankButton })) : null] }) }));
+        const logoProps = customLogo.image?.icon || customLogo.image?.src ? customLogo : logo;
+        return (jsx(BlockWrapper, { tag: "header", className: style('pt-3xl px-20', activeTopItem?.items?.length ? 'pb-m' : 'pb-lg', className), defaultPadding: "", version: version, ...rest, children: jsxs("div", { className: "container", children: [jsx("div", { className: "whitespace-nowrap", children: jsx(HeaderTopMenu, { activeTopItem: activeTopItem, topItems: topItems?.filter(isVisibleItem(HEADER_AREA_KEYS)), version: version, sitemap: sitemap, bgColor: bgColor, logo: logoProps }) }), jsx("div", { className: style('mt-xl h-px bg-main-divider', getVersionStyle(version)) }), activeTopItem?.items?.length ? (jsx(HeaderSubMenu, { subItems: activeTopItem?.items?.filter(isVisibleItem(HEADER_AREA_KEYS)), version: version, internetBankButton: internetBankButton })) : null] }) }));
     });
     const getVersionStyle = (version) => (version === 'transparent' ? 'opacity-30' : '');
 
@@ -5701,6 +5705,7 @@
 
     const getIconTextStyle = (version) => version === 'secondary' ? 'group-data-primary:text-white' : 'text-secondary-text';
 
+    const STEP_BREAKPOINT = 4;
     // TODO: Create universal function for this case
     const renderStep = (props) => (step, i, arr) => {
         const { type } = step;
@@ -5720,7 +5725,7 @@
         const { label, description, button, items, isDotted } = step;
         return (jsxs("div", { className: style('relative flex flex-col items-center text-center justify-between whitespace-pre-line overflow-hidden space-y-3xl', getContainerWidth(arr.length)), children: [jsxs("div", { className: "space-y-xs", children: [label ? (jsx(Text, { size: "text-h6", align: "text-center", children: label })) : null, jsxs("div", { className: "flex flex-col items-center gap-3xs", children: [description ? jsx("div", { className: styleMap.description, children: description }) : null, jsx(List, { className: styleMap.description, items: items, listItemSize: "M", isDotted: isDotted })] })] }), button?.text && !isMainButton ? (jsx(LinkButton, { className: "box-border py-s w-full max-w-60 mt-auto", version: version, ...button, children: button?.text })) : null] }, String(i)));
     };
-    const getContainerWidth = (length) => (length < 5 ? 'w-72' : 'w-52');
+    const getContainerWidth = (length) => (length < STEP_BREAKPOINT ? 'w-72' : 'w-52');
 
     const STEPS_BLOCK_STYLE = {
         description: 'text-white/80 text-l font-light group-data-primary:text-secondary-text group-data-gray:text-secondary-text',
@@ -5736,8 +5741,8 @@
         const shortGaps = stepsLength > 3;
         const styleMap = STEPS_BLOCK_STYLE;
         const lineOpacity = getLineOpacity(showLines);
-        const paddingXNormal = stepsLength < 5 ? 'px-24' : 'px-16';
-        const paddingXSmall = stepsLength < 5 ? 'px-28' : 'px-20';
+        const paddingXNormal = stepsLength < STEP_BREAKPOINT ? 'px-24' : 'px-16';
+        const paddingXSmall = stepsLength < STEP_BREAKPOINT ? 'px-28' : 'px-20';
         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: AlignStyles }), steps?.length ? (jsxs("div", { className: "box-border space-y-lg flex flex-col justify-center", children: [jsx("div", { className: style('flex items-center', size === 'normal' ? paddingXNormal : paddingXSmall), 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)] }));
     });
@@ -6390,7 +6395,7 @@
         slots: () => [HEADER_SLOT, FOOTER_SLOT, STICKY_FOOTER_SLOT],
     });
 
-    const packageVersion = "0.14.412";
+    const packageVersion = "0.14.414";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;