@salutejs/plasma-new-hope 0.326.0-canary.2012.15487817329.0 → 0.326.0-canary.2013.15518408913.0

package/styled-components/es/examples/plasma_b2c/components/Carousel/Carousel.stories.tsx

@@ -2,18 +2,38 @@ import * as React from 'react';
 import type { ComponentProps } from 'react';
 import type { Meta, StoryObj } from '@storybook/react';
 import styled from 'styled-components';
+import { getConfigVariations } from '@salutejs/plasma-sb-utils';
 
 import { WithTheme } from '../../../_helpers';
 
+import { config } from './Carousel.config';
 import { Carousel, CarouselItem } from './Carousel';
 
-type StoryCarouselProps = ComponentProps<typeof Carousel>;
+type StoryCarouselProps = ComponentProps<typeof Carousel> & {
+    slides: number;
+    visibleDots: number;
+    paginationCentered: boolean;
+};
+
+const { views, sizes } = getConfigVariations(config);
 
 const meta: Meta<StoryCarouselProps> = {
     title: 'b2c/Navigation/Carousel',
     component: Carousel,
     decorators: [WithTheme],
     argTypes: {
+        view: {
+            options: views,
+            control: {
+                type: 'select',
+            },
+        },
+        size: {
+            options: sizes,
+            control: {
+                type: 'inline-radio',
+            },
+        },
         align: {
             options: ['center', 'start', 'end'],
             control: {
@@ -23,55 +43,99 @@ const meta: Meta<StoryCarouselProps> = {
         isDragScrollDisabled: {
             control: 'boolean',
         },
+        slides: {
+            control: 'number',
+        },
+        visibleDots: {
+            control: 'number',
+        },
+        paginationCentered: {
+            control: 'boolean',
+        },
     },
     args: {
+        view: 'default',
+        size: 's',
         align: 'center',
         isDragScrollDisabled: false,
+        visibleDots: 6,
+        slides: 10,
+        paginationCentered: false,
     },
     parameters: {
         controls: {
-            include: ['align', 'isDragScrollDisabled'],
+            include: ['visibleDots', 'slides', 'paginationCentered'],
         },
     },
 };
 
 export default meta;
 
-const items = Array(25)
-    .fill({
-        title: 'Заголовок',
-    })
-    .map(({ title }, i) => ({
-        id: i,
-        title: `${title} ${i}`,
-    }));
-
 const StyledCard = styled.div`
+    display: flex;
+    align-items: center;
+    justify-content: center;
     position: relative;
     border-radius: 8px;
-    width: 350px;
-    height: 50px;
-    padding: 8px;
+    width: 500px;
+    height: 370px;
     background-color: #add8e6;
+    font-size: 30px;
 `;
 
-const StoryDefault = ({ align, isDragScrollDisabled }: StoryCarouselProps) => {
+const StoryDefault = ({
+    align,
+    visibleDots,
+    slides,
+    paginationCentered,
+    isDragScrollDisabled,
+    ...rest
+}: StoryCarouselProps) => {
     const [index, setIndex] = React.useState(0);
 
+    const items = Array(slides)
+        .fill(1)
+        .map((_, i) => ({
+            id: i,
+            title: i,
+        }));
+
     return (
-        <Carousel
-            index={index}
-            detectActive
-            onIndexChange={setIndex}
-            scrollAlign={align}
-            isDragScrollDisabled={isDragScrollDisabled}
-        >
-            {items.map((item, i) => (
-                <CarouselItem key={i} style={{ padding: '0 0.5rem' }} scrollSnapAlign={align}>
-                    <StyledCard>{item.title}</StyledCard>
-                </CarouselItem>
-            ))}
-        </Carousel>
+        <>
+            <button type="button" onClick={() => setIndex((prev) => Math.max(prev - 1, 0))}>
+                prev
+            </button>
+            <button type="button" onClick={() => setIndex((prev) => Math.min(prev + 1, slides - 1))}>
+                next
+            </button>
+            <br />
+            <span>текущий индекс: {index}</span>
+
+            <br />
+            <br />
+
+            <div style={{ width: '800px' }}>
+                <Carousel
+                    index={index}
+                    onIndexChange={setIndex}
+                    detectActive
+                    scrollAlign={align}
+                    isDragScrollDisabled={isDragScrollDisabled}
+                    gap="20px"
+                    paginationOptions={{
+                        visibleDots,
+                        centered: paginationCentered,
+                    }}
+                    {...rest}
+                >
+                    {items.map((item, i) => (
+                        <CarouselItem key={i} scrollSnapAlign={align}>
+                            <StyledCard>{item.title}</StyledCard>
+                        </CarouselItem>
+                    ))}
+                </Carousel>
+            </div>
+        </>
     );
 };
 

package/styled-components/es/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx

@@ -14,7 +14,6 @@ const onChangeValue = action('onChangeValue');
 const onCommitDate = action('onCommitDate');
 const onBlur = action('onBlur');
 const onFocus = action('onFocus');
-const onToggle = action('onToggle');
 
 const onChangeFirstValue = action('onChangeFirstValue');
 const onChangeSecondValue = action('onChangeSecondValue');
@@ -119,10 +118,7 @@ const StoryDefault = ({
             contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
             onBlur={onBlur}
             onFocus={onFocus}
-            onToggle={(is) => {
-                setIsOpen(is);
-                onToggle(is);
-            }}
+            onToggle={(is) => setIsOpen(is)}
             onChangeValue={onChangeValue}
             onCommitDate={onCommitDate}
             lang={lang}
@@ -166,7 +162,6 @@ export const Default: StoryObj<StoryPropsDefault> = {
         includeEdgeDates: true,
         min: new Date(2024, 1, 1),
         max: new Date(2024, 12, 29),
-        closeAfterDateSelect: true,
         maskWithFormat: true,
         required: false,
         requiredPlacement: 'right',
@@ -267,10 +262,7 @@ const StoryRange = ({
             secondTextfieldTextBefore={
                 showDefaultTextBefore ? secondTextfieldTextBefore || 'ПО' : secondTextfieldTextBefore
             }
-            onToggle={(is) => {
-                setIsOpen(is);
-                onToggle(is);
-            }}
+            onToggle={(is) => setIsOpen(is)}
             onChangeFirstValue={onChangeFirstValue}
             onChangeSecondValue={onChangeSecondValue}
             lang={lang}
@@ -312,11 +304,11 @@ export const Range: StoryObj<StoryPropsRange> = {
         calendarContainerHeight: 0,
         stretched: false,
         isDoubleCalendar: false,
+        closeAfterDateSelect: true,
         dividerVariant: 'dash',
         includeEdgeDates: true,
         min: new Date(2024, 1, 1),
         max: new Date(2024, 12, 29),
-        closeAfterDateSelect: true,
         renderFromDate: new Date(2024, 4, 14),
         maskWithFormat: false,
         required: false,
@@ -418,7 +410,6 @@ export const Deferred: StoryObj<StoryPropsDefault> = {
         includeEdgeDates: true,
         min: new Date(2024, 1, 1),
         max: new Date(2024, 12, 29),
-        closeAfterDateSelect: true,
         maskWithFormat: false,
         required: false,
         requiredPlacement: 'right',

package/styled-components/es/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx

@@ -118,10 +118,7 @@ const StoryDefault = ({
             contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
             onBlur={onBlur}
             onFocus={onFocus}
-            onToggle={(is) => {
-                setIsOpen(is);
-                onToggle(is);
-            }}
+            onToggle={(is) => setIsOpen(is)}
             onChangeValue={onChangeValue}
             onCommitDate={onCommitDate}
             lang={lang}
@@ -165,7 +162,6 @@ export const Default: StoryObj<StoryPropsDefault> = {
         includeEdgeDates: true,
         min: new Date(2024, 1, 1),
         max: new Date(2024, 12, 29),
-        closeAfterDateSelect: true,
         maskWithFormat: false,
         required: false,
         requiredPlacement: 'right',
@@ -266,10 +262,7 @@ const StoryRange = ({
             secondTextfieldTextBefore={
                 showDefaultTextBefore ? secondTextfieldTextBefore || 'ПО' : secondTextfieldTextBefore
             }
-            onToggle={(is) => {
-                setIsOpen(is);
-                onToggle(is);
-            }}
+            onToggle={(is) => setIsOpen(is)}
             onChangeFirstValue={onChangeFirstValue}
             onChangeSecondValue={onChangeSecondValue}
             lang={lang}
@@ -311,11 +304,11 @@ export const Range: StoryObj<StoryPropsRange> = {
         calendarContainerHeight: 0,
         stretched: false,
         isDoubleCalendar: false,
+        closeAfterDateSelect: true,
         dividerVariant: 'dash',
         includeEdgeDates: true,
         min: new Date(2024, 1, 1),
         max: new Date(2024, 12, 29),
-        closeAfterDateSelect: true,
         renderFromDate: new Date(2024, 4, 14),
         maskWithFormat: false,
         required: false,
@@ -417,7 +410,6 @@ export const Deferred: StoryObj<StoryPropsDefault> = {
         includeEdgeDates: true,
         min: new Date(2024, 1, 1),
         max: new Date(2024, 12, 29),
-        closeAfterDateSelect: true,
         maskWithFormat: false,
         required: false,
         requiredPlacement: 'right',

package/styled-components/es/hooks/index.js

@@ -3,5 +3,6 @@ export { useFocusTrap } from "./useFocusTrap";
 export { usePreviousValue } from "./usePreviousValue";
 export { useForceUpdate } from "./useForceUpdate";
 export { useDidMountEffect } from "./useDidMountEffect";
+export { useDidMountLayoutEffect } from "./useDidMountLayoutEffect";
 export { useOutsideClick } from "./useOutsideClick";
 export { useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect";

package/styled-components/es/hooks/useDidMountLayoutEffect.js

@@ -0,0 +1,11 @@
+import { useLayoutEffect, useRef } from 'react';
+export var useDidMountLayoutEffect = function useDidMountLayoutEffect(fn, inputs) {
+  var didMountRef = useRef(false);
+  useLayoutEffect(function () {
+    if (didMountRef.current) {
+      fn();
+    } else {
+      didMountRef.current = true;
+    }
+  }, inputs);
+};

package/types/components/Carousel/CarouselNew/Carousel.d.ts

@@ -0,0 +1,32 @@
+import { RootProps } from '../../../../src/engines';
+import React from 'react';
+import { CarouselNewProps } from './Carousel.types';
+/**
+ * Компонент для создания списков с прокруткой.
+ */
+export declare const carouselNewRoot: (Root: RootProps<HTMLDivElement, CarouselNewProps>) => React.ForwardRefExoticComponent<Omit<import("./Carousel.types").BasicProps & (import("./Carousel.types").DetectionProps | import("./Carousel.types").NoDetectionProps), "throttleMs" | "axis" | "animatedScrollByIndex" | "debounceMs"> & {
+    ariaLive?: "off" | "polite";
+    isDragScrollDisabled?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+export declare const carouselNewConfig: {
+    name: string;
+    tag: string;
+    layout: (Root: RootProps<HTMLDivElement, CarouselNewProps>) => React.ForwardRefExoticComponent<Omit<import("./Carousel.types").BasicProps & (import("./Carousel.types").DetectionProps | import("./Carousel.types").NoDetectionProps), "throttleMs" | "axis" | "animatedScrollByIndex" | "debounceMs"> & {
+        ariaLive?: "off" | "polite";
+        isDragScrollDisabled?: boolean;
+    } & React.RefAttributes<HTMLDivElement>>;
+    base: import("@linaria/core").LinariaClassName;
+    variations: {
+        view: {
+            css: import("@linaria/core").LinariaClassName;
+        };
+        size: {
+            css: import("@linaria/core").LinariaClassName;
+        };
+    };
+    defaults: {
+        view: string;
+        size: string;
+    };
+};
+//# sourceMappingURL=Carousel.d.ts.map

package/types/components/Carousel/CarouselNew/Carousel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Carousel.d.ts","sourceRoot":"","sources":["../../../../src/components/Carousel/CarouselNew/Carousel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,KAAsD,MAAM,OAAO,CAAC;AAO3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAKpD;;GAEG;AACH,eAAO,MAAM,eAAe,SAAU,SAAS,CAAC,cAAc,EAAE,gBAAgB,CAAC;;;wCA6E5E,CAAC;AAEN,eAAO,MAAM,iBAAiB;;;mBA/EQ,SAAS,CAAC,cAAc,EAAE,gBAAgB,CAAC;;;;;;;;;;;;;;;;;CAgGhF,CAAC"}

package/types/components/Carousel/CarouselNew/Carousel.styles.d.ts

@@ -0,0 +1,15 @@
+import { CSSProperties } from 'react';
+export declare const base: import("@linaria/core").LinariaClassName;
+/**
+ * Компонент применяется, если требуется компенсировать отступы контейнера в сетке.
+ * При обертывании вокруг ``Carousel``, добавляет карусели и ее прокрутке дополнительные отступы.
+ * Стилизованный компонент, обладающий всеми свойствами ``div``.
+ */
+export declare const CarouselGridWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const CarouselWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    scrollSnapType?: "mandatory" | "proximity" | "none";
+}>;
+export declare const CarouselTrack: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    gap?: CSSProperties["gap"];
+}>;
+//# sourceMappingURL=Carousel.styles.d.ts.map

package/types/components/Carousel/CarouselNew/Carousel.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Carousel.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Carousel/CarouselNew/Carousel.styles.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,eAAO,MAAM,IAAI,0CAehB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,qKAI/B,CAAC;AAEF,eAAO,MAAM,eAAe;qBAAiC,WAAW,GAAG,WAAW,GAAG,MAAM;EAyB9F,CAAC;AAEF,eAAO,MAAM,aAAa;UAAsB,aAAa,CAAC,KAAK,CAAC;EAInE,CAAC"}

package/types/components/Carousel/CarouselNew/Carousel.tokens.d.ts

@@ -0,0 +1,16 @@
+export declare const classes: {
+    dot: string;
+    active: string;
+    animating: string;
+    animateIn: string;
+    animateOut: string;
+    temporaryNatural: string;
+    shrinking: string;
+    availableDotsLeft: string;
+    availableDotsRight: string;
+};
+export declare const tokens: {
+    paginationDotBackground: string;
+    paginationDotActiveBackground: string;
+};
+//# sourceMappingURL=Carousel.tokens.d.ts.map

package/types/components/Carousel/CarouselNew/Carousel.tokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Carousel.tokens.d.ts","sourceRoot":"","sources":["../../../../src/components/Carousel/CarouselNew/Carousel.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;CAUnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;CAGlB,CAAC"}

package/types/components/Carousel/CarouselNew/Carousel.types.d.ts

@@ -0,0 +1,167 @@
+import type { HTMLAttributes, CSSProperties } from 'react';
+import { AsProps } from '../../../../src/types';
+import type { HTMLAttributesWithoutOnChange } from '../../../engines/types';
+export type SnapType = 'mandatory' | 'proximity' | 'none';
+export type SnapAlign = 'start' | 'center' | 'end';
+export type SnapStop = 'normal' | 'always';
+export type ScrollAxis = 'x' | 'y';
+export type ScrollAlign = 'start' | 'center' | 'end' | 'activeDirection';
+export interface BasicProps extends AsProps, HTMLAttributes<HTMLDivElement> {
+    /**
+     * Индекс текущего элемента
+     */
+    index: number;
+    /**
+     * Ось прокрутки
+     */
+    axis: ScrollAxis;
+    /**
+     * Тип CSS Scroll Snap
+     */
+    scrollSnapType?: SnapType;
+    /**
+     * Центрирование активного элемента при скролле
+     */
+    scrollAlign?: ScrollAlign;
+    /**
+     * Throttling внутренних обработчиков события onScroll
+     */
+    throttleMs?: number;
+    /**
+     * Debounce внутренних обработчиков события onScroll
+     */
+    debounceMs?: number;
+    /**
+     * Сменить WAI-ARIA Role списка.
+     */
+    listRole?: string;
+    /**
+     * Сменить WAI-ARIA Label списка.
+     */
+    listAriaLabel?: string;
+    /**
+     * Внутренний отступ между слайдами.
+     */
+    gap?: CSSProperties['gap'];
+    paginationOptions?: {
+        disabled?: boolean;
+        visibleDots?: number;
+        centered?: boolean;
+    };
+    /**
+     * Размер контрола.
+     */
+    size?: string;
+    /**
+     * Вид контрола.
+     * @default default
+     */
+    view?: string;
+}
+export interface DetectionProps {
+    /**
+     * Вычислять активный элемент
+     */
+    detectActive: true;
+    /**
+     * Пороговое значение определения центрального элемента (0-1)
+     */
+    detectThreshold: number;
+    /**
+     * Коллбек изменения индекса
+     */
+    onIndexChange?: (index: number) => void;
+}
+export interface NoDetectionProps {
+    detectActive?: false;
+    detectThreshold?: never;
+    onIndexChange?: never;
+    onDetectActiveItem?: never;
+    scaleCallback?: never;
+    scaleResetCallback?: never;
+}
+type CarouselPropsBase = BasicProps & (DetectionProps | NoDetectionProps);
+export type CarouselNewProps = Omit<CarouselPropsBase, 'axis' | 'animatedScrollByIndex' | 'throttleMs' | 'debounceMs'> & {
+    /**
+     * При значении `polite` скринридер будет объявлять переключаемые слайды.
+     */
+    ariaLive?: 'off' | 'polite';
+    isDragScrollDisabled?: boolean;
+};
+export type CarouselItemProps = {
+    scrollSnapAlign?: SnapAlign;
+    scrollSnapStop?: SnapStop;
+} & AsProps & HTMLAttributes<HTMLDivElement>;
+interface CustomPaginationDots {
+    /**
+     * Размер контрола.
+     */
+    size?: string;
+    /**
+     * Вид контрола.
+     * @default default
+     */
+    view?: string;
+    /**
+     * Отображение активного элемента
+     * @default 'dot'
+     */
+    activeElementView?: 'dot' | 'line';
+    /**
+     * Ориентация элементов
+     */
+    orientation?: 'horizontal' | 'vertical';
+    /**
+     * Центрирует элемент по горизонтали на всю ширину контейнера
+     * @default false
+     */
+    centered?: boolean;
+    /**
+     * Выбранная страница
+     */
+    value?: number;
+    /**
+     * Количество страниц
+     */
+    count?: number;
+    /**
+     * Максимальное количество видимых точек, для условий count > visibleCount
+     */
+    visibleCount?: number;
+    /**
+     * Обработчик клика по точке
+     */
+    onChange?: (index: number) => void;
+}
+export interface PaginationDotsProps extends HTMLAttributesWithoutOnChange<HTMLDivElement>, CustomPaginationDots {
+}
+export interface DotsProps {
+    /**
+     * Выбранная страница
+     */
+    index: number;
+    /**
+     * Обработчик изменения индекса
+     */
+    onChange: (index: number) => void;
+    /**
+     * Количество страниц
+     */
+    count: number;
+    /**
+     * Максимальное количество видимых точек, для условий count > visibleCount
+     */
+    visibleCount: number;
+    /**
+     * Отображение активного элемента
+     * @default 'dot'
+     */
+    activeElementView?: 'dot' | 'line';
+    /**
+     * Центрирует элемент по горизонтали на всю ширину контейнера
+     * @default false
+     */
+    centered?: boolean;
+}
+export {};
+//# sourceMappingURL=Carousel.types.d.ts.map

package/types/components/Carousel/CarouselNew/Carousel.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Carousel.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Carousel/CarouselNew/Carousel.types.ts"],"names":[],"mappings":"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"}

package/types/components/Carousel/CarouselNew/hooks/useCarousel.d.ts

@@ -0,0 +1,61 @@
+import React from 'react';
+import { CarouselNewProps as CarouselProps, ScrollAlign, ScrollAxis } from '../Carousel.types';
+/**
+ * Подсчет смещения из-за паддингов.
+ */
+export declare const getCalculatedOffset: (scrollEl: Element, trackEl: Element, axis: ScrollAxis) => number;
+/**
+ * Подсчет скролла до переданного индекса.
+ */
+export declare const getCalculatedPos: ({ scrollEl, items, axis, index, offset, scrollAlign, }: {
+    scrollEl: HTMLElement;
+    items: HTMLCollectionOf<HTMLElement>;
+    axis: ScrollAxis;
+    index: number;
+    offset: number;
+    scrollAlign: ScrollAlign;
+}) => number;
+declare const tfs: {
+    linear: (t: number) => number;
+    easeIn: (t: number) => number;
+    easeOut: (t: number) => number;
+    easeInOut: (t: number) => number;
+};
+export type TimingFunction = keyof typeof tfs;
+/**
+ * Плавная прокрутка по горизонтали
+ * @param {Element} elem
+ * @param {number} pos
+ * @param {number} duration
+ * @param {string} timingFunction
+ */
+export declare const animatedScrollToX: (elem: Element, pos: number, duration?: number, timingFunction?: TimingFunction) => void;
+/**
+ * Прокрутка к указанной позиции с анимацией или без.
+ */
+export declare const scrollToPos: ({ scrollEl, pos, axis, animated, duration, timingFunction, }: {
+    scrollEl: HTMLElement;
+    pos: number;
+    axis: ScrollAxis;
+    animated?: boolean;
+    duration?: number;
+    timingFunction?: TimingFunction;
+}) => void;
+/**
+ * Получить позицию (слот) айтема в каруселе.
+ * Каждый айтем имеет свой слот относительно вьюпорта карусели.
+ */
+export declare const getItemSlot: (itemIndex: number, itemEnd: number, itemSize: number, scrollStart: number, scrollSize: number, scrollAlign: ScrollAlign, prevIndex?: number, offset?: number) => number | null;
+export declare function getCarouselItems(track: HTMLElement): HTMLCollectionOf<HTMLElement>;
+export declare function useDebouncedFunction(func: (...args: any) => any, delay: number, cleanUp?: boolean): (...args: any[]) => void;
+type UseCarouselOptions = Pick<CarouselProps, 'index' | 'scrollAlign' | 'detectActive' | 'detectThreshold' | 'onIndexChange'> & {
+    throttleMs?: number;
+    debounceMs?: number;
+};
+type UseCarouselHookResult = {
+    scrollRef: React.MutableRefObject<HTMLElement | null>;
+    trackRef: React.MutableRefObject<HTMLElement | null>;
+};
+export declare const useCarousel: ({ index, detectActive, detectThreshold, scrollAlign, onIndexChange, throttleMs, debounceMs, }: UseCarouselOptions) => UseCarouselHookResult;
+export {};
+//# sourceMappingURL=useCarousel.d.ts.map

package/types/components/Carousel/CarouselNew/hooks/useCarousel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCarousel.d.ts","sourceRoot":"","sources":["../../../../../src/components/Carousel/CarouselNew/hooks/useCarousel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAGvE,OAAO,EAAE,gBAAgB,IAAI,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/F;;GAEG;AACH,eAAO,MAAM,mBAAmB,aAAc,OAAO,WAAW,OAAO,QAAQ,UAAU,WAGxF,CAAC;AAyCF;;GAEG;AACH,eAAO,MAAM,gBAAgB,2DAO1B;IACC,QAAQ,EAAE,WAAW,CAAC;IACtB,KAAK,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACrC,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,WAAW,CAAC;CAC5B,WAqCA,CAAC;AAKF,QAAA,MAAM,GAAG;gBACO,MAAM;gBAEN,MAAM;iBAEL,MAAM;mBACJ,MAAM;CACxB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,GAAG,CAAC;AAE9C;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,SACpB,OAAO,OACR,MAAM,aACD,MAAM,mBACA,cAAc,KAC/B,IAeF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,WAAW,iEAOrB;IACC,QAAQ,EAAE,WAAW,CAAC;IACtB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,UAAU,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,cAAc,CAAC;CACnC,SAQA,CAAC;AAIF;;;GAGG;AACH,eAAO,MAAM,WAAW,cACT,MAAM,WACR,MAAM,YACL,MAAM,eACH,MAAM,cACP,MAAM,eACL,WAAW,uDAkC3B,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,WAAW,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAElF;AAED,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,KAAK,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,OAAO,aAmB7E,GAAG,EAAE,UAIzB;AAED,KAAK,kBAAkB,GAAG,IAAI,CAC1B,aAAa,EACb,OAAO,GAAG,aAAa,GAAG,cAAc,GAAG,iBAAiB,GAAG,eAAe,CACjF,GAAG;IACA,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,KAAK,qBAAqB,GAAG;IACzB,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACtD,QAAQ,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACxD,CAAC;AAKF,eAAO,MAAM,WAAW,kGAQrB,kBAAkB,KAAG,qBA6LvB,CAAC"}

package/types/components/Carousel/CarouselNew/hooks/useDragScroll.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDragScroll.d.ts","sourceRoot":"","sources":["../../../../../src/components/Carousel/CarouselNew/hooks/useDragScroll.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,aAAa,GAAI,CAAC,SAAS,WAAW,aACpC,KAAK,CAAC,gBAAgB,CAAC,CAAC,GAAG,IAAI,CAAC,yBACpB,OAAO,SAwDjC,CAAC"}

package/types/components/Carousel/CarouselNew/ui/Dots/Dots.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { DotsProps } from '../../Carousel.types';
+export declare const Dots: React.FC<DotsProps>;
+//# sourceMappingURL=Dots.d.ts.map

package/types/components/Carousel/CarouselNew/ui/Dots/Dots.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dots.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Carousel/CarouselNew/ui/Dots/Dots.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAI7D,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AASjD,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAsPpC,CAAC"}

package/types/components/Carousel/CarouselNew/ui/Dots/Dots.styles.d.ts

@@ -0,0 +1,6 @@
+export declare const Wrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const TransitionWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const DotWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const LeftAnimationWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const RightAnimationWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+//# sourceMappingURL=Dots.styles.d.ts.map

package/types/components/Carousel/CarouselNew/ui/Dots/Dots.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dots.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Carousel/CarouselNew/ui/Dots/Dots.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,OAAO,qKAOnB,CAAC;AAEF,eAAO,MAAM,iBAAiB,qKAiD7B,CAAC;AAEF,eAAO,MAAM,UAAU,qKAkBtB,CAAC;AAEF,eAAO,MAAM,oBAAoB,qKA0ChC,CAAC;AAEF,eAAO,MAAM,qBAAqB,qKA0CjC,CAAC"}

package/types/components/Carousel/CarouselNew/ui/Dots/utils/index.d.ts

@@ -0,0 +1,4 @@
+export declare const getInitialData: (index: number, count: number, visibleCount: number) => [number, number];
+export declare const getActiveIndex: (index: number, isRightDirection: boolean, count: number, visibleCount: number) => number;
+export declare const getTargetIndex: (index: number, prevIndex: number, prevActiveIndex: number, diffDotsRange: number) => number;
+//# sourceMappingURL=index.d.ts.map

package/types/components/Carousel/CarouselNew/ui/Dots/utils/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/Carousel/CarouselNew/ui/Dots/utils/index.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc,UAAW,MAAM,SAAS,MAAM,gBAAgB,MAAM,KAAG,CAAC,MAAM,EAAE,MAAM,CAiBlG,CAAC;AAEF,eAAO,MAAM,cAAc,UAChB,MAAM,oBACK,OAAO,SAClB,MAAM,gBACC,MAAM,KACrB,MAcF,CAAC;AAEF,eAAO,MAAM,cAAc,UAChB,MAAM,aACF,MAAM,mBACA,MAAM,iBACR,MAAM,KACtB,MAUF,CAAC"}

package/types/components/Carousel/CarouselNew/ui/Item/Item.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { CarouselItemProps } from '../../Carousel.types';
+export declare const CarouselItem: React.FC<CarouselItemProps>;
+//# sourceMappingURL=Item.d.ts.map