@redneckz/wildless-cms-uni-blocks 0.13.18 → 0.13.20

package/bundle/bundle.umd.js

@@ -2355,7 +2355,7 @@
                 });
             }
         };
-        return dotCount ? (jsx("div", { className: style('flex gap-xs', containerStyles[listType], version ? 'group' : ''), ...(version ? { 'data-ver': version } : {}), children: new Array(dotCount).fill(null).map((_, idx) => (jsx("div", { className: `${dotStyle} ${idx === activeIndex ? activeDotStyles[listType] : inactiveDotStyle}`, role: "button", "aria-hidden": true, onClick: () => handleClick(idx) }, String(idx)))) })) : null;
+        return dotCount ? (jsx("div", { className: style('flex gap-xs @lg:hidden', containerStyles[listType], version ? 'group' : ''), ...(version ? { 'data-ver': version } : {}), children: new Array(dotCount).fill(null).map((_, idx) => (jsx("div", { className: `${dotStyle} ${idx === activeIndex ? activeDotStyles[listType] : inactiveDotStyle}`, role: "button", "aria-hidden": true, onClick: () => handleClick(idx) }, String(idx)))) })) : null;
     });
 
     const areArraysEqual = (as, bs) => as === bs || Boolean(as && bs && as?.length === bs?.length && as.every((_, i) => _ === bs[i]));
@@ -2540,7 +2540,7 @@
         'border border-solid border-gray group-data-secondary:border-white/50 group-data-gray:border-main-divider');
     const isCardHighlighted = (_) => _?.content && 'isHighlighting' in _.content && _.content.isHighlighting;
 
-    const Carousel = JSX(({ className, itemCount, visibleItemCount = 0, noCardBorder, isAlignCenter, showDots, arrowsPadded = true, isGap = true, cardSize = 'normal', ...rest }) => {
+    const Carousel = JSX(({ className, itemCount, visibleItemCount = 0, noCardBorder, isAlignCenter, arrowsPadded = true, isGap = true, cardSize = 'normal', ...rest }) => {
         const { blocks: childBlocks = [] } = rest.block || {};
         const count = itemCount || childBlocks?.length;
         const [activeIndex, { inc: increaseActiveIndex, dec: decreaseActiveIndex }] = useCarouselControls({
@@ -2551,7 +2551,7 @@
         const [dotsActiveIndex] = scroll.visibleIndicesRange;
         // TODO Remove
         const isBankHistoryCarousel = childBlocks && childBlocks[0]?.type === 'CarouselBankHistoryCard';
-        return (jsx(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: jsxs("div", { className: style(isAlignCenter ? 'flex justify-center' : '', 'relative max-w-full'), children: [jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: visibleItemCount, snapAlign: "snap-start", gap: isGap ? ITEMS_GAP : undefined, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: renderCarouselCards({ noCardBorder, activeIndex, cardSize, ...rest }) }), jsx(CarouselScrollButtons, { scroll: scroll, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count }), showDots ? (jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: dotsActiveIndex, dotCount: count, listType: "horizontal-list" })) : null] }) }));
+        return (jsxs(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: [jsxs("div", { className: style(isAlignCenter ? 'flex justify-center' : '', 'relative max-w-full'), children: [jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: visibleItemCount, snapAlign: "snap-start", gap: isGap ? ITEMS_GAP : undefined, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: renderCarouselCards({ noCardBorder, activeIndex, cardSize, ...rest }) }), jsx(CarouselScrollButtons, { scroll: scroll, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count })] }), jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: dotsActiveIndex, dotCount: count, listType: "horizontal-list" })] }));
     });
     Carousel.childrenTypes = [
         'CarouselCard',
@@ -2639,7 +2639,7 @@
     const CarouselLinks = JSX(({ className, additionalDescription, description, links, title, maxLinksCount = 10, ...rest }) => (jsxs(BlockWrapper, { className: style('flex flex-col sm:flex-row w-full overflow-hidden', className), ...rest, children: [jsxs("div", { className: "mr-xl flex-auto", children: [jsx(Headline, { isEmbedded: true, title: title, description: description, as: "h1", align: "text-left" }), additionalDescription ? (jsx(Headline, { className: "pt-m", description: additionalDescription, align: "text-left", isEmbedded: true })) : null] }), links?.length ? renderLinks(links, maxLinksCount) : null] })));
     const renderLinks = (links, maxLinksCount) => {
         const itemCount = Math.ceil(links.length / maxLinksCount);
-        return (jsx(Carousel, { className: "@container-normal sm:w-2/3 w-full p-0 sm:p-xs", version: "secondary", itemCount: itemCount, arrowsPadded: false, showDots: false, children: new Array(itemCount).fill(null).map((_, groupIndex) => (jsx("div", { className: style('flex flex-wrap self-start w-full sm:w-[672px]'), children: links
+        return (jsx(Carousel, { className: "@container-normal sm:w-2/3 w-full p-0 sm:p-xs", version: "secondary", itemCount: itemCount, arrowsPadded: false, children: new Array(itemCount).fill(null).map((_, groupIndex) => (jsx("div", { className: style('flex flex-wrap self-start w-full sm:w-[672px]'), children: links
                     .slice(groupIndex * maxLinksCount, (groupIndex + 1) * maxLinksCount)
                     .map((link, index) => (jsx(CarouselLinkButton, { className: "sm:m-2xs", ...link }, String(index)))) }, String(groupIndex)))) }));
     };
@@ -2777,6 +2777,11 @@
             iconMapped: { icon: 'YoutubeIcon' },
             label: 'Youtube',
         },
+        {
+            origins: ['rutube.ru'],
+            iconMapped: { icon: 'RutubeIcon' },
+            label: 'Rutube',
+        },
     ];
 
     const findIconByHref = (href) => ICONS_MAP.find(({ origins }) => origins?.some((_) => href?.includes(_))) || {};
@@ -2954,7 +2959,7 @@
     };
 
     const ICONS = ['ArrowDownIcon', 'ArrowUpIcon'];
-    const resultsGridStyle = 'grid grid-cols-12 gap-2xs border-box';
+    const resultsGridStyle = 'space-y-px lg:space-y-0 lg:grid lg:grid-cols-12 gap-2xs border-box';
     const BaseFiltrationInner = JSX(({ label = '', filtrationState = {}, topItemsCount = 0, block, notFound, ...rest }) => {
         const blocksToRender = block?.blocks?.filter((b) => checkShouldRenderBlock(filtrationState, b.content || {})) || [];
         const [visibleBlocks, hiddenBlocks] = topItemsCount > 0
@@ -2984,7 +2989,7 @@
         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 = ({ field, reset, filtrationSchema, resetButton, children, }) => (jsxs("form", { className: "flex justify-between bg-white p-4xl", children: [jsxs("div", { className: "flex gap-5xl", children: [children, Object.entries(filtrationSchema).map(renderFormItem(field))] }), resetButton ? (jsx("div", { children: jsx(Button, { className: "w-72 ml-s", onClick: reset, ...resetButton }) })) : null] }));
+    const renderFiltrationForm = ({ 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, ...resetButton }) })) : null] }));
     const renderFormItem = (field) => ([key, item]) => {
         const type = item?.type;
         switch (type) {
@@ -3386,7 +3391,7 @@
             close();
             onClose && onClose();
         }, [onClose]);
-        return (jsxs("div", { className: style('relative min-h-full bg-white p-5', className), children: [jsxs("div", { className: "sticky py-xl top-0 bg-white z-10", children: [jsx(CloseButton, { className: "absolute top-0 right-0", onClose: handleClose }), jsx("div", { className: "container", children: head })] }), jsx("div", { className: "container pb-6xl", children: children })] }));
+        return (jsxs("div", { className: style('relative min-h-full bg-white pt-0 p-5', className), children: [jsxs("div", { className: "sticky py-xl top-0 bg-white z-10", children: [jsx(CloseButton, { className: "absolute top-0 right-0", onClose: handleClose }), jsx("div", { className: "container", children: head })] }), jsx("div", { className: "container pb-6xl", children: children })] }));
     });
 
     const Sitemap = JSX(({ className, topItems }) => {
@@ -3516,7 +3521,9 @@
     const renderMonthNames = (item, colSize) => item.month?.map((_, i) => (jsx("div", { style: { flexBasis: `${colSize}%` }, children: _.text }, `monthName-${i}`)));
     const renderMonthImages = (item) => item.month?.map((_) => _.image?.src ? (jsx("div", { className: "h-52 border-r pr-s border-main-divider last:border-r-0", children: jsx(Img, { image: _.image, className: "flex" }) }, `monthImage-${_.image.src}`)) : null);
 
-    const isHrefActive = (router) => ({ href }) => withoutQuery(isURL(href) ? router.href : router.pathname).startsWith(withoutQuery(href));
+    const isHrefActive = (router) => ({ href }) => !href
+        ? false
+        : withoutQuery(isURL(href) ? router.href : router.pathname).startsWith(withoutQuery(href));
 
     const isTopItemActive = (router) => isHrefActive(projectSettings.BASE_PATH ? { pathname: projectSettings.BASE_PATH } : router);
 
@@ -4476,19 +4483,26 @@
     const renderShimmerItem = (width, index) => (jsx("div", { style: { width: `${width || 100}%` }, className: "h-4 mt-xs bg-secondary-light" }, String(index)));
     const goldenSequence = (first, size) => [first].concat(size > 0 ? goldenSequence(first / GOLDEN_RATIO, size - 1) : []);
 
-    function renderBackwardButton({ text, href, target, icon }, version) {
+    function renderBackwardButton(version, handleClick) {
         const iconVersion = version === 'primary' ? 'white' : 'black';
-        const commonProps = { text, href, target, ariaLabel: text };
-        return (jsxs("div", { className: "flex items-center gap-s", children: [jsx(Button, { className: "w-12 h-12 min-h-12 min-w-12 flex items-center justify-center", version: version, rounded: true, ...commonProps, children: jsx(Img, { className: "w-4 h-4", image: {
-                            ...icon,
-                            icon: icon?.icon || 'ArrowLeftIcon',
-                            iconVersion: icon?.iconVersion || iconVersion,
-                        } }) }), jsx(Button, { version: "link", ...commonProps })] }));
+        const className = 'w-12 h-12 min-h-12 min-w-12 flex items-center justify-center';
+        const text = 'Вернуться назад';
+        return (jsxs("div", { className: "flex items-center gap-s", children: [jsx("div", { className: getRegularButtonClasses({ className, version, rounded: true }), onClick: handleClick, children: jsx(Img, { className: "w-4 h-4", image: {
+                            icon: 'ArrowLeftIcon',
+                            iconVersion: iconVersion,
+                        } }) }), jsx(Button, { version: "link", text: text, ariaLabel: text, onClick: handleClick })] }));
     }
 
-    const ProductBlock = JSX(({ className, padding, backwardButton, ...rest }) => (jsxs(BlockWrapper, { className: style('overflow-hidden flex flex-col gap-3xl box-border', className), defaultPadding: "p-6xl", padding: padding, ...rest, children: [backwardButton?.text
-                ? renderBackwardButton(backwardButton, !rest.version || rest.version === 'primary' ? 'primary' : 'white')
-                : null, jsx(BaseProductTile, { className: "grow h-full", ...rest })] })));
+    const ProductBlock = JSX(({ className, padding, backwardButton, ...rest }) => {
+        const router = useRouter();
+        const handleClick = useCallback((ev) => {
+            ev?.preventDefault();
+            router.back();
+        }, []);
+        return (jsxs(BlockWrapper, { className: style('overflow-hidden flex flex-col gap-3xl box-border', className), defaultPadding: "p-6xl", padding: padding, ...rest, children: [backwardButton
+                    ? renderBackwardButton(!rest.version || rest.version === 'primary' ? 'primary' : 'white', handleClick)
+                    : null, jsx(BaseProductTile, { className: "grow h-full", ...rest })] }));
+    });
 
     const ProductGallery = JSX(({ className = '', padding, slides = [], ...rest }) => {
         const [activeSlideIndex, setActiveSlideIndex] = useState(0);
@@ -5291,7 +5305,7 @@
             parent: data,
         };
         useBlockRouterProvider();
-        return (jsxs("div", { children: [jsxs("section", { className: style('relative @container', pageStyle, className), "data-theme": colorPalette, children: [slots?.header ? (jsx("div", { className: "relative z-10 mb-lg shadow-[0_8px_32px_0px_#00000014]", children: renderBlocksList(slots?.header, { ...options, slotName: 'header' }) })) : null, jsxs("div", { className: "container space-y-px @lg:space-y-0 @lg:grid @lg:grid-cols-12 @lg:gap-2xs", children: [renderChildren({ block: data, options, extraProps: { className: 'scroll-mt-12' } }), renderBlocksList(slots?.footer, { ...options, slotName: 'footer' })] }), likeControl ? renderLikeControl() : null] }), jsx(StickyBottomMenu, {}), jsx(DialogManager, {}), jsx(CookiePopup, { termLink: { href: '/pd-policy#cookie', target: '_blank' }, personalDataPolicyLink: { href: '/pd-policy', target: '_blank' } })] }));
+        return (jsxs("div", { children: [jsxs("section", { className: style('relative @container', pageStyle, className), "data-theme": colorPalette, children: [slots?.header ? (jsx("div", { className: "relative z-10 mb-lg shadow-[0_8px_32px_0px_#00000014]", children: renderBlocksList(slots?.header, { ...options, slotName: 'header' }) })) : null, jsxs("div", { className: "container space-y-px @lg:space-y-0 @lg:grid @lg:grid-cols-12 @lg:gap-2xs", children: [renderChildren({ block: data, options, extraProps: { className: 'scroll-mt-12' } }), renderBlocksList(slots?.footer, { ...options, slotName: 'footer' })] }), likeControl ? renderLikeControl() : null, jsx(StickyBottomMenu, {}), jsx(DialogManager, {})] }), jsx(CookiePopup, { termLink: { href: '/pd-policy#cookie', target: '_blank' }, personalDataPolicyLink: { href: '/pd-policy', target: '_blank' } })] }));
     });
     ContentPage.childrenTypes = [];
     ContentPage.slots = () => ['header', 'footer', 'StickyBottomMenu'];
@@ -5299,7 +5313,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.13.18";
+    const packageVersion = "0.13.20";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;