npm - @gravity-ui/page-constructor - Versions diffs - 6.8.2-alpha.1 → 7.0.0-alpha.3 - Mend

@gravity-ui/page-constructor 6.8.2-alpha.1 → 7.0.0-alpha.3

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 (385) hide show

package/build/esm/blocks/Slider/Slider.d.ts CHANGED Viewed

@@ -1,15 +1,16 @@
 import * as React from 'react';
-import { Settings } from 'react-slick';
+import { Swiper as SwiperReact } from 'swiper/swiper.esm.js/react';
 import { ClassNameProps, Refable, SliderProps as SliderParams } from "../../models/index.js";
 import './Slider.css';
-export interface SliderProps extends Omit<SliderParams, 'children'>, Refable<HTMLDivElement>, ClassNameProps, Pick<Settings, 'lazyLoad'> {
+import 'swiper/swiper-bundle.css';
+export type { Swiper, SwiperOptions } from 'swiper';
+export interface SliderProps extends Omit<SliderParams, 'children'>, Partial<Pick<SwiperReact, 'onSlideChange' | 'onSlideChangeTransitionStart' | 'onSlideChangeTransitionEnd' | 'onActiveIndexChange' | 'onBreakpoint'>>, Refable<HTMLDivElement>, ClassNameProps {
     type?: string;
     anchorId?: string;
-    onAfterChange?: (index: number) => void;
-    onBeforeChange?: (current: number, next: number) => void;
     dotsClassName?: string;
     blockClassName?: string;
     arrowSize?: number;
+    initialSlide?: number;
 }
-export declare const SliderBlock: (props: React.PropsWithChildren<SliderProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const SliderBlock: ({ animated, title, description, type, anchorId, arrows, adaptive, autoplay: autoplayMs, dots, initialSlide, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }: React.PropsWithChildren<SliderProps>) => import("react/jsx-runtime").JSX.Element;
 export default SliderBlock;

package/build/esm/blocks/Slider/Slider.js CHANGED Viewed

@@ -1,290 +1,47 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
-import { useUniqId } from '@gravity-ui/uikit';
-import debounce from "lodash/debounce.js";
-import get from "lodash/get.js";
-import noop from "lodash/noop.js";
-import _SlickSlider from 'react-slick';
+import Swiper, { A11y, Autoplay, Pagination } from 'swiper/swiper.esm.js';
+import { Swiper as SwiperReact, SwiperSlide } from 'swiper/swiper-react.esm.js';
 import Anchor from "../../components/Anchor/Anchor.js";
 import AnimateBlock from "../../components/AnimateBlock/AnimateBlock.js";
-import OutsideClick from "../../components/OutsideClick/OutsideClick.js";
 import Title from "../../components/Title/Title.js";
-import { BREAKPOINTS } from "../../constants.js";
-import { MobileContext } from "../../context/mobileContext/index.js";
-import { SSRContext } from "../../context/ssrContext/index.js";
-import { StylesContext } from "../../context/stylesContext/StylesContext.js";
-import useFocus from "../../hooks/useFocus.js";
-import { SliderType, } from "../../models/index.js";
+import { SliderType } from "../../models/index.js";
 import { block } from "../../utils/index.js";
 import Arrow from "./Arrow/Arrow.js";
 import { i18n } from "./i18n/index.js";
-import { getSliderResponsiveParams, getSlidesCountByBreakpoint, getSlidesToShowCount, getSlidesToShowWithDefaults, isFocusable, useRovingTabIndex, } from "./utils.js";
+import { useSlider } from "./useSlider.js";
+import { useSliderPagination } from "./useSliderPagination.js";
 import './Slider.css';
+import 'swiper/swiper-bundle.css';
 const b = block('SliderBlock');
-const slick = block('slick-origin');
-const DOT_WIDTH = 8;
-const DOT_GAP = 16;
-const SlickSlider = 'default' in _SlickSlider && _SlickSlider.default
-    ? _SlickSlider.default
-    : _SlickSlider;
-export const SliderBlock = (props) => {
-    const { animated, title, description, type, anchorId, arrows = true, adaptive, autoplay: autoplaySpeed, dots = true, dotsClassName, disclaimer, children, className, blockClassName, lazyLoad, arrowSize, onAfterChange: handleAfterChange, onBeforeChange: handleBeforeChange, } = props;
-    const { isServer } = React.useContext(SSRContext);
-    const isMobile = React.useContext(MobileContext);
-    const [breakpoint, setBreakpoint] = React.useState(BREAKPOINTS.xl);
-    const sliderId = useUniqId();
-    const disclosedChildren = React.useMemo(() => discloseAllNestedChildren(children, sliderId), [children, sliderId]);
-    const childrenCount = disclosedChildren.length;
-    const isAutoplayEnabled = autoplaySpeed !== undefined && autoplaySpeed > 0;
-    const isUserInteractionRef = React.useRef(false);
-    const [slidesToShow] = React.useState(getSlidesToShowWithDefaults({
-        contentLength: childrenCount,
-        breakpoints: props.slidesToShow,
-        mobileFullscreen: Boolean(props.type && Object.values(SliderType).includes(props.type)),
-    }));
-    const slidesToShowCount = getSlidesToShowCount(slidesToShow);
-    const slidesCountByBreakpoint = getSlidesCountByBreakpoint(breakpoint, slidesToShow);
-    const [currentIndex, setCurrentIndex] = React.useState(0);
-    const [childStyles, setChildStyles] = React.useState({});
-    const [slider, setSlider] = React.useState();
-    const prevIndexRef = React.useRef(0);
-    const autoplayTimeId = React.useRef();
-    const { hasFocus, unsetFocus } = useFocus(slider?.innerSlider?.list);
-    const asUserInteraction = (fn) => (...args) => {
-        isUserInteractionRef.current = true;
-        return fn(...args);
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    const onResize = React.useCallback(debounce(() => {
-        if (!slider) {
-            return;
-        }
-        const newBreakpoint = get(slider, 'state.breakpoint') || BREAKPOINTS.xl;
-        if (newBreakpoint !== breakpoint) {
-            setBreakpoint(newBreakpoint);
-            setCurrentIndex(0);
-            slider.slickGoTo(0);
-        }
-    }, 100), [slider, breakpoint]);
-    const scrollLastSlide = React.useCallback((current) => {
-        const lastSlide = childrenCount - slidesToShowCount;
-        if (isAutoplayEnabled && lastSlide === current) {
-            // Slick doesn't support autoplay with no infinity scroll
-            autoplayTimeId.current = setTimeout(() => {
-                if (slider) {
-                    slider.slickGoTo(0, false);
-                    slider.slickPause();
-                }
-                setTimeout(() => {
-                    if (slider) {
-                        slider.slickPlay();
-                    }
-                }, 500);
-            }, autoplaySpeed);
-        }
-    }, [autoplaySpeed, childrenCount, isAutoplayEnabled, slider, slidesToShowCount]);
-    React.useEffect(() => {
-        if (hasFocus && autoplayTimeId.current) {
-            clearTimeout(autoplayTimeId.current);
-        }
-        else {
-            scrollLastSlide(currentIndex);
-        }
-    }, [currentIndex, hasFocus, scrollLastSlide]);
-    React.useEffect(() => {
-        onResize();
-        window.addEventListener('resize', onResize, { passive: true });
-        return () => window.removeEventListener('resize', onResize);
-    }, [onResize]);
-    const handleArrowClick = (direction) => {
-        let nextIndex;
-        if (direction === 'right') {
-            nextIndex =
-                currentIndex === childrenCount - slidesCountByBreakpoint ? 0 : currentIndex + 1;
-        }
-        else {
-            nextIndex =
-                currentIndex === 0 ? childrenCount - slidesCountByBreakpoint : currentIndex - 1;
-        }
-        if (slider) {
-            slider.slickGoTo(nextIndex);
-        }
-    };
-    const onBeforeChange = React.useCallback((current, next) => {
-        if (handleBeforeChange) {
-            handleBeforeChange(current, next);
-        }
-        prevIndexRef.current = current;
-        setCurrentIndex(Math.ceil(next));
-    }, [handleBeforeChange]);
-    const onAfterChange = React.useCallback((current) => {
-        if (handleAfterChange) {
-            handleAfterChange(current);
-        }
-        if (autoplayTimeId.current) {
-            clearTimeout(autoplayTimeId.current);
-        }
-        if (!hasFocus) {
-            scrollLastSlide(current);
-        }
-        if (isUserInteractionRef.current) {
-            const focusIndex = prevIndexRef.current >= current
-                ? current
-                : Math.max(current, prevIndexRef.current + slidesCountByBreakpoint);
-            const firstNewSlide = document.getElementById(getSlideId(sliderId, focusIndex));
-            if (firstNewSlide) {
-                const focusableChild = Array.from(firstNewSlide.querySelectorAll('*')).find(isFocusable);
-                focusableChild?.focus();
-            }
-        }
-        isUserInteractionRef.current = false;
-    }, [handleAfterChange, hasFocus, scrollLastSlide, sliderId, slidesCountByBreakpoint]);
-    const handleDotClick = (index) => {
-        const nextIndex = index > currentIndex ? index + 1 - slidesCountByBreakpoint : index;
-        if (slider) {
-            slider.slickGoTo(nextIndex);
-        }
-    };
-    const barSlidesCount = childrenCount - slidesCountByBreakpoint + 1;
-    const barPosition = (DOT_GAP + DOT_WIDTH) * currentIndex;
-    const barWidth = DOT_WIDTH + (DOT_GAP + DOT_WIDTH) * (slidesCountByBreakpoint - 1);
-    const { getRovingItemProps, rovingListProps } = useRovingTabIndex({
-        itemCount: barSlidesCount,
-        activeIndex: currentIndex + 1,
-        firstIndex: 1,
-        uniqId: sliderId,
+// eslint-disable-next-line react-hooks/rules-of-hooks
+Swiper.use([Autoplay, A11y, Pagination]);
+export const SliderBlock = ({ animated, title, description, type, anchorId, arrows = true, adaptive, autoplay: autoplayMs, dots = true, initialSlide = 0, className, dotsClassName, disclaimer, children, blockClassName, arrowSize, slidesToShow, onSlideChange, onSlideChangeTransitionStart, onSlideChangeTransitionEnd, onActiveIndexChange, onBreakpoint, }) => {
+    const { autoplay, isLocked, childrenCount, breakpoints, onSwiper, onImagesReady, onPrev, onNext, setIsLocked, } = useSlider({
+        slidesToShow,
+        children,
+        type,
+        autoplayMs,
     });
-    const renderBar = () => {
-        return (slidesCountByBreakpoint > 1 && (_jsx("li", { className: b('bar'), style: {
-                left: barPosition,
-                width: barWidth,
-            } })));
-    };
-    // renders additional bar, not visible in the layout but visible for screenreaders
-    const renderAccessibleBar = (index) => {
-        return (
-        // To have this key differ from keys used in renderDot function, added `-accessible-bar` part
-        _jsx(React.Fragment, { children: slidesCountByBreakpoint > 0 && (_jsx("li", { className: b('accessible-bar'), role: "menuitemradio", "aria-checked": true, "aria-label": i18n('dot-label', {
-                    index: currentIndex + 1,
-                    count: barSlidesCount,
-                }), style: {
-                    left: barPosition,
-                    width: barWidth,
-                }, ...getRovingItemProps(currentIndex + 1) })) }, `${index}-accessible-bar`));
-    };
-    const getCurrentSlideNumber = (index) => {
-        const currentIndexDiff = index - currentIndex;
-        let currentSlideNumber;
-        if (0 <= currentIndexDiff && currentIndexDiff < slidesCountByBreakpoint) {
-            currentSlideNumber = currentIndex + 1;
-        }
-        else if (currentIndexDiff >= slidesCountByBreakpoint) {
-            currentSlideNumber = index - slidesCountByBreakpoint + 2;
-        }
-        else {
-            currentSlideNumber = index + 1;
-        }
-        return currentSlideNumber;
-    };
-    const isVisibleSlide = (index) => {
-        const currentIndexDiff = index - currentIndex;
-        const result = slidesCountByBreakpoint > 0 &&
-            0 <= currentIndexDiff &&
-            currentIndexDiff < slidesCountByBreakpoint;
-        return result;
-    };
-    const renderDot = (index) => {
-        const isVisible = isVisibleSlide(index);
-        const currentSlideNumber = getCurrentSlideNumber(index);
-        const rovingItemProps = isVisible ? undefined : getRovingItemProps(currentSlideNumber);
-        return (_jsx("li", { className: b('dot', { active: index === currentIndex }), onClick: asUserInteraction(() => handleDotClick(index)), onKeyDown: (e) => {
-                const key = e.key.toLowerCase();
-                if (key === 'space' || key === 'enter') {
-                    e.currentTarget.click();
-                }
-            }, role: "menuitemradio", "aria-checked": false, tabIndex: -1, "aria-hidden": isVisible, "aria-label": i18n('dot-label', {
-                index: currentSlideNumber,
-                count: barSlidesCount,
-            }), ...rovingItemProps }, index));
-    };
-    const renderNavigation = () => {
-        if (childrenCount <= slidesCountByBreakpoint || !dots || childrenCount === 1) {
-            return null;
-        }
-        const dotsList = Array(childrenCount)
-            .fill(null)
-            .map((_item, index) => renderDot(index));
-        dotsList.splice(currentIndex, 0, renderAccessibleBar(currentIndex));
-        return (_jsx("div", { className: b('dots', dotsClassName), children: _jsxs("ul", { className: b('dots-list'), role: "menu", "aria-label": i18n('pagination-label'), ...rovingListProps, children: [renderBar(), dotsList] }) }));
-    };
-    const renderDisclaimer = () => {
-        return disclaimer ? (_jsx("div", { className: b('disclaimer', { size: disclaimer.size || 'm' }), children: disclaimer.text })) : null;
-    };
-    const renderSlider = () => {
-        /* Disable adding of width in inline styles when SSR to prevent overriding of default styles */
-        /* Calculate appropriate breakpoint for mobile devices with user agent */
-        const variableWidth = isServer && isMobile;
-        const settings = {
-            ref: (slickSlider) => setSlider(slickSlider),
-            className: slick(null, className),
-            arrows,
-            variableWidth,
-            infinite: false,
-            speed: 1000,
-            adaptiveHeight: adaptive,
-            autoplay: isAutoplayEnabled,
-            autoplaySpeed,
-            slidesToShow: slidesToShowCount,
-            slidesToScroll: 1,
-            responsive: getSliderResponsiveParams(slidesToShow),
-            beforeChange: onBeforeChange,
-            afterChange: onAfterChange,
-            initialSlide: 0,
-            nextArrow: (_jsx(Arrow, { type: "right", handleClick: asUserInteraction(handleArrowClick), size: arrowSize })),
-            prevArrow: (_jsx(Arrow, { type: "left", handleClick: asUserInteraction(handleArrowClick), size: arrowSize })),
-            lazyLoad,
-            accessibility: false,
-        };
-        return (_jsxs(OutsideClick, { onOutsideClick: isMobile ? unsetFocus : noop, children: [_jsx(SlickSlider, { ...settings, children: disclosedChildren }), _jsxs("div", { className: b('footer'), children: [renderDisclaimer(), renderNavigation()] })] }));
-    };
-    return (_jsx(StylesContext.Provider, { value: { ...childStyles, setStyles: setChildStyles }, children: _jsxs("div", { className: b({
-                'align-left': childrenCount < slidesCountByBreakpoint,
-                'one-slide': childrenCount === 1,
-                'only-arrows': !title?.text && !description && arrows,
-                mobile: isMobile,
-                type,
-            }, blockClassName), children: [anchorId && _jsx(Anchor, { id: anchorId }), _jsx(Title, { title: title, subtitle: description, className: b('header', { 'no-description': !description }) }), _jsx(AnimateBlock, { className: b('animate-slides'), animate: animated, children: renderSlider() })] }) }));
+    const isA11yControlHidden = Boolean(autoplay);
+    const controlTabIndex = isA11yControlHidden ? -1 : 0;
+    const paginationProps = useSliderPagination({
+        enabled: dots,
+        isA11yControlHidden,
+        controlTabIndex,
+        bulletClass: b('dot', dotsClassName),
+        bulletActiveClass: b('dot_active'),
+        paginationLabel: i18n('pagination-label'),
+    });
+    return (_jsxs("div", { className: b({
+            'one-slide': childrenCount === 1,
+            'only-arrows': !title?.text && !description && arrows,
+            'without-dots': !dots || isLocked,
+            type,
+        }, blockClassName), children: [anchorId && _jsx(Anchor, { id: anchorId }), _jsx(Title, { title: title, subtitle: description, className: b('header', { 'no-description': !description }) }), _jsxs(AnimateBlock, { className: b('animate-slides'), animate: animated, children: [_jsx(SwiperReact, { className: b('slider', className), onSwiper: onSwiper, speed: 1000, autoplay: autoplay, autoHeight: adaptive, initialSlide: initialSlide, noSwiping: false, breakpoints: breakpoints, onSlideChange: onSlideChange, onSlideChangeTransitionStart: onSlideChangeTransitionStart, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onActiveIndexChange: onActiveIndexChange, onBreakpoint: onBreakpoint, onLock: () => setIsLocked(true), onUnlock: () => setIsLocked(false), onImagesReady: onImagesReady, watchSlidesVisibility: true, watchOverflow: true, a11y: {
+                            slideLabelMessage: '',
+                            paginationBulletMessage: i18n('dot-label', { index: '{{index}}' }),
+                        }, ...paginationProps, children: React.Children.map(children, (elem, index) => (_jsx(SwiperSlide, { className: b('slide'), children: ({ isVisible }) => (_jsx("div", { className: b('slide-item'), "aria-hidden": !isA11yControlHidden && !isVisible, children: elem })) }, index))) }), arrows && !isLocked && (_jsx(React.Fragment, { children: _jsxs("div", { "aria-hidden": isA11yControlHidden, children: [_jsx(Arrow, { className: b('arrow', { prev: true }), type: "left", transparent: type === SliderType.HeaderCard, onClick: onPrev, size: arrowSize, extraProps: { tabIndex: controlTabIndex } }), _jsx(Arrow, { className: b('arrow', { next: true }), type: "right", transparent: type === SliderType.HeaderCard, onClick: onNext, size: arrowSize, extraProps: { tabIndex: controlTabIndex } })] }) })), _jsx("div", { className: b('footer'), children: disclaimer ? (_jsx("div", { className: b('disclaimer', { size: disclaimer?.size || 'm' }), children: disclaimer?.text })) : null })] })] }));
 };
-function getSlideId(sliderId, index) {
-    return `slider-${sliderId}-child-${index}`;
-}
-// TODO remove this and rework PriceDetailed CLOUDFRONT-12230
-function discloseAllNestedChildren(children, sliderId) {
-    if (!children) {
-        return [];
-    }
-    let childIndex = 0;
-    const wrapped = (child) => {
-        const id = getSlideId(sliderId, childIndex++);
-        return (_jsx("div", { id: id, children: child }, id));
-    };
-    return React.Children.map(children, (child) => {
-        if (child) {
-            // TODO: if child has 'items' then 'items' determinate like nested children for Slider.
-            const nestedChildren = child.props.data?.items;
-            if (nestedChildren) {
-                return nestedChildren.map((nestedChild) => {
-                    return wrapped(React.cloneElement(child, {
-                        data: {
-                            ...child.props.data,
-                            items: [nestedChild],
-                        },
-                    }));
-                });
-            }
-        }
-        return child && wrapped(child);
-    }).filter(Boolean);
-}
 export default SliderBlock;
 //# sourceMappingURL=Slider.js.map

package/build/esm/blocks/Slider/Slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Slider.js","sourceRoot":"../../../../src","sources":["blocks/Slider/Slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {useUniqId} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\nimport get from 'lodash/get';\nimport noop from 'lodash/noop';\nimport _SlickSlider, {Settings} from 'react-slick';\n\nimport Anchor from '../../components/Anchor/Anchor';\nimport AnimateBlock from '../../components/AnimateBlock/AnimateBlock';\nimport OutsideClick from '../../components/OutsideClick/OutsideClick';\nimport Title from '../../components/Title/Title';\nimport {BREAKPOINTS} from '../../constants';\nimport {MobileContext} from '../../context/mobileContext';\nimport {SSRContext} from '../../context/ssrContext';\nimport {StylesContext} from '../../context/stylesContext/StylesContext';\nimport useFocus from '../../hooks/useFocus';\nimport {\n ClassNameProps,\n Refable,\n SliderProps as SliderParams,\n SliderType,\n Timeout,\n} from '../../models';\nimport {block} from '../../utils';\n\nimport Arrow, {ArrowType} from './Arrow/Arrow';\nimport {i18n} from './i18n';\nimport {SliderBreakpointParams} from './models';\nimport {\n getSliderResponsiveParams,\n getSlidesCountByBreakpoint,\n getSlidesToShowCount,\n getSlidesToShowWithDefaults,\n isFocusable,\n useRovingTabIndex,\n} from './utils';\n\nimport './Slider.scss';\n\nconst b = block('SliderBlock');\nconst slick = block('slick-origin');\n\nconst DOT_WIDTH = 8;\nconst DOT_GAP = 16;\n\nconst SlickSlider =\n 'default' in _SlickSlider && _SlickSlider.default\n ? (_SlickSlider.default as typeof _SlickSlider)\n : _SlickSlider;\n\nexport interface SliderProps\n extends Omit<SliderParams, 'children'>,\n Refable<HTMLDivElement>,\n ClassNameProps,\n Pick<Settings, 'lazyLoad'> {\n type?: string;\n anchorId?: string;\n onAfterChange?: (index: number) => void;\n onBeforeChange?: (current: number, next: number) => void;\n dotsClassName?: string;\n blockClassName?: string;\n arrowSize?: number;\n}\n\nexport const SliderBlock = (props: React.PropsWithChildren<SliderProps>) => {\n const {\n animated,\n title,\n description,\n type,\n anchorId,\n arrows = true,\n adaptive,\n autoplay: autoplaySpeed,\n dots = true,\n dotsClassName,\n disclaimer,\n children,\n className,\n blockClassName,\n lazyLoad,\n arrowSize,\n onAfterChange: handleAfterChange,\n onBeforeChange: handleBeforeChange,\n } = props;\n\n const {isServer} = React.useContext(SSRContext);\n const isMobile = React.useContext(MobileContext);\n const [breakpoint, setBreakpoint] = React.useState<number>(BREAKPOINTS.xl);\n const sliderId = useUniqId();\n const disclosedChildren = React.useMemo<React.ReactElement[]>(\n () => discloseAllNestedChildren(children as React.ReactElement[], sliderId),\n [children, sliderId],\n );\n const childrenCount = disclosedChildren.length;\n const isAutoplayEnabled = autoplaySpeed !== undefined && autoplaySpeed > 0;\n const isUserInteractionRef = React.useRef(false);\n\n const [slidesToShow] = React.useState<SliderBreakpointParams>(\n getSlidesToShowWithDefaults({\n contentLength: childrenCount,\n breakpoints: props.slidesToShow,\n mobileFullscreen: Boolean(\n props.type && Object.values(SliderType).includes(props.type as SliderType),\n ),\n }),\n );\n\n const slidesToShowCount = getSlidesToShowCount(slidesToShow);\n const slidesCountByBreakpoint = getSlidesCountByBreakpoint(breakpoint, slidesToShow);\n\n const [currentIndex, setCurrentIndex] = React.useState<number>(0);\n const [childStyles, setChildStyles] = React.useState<Object>({});\n const [slider, setSlider] = React.useState<_SlickSlider>();\n const prevIndexRef = React.useRef<number>(0);\n const autoplayTimeId = React.useRef<Timeout>();\n const {hasFocus, unsetFocus} = useFocus(slider?.innerSlider?.list);\n\n const asUserInteraction =\n <T extends unknown[], R>(fn: (...args: T) => R) =>\n (...args: T): R => {\n isUserInteractionRef.current = true;\n return fn(...args);\n };\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n const onResize = React.useCallback(\n debounce(() => {\n if (!slider) {\n return;\n }\n\n const newBreakpoint = get(slider, 'state.breakpoint') \|\| BREAKPOINTS.xl;\n\n if (newBreakpoint !== breakpoint) {\n setBreakpoint(newBreakpoint);\n setCurrentIndex(0);\n\n slider.slickGoTo(0);\n }\n }, 100),\n [slider, breakpoint],\n );\n\n const scrollLastSlide = React.useCallback(\n (current: number) => {\n const lastSlide = childrenCount - slidesToShowCount;\n\n if (isAutoplayEnabled && lastSlide === current) {\n // Slick doesn't support autoplay with no infinity scroll\n autoplayTimeId.current = setTimeout(() => {\n if (slider) {\n slider.slickGoTo(0, false);\n slider.slickPause();\n }\n setTimeout(() => {\n if (slider) {\n slider.slickPlay();\n }\n }, 500);\n }, autoplaySpeed);\n }\n },\n [autoplaySpeed, childrenCount, isAutoplayEnabled, slider, slidesToShowCount],\n );\n\n React.useEffect(() => {\n if (hasFocus && autoplayTimeId.current) {\n clearTimeout(autoplayTimeId.current);\n } else {\n scrollLastSlide(currentIndex);\n }\n }, [currentIndex, hasFocus, scrollLastSlide]);\n\n React.useEffect(() => {\n onResize();\n\n window.addEventListener('resize', onResize, {passive: true});\n\n return () => window.removeEventListener('resize', onResize);\n }, [onResize]);\n\n const handleArrowClick = (direction: ArrowType) => {\n let nextIndex;\n\n if (direction === 'right') {\n nextIndex =\n currentIndex === childrenCount - slidesCountByBreakpoint ? 0 : currentIndex + 1;\n } else {\n nextIndex =\n currentIndex === 0 ? childrenCount - slidesCountByBreakpoint : currentIndex - 1;\n }\n\n if (slider) {\n slider.slickGoTo(nextIndex);\n }\n };\n\n const onBeforeChange = React.useCallback(\n (current: number, next: number) => {\n if (handleBeforeChange) {\n handleBeforeChange(current, next);\n }\n\n prevIndexRef.current = current;\n\n setCurrentIndex(Math.ceil(next));\n },\n [handleBeforeChange],\n );\n\n const onAfterChange = React.useCallback(\n (current: number) => {\n if (handleAfterChange) {\n handleAfterChange(current);\n }\n\n if (autoplayTimeId.current) {\n clearTimeout(autoplayTimeId.current);\n }\n\n if (!hasFocus) {\n scrollLastSlide(current);\n }\n\n if (isUserInteractionRef.current) {\n const focusIndex =\n prevIndexRef.current >= current\n ? current\n : Math.max(current, prevIndexRef.current + slidesCountByBreakpoint);\n\n const firstNewSlide = document.getElementById(getSlideId(sliderId, focusIndex));\n if (firstNewSlide) {\n const focusableChild = Array.from(firstNewSlide.querySelectorAll('')).find(\n isFocusable,\n ) as HTMLElement \| undefined;\n focusableChild?.focus();\n }\n }\n\n isUserInteractionRef.current = false;\n },\n [handleAfterChange, hasFocus, scrollLastSlide, sliderId, slidesCountByBreakpoint],\n );\n\n const handleDotClick = (index: number) => {\n const nextIndex = index > currentIndex ? index + 1 - slidesCountByBreakpoint : index;\n\n if (slider) {\n slider.slickGoTo(nextIndex);\n }\n };\n\n const barSlidesCount = childrenCount - slidesCountByBreakpoint + 1;\n const barPosition = (DOT_GAP + DOT_WIDTH) currentIndex;\n const barWidth = DOT_WIDTH + (DOT_GAP + DOT_WIDTH) * (slidesCountByBreakpoint - 1);\n\n const {getRovingItemProps, rovingListProps} = useRovingTabIndex({\n itemCount: barSlidesCount,\n activeIndex: currentIndex + 1,\n firstIndex: 1,\n uniqId: sliderId,\n });\n\n const renderBar = () => {\n return (\n slidesCountByBreakpoint > 1 && (\n <li\n className={b('bar')}\n style={{\n left: barPosition,\n width: barWidth,\n }}\n />\n )\n );\n };\n\n // renders additional bar, not visible in the layout but visible for screenreaders\n const renderAccessibleBar = (index: number) => {\n return (\n // To have this key differ from keys used in renderDot function, added `-accessible-bar` part\n <React.Fragment key={`${index}-accessible-bar`}>\n {slidesCountByBreakpoint > 0 && (\n <li\n className={b('accessible-bar')}\n role=\"menuitemradio\"\n aria-checked\n aria-label={i18n('dot-label', {\n index: currentIndex + 1,\n count: barSlidesCount,\n })}\n style={{\n left: barPosition,\n width: barWidth,\n }}\n {...getRovingItemProps(currentIndex + 1)}\n />\n )}\n </React.Fragment>\n );\n };\n\n const getCurrentSlideNumber = (index: number) => {\n const currentIndexDiff = index - currentIndex;\n\n let currentSlideNumber;\n if (0 <= currentIndexDiff && currentIndexDiff < slidesCountByBreakpoint) {\n currentSlideNumber = currentIndex + 1;\n } else if (currentIndexDiff >= slidesCountByBreakpoint) {\n currentSlideNumber = index - slidesCountByBreakpoint + 2;\n } else {\n currentSlideNumber = index + 1;\n }\n return currentSlideNumber;\n };\n const isVisibleSlide = (index: number) => {\n const currentIndexDiff = index - currentIndex;\n\n const result =\n slidesCountByBreakpoint > 0 &&\n 0 <= currentIndexDiff &&\n currentIndexDiff < slidesCountByBreakpoint;\n return result;\n };\n\n const renderDot = (index: number) => {\n const isVisible = isVisibleSlide(index);\n const currentSlideNumber = getCurrentSlideNumber(index);\n const rovingItemProps = isVisible ? undefined : getRovingItemProps(currentSlideNumber);\n return (\n <li\n key={index}\n className={b('dot', {active: index === currentIndex})}\n onClick={asUserInteraction(() => handleDotClick(index))}\n onKeyDown={(e) => {\n const key = e.key.toLowerCase();\n if (key === 'space' \|\| key === 'enter') {\n e.currentTarget.click();\n }\n }}\n role=\"menuitemradio\"\n aria-checked={false}\n tabIndex={-1}\n aria-hidden={isVisible}\n aria-label={i18n('dot-label', {\n index: currentSlideNumber,\n count: barSlidesCount,\n })}\n {...rovingItemProps}\n />\n );\n };\n\n const renderNavigation = () => {\n if (childrenCount <= slidesCountByBreakpoint \|\| !dots \|\| childrenCount === 1) {\n return null;\n }\n const dotsList = Array(childrenCount)\n .fill(null)\n .map((_item, index) => renderDot(index));\n dotsList.splice(currentIndex, 0, renderAccessibleBar(currentIndex));\n\n return (\n <div className={b('dots', dotsClassName)}>\n <ul\n className={b('dots-list')}\n role=\"menu\"\n aria-label={i18n('pagination-label')}\n {...rovingListProps}\n >\n {renderBar()}\n {dotsList}\n </ul>\n </div>\n );\n };\n\n const renderDisclaimer = () => {\n return disclaimer ? (\n <div className={b('disclaimer', {size: disclaimer.size \|\| 'm'})}>{disclaimer.text}</div>\n ) : null;\n };\n\n const renderSlider = () => {\n /* Disable adding of width in inline styles when SSR to prevent overriding of default styles /\n / Calculate appropriate breakpoint for mobile devices with user agent */\n const variableWidth = isServer && isMobile;\n\n const settings = {\n ref: (slickSlider: _SlickSlider) => setSlider(slickSlider),\n className: slick(null, className),\n arrows,\n variableWidth,\n infinite: false,\n speed: 1000,\n adaptiveHeight: adaptive,\n autoplay: isAutoplayEnabled,\n autoplaySpeed,\n slidesToShow: slidesToShowCount,\n slidesToScroll: 1,\n responsive: getSliderResponsiveParams(slidesToShow),\n beforeChange: onBeforeChange,\n afterChange: onAfterChange,\n initialSlide: 0,\n nextArrow: (\n <Arrow\n type=\"right\"\n handleClick={asUserInteraction(handleArrowClick)}\n size={arrowSize}\n />\n ),\n prevArrow: (\n <Arrow\n type=\"left\"\n handleClick={asUserInteraction(handleArrowClick)}\n size={arrowSize}\n />\n ),\n lazyLoad,\n accessibility: false,\n };\n\n return (\n <OutsideClick onOutsideClick={isMobile ? unsetFocus : noop}>\n <SlickSlider {...settings}>{disclosedChildren}</SlickSlider>\n <div className={b('footer')}>\n {renderDisclaimer()}\n {renderNavigation()}\n </div>\n </OutsideClick>\n );\n };\n\n return (\n <StylesContext.Provider value={{...childStyles, setStyles: setChildStyles}}>\n <div\n className={b(\n {\n 'align-left': childrenCount < slidesCountByBreakpoint,\n 'one-slide': childrenCount === 1,\n 'only-arrows': !title?.text && !description && arrows,\n mobile: isMobile,\n type,\n },\n blockClassName,\n )}\n >\n {anchorId && <Anchor id={anchorId} />}\n <Title\n title={title}\n subtitle={description}\n className={b('header', {'no-description': !description})}\n />\n <AnimateBlock className={b('animate-slides')} animate={animated}>\n {renderSlider()}\n </AnimateBlock>\n </div>\n </StylesContext.Provider>\n );\n};\n\nfunction getSlideId(sliderId: string, index: number) {\n return `slider-${sliderId}-child-${index}`;\n}\n\n// TODO remove this and rework PriceDetailed CLOUDFRONT-12230\nfunction discloseAllNestedChildren(\n children: React.ReactElement[],\n sliderId: string,\n): React.ReactElement[] {\n if (!children) {\n return [];\n }\n\n let childIndex = 0;\n const wrapped = (child: React.ReactElement) => {\n const id = getSlideId(sliderId, childIndex++);\n\n return (\n <div key={id} id={id}>\n {child}\n </div>\n );\n };\n\n return React.Children.map(children, (child) => {\n if (child) {\n // TODO: if child has 'items' then 'items' determinate like nested children for Slider.\n const nestedChildren = child.props.data?.items;\n\n if (nestedChildren) {\n return nestedChildren.map((nestedChild: React.ReactElement) => {\n return wrapped(\n React.cloneElement(child, {\n data: {\n ...child.props.data,\n items: [nestedChild],\n },\n }),\n );\n });\n }\n }\n return child && wrapped(child);\n }).filter(Boolean);\n}\n\nexport default SliderBlock;\n"]}
1	+ {"version":3,"file":"Slider.js","sourceRoot":"../../../../src","sources":["blocks/Slider/Slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport Swiper, {A11y, Autoplay, Pagination} from 'swiper';\nimport {Swiper as SwiperReact, SwiperSlide} from 'swiper/react';\n\nimport Anchor from '../../components/Anchor/Anchor';\nimport AnimateBlock from '../../components/AnimateBlock/AnimateBlock';\nimport Title from '../../components/Title/Title';\nimport {ClassNameProps, Refable, SliderProps as SliderParams, SliderType} from '../../models';\nimport {block} from '../../utils';\n\nimport Arrow from './Arrow/Arrow';\nimport {i18n} from './i18n';\nimport {useSlider} from './useSlider';\nimport {useSliderPagination} from './useSliderPagination';\n\nimport './Slider.scss';\nimport 'swiper/swiper-bundle.css';\n\nexport type {Swiper, SwiperOptions} from 'swiper';\n\nconst b = block('SliderBlock');\n\nexport interface SliderProps\n extends Omit<SliderParams, 'children'>,\n Partial<\n Pick<\n SwiperReact,\n \| 'onSlideChange'\n \| 'onSlideChangeTransitionStart'\n \| 'onSlideChangeTransitionEnd'\n \| 'onActiveIndexChange'\n \| 'onBreakpoint'\n >\n >,\n Refable<HTMLDivElement>,\n ClassNameProps {\n type?: string;\n anchorId?: string;\n dotsClassName?: string;\n blockClassName?: string;\n arrowSize?: number;\n initialSlide?: number;\n}\n\n// eslint-disable-next-line react-hooks/rules-of-hooks\nSwiper.use([Autoplay, A11y, Pagination]);\n\nexport const SliderBlock = ({\n animated,\n title,\n description,\n type,\n anchorId,\n arrows = true,\n adaptive,\n autoplay: autoplayMs,\n dots = true,\n initialSlide = 0,\n className,\n dotsClassName,\n disclaimer,\n children,\n blockClassName,\n arrowSize,\n slidesToShow,\n onSlideChange,\n onSlideChangeTransitionStart,\n onSlideChangeTransitionEnd,\n onActiveIndexChange,\n onBreakpoint,\n}: React.PropsWithChildren<SliderProps>) => {\n const {\n autoplay,\n isLocked,\n childrenCount,\n breakpoints,\n onSwiper,\n onImagesReady,\n onPrev,\n onNext,\n setIsLocked,\n } = useSlider({\n slidesToShow,\n children,\n type,\n autoplayMs,\n });\n\n const isA11yControlHidden = Boolean(autoplay);\n const controlTabIndex = isA11yControlHidden ? -1 : 0;\n\n const paginationProps = useSliderPagination({\n enabled: dots,\n isA11yControlHidden,\n controlTabIndex,\n bulletClass: b('dot', dotsClassName),\n bulletActiveClass: b('dot_active'),\n paginationLabel: i18n('pagination-label'),\n });\n\n return (\n <div\n className={b(\n {\n 'one-slide': childrenCount === 1,\n 'only-arrows': !title?.text && !description && arrows,\n 'without-dots': !dots \|\| isLocked,\n type,\n },\n blockClassName,\n )}\n >\n {anchorId && <Anchor id={anchorId} />}\n <Title\n title={title}\n subtitle={description}\n className={b('header', {'no-description': !description})}\n />\n <AnimateBlock className={b('animate-slides')} animate={animated}>\n <SwiperReact\n className={b('slider', className)}\n onSwiper={onSwiper}\n speed={1000}\n autoplay={autoplay}\n autoHeight={adaptive}\n initialSlide={initialSlide}\n noSwiping={false}\n breakpoints={breakpoints}\n onSlideChange={onSlideChange}\n onSlideChangeTransitionStart={onSlideChangeTransitionStart}\n onSlideChangeTransitionEnd={onSlideChangeTransitionEnd}\n onActiveIndexChange={onActiveIndexChange}\n onBreakpoint={onBreakpoint}\n onLock={() => setIsLocked(true)}\n onUnlock={() => setIsLocked(false)}\n onImagesReady={onImagesReady}\n watchSlidesVisibility\n watchOverflow\n a11y={{\n slideLabelMessage: '',\n paginationBulletMessage: i18n('dot-label', {index: '{{index}}'}),\n }}\n {...paginationProps}\n >\n {React.Children.map(children, (elem, index) => (\n <SwiperSlide className={b('slide')} key={index}>\n {({isVisible}) => (\n <div\n className={b('slide-item')}\n aria-hidden={!isA11yControlHidden && !isVisible}\n >\n {elem}\n </div>\n )}\n </SwiperSlide>\n ))}\n </SwiperReact>\n {arrows && !isLocked && (\n <React.Fragment>\n <div aria-hidden={isA11yControlHidden}>\n <Arrow\n className={b('arrow', {prev: true})}\n type=\"left\"\n transparent={type === SliderType.HeaderCard}\n onClick={onPrev}\n size={arrowSize}\n extraProps={{tabIndex: controlTabIndex}}\n />\n <Arrow\n className={b('arrow', {next: true})}\n type=\"right\"\n transparent={type === SliderType.HeaderCard}\n onClick={onNext}\n size={arrowSize}\n extraProps={{tabIndex: controlTabIndex}}\n />\n </div>\n </React.Fragment>\n )}\n <div className={b('footer')}>\n {disclaimer ? (\n <div className={b('disclaimer', {size: disclaimer?.size \|\| 'm'})}>\n {disclaimer?.text}\n </div>\n ) : null}\n </div>\n </AnimateBlock>\n </div>\n );\n};\n\nexport default SliderBlock;\n"]}

package/build/esm/blocks/Slider/i18n/en.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "arrow-right": "Next",
   "arrow-left": "Previous",
-  "dot-label": "Page {{index}} of {{count}}",
+  "dot-label": "Page {{index}}",
   "pagination-label": "Pages"
 }

package/build/esm/blocks/Slider/i18n/ru.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "arrow-right": "Дальше",
   "arrow-left": "Назад",
-  "dot-label": "Страница {{index}} из {{count}}",
+  "dot-label": "Страница {{index}}",
   "pagination-label": "Страницы"
 }

package/build/esm/blocks/Slider/models.d.ts CHANGED Viewed

@@ -1,8 +1,8 @@
 export declare enum SliderBreakpointNames {
+    Xs = "xs",
     Sm = "sm",
     Md = "md",
-    Lg = "lg",
-    Xl = "xl"
+    Lg = "lg"
 }
 export type SliderBreakpointParams = Record<SliderBreakpointNames, number>;
 export type SlidesToShow = Partial<SliderBreakpointParams> | number;

package/build/esm/blocks/Slider/models.js CHANGED Viewed

@@ -1,8 +1,8 @@
 export var SliderBreakpointNames;
 (function (SliderBreakpointNames) {
+    SliderBreakpointNames["Xs"] = "xs";
     SliderBreakpointNames["Sm"] = "sm";
     SliderBreakpointNames["Md"] = "md";
     SliderBreakpointNames["Lg"] = "lg";
-    SliderBreakpointNames["Xl"] = "xl";
 })(SliderBreakpointNames || (SliderBreakpointNames = {}));
 //# sourceMappingURL=models.js.map

package/build/esm/blocks/Slider/models.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"models.js","sourceRoot":"../../../../src","sources":["blocks/Slider/models.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,qBAKX;AALD,WAAY,qBAAqB;IAC7B,kCAAS,CAAA;IACT,kCAAS,CAAA;IACT,kCAAS,CAAA;IACT,kCAAS,CAAA;AACb,CAAC,EALW,qBAAqB,KAArB,qBAAqB,QAKhC","sourcesContent":["export enum SliderBreakpointNames {\n Sm = 'sm',\n Md = 'md',\n Lg = 'lg',\n Xl = 'xl',\n}\n\nexport type SliderBreakpointParams = Record<SliderBreakpointNames, number>;\nexport type SlidesToShow = Partial<SliderBreakpointParams> \| number;\n"]}
1	+ {"version":3,"file":"models.js","sourceRoot":"../../../../src","sources":["blocks/Slider/models.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,qBAKX;AALD,WAAY,qBAAqB;IAC7B,kCAAS,CAAA;IACT,kCAAS,CAAA;IACT,kCAAS,CAAA;IACT,kCAAS,CAAA;AACb,CAAC,EALW,qBAAqB,KAArB,qBAAqB,QAKhC","sourcesContent":["export enum SliderBreakpointNames {\n Xs = 'xs',\n Sm = 'sm',\n Md = 'md',\n Lg = 'lg',\n}\n\nexport type SliderBreakpointParams = Record<SliderBreakpointNames, number>;\nexport type SlidesToShow = Partial<SliderBreakpointParams> \| number;\n"]}

package/build/esm/blocks/Slider/schema.d.ts CHANGED Viewed

@@ -11,6 +11,15 @@ export declare const SliderProps: {
     autoplay: {
         type: string;
     };
+    type: {
+        type: string;
+    };
+    adaptive: {
+        type: string;
+    };
+    arrowSize: {
+        type: string;
+    };
     animated: {
         animated: {
             type: string;
@@ -135,6 +144,15 @@ export declare const SliderBlock: {
             autoplay: {
                 type: string;
             };
+            type: {
+                type: string;
+            };
+            adaptive: {
+                type: string;
+            };
+            arrowSize: {
+                type: string;
+            };
             animated: {
                 animated: {
                     type: string;
@@ -245,7 +263,6 @@ export declare const SliderBlock: {
                     };
                 };
             };
-            type: {};
             when: {
                 type: string;
             };

package/build/esm/blocks/Slider/schema.js CHANGED Viewed

@@ -64,6 +64,15 @@ export const SliderProps = {
     autoplay: {
         type: 'number',
     },
+    type: {
+        type: 'string',
+    },
+    adaptive: {
+        type: 'boolean',
+    },
+    arrowSize: {
+        type: 'number',
+    },
     animated: AnimatableProps,
     slidesToShow: sliderSizesObject,
     disclaimer: DisclaimerProps,

package/build/esm/blocks/Slider/schema.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["blocks/Slider/schema.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,kBAAkB,EAClB,iBAAiB,EACjB,QAAQ,GACX,0CAAuC;AAExC,MAAM,aAAa,GAAG;IAClB,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,QAAQ,CAAC;IACpB,UAAU,EAAE;QACR,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,0DAA0D;YAC1D,0DAA0D;SAC7D;QACD;;WAEG;QACH,QAAQ,EAAE;YACN,IAAI,EAAE,QAAQ;SACjB;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,iBAAiB,EAAE;gBACf,IAAI,EAAE;oBACF,KAAK,EAAE;wBACH;4BACI,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC;yBACxC;wBACD;4BACI,IAAI,EAAE,QAAQ;4BACd,oBAAoB,EAAE,IAAI;yBAC7B;wBACD;4BACI,IAAI,EAAE,OAAO;yBAChB;qBACJ;iBACJ;aACJ;SACJ;KACJ;IACD,gEAAgE;IAChE,QAAQ,EAAE,IAAI;CACjB,CAAC;AAEF,MAAM,eAAe,GAAG;IACpB,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,MAAM,CAAC;IAClB,UAAU,EAAE;QACR,IAAI,EAAE;YACF,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,MAAM;SACtB;QACD,IAAI,EAAE;YACF,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,QAAQ;SACjB;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG;IACvB,IAAI,EAAE;QACF,IAAI,EAAE,SAAS;KAClB;IACD,MAAM,EAAE;QACJ,IAAI,EAAE,SAAS;KAClB;IACD,WAAW,EAAE;QACT,IAAI,EAAE,SAAS;KAClB;IACD,QAAQ,EAAE;QACN,IAAI,EAAE,QAAQ;KACjB;IACD,QAAQ,EAAE,eAAe;IACzB,YAAY,EAAE,iBAAiB;IAC/B,UAAU,EAAE,eAAe;IAC3B,QAAQ,EAAE,aAAa;IACvB,QAAQ,EAAE,kBAAkB;CAC/B,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG;IACvB,cAAc,EAAE;QACZ,oBAAoB,EAAE,KAAK;QAC3B,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE;YACR,GAAG,cAAc;YACjB,GAAG,eAAe;YAClB,GAAG,WAAW;YACd,GAAG,gBAAgB;SACtB;KACJ;CACJ,CAAC","sourcesContent":["import {\n AnimatableProps,\n BlockBaseProps,\n BlockHeaderProps,\n ChildrenCardsProps,\n sliderSizesObject,\n textSize,\n} from '../../schema/validators/common';\n\nconst LoadableProps = {\n additionalProperties: false,\n required: ['source'],\n properties: {\n source: {\n type: 'string',\n // add loadable sources here if you use it in your project\n // enum: ['my-loadable-source-1', 'my-loadable-source-1'],\n },\n /*\n @deprecated\n /\n minCount: {\n type: 'number',\n },\n params: {\n type: 'object',\n patternProperties: {\n '.': {\n oneOf: [\n {\n type: ['string', 'number', 'boolean'],\n },\n {\n type: 'object',\n additionalProperties: true,\n },\n {\n type: 'array',\n },\n ],\n },\n },\n },\n },\n // remove it in your custom validator schema if you use loadable\n disabled: true,\n};\n\nconst DisclaimerProps = {\n additionalProperties: false,\n required: ['text'],\n properties: {\n text: {\n type: 'string',\n contentType: 'text',\n },\n size: {\n type: 'string',\n enum: textSize,\n },\n },\n};\n\nexport const SliderProps = {\n dots: {\n type: 'boolean',\n },\n arrows: {\n type: 'boolean',\n },\n randomOrder: {\n type: 'boolean',\n },\n autoplay: {\n type: 'number',\n },\n animated: AnimatableProps,\n slidesToShow: sliderSizesObject,\n disclaimer: DisclaimerProps,\n loadable: LoadableProps,\n children: ChildrenCardsProps,\n};\n\nexport const SliderBlock = {\n 'slider-block': {\n additionalProperties: false,\n required: [],\n properties: {\n ...BlockBaseProps,\n ...AnimatableProps,\n ...SliderProps,\n ...BlockHeaderProps,\n },\n },\n};\n"]}
1	+ {"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["blocks/Slider/schema.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,kBAAkB,EAClB,iBAAiB,EACjB,QAAQ,GACX,0CAAuC;AAExC,MAAM,aAAa,GAAG;IAClB,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,QAAQ,CAAC;IACpB,UAAU,EAAE;QACR,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,0DAA0D;YAC1D,0DAA0D;SAC7D;QACD;;WAEG;QACH,QAAQ,EAAE;YACN,IAAI,EAAE,QAAQ;SACjB;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,iBAAiB,EAAE;gBACf,IAAI,EAAE;oBACF,KAAK,EAAE;wBACH;4BACI,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC;yBACxC;wBACD;4BACI,IAAI,EAAE,QAAQ;4BACd,oBAAoB,EAAE,IAAI;yBAC7B;wBACD;4BACI,IAAI,EAAE,OAAO;yBAChB;qBACJ;iBACJ;aACJ;SACJ;KACJ;IACD,gEAAgE;IAChE,QAAQ,EAAE,IAAI;CACjB,CAAC;AAEF,MAAM,eAAe,GAAG;IACpB,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,MAAM,CAAC;IAClB,UAAU,EAAE;QACR,IAAI,EAAE;YACF,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,MAAM;SACtB;QACD,IAAI,EAAE;YACF,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,QAAQ;SACjB;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG;IACvB,IAAI,EAAE;QACF,IAAI,EAAE,SAAS;KAClB;IACD,MAAM,EAAE;QACJ,IAAI,EAAE,SAAS;KAClB;IACD,WAAW,EAAE;QACT,IAAI,EAAE,SAAS;KAClB;IACD,QAAQ,EAAE;QACN,IAAI,EAAE,QAAQ;KACjB;IACD,IAAI,EAAE;QACF,IAAI,EAAE,QAAQ;KACjB;IACD,QAAQ,EAAE;QACN,IAAI,EAAE,SAAS;KAClB;IACD,SAAS,EAAE;QACP,IAAI,EAAE,QAAQ;KACjB;IACD,QAAQ,EAAE,eAAe;IACzB,YAAY,EAAE,iBAAiB;IAC/B,UAAU,EAAE,eAAe;IAC3B,QAAQ,EAAE,aAAa;IACvB,QAAQ,EAAE,kBAAkB;CAC/B,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG;IACvB,cAAc,EAAE;QACZ,oBAAoB,EAAE,KAAK;QAC3B,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE;YACR,GAAG,cAAc;YACjB,GAAG,eAAe;YAClB,GAAG,WAAW;YACd,GAAG,gBAAgB;SACtB;KACJ;CACJ,CAAC","sourcesContent":["import {\n AnimatableProps,\n BlockBaseProps,\n BlockHeaderProps,\n ChildrenCardsProps,\n sliderSizesObject,\n textSize,\n} from '../../schema/validators/common';\n\nconst LoadableProps = {\n additionalProperties: false,\n required: ['source'],\n properties: {\n source: {\n type: 'string',\n // add loadable sources here if you use it in your project\n // enum: ['my-loadable-source-1', 'my-loadable-source-1'],\n },\n /*\n @deprecated\n /\n minCount: {\n type: 'number',\n },\n params: {\n type: 'object',\n patternProperties: {\n '.': {\n oneOf: [\n {\n type: ['string', 'number', 'boolean'],\n },\n {\n type: 'object',\n additionalProperties: true,\n },\n {\n type: 'array',\n },\n ],\n },\n },\n },\n },\n // remove it in your custom validator schema if you use loadable\n disabled: true,\n};\n\nconst DisclaimerProps = {\n additionalProperties: false,\n required: ['text'],\n properties: {\n text: {\n type: 'string',\n contentType: 'text',\n },\n size: {\n type: 'string',\n enum: textSize,\n },\n },\n};\n\nexport const SliderProps = {\n dots: {\n type: 'boolean',\n },\n arrows: {\n type: 'boolean',\n },\n randomOrder: {\n type: 'boolean',\n },\n autoplay: {\n type: 'number',\n },\n type: {\n type: 'string',\n },\n adaptive: {\n type: 'boolean',\n },\n arrowSize: {\n type: 'number',\n },\n animated: AnimatableProps,\n slidesToShow: sliderSizesObject,\n disclaimer: DisclaimerProps,\n loadable: LoadableProps,\n children: ChildrenCardsProps,\n};\n\nexport const SliderBlock = {\n 'slider-block': {\n additionalProperties: false,\n required: [],\n properties: {\n ...BlockBaseProps,\n ...AnimatableProps,\n ...SliderProps,\n ...BlockHeaderProps,\n },\n },\n};\n"]}

package/build/esm/blocks/{SliderNew → Slider}/useSlider.d.ts RENAMED Viewed

@@ -11,6 +11,7 @@ export declare const useSlider: ({ children, autoplayMs, type, ...props }: UseSl
     onSwiper: React.Dispatch<React.SetStateAction<Swiper | undefined>>;
     onNext: () => void;
     onPrev: () => void;
+    onImagesReady: (localSlider: Swiper) => void;
     breakpoints: Record<number, import("swiper").SwiperOptions>;
     childrenCount: number;
     isLocked: boolean;

package/build/esm/blocks/{SliderNew → Slider}/useSlider.js RENAMED Viewed

@@ -34,6 +34,9 @@ export const useSlider = ({ children, autoplayMs, type, ...props }) => {
         }
         slider.slidePrev();
     };
+    const handleImagesReady = React.useCallback((localSlider) => {
+        setTimeout(() => localSlider.update(), 100);
+    }, []);
     React.useEffect(() => {
         if (!slider) {
             return;
@@ -50,6 +53,7 @@ export const useSlider = ({ children, autoplayMs, type, ...props }) => {
         onSwiper: setSlider,
         onNext: handleNext,
         onPrev: handlePrev,
+        onImagesReady: handleImagesReady,
         breakpoints,
         childrenCount,
         isLocked,

package/build/esm/blocks/Slider/useSlider.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useSlider.js","sourceRoot":"../../../../src","sources":["blocks/Slider/useSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,UAAU,EAAe,8BAAqB;AAEtD,OAAO,EAAC,yBAAyB,EAAE,WAAW,EAAC,mBAAgB;AAQ/D,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,KAAK,EAAiB,EAAE,EAAE;IAChF,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IACrD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,YAAY,GAAG,WAAW,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;IAErD,MAAM,aAAa,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAErD,MAAM,eAAe,GAAG,UAAU,KAAK,SAAS,IAAI,UAAU,GAAG,CAAC,CAAC;IAEnE,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACnC,OAAO,yBAAyB,CAAC;YAC7B,aAAa,EAAE,aAAa;YAC5B,YAAY;YACZ,gBAAgB,EAAE,OAAO,CACrB,IAAI,IAAI,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,QAAQ,CAAC,IAAkB,CAAC,CACjE;SACJ,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,YAAY,EAAE,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC;IAExC,MAAM,UAAU,GAAG,GAAG,EAAE;QACpB,IAAI,CAAC,MAAM,EAAE,CAAC;YACV,OAAO;QACX,CAAC;QAED,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;YACf,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YAClB,OAAO;QACX,CAAC;QAED,MAAM,CAAC,SAAS,EAAE,CAAC;IACvB,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,GAAG,EAAE;QACpB,IAAI,CAAC,MAAM,EAAE,CAAC;YACV,OAAO;QACX,CAAC;QAED,IAAI,MAAM,CAAC,WAAW,EAAE,CAAC;YACrB,MAAM,CAAC,OAAO,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC;YAClC,OAAO;QACX,CAAC;QAED,MAAM,CAAC,SAAS,EAAE,CAAC;IACvB,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,WAAmB,EAAE,EAAE;QAChE,UAAU,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,MAAM,EAAE,EAAE,GAAG,CAAC,CAAC;IAChD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,CAAC,MAAM,EAAE,CAAC;YACV,OAAO;QACX,CAAC;QAED,IAAI,eAAe,EAAE,CAAC;YAClB,MAAM,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;QAC5B,CAAC;aAAM,CAAC;YACJ,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;QAC3B,CAAC;IACL,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC,CAAC;IAE9B,OAAO;QACH,MAAM;QACN,QAAQ,EAAE,SAAS;QACnB,MAAM,EAAE,UAAU;QAClB,MAAM,EAAE,UAAU;QAClB,aAAa,EAAE,iBAAiB;QAChC,WAAW;QACX,aAAa;QACb,QAAQ;QACR,WAAW;QACX,QAAQ,EAAE,eAAe,IAAI;YACzB,KAAK,EAAE,UAAU;YACjB,oBAAoB,EAAE,KAAK;SAC9B;KACJ,CAAC;AACN,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport type {Swiper} from 'swiper';\n\nimport {SliderType, SlidesToShow} from '../../models';\n\nimport {getSliderResponsiveParams, useMemoized} from './utils';\n\ntype UseSliderProps = React.PropsWithChildren<{\n autoplayMs?: number;\n type?: string;\n slidesToShow?: SlidesToShow;\n}>;\n\nexport const useSlider = ({children, autoplayMs, type, ...props}: UseSliderProps) => {\n const [slider, setSlider] = React.useState<Swiper>();\n const [isLocked, setIsLocked] = React.useState(false);\n const slidesToShow = useMemoized(props.slidesToShow);\n\n const childrenCount = React.Children.count(children);\n\n const autoplayEnabled = autoplayMs !== undefined && autoplayMs > 0;\n\n const breakpoints = React.useMemo(() => {\n return getSliderResponsiveParams({\n contentLength: childrenCount,\n slidesToShow,\n mobileFullscreen: Boolean(\n type && Object.values(SliderType).includes(type as SliderType),\n ),\n });\n }, [slidesToShow, type, childrenCount]);\n\n const handleNext = () => {\n if (!slider) {\n return;\n }\n\n if (slider.isEnd) {\n slider.slideTo(0);\n return;\n }\n\n slider.slideNext();\n };\n\n const handlePrev = () => {\n if (!slider) {\n return;\n }\n\n if (slider.isBeginning) {\n slider.slideTo(childrenCount - 1);\n return;\n }\n\n slider.slidePrev();\n };\n\n const handleImagesReady = React.useCallback((localSlider: Swiper) => {\n setTimeout(() => localSlider.update(), 100);\n }, []);\n\n React.useEffect(() => {\n if (!slider) {\n return;\n }\n\n if (autoplayEnabled) {\n slider.autoplay.start();\n } else {\n slider.autoplay.stop();\n }\n }, [slider, autoplayEnabled]);\n\n return {\n slider,\n onSwiper: setSlider,\n onNext: handleNext,\n onPrev: handlePrev,\n onImagesReady: handleImagesReady,\n breakpoints,\n childrenCount,\n isLocked,\n setIsLocked,\n autoplay: autoplayEnabled && {\n delay: autoplayMs,\n disableOnInteraction: false,\n },\n };\n};\n"]}

package/build/esm/blocks/Slider/useSliderPagination.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useSliderPagination.js","sourceRoot":"../../../../src","sources":["blocks/Slider/useSliderPagination.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,oBAAoB,EAAC,mBAAgB;AAE7C,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,KAOnC,EAAsE,EAAE;IACrE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;QACjB,OAAO,SAAS,CAAC;IACrB,CAAC;IAED,MAAM,EAAC,mBAAmB,EAAE,eAAe,EAAE,WAAW,EAAE,iBAAiB,EAAE,eAAe,EAAC,GACzF,KAAK,CAAC;IAEV,OAAO;QACH,UAAU,EAAE;YACR,SAAS,EAAE,IAAI;YACf,WAAW;YACX,iBAAiB;SACpB;QACD,kBAAkB,EAAE,CAAC,MAAM,EAAE,EAAE;YAC3B,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC;YAExC,oBAAoB,CAAC,UAAU,EAAE;gBAC7B,IAAI,EAAE,MAAM;gBACZ,aAAa,EAAE,mBAAmB;gBAClC,YAAY,EAAE,eAAe;aAChC,CAAC,CAAC;YAEH,MAAM,OAAO,GAAG,UAAU,CAAC,gBAAgB,CAAC,IAAI,WAAW,EAAE,CAAC,CAAC;YAE/D,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;gBACvB,MAAM,QAAQ,GAAG,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC;gBAE9D,oBAAoB,CAAC,MAAM,EAAE;oBACzB,IAAI,EAAE,eAAe;oBACrB,aAAa,EAAE,mBAAmB;oBAClC,cAAc,EAAE,QAAQ;oBACxB,QAAQ,EAAE,eAAe;iBAC5B,CAAC,CAAC;YACP,CAAC,CAAC,CAAC;QACP,CAAC;KACJ,CAAC;AACN,CAAC,CAAC","sourcesContent":["import {Swiper as SwiperProps} from 'swiper/swiper-react';\n\nimport {setElementAtrributes} from './utils';\n\nexport const useSliderPagination = (props: {\n enabled: boolean;\n isA11yControlHidden: boolean;\n controlTabIndex: number;\n bulletClass: string;\n bulletActiveClass: string;\n paginationLabel: string;\n}): Pick<SwiperProps, 'pagination' | 'onPaginationUpdate'> | undefined => {\n if (!props.enabled) {\n return undefined;\n }\n\n const {isA11yControlHidden, controlTabIndex, bulletClass, bulletActiveClass, paginationLabel} =\n props;\n\n return {\n pagination: {\n clickable: true,\n bulletClass,\n bulletActiveClass,\n },\n onPaginationUpdate: (slider) => {\n const pagination = slider.pagination.el;\n\n setElementAtrributes(pagination, {\n role: 'menu',\n 'aria-hidden': isA11yControlHidden,\n 'aria-label': paginationLabel,\n });\n\n const bullets = pagination.querySelectorAll(`.${bulletClass}`);\n\n bullets.forEach((bullet) => {\n const isActive = bullet.classList.contains(bulletActiveClass);\n\n setElementAtrributes(bullet, {\n role: 'menuitemradio',\n 'aria-hidden': isA11yControlHidden,\n 'aria-checked': isActive,\n tabindex: controlTabIndex,\n });\n });\n },\n };\n};\n"]}