@salutejs/plasma-new-hope 0.326.0-canary.2013.15538813402.0 → 0.326.0-canary.2013.15555525626.0

package/styled-components/es/components/Carousel/CarouselNew/hooks/useCarousel.js

@@ -3,8 +3,8 @@ import throttle from 'lodash.throttle';
 /**
  * Подсчет смещения из-за паддингов.
  */
-export var getCalculatedOffset = function getCalculatedOffset(scrollEl, trackEl, axis) {
-  var paddingProp = axis === 'x' ? 'paddingLeft' : 'paddingTop';
+export var getCalculatedOffset = function getCalculatedOffset(scrollEl, trackEl) {
+  var paddingProp = 'paddingLeft';
   return parseInt(getComputedStyle(scrollEl)[paddingProp], 10) + parseInt(getComputedStyle(trackEl)[paddingProp], 10);
 };
 var positionModByScrollAlign = function positionModByScrollAlign(_ref) {
@@ -13,11 +13,9 @@ var positionModByScrollAlign = function positionModByScrollAlign(_ref) {
     carouselSize = _ref.carouselSize,
     itemSize = _ref.itemSize,
     offset = _ref.offset,
-    scrollStart = _ref.scrollStart,
-    axis = _ref.axis;
+    scrollStart = _ref.scrollStart;
   if (scrollAlign === 'start') {
-    var inaccuracy = 1;
-    var paddingOffset = axis === 'y' ? offset - itemSize / 2 + inaccuracy : 0;
+    var paddingOffset = 0;
     return position + paddingOffset;
   }
   if (scrollAlign === 'center') {
@@ -41,47 +39,30 @@ var positionModByScrollAlign = function positionModByScrollAlign(_ref) {
  * Подсчет скролла до переданного индекса.
  */
 export var getCalculatedPos = function getCalculatedPos(_ref2) {
+  var _items$item$offsetWid2, _items$item2;
   var scrollEl = _ref2.scrollEl,
     items = _ref2.items,
-    axis = _ref2.axis,
     index = _ref2.index,
     offset = _ref2.offset,
     scrollAlign = _ref2.scrollAlign;
   var position = scrollAlign === 'center' ? offset : 0;
-  var carouselSize;
-  var itemSize;
-  var scrollStart;
   if (items.item(index) === null) {
     return position;
   }
   for (var i = 0; i < index; i++) {
-    if (axis === 'x') {
-      var _items$item$offsetWid, _items$item;
-      position += (_items$item$offsetWid = (_items$item = items.item(i)) === null || _items$item === void 0 ? void 0 : _items$item.offsetWidth) !== null && _items$item$offsetWid !== void 0 ? _items$item$offsetWid : 0;
-    } else {
-      var _items$item$offsetHei, _items$item2;
-      position += (_items$item$offsetHei = (_items$item2 = items.item(i)) === null || _items$item2 === void 0 ? void 0 : _items$item2.offsetHeight) !== null && _items$item$offsetHei !== void 0 ? _items$item$offsetHei : 0;
-    }
-  }
-  if (axis === 'x') {
-    var _items$item$offsetWid2, _items$item3;
-    carouselSize = scrollEl.offsetWidth;
-    itemSize = (_items$item$offsetWid2 = (_items$item3 = items.item(index)) === null || _items$item3 === void 0 ? void 0 : _items$item3.offsetWidth) !== null && _items$item$offsetWid2 !== void 0 ? _items$item$offsetWid2 : 0;
-    scrollStart = scrollEl.scrollLeft;
-  } else {
-    var _items$item$offsetHei2, _items$item4;
-    carouselSize = scrollEl.offsetHeight;
-    itemSize = (_items$item$offsetHei2 = (_items$item4 = items.item(index)) === null || _items$item4 === void 0 ? void 0 : _items$item4.offsetHeight) !== null && _items$item$offsetHei2 !== void 0 ? _items$item$offsetHei2 : 0;
-    scrollStart = scrollEl.scrollTop;
+    var _items$item$offsetWid, _items$item;
+    position += (_items$item$offsetWid = (_items$item = items.item(i)) === null || _items$item === void 0 ? void 0 : _items$item.offsetWidth) !== null && _items$item$offsetWid !== void 0 ? _items$item$offsetWid : 0;
   }
+  var carouselSize = scrollEl.offsetWidth;
+  var itemSize = (_items$item$offsetWid2 = (_items$item2 = items.item(index)) === null || _items$item2 === void 0 ? void 0 : _items$item2.offsetWidth) !== null && _items$item$offsetWid2 !== void 0 ? _items$item$offsetWid2 : 0;
+  var scrollStart = scrollEl.scrollLeft;
   return positionModByScrollAlign({
     scrollAlign: scrollAlign,
     position: position,
     carouselSize: carouselSize,
     itemSize: itemSize,
     offset: offset,
-    scrollStart: scrollStart,
-    axis: axis
+    scrollStart: scrollStart
   });
 };
 var DEFAULT_DURATION = 300;
@@ -135,11 +116,10 @@ export var animatedScrollToX = function animatedScrollToX(elem, pos) {
 export var scrollToPos = function scrollToPos(_ref3) {
   var scrollEl = _ref3.scrollEl,
     pos = _ref3.pos,
-    axis = _ref3.axis,
     animated = _ref3.animated,
     duration = _ref3.duration,
     timingFunction = _ref3.timingFunction;
-  if (axis === 'x' && Math.abs(pos - scrollEl.scrollLeft) > 1) {
+  if (Math.abs(pos - scrollEl.scrollLeft) > 1) {
     if (animated) {
       animatedScrollToX(scrollEl, pos, duration, timingFunction);
     } else {
@@ -327,7 +307,7 @@ export var useCarousel = function useCarousel(_ref4) {
         }
       }
     }, throttleMs);
-  }, [axis, debouncedOnIndexChange, detectActive, detectThreshold, scrollAlign, throttleMs]);
+  }, [debouncedOnIndexChange, detectActive, detectThreshold, scrollAlign, throttleMs]);
 
   /**
    * Прокрутка до нужной позиции индекса.
@@ -341,21 +321,19 @@ export var useCarousel = function useCarousel(_ref4) {
         pos: getCalculatedPos({
           scrollEl: scrollEl,
           items: items,
-          axis: axis,
           index: i,
           offset: offset.current,
           scrollAlign: scrollAlign
-        }),
-        axis: axis
+        })
       });
       prevIndex.current = i;
     }
-  }, [axis, scrollAlign]);
+  }, [scrollAlign]);
   useEffect(function () {
     if (scrollRef.current && trackRef.current) {
-      offset.current = getCalculatedOffset(scrollRef.current, trackRef.current, axis);
+      offset.current = getCalculatedOffset(scrollRef.current, trackRef.current);
     }
-  }, [axis]);
+  }, []);
 
   /**
    * Операции на маунте/анмаунте компонента.
@@ -373,27 +351,6 @@ export var useCarousel = function useCarousel(_ref4) {
     };
   }, [throttledDetectActiveItem]);
 
-  /**
-   * Нужно вызвать только при первом рендере
-   */
-  // useEffect(() => {
-  //     requestAnimationFrame(() => {
-  //         /**
-  //          * Прокрутка до начального индекса.
-  //          */
-  //         toIndex(index);
-  //
-  //         /**
-  //          * Если на момент запуска карусель уже находится на нужной позиции,
-  //          * событие скролла не произойдет, не сработает и определение центра,
-  //          * необходимо вызвать его вручную.
-  //          */
-  //         throttledDetectActiveItem();
-  //     });
-  //
-  //     // eslint-disable-next-line react-hooks/exhaustive-deps
-  // }, []);
-
   /**
    * Прокрутка до нужной позиции индекса, если индекс изменился.
    */

package/styled-components/es/components/Carousel/CarouselNew/ui/index.js

@@ -1,2 +1 @@
-export * from "./Item/Item";
 export * from "./Dots/Dots";

package/styled-components/es/components/Carousel/CarouselOld/CarouselItem.js

@@ -6,7 +6,7 @@ import React from 'react';
 import styled from 'styled-components';
 var StyledItem = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-1b1k2uh-0"
-})(["scroll-snap-align:", ";scroll-snap-stop:", ";"], function (_ref) {
+})(["scroll-snap-align:", ";scroll-snap-stop:", ";padding:0 var(--temporary-carousel-padding);"], function (_ref) {
   var scrollSnapAlign = _ref.scrollSnapAlign;
   return scrollSnapAlign || 'none';
 }, function (_ref2) {

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

@@ -4,4 +4,4 @@ export { CarouselItem } from "./CarouselOld/CarouselItem";
 
 // New Carousel
 export { carouselNewConfig, carouselNewRoot } from "./CarouselNew/Carousel";
-export { tokens as carouselTokens } from "./CarouselNew/Carousel.tokens";
+export { tokens as carouselNewTokens } from "./CarouselNew/Carousel.tokens";

package/styled-components/es/examples/plasma_b2c/components/Carousel/Carousel.config.js

@@ -1,9 +1,9 @@
 import { css } from 'styled-components';
-import { carouselTokens as tokens } from "../../../../components/Carousel";
+import { carouselNewTokens as tokens } from "../../../../components/Carousel";
 export var config = {
   defaults: {
     view: 'default',
-    size: 'm'
+    size: 's'
   },
   variations: {
     view: {

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

@@ -12,6 +12,7 @@ import { Carousel, CarouselItem } from './Carousel';
 type StoryCarouselProps = ComponentProps<typeof Carousel> & {
     slides: number;
     visibleDots: number;
+    paginationDisabled: boolean;
     paginationCentered: boolean;
 };
 
@@ -35,40 +36,48 @@ const meta: Meta<StoryCarouselProps> = {
             },
         },
         align: {
-            options: ['start', 'center', 'end'],
+            options: ['start', 'center', 'end', 'activeDirection'],
             control: {
                 type: 'inline-radio',
             },
         },
-        isDragScrollDisabled: {
-            control: 'boolean',
-        },
         slides: {
             control: 'number',
         },
         visibleDots: {
             control: 'number',
         },
-        paginationCentered: {
+        controlArrowsDisabled: {
             control: 'boolean',
         },
-        gap: {
-            control: 'text',
+        paginationDisabled: {
+            control: 'boolean',
+        },
+        paginationCentered: {
+            control: 'boolean',
         },
     },
     args: {
         view: 'default',
         size: 's',
         align: 'center',
-        isDragScrollDisabled: false,
         visibleDots: 6,
         slides: 10,
+        controlArrowsDisabled: false,
+        paginationDisabled: false,
         paginationCentered: false,
-        gap: '20px',
     },
     parameters: {
         controls: {
-            include: ['align', 'isDragScrollDisabled', 'visibleDots', 'slides', 'paginationCentered', 'gap'],
+            include: [
+                'align',
+                'visibleDots',
+                'slides',
+                'controlArrowsDisabled',
+                'paginationDisabled',
+                'paginationCentered',
+                'gap',
+            ],
         },
     },
 };
@@ -81,7 +90,7 @@ const StyledCard = styled.div`
     justify-content: center;
     position: relative;
     border-radius: 8px;
-    width: 500px;
+    width: 400px;
     height: 370px;
     background-color: #add8e6;
     font-size: 30px;
@@ -91,9 +100,8 @@ const StoryDefault = ({
     align,
     visibleDots,
     slides,
+    paginationDisabled,
     paginationCentered,
-    isDragScrollDisabled,
-    gap,
     ...rest
 }: StoryCarouselProps) => {
     const items = Array(slides)
@@ -109,9 +117,8 @@ const StoryDefault = ({
                 <Carousel
                     detectActive
                     scrollAlign={align}
-                    isDragScrollDisabled={isDragScrollDisabled}
-                    gap={gap}
                     paginationOptions={{
+                        disabled: paginationDisabled,
                         visibleDots,
                         centered: paginationCentered,
                     }}

package/styled-components/es/examples/plasma_web/components/Carousel/Carousel.config.js

@@ -1,4 +1,16 @@
+import { css } from 'styled-components';
+import { carouselNewTokens as tokens } from "../../../../components/Carousel";
 export var config = {
-  defaults: {},
-  variations: {}
+  defaults: {
+    view: 'default',
+    size: 's'
+  },
+  variations: {
+    view: {
+      "default": /*#__PURE__*/css(["", ":var(--surface-transparent-tertiary);", ":var(--surface-solid-default);"], tokens.paginationDotBackground, tokens.paginationDotActiveBackground)
+    },
+    size: {
+      s: /*#__PURE__*/css([""])
+    }
+  }
 };

package/styled-components/es/examples/plasma_web/components/Carousel/Carousel.js

@@ -1,6 +1,6 @@
-import { carouselConfig, CarouselItem } from "../../../../components/Carousel";
+import { carouselNewConfig, CarouselItem } from "../../../../components/Carousel";
 import { component, mergeConfig } from "../../../../engines";
 import { config } from "./Carousel.config";
-export var mergedConfig = /*#__PURE__*/mergeConfig(carouselConfig, config);
+export var mergedConfig = /*#__PURE__*/mergeConfig(carouselNewConfig, config);
 export var Carousel = /*#__PURE__*/component(mergedConfig);
 export { CarouselItem };

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

@@ -2,76 +2,136 @@ 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;
+    paginationDisabled: boolean;
+    paginationCentered: boolean;
+};
+
+const { views, sizes } = getConfigVariations(config);
 
 const meta: Meta<StoryCarouselProps> = {
     title: 'web/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'],
+            options: ['start', 'center', 'end', 'activeDirection'],
             control: {
                 type: 'inline-radio',
             },
         },
-        isDragScrollDisabled: {
+        slides: {
+            control: 'number',
+        },
+        visibleDots: {
+            control: 'number',
+        },
+        controlArrowsDisabled: {
+            control: 'boolean',
+        },
+        paginationDisabled: {
+            control: 'boolean',
+        },
+        paginationCentered: {
             control: 'boolean',
         },
     },
     args: {
+        view: 'default',
+        size: 's',
         align: 'center',
-        isDragScrollDisabled: false,
+        visibleDots: 6,
+        slides: 10,
+        controlArrowsDisabled: false,
+        paginationDisabled: false,
+        paginationCentered: false,
     },
     parameters: {
         controls: {
-            include: ['align', 'isDragScrollDisabled'],
+            include: [
+                'align',
+                'visibleDots',
+                'slides',
+                'controlArrowsDisabled',
+                'paginationDisabled',
+                'paginationCentered',
+                'gap',
+            ],
         },
     },
 };
 
 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: 400px;
+    height: 370px;
     background-color: #add8e6;
+    font-size: 30px;
 `;
 
-const StoryDefault = ({ align, isDragScrollDisabled }: StoryCarouselProps) => {
-    const [index, setIndex] = React.useState(0);
+const StoryDefault = ({
+    align,
+    visibleDots,
+    slides,
+    paginationDisabled,
+    paginationCentered,
+    ...rest
+}: StoryCarouselProps) => {
+    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>
+        <>
+            <div style={{ width: '600px' }}>
+                <Carousel
+                    detectActive
+                    scrollAlign={align}
+                    paginationOptions={{
+                        disabled: paginationDisabled,
+                        visibleDots,
+                        centered: paginationCentered,
+                    }}
+                    {...rest}
+                >
+                    {items.map((item, i) => (
+                        <CarouselItem key={i} scrollSnapAlign={align}>
+                            <StyledCard>{item.title}</StyledCard>
+                        </CarouselItem>
+                    ))}
+                </Carousel>
+            </div>
+        </>
     );
 };
 

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

@@ -1 +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,KAAyC,MAAM,OAAO,CAAC;AAO9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAKpD;;GAEG;AACH,eAAO,MAAM,eAAe,SAAU,SAAS,CAAC,cAAc,EAAE,gBAAgB,CAAC,4FA8E5E,CAAC;AAEN,eAAO,MAAM,iBAAiB;;;mBAhFQ,SAAS,CAAC,cAAc,EAAE,gBAAgB,CAAC;;;;;;;;;;;;;;CAiGhF,CAAC"}
+{"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,KAAyC,MAAM,OAAO,CAAC;AAO9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAIpD;;GAEG;AACH,eAAO,MAAM,eAAe,SAAU,SAAS,CAAC,cAAc,EAAE,gBAAgB,CAAC,4FAqE5E,CAAC;AAEN,eAAO,MAAM,iBAAiB;;;mBAvEQ,SAAS,CAAC,cAAc,EAAE,gBAAgB,CAAC;;;;;;;;;;;;;;CAwFhF,CAAC"}

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

@@ -1,4 +1,3 @@
-import { CSSProperties } from 'react';
 export declare const IconButtonComponent: import("react").FunctionComponent<import("../../../engines/types").PropsType<import("../../../engines/types").Variants> & ((Omit<import("react").ButtonHTMLAttributes<HTMLElement>, "value"> & Omit<import("react").AnchorHTMLAttributes<HTMLElement>, "type"> & import("../../..").AsProps & {
     text?: string;
     contentLeft?: import("react").ReactNode;
@@ -44,9 +43,7 @@ export declare const IconButtonComponent: import("react").FunctionComponent<impo
 } & import("react").RefAttributes<HTMLButtonElement>))>;
 export declare const base: import("@linaria/core").LinariaClassName;
 export declare const CarouselWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
-export declare const CarouselTrack: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    gap?: CSSProperties["gap"];
-}>;
+export declare const CarouselTrack: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
 export declare const IconButton: import("@linaria/react").StyledMeta & import("react").FunctionComponent<import("../../../engines/types").PropsType<import("../../../engines/types").Variants> & ((Omit<import("react").ButtonHTMLAttributes<HTMLElement>, "value"> & Omit<import("react").AnchorHTMLAttributes<HTMLElement>, "type"> & import("../../..").AsProps & {
     text?: string;
     contentLeft?: import("react").ReactNode;

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

@@ -1 +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;AAOtC,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uDAA0B,CAAC;AAE3D,eAAO,MAAM,IAAI,0CAEhB,CAAC;AAEF,eAAO,MAAM,eAAe,qKAoB3B,CAAC;AAEF,eAAO,MAAM,aAAa;UAAsB,aAAa,CAAC,KAAK,CAAC;EAInE,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uDAsBtB,CAAC;AAEF,eAAO,MAAM,eAAe,qKAE3B,CAAC"}
+{"version":3,"file":"Carousel.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Carousel/CarouselNew/Carousel.styles.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uDAA0B,CAAC;AAE3D,eAAO,MAAM,IAAI,0CAEhB,CAAC;AAEF,eAAO,MAAM,eAAe,qKAuB3B,CAAC;AAEF,eAAO,MAAM,aAAa,qKAGzB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uDAsBtB,CAAC;AAEF,eAAO,MAAM,eAAe,qKAE3B,CAAC"}

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

@@ -1,38 +1,24 @@
-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';
+import type { HTMLAttributes } from 'react';
 export type ScrollAlign = 'start' | 'center' | 'end' | 'activeDirection';
 export interface CarouselNewProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Центрирование активного элемента при скролле.
+     * @default center
      */
     scrollAlign?: ScrollAlign;
     /**
-     * Сменить WAI-ARIA Role списка.
+     * Опции управления пагинацией.
      */
-    listRole?: string;
-    /**
-     * Сменить WAI-ARIA Label списка.
-     */
-    listAriaLabel?: string;
-    /**
-     * Внутренний отступ между слайдами.
-     */
-    gap?: CSSProperties['gap'];
     paginationOptions?: {
         disabled?: boolean;
         visibleDots?: number;
         centered?: boolean;
     };
     /**
-     * Выключает драг скролл (только для десктопа).
+     * Включение/выключение стрелок управления слайдами.
      * @default false
      */
-    isDragScrollDisabled?: boolean;
+    controlArrowsDisabled?: boolean;
     /**
      * Размер контрола.
      */
@@ -43,53 +29,7 @@ export interface CarouselNewProps extends HTMLAttributes<HTMLDivElement> {
      */
     view?: string;
 }
-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 type CarouselItemProps = HTMLAttributes<HTMLDivElement>;
 export interface DotsProps {
     /**
      * Выбранная страница
@@ -118,5 +58,4 @@ export interface DotsProps {
      */
     centered?: boolean;
 }
-export {};
 //# sourceMappingURL=Carousel.types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Carousel.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Carousel/CarouselNew/Carousel.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,wBAAwB,CAAC;AAE5E,MAAM,MAAM,QAAQ,GAAG,WAAW,GAAG,WAAW,GAAG,MAAM,CAAC;AAC1D,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AACnD,MAAM,MAAM,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAE3C,MAAM,MAAM,UAAU,GAAG,GAAG,GAAG,GAAG,CAAC;AACnC,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,iBAAiB,CAAC;AAEzE,MAAM,WAAW,gBAAiB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACpE;;OAEG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAC3B,iBAAiB,CAAC,EAAE;QAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;IACF;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAE/B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC5B,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,cAAc,CAAC,EAAE,QAAQ,CAAC;CAC7B,GAAG,OAAO,GACP,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,UAAU,oBAAoB;IAC1B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,iBAAiB,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED,MAAM,WAAW,mBAAoB,SAAQ,6BAA6B,CAAC,cAAc,CAAC,EAAE,oBAAoB;CAAG;AAEnH,MAAM,WAAW,SAAS;IACtB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB"}
+{"version":3,"file":"Carousel.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Carousel/CarouselNew/Carousel.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,iBAAiB,CAAC;AAEzE,MAAM,WAAW,gBAAiB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACpE;;;OAGG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;OAEG;IACH,iBAAiB,CAAC,EAAE;QAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;IACF;;;OAGG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAE/D,MAAM,WAAW,SAAS;IACtB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB"}

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

@@ -1,16 +1,15 @@
 import React from 'react';
-import { CarouselNewProps as CarouselProps, ScrollAlign, ScrollAxis } from '../Carousel.types';
+import { CarouselNewProps as CarouselProps, ScrollAlign } from '../Carousel.types';
 /**
  * Подсчет смещения из-за паддингов.
  */
-export declare const getCalculatedOffset: (scrollEl: Element, trackEl: Element, axis: ScrollAxis) => number;
+export declare const getCalculatedOffset: (scrollEl: Element, trackEl: Element) => number;
 /**
  * Подсчет скролла до переданного индекса.
  */
-export declare const getCalculatedPos: ({ scrollEl, items, axis, index, offset, scrollAlign, }: {
+export declare const getCalculatedPos: ({ scrollEl, items, index, offset, scrollAlign, }: {
     scrollEl: HTMLElement;
     items: HTMLCollectionOf<HTMLElement>;
-    axis: ScrollAxis;
     index: number;
     offset: number;
     scrollAlign: ScrollAlign;
@@ -33,10 +32,9 @@ export declare const animatedScrollToX: (elem: Element, pos: number, duration?:
 /**
  * Прокрутка к указанной позиции с анимацией или без.
  */
-export declare const scrollToPos: ({ scrollEl, pos, axis, animated, duration, timingFunction, }: {
+export declare const scrollToPos: ({ scrollEl, pos, animated, duration, timingFunction, }: {
     scrollEl: HTMLElement;
     pos: number;
-    axis: ScrollAxis;
     animated?: boolean;
     duration?: number;
     timingFunction?: TimingFunction;