@sberbusiness/triplex-next 0.38.0 → 0.39.0

package/components/Carousel/Carousel.js

@@ -0,0 +1,362 @@
+import { jsx } from "react/jsx-runtime";
+import React, { useState, useMemo, useRef, useCallback, useLayoutEffect, useEffect } from "react";
+import { c as clsx } from "../../chunks/vendor-DKrjZZwJ.js";
+import { CarouselContext } from "./CarouselContext.js";
+import { ECarouselOrientation, ECarouselScrollMode } from "./enums.js";
+import { resolveViewportPadding, useLatestRef } from "./utils.js";
+import { s as styles } from "../../chunks/Carousel.module-COe08s01.js";
+import { CarouselViewport } from "./CarouselViewport.js";
+import { CarouselTrack } from "./CarouselTrack.js";
+import { CarouselItem } from "./CarouselItem.js";
+import { CarouselNextButton, CarouselPrevButton } from "./CarouselButton.js";
+import { CarouselIndicators } from "./CarouselIndicators.js";
+const ORIENTATION_TO_PADDING_KEY = {
+  [ECarouselOrientation.HORIZONTAL]: { start: "left", end: "right" },
+  [ECarouselOrientation.VERTICAL]: { start: "top", end: "bottom" }
+};
+const ORIENTATION_TO_RECT_SIZE_KEY = {
+  [ECarouselOrientation.HORIZONTAL]: "width",
+  [ECarouselOrientation.VERTICAL]: "height"
+};
+const ORIENTATION_TO_CLIENT_SIZE_KEY = {
+  [ECarouselOrientation.HORIZONTAL]: "clientWidth",
+  [ECarouselOrientation.VERTICAL]: "clientHeight"
+};
+const CarouselRoot = React.forwardRef(
+  ({
+    children,
+    orientation = ECarouselOrientation.HORIZONTAL,
+    scrollMode = ECarouselScrollMode.ITEM,
+    gap = 16,
+    viewportPadding = 0,
+    className,
+    ...restProps
+  }, ref) => {
+    const [offset, setOffset] = useState(0);
+    const [maxOffset, setMaxOffset] = useState(0);
+    const [activeIndices, setActiveIndices] = useState([]);
+    const [currentIndex, setCurrentIndex] = useState(0);
+    const paddingKey = Array.isArray(viewportPadding) ? viewportPadding.join(",") : String(viewportPadding);
+    const { metrics: normalizedPadding, style: viewportPaddingStyle } = useMemo(
+      () => resolveViewportPadding(viewportPadding),
+      // eslint-disable-next-line react-hooks/exhaustive-deps -- мемоизация по значению, а не по ссылке
+      [paddingKey]
+    );
+    const orientationRef = useLatestRef(orientation);
+    const offsetRef = useLatestRef(offset);
+    const currentIndexRef = useLatestRef(currentIndex);
+    const viewportRef = useRef(null);
+    const trackRef = useRef(null);
+    const slideRefs = useRef(/* @__PURE__ */ new Map());
+    const maxOffsetRef = useRef(maxOffset);
+    const pageRafIdRef = useRef(null);
+    const lastConfigRef = useRef({ gap, scrollMode, orientation });
+    const geometryCacheRef = useRef({ sizes: /* @__PURE__ */ new Map(), starts: /* @__PURE__ */ new Map() });
+    const pageMode = scrollMode === ECarouselScrollMode.PAGE;
+    const getSlideSize = useCallback(
+      (index) => {
+        if (geometryCacheRef.current.sizes.has(index)) {
+          return geometryCacheRef.current.sizes.get(index);
+        }
+        const slide = slideRefs.current.get(index);
+        if (!slide) return 0;
+        const rect = slide.getBoundingClientRect();
+        const key = ORIENTATION_TO_RECT_SIZE_KEY[orientation];
+        const size = rect[key];
+        geometryCacheRef.current.sizes.set(index, size);
+        return size;
+      },
+      [orientation]
+    );
+    const getSlidesCount = useCallback(() => slideRefs.current.size, []);
+    const getSlideStart = useCallback(
+      (index) => {
+        if (index <= 0) {
+          return 0;
+        }
+        if (geometryCacheRef.current.starts.has(index)) {
+          return geometryCacheRef.current.starts.get(index);
+        }
+        const prevIndex = index - 1;
+        const start = getSlideStart(prevIndex) + getSlideSize(prevIndex) + gap;
+        geometryCacheRef.current.starts.set(index, start);
+        return start;
+      },
+      [gap, getSlideSize]
+    );
+    const getSlideEnd = useCallback(
+      (index) => {
+        return getSlideStart(index) + getSlideSize(index);
+      },
+      [getSlideStart, getSlideSize]
+    );
+    const getViewportSize = useCallback(() => {
+      if (!viewportRef.current) return 0;
+      const key = ORIENTATION_TO_CLIENT_SIZE_KEY[orientation];
+      return viewportRef.current[key];
+    }, [orientation]);
+    const updateOffsetAndPages = useCallback(
+      (index) => {
+        const lastConfig = lastConfigRef.current;
+        if (lastConfig.gap !== gap || lastConfig.scrollMode !== scrollMode || lastConfig.orientation !== orientation) {
+          geometryCacheRef.current.sizes.clear();
+          geometryCacheRef.current.starts.clear();
+          lastConfigRef.current = { gap, scrollMode, orientation };
+        }
+        const slidesCount = getSlidesCount();
+        if (slidesCount === 0) {
+          maxOffsetRef.current = 0;
+          setOffset((prev) => prev !== 0 ? 0 : prev);
+          setMaxOffset((prev) => prev !== 0 ? 0 : prev);
+          setActiveIndices(Array.of());
+          return;
+        }
+        const totalContentSize = getSlideEnd(slidesCount - 1);
+        const containerSize = getViewportSize();
+        const { start: startKey, end: endKey } = ORIENTATION_TO_PADDING_KEY[orientation];
+        const startP = normalizedPadding[startKey];
+        const endP = normalizedPadding[endKey];
+        const calculatedMaxOffset = Math.max(0, totalContentSize + startP + endP - containerSize);
+        maxOffsetRef.current = calculatedMaxOffset;
+        let targetOffset = 0;
+        if (pageMode && containerSize > 0) {
+          const pagesMatrix = [];
+          let currentPage = [];
+          let currentGroupSize = 0;
+          for (let i = 0; i < slidesCount; i++) {
+            const slideSize = getSlideSize(i);
+            const addedSize = currentPage.length > 0 ? slideSize + gap : slideSize;
+            if (currentGroupSize + addedSize <= containerSize + 1) {
+              currentPage.push(i);
+              currentGroupSize += addedSize;
+            } else {
+              if (currentPage.length > 0) pagesMatrix.push(currentPage);
+              currentPage = [i];
+              currentGroupSize = slideSize;
+            }
+          }
+          if (currentPage.length > 0) pagesMatrix.push(currentPage);
+          const clampedIndex = Math.max(0, Math.min(index, pagesMatrix.length - 1));
+          if (clampedIndex !== index) {
+            if (pageRafIdRef.current !== null) {
+              cancelAnimationFrame(pageRafIdRef.current);
+            }
+            pageRafIdRef.current = requestAnimationFrame(() => {
+              setCurrentIndex(clampedIndex);
+              pageRafIdRef.current = null;
+            });
+          }
+          const validPageIndices = Array.from({ length: pagesMatrix.length }, (_, i) => i);
+          setActiveIndices((prev) => {
+            if (prev.length === validPageIndices.length) return prev;
+            return validPageIndices;
+          });
+          const currentGroup = pagesMatrix[clampedIndex];
+          if (currentGroup && currentGroup.length > 0) {
+            const firstSlideIndex = currentGroup[0];
+            const lastSlideIndex = currentGroup[currentGroup.length - 1];
+            const groupStart = getSlideStart(firstSlideIndex);
+            const lastSlideSize = getSlideSize(lastSlideIndex);
+            const groupEnd = getSlideStart(lastSlideIndex) + lastSlideSize;
+            const groupSize = groupEnd - groupStart;
+            targetOffset = groupStart - (containerSize - groupSize) / 2;
+          }
+        } else {
+          setActiveIndices((prev) => prev.length === 0 ? prev : []);
+          const slideStart = getSlideStart(index);
+          const slideEnd = getSlideEnd(index);
+          const currentOffset = offsetRef.current;
+          const containerEnd = currentOffset + containerSize;
+          if (slideEnd - slideStart > containerSize) {
+            if (currentOffset < slideStart - startP) {
+              targetOffset = slideStart - startP;
+            } else if (currentOffset + containerSize > slideEnd + endP) {
+              targetOffset = slideEnd - containerSize + endP;
+            } else {
+              targetOffset = currentOffset;
+            }
+          } else {
+            if (slideEnd > containerEnd + 1) {
+              targetOffset = slideEnd - containerSize + startP + endP;
+            } else if (slideStart < currentOffset - 1) {
+              targetOffset = slideStart - startP;
+            } else {
+              targetOffset = currentOffset;
+            }
+          }
+        }
+        if (targetOffset <= 0 || calculatedMaxOffset === 0) {
+          setOffset(0);
+        } else if (targetOffset >= calculatedMaxOffset) {
+          setOffset(calculatedMaxOffset);
+        } else {
+          setOffset(targetOffset);
+        }
+        setMaxOffset((prev) => prev !== calculatedMaxOffset ? calculatedMaxOffset : prev);
+      },
+      [
+        gap,
+        scrollMode,
+        orientation,
+        getSlidesCount,
+        getSlideEnd,
+        getViewportSize,
+        normalizedPadding,
+        pageMode,
+        getSlideSize,
+        getSlideStart
+      ]
+    );
+    const nextSlide = useCallback(() => {
+      if (pageMode) {
+        setCurrentIndex((prev) => prev === activeIndices.length - 1 ? prev : prev + 1);
+        return;
+      }
+      const slidesCount = getSlidesCount();
+      const containerSize = getViewportSize();
+      const currentSlideEnd = getSlideEnd(currentIndex);
+      const { end: endKey } = ORIENTATION_TO_PADDING_KEY[orientation];
+      const endP = normalizedPadding[endKey];
+      if (currentSlideEnd + endP > offset + containerSize + 1) {
+        const maxSlideOffset = currentSlideEnd - containerSize + endP;
+        const nextOffset = Math.min(offset + containerSize, maxSlideOffset);
+        const clampedOffset = Math.min(nextOffset, maxOffsetRef.current);
+        setOffset(clampedOffset);
+        return;
+      }
+      for (let i = currentIndex + 1; i < slidesCount; i++) {
+        const slideEnd = getSlideEnd(i);
+        if (slideEnd + endP > offset + containerSize + 1) {
+          setCurrentIndex(i);
+          return;
+        }
+      }
+      setCurrentIndex(Math.max(0, slidesCount - 1));
+    }, [
+      pageMode,
+      activeIndices.length,
+      getSlidesCount,
+      getViewportSize,
+      getSlideEnd,
+      orientation,
+      normalizedPadding,
+      offset,
+      currentIndex
+    ]);
+    const prevSlide = useCallback(() => {
+      if (pageMode) {
+        setCurrentIndex((prev) => prev === 0 ? prev : prev - 1);
+        return;
+      }
+      const containerSize = getViewportSize();
+      const currentSlideStart = getSlideStart(currentIndex);
+      const { start: startKey } = ORIENTATION_TO_PADDING_KEY[orientation];
+      const startP = normalizedPadding[startKey];
+      if (currentSlideStart - startP < offset - 1) {
+        const minSlideOffset = currentSlideStart - startP;
+        const prevOffset = Math.max(offset - containerSize, minSlideOffset);
+        const clampedOffset = Math.max(0, prevOffset);
+        setOffset(clampedOffset);
+        return;
+      }
+      for (let i = currentIndex - 1; i >= 0; i--) {
+        const slideStart = getSlideStart(i);
+        if (slideStart - startP < offset - 1) {
+          setCurrentIndex(i);
+          return;
+        }
+      }
+      setCurrentIndex(0);
+    }, [pageMode, getViewportSize, getSlideStart, orientation, normalizedPadding, offset, currentIndex]);
+    const goToSlide = useCallback(
+      (slideIndex) => {
+        const slidesCount = getSlidesCount();
+        if (slidesCount === 0) {
+          setCurrentIndex(0);
+          return;
+        }
+        const clampedIndex = Math.max(0, Math.min(slideIndex, slidesCount - 1));
+        setCurrentIndex(clampedIndex);
+      },
+      [getSlidesCount]
+    );
+    useLayoutEffect(() => {
+      if (!viewportRef.current || !trackRef.current) return;
+      const observer = new ResizeObserver(() => {
+        geometryCacheRef.current.sizes.clear();
+        geometryCacheRef.current.starts.clear();
+        updateOffsetAndPages(currentIndexRef.current);
+      });
+      observer.observe(viewportRef.current);
+      observer.observe(trackRef.current);
+      return () => observer.disconnect();
+    }, [updateOffsetAndPages]);
+    useEffect(() => {
+      setCurrentIndex(0);
+    }, [gap, scrollMode, orientation]);
+    useEffect(() => {
+      updateOffsetAndPages(currentIndex);
+    }, [currentIndex, updateOffsetAndPages]);
+    useEffect(() => {
+      return () => {
+        if (pageRafIdRef.current !== null) {
+          cancelAnimationFrame(pageRafIdRef.current);
+        }
+      };
+    }, []);
+    const atStart = pageMode ? currentIndex === 0 : offset <= 1;
+    const atEnd = pageMode ? activeIndices.length === 0 || currentIndex >= activeIndices.length - 1 : maxOffset > 0 ? offset >= maxOffset - 1 : true;
+    const classNames = clsx(styles.carousel, styles[orientation], className);
+    const contextValue = useMemo(
+      () => ({
+        gap,
+        orientation,
+        scrollMode,
+        offset,
+        activeIndices,
+        currentIndex,
+        viewportPaddingStyle,
+        atStart,
+        atEnd,
+        nextSlide,
+        prevSlide,
+        goToSlide,
+        orientationRef,
+        offsetRef,
+        maxOffsetRef,
+        currentIndexRef,
+        viewportRef,
+        trackRef,
+        slideRefs
+      }),
+      [
+        gap,
+        orientation,
+        scrollMode,
+        offset,
+        activeIndices,
+        currentIndex,
+        viewportPaddingStyle,
+        atStart,
+        atEnd,
+        nextSlide,
+        prevSlide,
+        goToSlide
+      ]
+    );
+    return /* @__PURE__ */ jsx(CarouselContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: classNames, ...restProps, ref, children }) });
+  }
+);
+CarouselRoot.displayName = "Carousel";
+const Carousel = Object.assign(CarouselRoot, {
+  Viewport: CarouselViewport,
+  Track: CarouselTrack,
+  Item: CarouselItem,
+  PrevButton: CarouselPrevButton,
+  NextButton: CarouselNextButton,
+  Indicators: CarouselIndicators
+});
+export {
+  Carousel
+};
+//# sourceMappingURL=Carousel.js.map

package/components/Carousel/Carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Carousel.js","sources":["../../../src/components/Carousel/Carousel.tsx"],"sourcesContent":["import React, { useState, useMemo, useRef, useLayoutEffect, useCallback, useEffect } from \"react\";\nimport clsx from \"clsx\";\nimport { CarouselContext } from \"./CarouselContext\";\nimport { ICarouselProps } from \"./types\";\nimport { ECarouselOrientation, ECarouselScrollMode } from \"./enums\";\nimport { resolveViewportPadding, useLatestRef } from \"./utils\";\nimport styles from \"./styles/Carousel.module.less\";\nimport { CarouselViewport } from \"./CarouselViewport\";\nimport { CarouselTrack } from \"./CarouselTrack\";\nimport { CarouselItem } from \"./CarouselItem\";\nimport { CarouselPrevButton, CarouselNextButton } from \"./CarouselButton\";\nimport { CarouselIndicators } from \"./CarouselIndicators\";\n\nconst ORIENTATION_TO_PADDING_KEY = {\n    [ECarouselOrientation.HORIZONTAL]: { start: \"left\", end: \"right\" },\n    [ECarouselOrientation.VERTICAL]: { start: \"top\", end: \"bottom\" },\n} as const;\n\nconst ORIENTATION_TO_RECT_SIZE_KEY = {\n    [ECarouselOrientation.HORIZONTAL]: \"width\",\n    [ECarouselOrientation.VERTICAL]: \"height\",\n} as const;\n\nconst ORIENTATION_TO_CLIENT_SIZE_KEY = {\n    [ECarouselOrientation.HORIZONTAL]: \"clientWidth\",\n    [ECarouselOrientation.VERTICAL]: \"clientHeight\",\n} as const;\n\nconst CarouselRoot = React.forwardRef<HTMLDivElement, ICarouselProps>(\n    (\n        {\n            children,\n            orientation = ECarouselOrientation.HORIZONTAL,\n            scrollMode = ECarouselScrollMode.ITEM,\n            gap = 16,\n            viewportPadding = 0,\n            className,\n            ...restProps\n        },\n        ref,\n    ) => {\n        const [offset, setOffset] = useState(0);\n        const [maxOffset, setMaxOffset] = useState(0);\n        const [activeIndices, setActiveIndices] = useState<number[]>([]);\n        const [currentIndex, setCurrentIndex] = useState(0);\n\n        const paddingKey = Array.isArray(viewportPadding) ? viewportPadding.join(\",\") : String(viewportPadding);\n        const { metrics: normalizedPadding, style: viewportPaddingStyle } = useMemo(\n            () => resolveViewportPadding(viewportPadding),\n            // eslint-disable-next-line react-hooks/exhaustive-deps -- мемоизация по значению, а не по ссылке\n            [paddingKey],\n        );\n\n        // Защита от пересоздания обработчиков жестов во Viewport при смене ориентации\n        const orientationRef = useLatestRef(orientation);\n        // Защита от бесконечного цикла рендеров в updateOffsetAndPages\n        const offsetRef = useLatestRef(offset);\n        // Защита от stale closures в ResizeObserver\n        const currentIndexRef = useLatestRef(currentIndex);\n\n        const viewportRef = useRef<HTMLDivElement | null>(null);\n        const trackRef = useRef<HTMLDivElement | null>(null);\n        const slideRefs = useRef<Map<number, HTMLDivElement>>(new Map());\n        const maxOffsetRef = useRef(maxOffset);\n\n        // Реф для отслеживания запланированного кадра анимации\n        const pageRafIdRef = useRef<number | null>(null);\n        // Хранит настройки предыдущего успешного расчёта для авто-сброса кэша\n        const lastConfigRef = useRef({ gap, scrollMode, orientation });\n\n        const geometryCacheRef = useRef<{\n            sizes: Map<number, number>;\n            starts: Map<number, number>;\n        }>({ sizes: new Map(), starts: new Map() });\n\n        const pageMode = scrollMode === ECarouselScrollMode.PAGE;\n\n        const getSlideSize = useCallback(\n            (index: number) => {\n                if (geometryCacheRef.current.sizes.has(index)) {\n                    // Безопасно: строка выше гарантирует наличие значения в кэше.\n                    return geometryCacheRef.current.sizes.get(index)!;\n                }\n\n                const slide = slideRefs.current.get(index);\n                if (!slide) return 0;\n\n                const rect = slide.getBoundingClientRect();\n                const key = ORIENTATION_TO_RECT_SIZE_KEY[orientation];\n                const size = rect[key];\n\n                geometryCacheRef.current.sizes.set(index, size);\n                return size;\n            },\n            [orientation],\n        );\n\n        const getSlidesCount = useCallback(() => slideRefs.current.size, []);\n\n        const getSlideStart = useCallback(\n            (index: number): number => {\n                if (index <= 0) {\n                    return 0;\n                }\n\n                if (geometryCacheRef.current.starts.has(index)) {\n                    // Безопасно: строка выше гарантирует наличие значения в кэше.\n                    return geometryCacheRef.current.starts.get(index)!;\n                }\n\n                const prevIndex = index - 1;\n                const start = getSlideStart(prevIndex) + getSlideSize(prevIndex) + gap;\n\n                geometryCacheRef.current.starts.set(index, start);\n                return start;\n            },\n            [gap, getSlideSize],\n        );\n\n        const getSlideEnd = useCallback(\n            (index: number) => {\n                return getSlideStart(index) + getSlideSize(index);\n            },\n            [getSlideStart, getSlideSize],\n        );\n\n        const getViewportSize = useCallback(() => {\n            if (!viewportRef.current) return 0;\n            const key = ORIENTATION_TO_CLIENT_SIZE_KEY[orientation];\n            return viewportRef.current[key];\n        }, [orientation]);\n\n        const updateOffsetAndPages = useCallback(\n            (index: number) => {\n                const lastConfig = lastConfigRef.current;\n                if (\n                    lastConfig.gap !== gap ||\n                    lastConfig.scrollMode !== scrollMode ||\n                    lastConfig.orientation !== orientation\n                ) {\n                    geometryCacheRef.current.sizes.clear();\n                    geometryCacheRef.current.starts.clear();\n                    lastConfigRef.current = { gap, scrollMode, orientation };\n                }\n\n                const slidesCount = getSlidesCount();\n                if (slidesCount === 0) {\n                    maxOffsetRef.current = 0;\n                    setOffset((prev) => (prev !== 0 ? 0 : prev));\n                    setMaxOffset((prev) => (prev !== 0 ? 0 : prev));\n                    setActiveIndices(Array.of());\n                    return;\n                }\n\n                const totalContentSize = getSlideEnd(slidesCount - 1);\n                const containerSize = getViewportSize();\n\n                const { start: startKey, end: endKey } = ORIENTATION_TO_PADDING_KEY[orientation];\n                const startP = normalizedPadding[startKey];\n                const endP = normalizedPadding[endKey];\n\n                const calculatedMaxOffset = Math.max(0, totalContentSize + startP + endP - containerSize);\n                maxOffsetRef.current = calculatedMaxOffset;\n\n                let targetOffset = 0;\n\n                if (pageMode && containerSize > 0) {\n                    const pagesMatrix: number[][] = [];\n                    let currentPage: number[] = [];\n                    let currentGroupSize = 0;\n\n                    for (let i = 0; i < slidesCount; i++) {\n                        const slideSize = getSlideSize(i);\n                        const addedSize = currentPage.length > 0 ? slideSize + gap : slideSize;\n\n                        if (currentGroupSize + addedSize <= containerSize + 1) {\n                            currentPage.push(i);\n                            currentGroupSize += addedSize;\n                        } else {\n                            if (currentPage.length > 0) pagesMatrix.push(currentPage);\n                            currentPage = [i];\n                            currentGroupSize = slideSize;\n                        }\n                    }\n\n                    if (currentPage.length > 0) pagesMatrix.push(currentPage);\n\n                    const clampedIndex = Math.max(0, Math.min(index, pagesMatrix.length - 1));\n\n                    if (clampedIndex !== index) {\n                        if (pageRafIdRef.current !== null) {\n                            cancelAnimationFrame(pageRafIdRef.current);\n                        }\n\n                        pageRafIdRef.current = requestAnimationFrame(() => {\n                            setCurrentIndex(clampedIndex);\n                            pageRafIdRef.current = null;\n                        });\n                    }\n\n                    const validPageIndices = Array.from({ length: pagesMatrix.length }, (_, i) => i);\n\n                    setActiveIndices((prev) => {\n                        if (prev.length === validPageIndices.length) return prev;\n                        return validPageIndices;\n                    });\n\n                    const currentGroup = pagesMatrix[clampedIndex];\n                    if (currentGroup && currentGroup.length > 0) {\n                        const firstSlideIndex = currentGroup[0];\n                        const lastSlideIndex = currentGroup[currentGroup.length - 1];\n                        const groupStart = getSlideStart(firstSlideIndex);\n\n                        const lastSlideSize = getSlideSize(lastSlideIndex);\n                        const groupEnd = getSlideStart(lastSlideIndex) + lastSlideSize;\n                        const groupSize = groupEnd - groupStart;\n\n                        targetOffset = groupStart - (containerSize - groupSize) / 2;\n                    }\n                } else {\n                    setActiveIndices((prev) => (prev.length === 0 ? prev : []));\n\n                    const slideStart = getSlideStart(index);\n                    const slideEnd = getSlideEnd(index);\n\n                    const currentOffset = offsetRef.current;\n                    const containerEnd = currentOffset + containerSize;\n\n                    // Ситуация 1: Слайд шире, чем сам контейнер (огромный слайд)\n                    if (slideEnd - slideStart > containerSize) {\n                        if (currentOffset < slideStart - startP) {\n                            targetOffset = slideStart - startP;\n                        } else if (currentOffset + containerSize > slideEnd + endP) {\n                            targetOffset = slideEnd - containerSize + endP;\n                        } else {\n                            targetOffset = currentOffset;\n                        }\n                    }\n                    // Ситуация 2: Стандартный слайд (меньше или равен размеру контейнера)\n                    else {\n                        if (slideEnd > containerEnd + 1) {\n                            targetOffset = slideEnd - containerSize + startP + endP;\n                        } else if (slideStart < currentOffset - 1) {\n                            targetOffset = slideStart - startP;\n                        } else {\n                            targetOffset = currentOffset;\n                        }\n                    }\n                }\n\n                if (targetOffset <= 0 || calculatedMaxOffset === 0) {\n                    setOffset(0);\n                } else if (targetOffset >= calculatedMaxOffset) {\n                    setOffset(calculatedMaxOffset);\n                } else {\n                    setOffset(targetOffset);\n                }\n\n                // Обновляем реактивный стейт для синхронизации с кнопками (стрелками)\n                setMaxOffset((prev) => (prev !== calculatedMaxOffset ? calculatedMaxOffset : prev));\n            },\n            [\n                gap,\n                scrollMode,\n                orientation,\n                getSlidesCount,\n                getSlideEnd,\n                getViewportSize,\n                normalizedPadding,\n                pageMode,\n                getSlideSize,\n                getSlideStart,\n            ],\n        );\n\n        const nextSlide = useCallback(() => {\n            if (pageMode) {\n                setCurrentIndex((prev) => (prev === activeIndices.length - 1 ? prev : prev + 1));\n                return;\n            }\n\n            const slidesCount = getSlidesCount();\n            const containerSize = getViewportSize();\n\n            const currentSlideEnd = getSlideEnd(currentIndex);\n\n            const { end: endKey } = ORIENTATION_TO_PADDING_KEY[orientation];\n            const endP = normalizedPadding[endKey];\n\n            // Случай 1: Мы на огромном слайде, и его правый край всё еще скрыт за экраном\n            if (currentSlideEnd + endP > offset + containerSize + 1) {\n                // Вычисляем следующий шаг (не дальше, чем правый край слайда с учётом endP)\n                const maxSlideOffset = currentSlideEnd - containerSize + endP;\n                const nextOffset = Math.min(offset + containerSize, maxSlideOffset);\n                const clampedOffset = Math.min(nextOffset, maxOffsetRef.current);\n\n                setOffset(clampedOffset);\n                return; // Индекс не меняем, просто продвинули скролл внутри слайда\n            }\n\n            // Случай 2: Текущий слайд закончился, ищем следующий скрытый элемент\n            for (let i = currentIndex + 1; i < slidesCount; i++) {\n                const slideEnd = getSlideEnd(i);\n\n                if (slideEnd + endP > offset + containerSize + 1) {\n                    setCurrentIndex(i);\n                    return;\n                }\n            }\n            setCurrentIndex(Math.max(0, slidesCount - 1));\n        }, [\n            pageMode,\n            activeIndices.length,\n            getSlidesCount,\n            getViewportSize,\n            getSlideEnd,\n            orientation,\n            normalizedPadding,\n            offset,\n            currentIndex,\n        ]);\n\n        const prevSlide = useCallback(() => {\n            if (pageMode) {\n                setCurrentIndex((prev) => (prev === 0 ? prev : prev - 1));\n                return;\n            }\n\n            const containerSize = getViewportSize();\n            const currentSlideStart = getSlideStart(currentIndex);\n\n            const { start: startKey } = ORIENTATION_TO_PADDING_KEY[orientation];\n            const startP = normalizedPadding[startKey];\n\n            // Случай 1: Мы на огромном слайде, и его левый край скрыт слева за экраном\n            if (currentSlideStart - startP < offset - 1) {\n                // Вычисляем шаг назад (не дальше, чем левый край слайда с учётом startP)\n                const minSlideOffset = currentSlideStart - startP;\n                const prevOffset = Math.max(offset - containerSize, minSlideOffset);\n                const clampedOffset = Math.max(0, prevOffset);\n\n                setOffset(clampedOffset);\n                return; // Индекс не меняем, скроллим назад внутри слайда\n            }\n\n            // Случай 2: Левый край текущего слайда полностью виден, ищем предыдущие скрытые элементы\n            for (let i = currentIndex - 1; i >= 0; i--) {\n                const slideStart = getSlideStart(i);\n\n                if (slideStart - startP < offset - 1) {\n                    setCurrentIndex(i);\n                    return;\n                }\n            }\n\n            setCurrentIndex(0);\n        }, [pageMode, getViewportSize, getSlideStart, orientation, normalizedPadding, offset, currentIndex]);\n\n        const goToSlide = useCallback(\n            (slideIndex: number) => {\n                const slidesCount = getSlidesCount();\n                if (slidesCount === 0) {\n                    setCurrentIndex(0);\n                    return;\n                }\n\n                const clampedIndex = Math.max(0, Math.min(slideIndex, slidesCount - 1));\n                setCurrentIndex(clampedIndex);\n            },\n            [getSlidesCount],\n        );\n\n        // ResizeObserver для адаптивности при изменении размеров экрана или контента\n        useLayoutEffect(() => {\n            if (!viewportRef.current || !trackRef.current) return;\n\n            const observer = new ResizeObserver(() => {\n                geometryCacheRef.current.sizes.clear();\n                geometryCacheRef.current.starts.clear();\n\n                updateOffsetAndPages(currentIndexRef.current);\n            });\n\n            observer.observe(viewportRef.current);\n            observer.observe(trackRef.current);\n\n            return () => observer.disconnect();\n        }, [updateOffsetAndPages]);\n\n        // Сброс индекса при изменении ключевых настроек карусели\n        useEffect(() => {\n            setCurrentIndex(0);\n        }, [gap, scrollMode, orientation]);\n\n        // Синхронизация смещения при изменении индекса\n        useEffect(() => {\n            updateOffsetAndPages(currentIndex);\n        }, [currentIndex, updateOffsetAndPages]);\n\n        // Очистка запланированных анимационных фреймов при размонтировании карусели\n        useEffect(() => {\n            return () => {\n                if (pageRafIdRef.current !== null) {\n                    cancelAnimationFrame(pageRafIdRef.current);\n                }\n            };\n        }, []);\n\n        // Вычисление граничных состояний (актуально для отключения стрелок навигации)\n        const atStart = pageMode ? currentIndex === 0 : offset <= 1;\n        const atEnd = pageMode\n            ? activeIndices.length === 0 || currentIndex >= activeIndices.length - 1\n            : maxOffset > 0\n              ? offset >= maxOffset - 1\n              : true;\n\n        const classNames = clsx(styles.carousel, styles[orientation], className);\n\n        const contextValue = useMemo(\n            () => ({\n                gap,\n                orientation,\n                scrollMode,\n                offset,\n                activeIndices,\n                currentIndex,\n                viewportPaddingStyle,\n                atStart,\n                atEnd,\n                nextSlide,\n                prevSlide,\n                goToSlide,\n                orientationRef,\n                offsetRef,\n                maxOffsetRef,\n                currentIndexRef,\n                viewportRef,\n                trackRef,\n                slideRefs,\n            }),\n            [\n                gap,\n                orientation,\n                scrollMode,\n                offset,\n                activeIndices,\n                currentIndex,\n                viewportPaddingStyle,\n                atStart,\n                atEnd,\n                nextSlide,\n                prevSlide,\n                goToSlide,\n            ],\n        );\n\n        return (\n            <CarouselContext.Provider value={contextValue}>\n                <div className={classNames} {...restProps} ref={ref}>\n                    {children}\n                </div>\n            </CarouselContext.Provider>\n        );\n    },\n);\n\nCarouselRoot.displayName = \"Carousel\";\n\n/**\n * Карусель.\n * @beta\n */\nexport const Carousel = Object.assign(CarouselRoot, {\n    Viewport: CarouselViewport,\n    Track: CarouselTrack,\n    Item: CarouselItem,\n    PrevButton: CarouselPrevButton,\n    NextButton: CarouselNextButton,\n    Indicators: CarouselIndicators,\n});\n"],"names":[],"mappings":"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"}

package/components/Carousel/CarouselButton.js

@@ -0,0 +1,78 @@
+import { jsx } from "react/jsx-runtime";
+import React, { useContext, useCallback } from "react";
+import { c as clsx } from "../../chunks/vendor-DKrjZZwJ.js";
+import { CarouselContext } from "./CarouselContext.js";
+import { useMatchMedia } from "../MediaWidth/useMatchMedia.js";
+import { ButtonIcon } from "../Button/ButtonIcon.js";
+import { CaretupStrokeSrvIcon20, CaretleftStrokeSrvIcon20, CaretdownStrokeSrvIcon20, CaretrightStrokeSrvIcon20 } from "@sberbusiness/icons-next";
+import { ECarouselOrientation } from "./enums.js";
+import { s as styles } from "../../chunks/Carousel.module-COe08s01.js";
+const ORIENTATION_TO_PREV_ICON_MAP = {
+  [ECarouselOrientation.HORIZONTAL]: /* @__PURE__ */ jsx(CaretleftStrokeSrvIcon20, { paletteIndex: 7 }),
+  [ECarouselOrientation.VERTICAL]: /* @__PURE__ */ jsx(CaretupStrokeSrvIcon20, { paletteIndex: 7 })
+};
+const CarouselPrevButton = React.forwardRef(
+  ({ children, className, onClick, ...restProps }, ref) => {
+    const { atStart, prevSlide, orientationRef } = useContext(CarouselContext);
+    const touchDevice = useMatchMedia("(pointer: coarse)");
+    const handleClick = useCallback(
+      (event) => {
+        if (!atStart) prevSlide();
+        onClick == null ? void 0 : onClick(event);
+      },
+      [atStart, prevSlide, onClick]
+    );
+    if (touchDevice) {
+      return null;
+    }
+    return /* @__PURE__ */ jsx(
+      ButtonIcon,
+      {
+        ...restProps,
+        className: clsx(styles.navButton, styles.prev, className),
+        "aria-disabled": atStart,
+        onClick: handleClick,
+        ref,
+        children: children || ORIENTATION_TO_PREV_ICON_MAP[orientationRef.current]
+      }
+    );
+  }
+);
+CarouselPrevButton.displayName = "Carousel.PrevButton";
+const ORIENTATION_TO_NEXT_ICON_MAP = {
+  [ECarouselOrientation.HORIZONTAL]: /* @__PURE__ */ jsx(CaretrightStrokeSrvIcon20, { paletteIndex: 7 }),
+  [ECarouselOrientation.VERTICAL]: /* @__PURE__ */ jsx(CaretdownStrokeSrvIcon20, { paletteIndex: 7 })
+};
+const CarouselNextButton = React.forwardRef(
+  ({ children, className, onClick, ...restProps }, ref) => {
+    const { atEnd, nextSlide, orientationRef } = useContext(CarouselContext);
+    const touchDevice = useMatchMedia("(pointer: coarse)");
+    const handleClick = useCallback(
+      (event) => {
+        if (!atEnd) nextSlide();
+        onClick == null ? void 0 : onClick(event);
+      },
+      [atEnd, nextSlide, onClick]
+    );
+    if (touchDevice) {
+      return null;
+    }
+    return /* @__PURE__ */ jsx(
+      ButtonIcon,
+      {
+        ...restProps,
+        className: clsx(styles.navButton, styles.next, className),
+        "aria-disabled": atEnd,
+        onClick: handleClick,
+        ref,
+        children: children || ORIENTATION_TO_NEXT_ICON_MAP[orientationRef.current]
+      }
+    );
+  }
+);
+CarouselNextButton.displayName = "Carousel.NextButton";
+export {
+  CarouselNextButton,
+  CarouselPrevButton
+};
+//# sourceMappingURL=CarouselButton.js.map

package/components/Carousel/CarouselButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CarouselButton.js","sources":["../../../src/components/Carousel/CarouselButton.tsx"],"sourcesContent":["import React, { useContext, useCallback } from \"react\";\nimport clsx from \"clsx\";\nimport { CarouselContext } from \"./CarouselContext\";\nimport { useMatchMedia } from \"../MediaWidth/useMatchMedia\";\nimport { ButtonIcon, IButtonIconProps } from \"../Button/ButtonIcon\";\nimport {\n    CaretleftStrokeSrvIcon20,\n    CaretupStrokeSrvIcon20,\n    CaretrightStrokeSrvIcon20,\n    CaretdownStrokeSrvIcon20,\n} from \"@sberbusiness/icons-next\";\nimport { ECarouselOrientation } from \"./enums\";\nimport styles from \"./styles/Carousel.module.less\";\n\nconst ORIENTATION_TO_PREV_ICON_MAP: Record<ECarouselOrientation, React.ReactElement> = {\n    [ECarouselOrientation.HORIZONTAL]: <CaretleftStrokeSrvIcon20 paletteIndex={7} />,\n    [ECarouselOrientation.VERTICAL]: <CaretupStrokeSrvIcon20 paletteIndex={7} />,\n};\n\nexport const CarouselPrevButton = React.forwardRef<HTMLButtonElement, IButtonIconProps>(\n    ({ children, className, onClick, ...restProps }, ref) => {\n        const { atStart, prevSlide, orientationRef } = useContext(CarouselContext);\n        const touchDevice = useMatchMedia(\"(pointer: coarse)\");\n\n        const handleClick = useCallback<React.MouseEventHandler<HTMLButtonElement>>(\n            (event) => {\n                if (!atStart) prevSlide();\n                onClick?.(event);\n            },\n            [atStart, prevSlide, onClick],\n        );\n\n        if (touchDevice) {\n            return null;\n        }\n\n        return (\n            <ButtonIcon\n                {...restProps}\n                className={clsx(styles.navButton, styles.prev, className)}\n                aria-disabled={atStart}\n                onClick={handleClick}\n                ref={ref}\n            >\n                {children || ORIENTATION_TO_PREV_ICON_MAP[orientationRef.current]}\n            </ButtonIcon>\n        );\n    },\n);\n\nCarouselPrevButton.displayName = \"Carousel.PrevButton\";\n\nconst ORIENTATION_TO_NEXT_ICON_MAP: Record<ECarouselOrientation, React.ReactElement> = {\n    [ECarouselOrientation.HORIZONTAL]: <CaretrightStrokeSrvIcon20 paletteIndex={7} />,\n    [ECarouselOrientation.VERTICAL]: <CaretdownStrokeSrvIcon20 paletteIndex={7} />,\n};\n\nexport const CarouselNextButton = React.forwardRef<HTMLButtonElement, IButtonIconProps>(\n    ({ children, className, onClick, ...restProps }, ref) => {\n        const { atEnd, nextSlide, orientationRef } = useContext(CarouselContext);\n        const touchDevice = useMatchMedia(\"(pointer: coarse)\");\n\n        const handleClick = useCallback<React.MouseEventHandler<HTMLButtonElement>>(\n            (event) => {\n                if (!atEnd) nextSlide();\n                onClick?.(event);\n            },\n            [atEnd, nextSlide, onClick],\n        );\n\n        if (touchDevice) {\n            return null;\n        }\n\n        return (\n            <ButtonIcon\n                {...restProps}\n                className={clsx(styles.navButton, styles.next, className)}\n                aria-disabled={atEnd}\n                onClick={handleClick}\n                ref={ref}\n            >\n                {children || ORIENTATION_TO_NEXT_ICON_MAP[orientationRef.current]}\n            </ButtonIcon>\n        );\n    },\n);\n\nCarouselNextButton.displayName = \"Carousel.NextButton\";\n"],"names":[],"mappings":";;;;;;;;;AAcA,MAAM,+BAAiF;AAAA,EACnF,CAAC,qBAAqB,UAAU,GAAG,oBAAC,0BAAA,EAAyB,cAAc,GAAG;AAAA,EAC9E,CAAC,qBAAqB,QAAQ,GAAG,oBAAC,wBAAA,EAAuB,cAAc,EAAA,CAAG;AAC9E;AAEO,MAAM,qBAAqB,MAAM;AAAA,EACpC,CAAC,EAAE,UAAU,WAAW,SAAS,GAAG,UAAA,GAAa,QAAQ;AACrD,UAAM,EAAE,SAAS,WAAW,eAAA,IAAmB,WAAW,eAAe;AACzE,UAAM,cAAc,cAAc,mBAAmB;AAErD,UAAM,cAAc;AAAA,MAChB,CAAC,UAAU;AACP,YAAI,CAAC,QAAS,WAAA;AACd,2CAAU;AAAA,MACd;AAAA,MACA,CAAC,SAAS,WAAW,OAAO;AAAA,IAAA;AAGhC,QAAI,aAAa;AACb,aAAO;AAAA,IACX;AAEA,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QACI,GAAG;AAAA,QACJ,WAAW,KAAK,OAAO,WAAW,OAAO,MAAM,SAAS;AAAA,QACxD,iBAAe;AAAA,QACf,SAAS;AAAA,QACT;AAAA,QAEC,UAAA,YAAY,6BAA6B,eAAe,OAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAG5E;AACJ;AAEA,mBAAmB,cAAc;AAEjC,MAAM,+BAAiF;AAAA,EACnF,CAAC,qBAAqB,UAAU,GAAG,oBAAC,2BAAA,EAA0B,cAAc,GAAG;AAAA,EAC/E,CAAC,qBAAqB,QAAQ,GAAG,oBAAC,0BAAA,EAAyB,cAAc,EAAA,CAAG;AAChF;AAEO,MAAM,qBAAqB,MAAM;AAAA,EACpC,CAAC,EAAE,UAAU,WAAW,SAAS,GAAG,UAAA,GAAa,QAAQ;AACrD,UAAM,EAAE,OAAO,WAAW,eAAA,IAAmB,WAAW,eAAe;AACvE,UAAM,cAAc,cAAc,mBAAmB;AAErD,UAAM,cAAc;AAAA,MAChB,CAAC,UAAU;AACP,YAAI,CAAC,MAAO,WAAA;AACZ,2CAAU;AAAA,MACd;AAAA,MACA,CAAC,OAAO,WAAW,OAAO;AAAA,IAAA;AAG9B,QAAI,aAAa;AACb,aAAO;AAAA,IACX;AAEA,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QACI,GAAG;AAAA,QACJ,WAAW,KAAK,OAAO,WAAW,OAAO,MAAM,SAAS;AAAA,QACxD,iBAAe;AAAA,QACf,SAAS;AAAA,QACT;AAAA,QAEC,UAAA,YAAY,6BAA6B,eAAe,OAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAG5E;AACJ;AAEA,mBAAmB,cAAc;"}

package/components/Carousel/CarouselContext.js

@@ -0,0 +1,30 @@
+import React from "react";
+import { ECarouselOrientation, ECarouselScrollMode } from "./enums.js";
+const CarouselContext = React.createContext({
+  gap: 0,
+  orientation: ECarouselOrientation.HORIZONTAL,
+  scrollMode: ECarouselScrollMode.ITEM,
+  offset: 0,
+  activeIndices: [],
+  currentIndex: 0,
+  viewportPaddingStyle: "",
+  atStart: true,
+  atEnd: false,
+  nextSlide: () => {
+  },
+  prevSlide: () => {
+  },
+  goToSlide: () => {
+  },
+  orientationRef: { current: ECarouselOrientation.HORIZONTAL },
+  currentIndexRef: { current: 0 },
+  viewportRef: { current: null },
+  trackRef: { current: null },
+  slideRefs: { current: /* @__PURE__ */ new Map() },
+  offsetRef: { current: 0 },
+  maxOffsetRef: { current: 0 }
+});
+export {
+  CarouselContext
+};
+//# sourceMappingURL=CarouselContext.js.map

package/components/Carousel/CarouselContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CarouselContext.js","sources":["../../../src/components/Carousel/CarouselContext.ts"],"sourcesContent":["import React from \"react\";\nimport { ECarouselOrientation, ECarouselScrollMode } from \"./enums\";\nimport { ICarouselProps } from \"./types\";\n\nexport interface ICarouselContext extends Required<Pick<ICarouselProps, \"gap\" | \"orientation\" | \"scrollMode\">> {\n    offset: number;\n    activeIndices: number[];\n    currentIndex: number;\n    viewportPaddingStyle: string;\n    atStart: boolean;\n    atEnd: boolean;\n    nextSlide: () => void;\n    prevSlide: () => void;\n    goToSlide: (index: number) => void;\n    orientationRef: React.MutableRefObject<ECarouselOrientation>;\n    currentIndexRef: React.MutableRefObject<number>;\n    offsetRef: React.MutableRefObject<number>;\n    maxOffsetRef: React.MutableRefObject<number>;\n    viewportRef: React.MutableRefObject<HTMLDivElement | null>;\n    trackRef: React.MutableRefObject<HTMLDivElement | null>;\n    slideRefs: React.MutableRefObject<Map<number, HTMLDivElement>>;\n}\n\nexport const CarouselContext = React.createContext<ICarouselContext>({\n    gap: 0,\n    orientation: ECarouselOrientation.HORIZONTAL,\n    scrollMode: ECarouselScrollMode.ITEM,\n    offset: 0,\n    activeIndices: [],\n    currentIndex: 0,\n    viewportPaddingStyle: \"\",\n    atStart: true,\n    atEnd: false,\n    nextSlide: () => {},\n    prevSlide: () => {},\n    goToSlide: () => {},\n    orientationRef: { current: ECarouselOrientation.HORIZONTAL },\n    currentIndexRef: { current: 0 },\n    viewportRef: { current: null },\n    trackRef: { current: null },\n    slideRefs: { current: new Map() },\n    offsetRef: { current: 0 },\n    maxOffsetRef: { current: 0 },\n});\n"],"names":[],"mappings":";;AAuBO,MAAM,kBAAkB,MAAM,cAAgC;AAAA,EACjE,KAAK;AAAA,EACL,aAAa,qBAAqB;AAAA,EAClC,YAAY,oBAAoB;AAAA,EAChC,QAAQ;AAAA,EACR,eAAe,CAAA;AAAA,EACf,cAAc;AAAA,EACd,sBAAsB;AAAA,EACtB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB,gBAAgB,EAAE,SAAS,qBAAqB,WAAA;AAAA,EAChD,iBAAiB,EAAE,SAAS,EAAA;AAAA,EAC5B,aAAa,EAAE,SAAS,KAAA;AAAA,EACxB,UAAU,EAAE,SAAS,KAAA;AAAA,EACrB,WAAW,EAAE,SAAS,oBAAI,MAAI;AAAA,EAC9B,WAAW,EAAE,SAAS,EAAA;AAAA,EACtB,cAAc,EAAE,SAAS,EAAA;AAC7B,CAAC;"}