@salutejs/plasma-core 1.226.1-next-sbcom.0 → 1.227.0-dev.0

package/es/components/Carousel/hooks.js

@@ -1,109 +1,59 @@
-function _array_like_to_array(arr, len) {
-    if (len == null || len > arr.length) len = arr.length;
-    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
-    return arr2;
-}
-function _array_with_holes(arr) {
-    if (Array.isArray(arr)) return arr;
-}
-function _iterable_to_array_limit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-    var _s, _e;
-    try {
-        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
-            _arr.push(_s.value);
-            if (i && _arr.length === i) break;
-        }
-    } catch (err) {
-        _d = true;
-        _e = err;
-    } finally{
-        try {
-            if (!_n && _i["return"] != null) _i["return"]();
-        } finally{
-            if (_d) throw _e;
-        }
-    }
-    return _arr;
-}
-function _non_iterable_rest() {
-    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _sliced_to_array(arr, i) {
-    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
-}
-function _unsupported_iterable_to_array(o, minLen) {
-    if (!o) return;
-    if (typeof o === "string") return _array_like_to_array(o, minLen);
-    var n = Object.prototype.toString.call(o).slice(8, -1);
-    if (n === "Object" && o.constructor) n = o.constructor.name;
-    if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
-}
 /* eslint-disable no-continue */ import throttle from 'lodash.throttle';
 import { useRef, useEffect, useCallback, useMemo, useLayoutEffect, useState } from 'react';
 import { useDebouncedFunction } from '../../hooks';
 import { scrollToPos, getCalculatedPos, getCalculatedOffset, getItemSlot, getCarouselItems, translateToIndex } from './utils';
-var THROTTLE_DEFAULT_MS = 100;
-var DEBOUNCE_DEFAULT_MS = 150;
-export var useCarousel = function useCarousel(param) {
-    var index = param.index, axis = param.axis, _param_detectActive = param.detectActive, detectActive = _param_detectActive === void 0 ? false : _param_detectActive, _param_detectThreshold = param.detectThreshold, detectThreshold = _param_detectThreshold === void 0 ? 0.5 : _param_detectThreshold, _param_scrollAlign = param.scrollAlign, scrollAlign = _param_scrollAlign === void 0 ? 'center' : _param_scrollAlign, scaleCallback = param.scaleCallback, scaleResetCallback = param.scaleResetCallback, onIndexChange = param.onIndexChange, onDetectActiveItem = param.onDetectActiveItem, _param_animatedScrollByIndex = param.animatedScrollByIndex, animatedScrollByIndex = _param_animatedScrollByIndex === void 0 ? false : _param_animatedScrollByIndex, _param_throttleMs = param.throttleMs, throttleMs = _param_throttleMs === void 0 ? THROTTLE_DEFAULT_MS : _param_throttleMs, _param_debounceMs = param.debounceMs, debounceMs = _param_debounceMs === void 0 ? DEBOUNCE_DEFAULT_MS : _param_debounceMs;
-    var prevIndex = useRef(null);
-    var direction = useRef(null);
-    var offset = useRef(0);
-    var scrollRef = useRef(null);
-    var trackRef = useRef(null);
+const THROTTLE_DEFAULT_MS = 100;
+const DEBOUNCE_DEFAULT_MS = 150;
+export const useCarousel = ({ index, axis, detectActive = false, detectThreshold = 0.5, scrollAlign = 'center', scaleCallback, scaleResetCallback, onIndexChange, onDetectActiveItem, animatedScrollByIndex = false, throttleMs = THROTTLE_DEFAULT_MS, debounceMs = DEBOUNCE_DEFAULT_MS })=>{
+    const prevIndex = useRef(null);
+    const direction = useRef(null);
+    const offset = useRef(0);
+    const scrollRef = useRef(null);
+    const trackRef = useRef(null);
     /**
      * Для того, чтобы не спамить изменениями индекса.
      * Задержка дебаунса слегка больше, чем у тротлинга.
      * Таким образом, событие срабатывает при завершении скролла.
-     */ var debouncedOnIndexChange = useDebouncedFunction(function(i) {
-        return onIndexChange === null || onIndexChange === void 0 ? void 0 : onIndexChange(i);
-    }, debounceMs);
+     */ const debouncedOnIndexChange = useDebouncedFunction((i)=>onIndexChange?.(i), debounceMs);
     /**
      * Вычисление центрального элемента.
      * Подсчет: от 0 до 1, какое количество ширины/высоты
      * каждого элемента находится по центру скролла.
-     */ var throttledDetectActiveItem = useMemo(function() {
-        return throttle(function() {
+     */ const throttledDetectActiveItem = useMemo(()=>{
+        return throttle(()=>{
             if (!detectActive || scrollRef.current === null || trackRef.current === null) {
                 return;
             }
             /**
              * Правая (или нижняя для Оу) граница элемента.
-             */ var itemEdge = offset.current;
+             */ let itemEdge = offset.current;
             /**
              * Смещение (отрицательный или положительный отступ)
              * и размер карусели (для Ox - ширина, для Oy - высота).
-             */ var scrollPos = scrollRef.current[axis === 'x' ? 'scrollLeft' : 'scrollTop'];
-            var scrollSize = scrollRef.current[axis === 'x' ? 'offsetWidth' : 'offsetHeight'];
+             */ const scrollPos = scrollRef.current[axis === 'x' ? 'scrollLeft' : 'scrollTop'];
+            const scrollSize = scrollRef.current[axis === 'x' ? 'offsetWidth' : 'offsetHeight'];
             /**
              * Граница скролла (видимой части).
              * Смещение + размер.
-             */ var scrollEdge = scrollPos + scrollSize;
+             */ const scrollEdge = scrollPos + scrollSize;
             /**
              * Элементы перед, после и в видимой части.
              * перед [ ВИДИМЫЕ ] после
-             */ var prevItems = [];
-            var nextItems = [];
-            var count = 0;
-            var items = getCarouselItems(trackRef.current);
+             */ const prevItems = [];
+            const nextItems = [];
+            let count = 0;
+            const items = getCarouselItems(trackRef.current);
             /**
              * Проходим по всему списку, суммируя ширины элементов,
              * пока не найдем один элемент, чей центр будет в центре карусели.
-             */ for(var itemIndex = 0; itemIndex < items.length; itemIndex++){
-                var _prevIndex_current;
-                var item = items.item(itemIndex);
+             */ for(let itemIndex = 0; itemIndex < items.length; itemIndex++){
+                const item = items.item(itemIndex);
                 if (item === null) {
                     continue;
                 }
                 /**
                  * Для Ox - ширина, для Oy - высота.
-                 */ var itemSize = item[axis === 'x' ? 'offsetWidth' : 'offsetHeight'];
+                 */ const itemSize = item[axis === 'x' ? 'offsetWidth' : 'offsetHeight'];
                 /**
                  * Все элементы правее вьюпорта выпадают из процедуры.
                  * Сравниваем по предыдущему элементу.
@@ -125,11 +75,11 @@ export var useCarousel = function useCarousel(param) {
                     }
                     continue;
                 }
-                var itemSlot = getItemSlot(itemIndex, itemEdge, itemSize, scrollPos, scrollSize, scrollAlign, (_prevIndex_current = prevIndex.current) !== null && _prevIndex_current !== void 0 ? _prevIndex_current : 0, offset.current);
+                const itemSlot = getItemSlot(itemIndex, itemEdge, itemSize, scrollPos, scrollSize, scrollAlign, prevIndex.current ?? 0, offset.current);
                 if (itemSlot !== null) {
                     if (detectThreshold && Math.abs(itemSlot) <= detectThreshold) {
-                        onDetectActiveItem === null || onDetectActiveItem === void 0 ? void 0 : onDetectActiveItem(itemIndex);
-                        debouncedOnIndexChange === null || debouncedOnIndexChange === void 0 ? void 0 : debouncedOnIndexChange(itemIndex);
+                        onDetectActiveItem?.(itemIndex);
+                        debouncedOnIndexChange?.(itemIndex);
                     }
                     if (scaleCallback) {
                         scaleCallback(item, itemSlot);
@@ -140,27 +90,19 @@ export var useCarousel = function useCarousel(param) {
                 }
             }
             if (scaleCallback && scaleResetCallback) {
-                window.requestAnimationFrame(function() {
+                window.requestAnimationFrame(()=>{
                     if (direction.current) {
                         if (nextItems.length) {
-                            nextItems.splice(0, count).forEach(function(elem) {
-                                return scaleCallback(elem, count);
-                            });
+                            nextItems.splice(0, count).forEach((elem)=>scaleCallback(elem, count));
                             if (nextItems.length) {
-                                nextItems.splice(0, count).forEach(function(elem) {
-                                    return scaleResetCallback(elem);
-                                });
+                                nextItems.splice(0, count).forEach((elem)=>scaleResetCallback(elem));
                             }
                         }
                     } else if (prevItems.length) {
-                        var prItemsRev = prevItems.reverse();
-                        prItemsRev.splice(0, count).forEach(function(elem) {
-                            return scaleCallback(elem, count * -1);
-                        });
+                        const prItemsRev = prevItems.reverse();
+                        prItemsRev.splice(0, count).forEach((elem)=>scaleCallback(elem, count * -1));
                         if (prItemsRev.length) {
-                            prItemsRev.splice(0, count).forEach(function(elem) {
-                                return scaleResetCallback(elem);
-                            });
+                            prItemsRev.splice(0, count).forEach((elem)=>scaleResetCallback(elem));
                         }
                     }
                 });
@@ -179,21 +121,21 @@ export var useCarousel = function useCarousel(param) {
     ]);
     /**
      * Прокрутка до нужной позиции индекса.
-     */ var toIndex = useCallback(function(i) {
-        var scrollEl = scrollRef.current;
-        var items = trackRef.current ? getCarouselItems(trackRef.current) : null;
+     */ const toIndex = useCallback((i)=>{
+        const scrollEl = scrollRef.current;
+        const items = trackRef.current ? getCarouselItems(trackRef.current) : null;
         if (scrollEl && items && items.length > 0 && i >= 0) {
             scrollToPos({
-                scrollEl: scrollEl,
+                scrollEl,
                 pos: getCalculatedPos({
-                    scrollEl: scrollEl,
-                    items: items,
-                    axis: axis,
+                    scrollEl,
+                    items,
+                    axis,
                     index: i,
                     offset: offset.current,
-                    scrollAlign: scrollAlign
+                    scrollAlign
                 }),
-                axis: axis,
+                axis,
                 /**
                      * Без анимации при переходе на другой конец списка
                      */ animated: animatedScrollByIndex && (prevIndex.current === null || Math.abs(i - prevIndex.current) !== items.length - 1)
@@ -205,7 +147,7 @@ export var useCarousel = function useCarousel(param) {
         axis,
         scrollAlign
     ]);
-    useEffect(function() {
+    useEffect(()=>{
         if (scrollRef.current && trackRef.current) {
             offset.current = getCalculatedOffset(scrollRef.current, trackRef.current, axis);
         }
@@ -215,12 +157,12 @@ export var useCarousel = function useCarousel(param) {
     /**
      * Операции на маунте/анмаунте компонента.
      * Создать слушатели событи и т.п.
-     */ useEffect(function() {
-        var carouselElement = scrollRef.current;
+     */ useEffect(()=>{
+        const carouselElement = scrollRef.current;
         if (carouselElement) {
             carouselElement.addEventListener('scroll', throttledDetectActiveItem);
         }
-        return function() {
+        return ()=>{
             if (carouselElement) {
                 carouselElement.removeEventListener('scroll', throttledDetectActiveItem);
             }
@@ -230,8 +172,8 @@ export var useCarousel = function useCarousel(param) {
     ]);
     /**
      * Нужно вызвать только при первом рендере
-     */ useEffect(function() {
-        requestAnimationFrame(function() {
+     */ useEffect(()=>{
+        requestAnimationFrame(()=>{
             /**
              * Прокрутка до начального индекса.
              */ toIndex(index);
@@ -245,7 +187,7 @@ export var useCarousel = function useCarousel(param) {
     }, []);
     /**
      * Прокрутка до нужной позиции индекса, если индекс изменился.
-     */ useEffect(function() {
+     */ useEffect(()=>{
         if (index !== prevIndex.current) {
             toIndex(index);
         }
@@ -254,29 +196,28 @@ export var useCarousel = function useCarousel(param) {
         toIndex
     ]);
     return {
-        scrollRef: scrollRef,
-        trackRef: trackRef
+        scrollRef,
+        trackRef
     };
 };
-export function useCarouselLite(param) {
-    var index = param.index, axis = param.axis, _param_scrollAlign = param.scrollAlign, scrollAlign = _param_scrollAlign === void 0 ? 'center' : _param_scrollAlign, _param_scrollMode = param.scrollMode, scrollMode = _param_scrollMode === void 0 ? 'translate' : _param_scrollMode;
-    var _useState = _sliced_to_array(useState(index), 2), prevIndex = _useState[0], setPrevIndex = _useState[1];
-    var carouselRef = useRef(null);
-    var trackRef = useRef(null);
-    var needTranslateToInitialIndex = useRef(true);
+export function useCarouselLite({ index, axis, scrollAlign = 'center', scrollMode = 'translate' }) {
+    const [prevIndex, setPrevIndex] = useState(index);
+    const carouselRef = useRef(null);
+    const trackRef = useRef(null);
+    const needTranslateToInitialIndex = useRef(true);
     // Первый раз нужно проскролить к индексу, после первого рендера
-    useLayoutEffect(function() {
+    useLayoutEffect(()=>{
         if (needTranslateToInitialIndex.current === false) {
             return;
         }
         /**
          * Вызываем через requestAnimationFrame, так как при использовании динамических CarouselCol
          * ширины элементов высчитываются неверно внутри translateToIndex при синхронном вызове
-         */ var rafId = requestAnimationFrame(function() {
+         */ const rafId = requestAnimationFrame(()=>{
             translateToIndex(index, index, axis, scrollAlign, trackRef.current, carouselRef.current, true, scrollMode);
             needTranslateToInitialIndex.current = false;
         });
-        return function() {
+        return ()=>{
             cancelAnimationFrame(rafId);
         };
     }, [
@@ -293,6 +234,6 @@ export function useCarouselLite(param) {
     }
     return {
         scrollRef: carouselRef,
-        trackRef: trackRef
+        trackRef
     };
 }

package/es/components/Carousel/utils.js

@@ -1,9 +1,8 @@
 import { animatedScrollToX, animatedScrollToY } from '../../utils';
-var positionModByScrollAlign = function positionModByScrollAlign(param) {
-    var scrollAlign = param.scrollAlign, position = param.position, carouselSize = param.carouselSize, itemSize = param.itemSize, offset = param.offset, scrollStart = param.scrollStart, axis = param.axis;
+const positionModByScrollAlign = ({ scrollAlign, position, carouselSize, itemSize, offset, scrollStart, axis })=>{
     if (scrollAlign === 'start') {
-        var inaccuracy = 1;
-        var paddingOffset = axis === 'y' ? offset - itemSize / 2 + inaccuracy : 0;
+        const inaccuracy = 1;
+        const paddingOffset = axis === 'y' ? offset - itemSize / 2 + inaccuracy : 0;
         return position + paddingOffset;
     }
     if (scrollAlign === 'center') {
@@ -24,59 +23,49 @@ var positionModByScrollAlign = function positionModByScrollAlign(param) {
 };
 /**
  * Подсчет скролла до переданного индекса.
- */ export var getCalculatedPos = function getCalculatedPos(param) {
-    var scrollEl = param.scrollEl, items = param.items, axis = param.axis, index = param.index, offset = param.offset, scrollAlign = param.scrollAlign;
-    var position = scrollAlign === 'center' ? offset : 0;
-    var carouselSize;
-    var itemSize;
-    var scrollStart;
+ */ export const getCalculatedPos = ({ scrollEl, items, axis, index, offset, scrollAlign })=>{
+    let position = scrollAlign === 'center' ? offset : 0;
+    let carouselSize;
+    let itemSize;
+    let scrollStart;
     if (items.item(index) === null) {
         return position;
     }
-    for(var i = 0; i < index; i++){
+    for(let i = 0; i < index; i++){
         if (axis === 'x') {
-            var _ref;
-            var _items_item;
-            position += (_ref = (_items_item = items.item(i)) === null || _items_item === void 0 ? void 0 : _items_item.offsetWidth) !== null && _ref !== void 0 ? _ref : 0;
+            position += items.item(i)?.offsetWidth ?? 0;
         } else {
-            var _ref1;
-            var _items_item1;
-            position += (_ref1 = (_items_item1 = items.item(i)) === null || _items_item1 === void 0 ? void 0 : _items_item1.offsetHeight) !== null && _ref1 !== void 0 ? _ref1 : 0;
+            position += items.item(i)?.offsetHeight ?? 0;
         }
     }
     if (axis === 'x') {
-        var _ref2;
-        var _items_item2;
         carouselSize = scrollEl.offsetWidth;
-        itemSize = (_ref2 = (_items_item2 = items.item(index)) === null || _items_item2 === void 0 ? void 0 : _items_item2.offsetWidth) !== null && _ref2 !== void 0 ? _ref2 : 0;
+        itemSize = items.item(index)?.offsetWidth ?? 0;
         scrollStart = scrollEl.scrollLeft;
     } else {
-        var _ref3;
-        var _items_item3;
         carouselSize = scrollEl.offsetHeight;
-        itemSize = (_ref3 = (_items_item3 = items.item(index)) === null || _items_item3 === void 0 ? void 0 : _items_item3.offsetHeight) !== null && _ref3 !== void 0 ? _ref3 : 0;
+        itemSize = items.item(index)?.offsetHeight ?? 0;
         scrollStart = scrollEl.scrollTop;
     }
     return positionModByScrollAlign({
-        scrollAlign: scrollAlign,
-        position: position,
-        carouselSize: carouselSize,
-        itemSize: itemSize,
-        offset: offset,
-        scrollStart: scrollStart,
-        axis: axis
+        scrollAlign,
+        position,
+        carouselSize,
+        itemSize,
+        offset,
+        scrollStart,
+        axis
     });
 };
 /**
  * Подсчет смещения из-за паддингов.
- */ export var getCalculatedOffset = function getCalculatedOffset(scrollEl, trackEl, axis) {
-    var paddingProp = axis === 'x' ? 'paddingLeft' : 'paddingTop';
+ */ export const getCalculatedOffset = (scrollEl, trackEl, axis)=>{
+    const paddingProp = axis === 'x' ? 'paddingLeft' : 'paddingTop';
     return parseInt(getComputedStyle(scrollEl)[paddingProp], 10) + parseInt(getComputedStyle(trackEl)[paddingProp], 10);
 };
 /**
  * Прокрутка к указанной позиции с анимацией или без.
- */ export var scrollToPos = function scrollToPos(param) {
-    var scrollEl = param.scrollEl, pos = param.pos, axis = param.axis, animated = param.animated, duration = param.duration, timingFunction = param.timingFunction;
+ */ export const scrollToPos = ({ scrollEl, pos, axis, animated, duration, timingFunction })=>{
     if (axis === 'x' && Math.abs(pos - scrollEl.scrollLeft) > 1) {
         if (animated) {
             animatedScrollToX(scrollEl, pos, duration, timingFunction);
@@ -96,20 +85,17 @@ var positionModByScrollAlign = function positionModByScrollAlign(param) {
         }
     }
 };
-var round = function round(n) {
-    return Math.round(n * 100) / 100;
-};
+const round = (n)=>Math.round(n * 100) / 100;
 /**
  * Получить позицию (слот) айтема в каруселе.
  * Каждый айтем имеет свой слот относительно вьюпорта карусели.
- */ export var getItemSlot = function getItemSlot(itemIndex, itemEnd, itemSize, scrollStart, scrollSize, scrollAlign) {
-    var prevIndex = arguments.length > 6 && arguments[6] !== void 0 ? arguments[6] : 0, offset = arguments.length > 7 && arguments[7] !== void 0 ? arguments[7] : 0;
+ */ export const getItemSlot = (itemIndex, itemEnd, itemSize, scrollStart, scrollSize, scrollAlign, prevIndex = 0, offset = 0)=>{
     /**
      * Граница и центр скролла (видимой части).
      * Смещение + размер.
-     */ var scrollEnd = scrollStart + scrollSize;
-    var scrollCenter = scrollStart + scrollSize / 2;
-    var itemCenter = itemEnd - itemSize / 2;
+     */ const scrollEnd = scrollStart + scrollSize;
+    const scrollCenter = scrollStart + scrollSize / 2;
+    const itemCenter = itemEnd - itemSize / 2;
     if (scrollAlign === 'center') {
         return round((itemCenter - scrollCenter) / itemSize);
     }
@@ -120,9 +106,9 @@ var round = function round(n) {
         return round((itemEnd - (scrollSize + scrollStart)) / itemSize);
     }
     if (scrollAlign === 'activeDirection') {
-        var prevStart = offset + itemSize * prevIndex;
-        var prevEnd = prevStart + itemSize;
-        var prevVisible = prevEnd > scrollStart && prevStart < scrollEnd;
+        const prevStart = offset + itemSize * prevIndex;
+        const prevEnd = prevStart + itemSize;
+        const prevVisible = prevEnd > scrollStart && prevStart < scrollEnd;
         if (!prevVisible) {
             if (prevIndex < itemIndex) {
                 return round((itemEnd - (scrollSize + scrollStart)) / itemSize);
@@ -135,28 +121,28 @@ var round = function round(n) {
 export function getCarouselItems(track) {
     return track.children;
 }
-var axisToTranslateMap = {
-    x: function x(position) {
-        return "translateX(".concat(-position, "px)");
+const axisToTranslateMap = {
+    x (position) {
+        return `translateX(${-position}px)`;
     },
-    y: function y(position) {
-        return "translateY(".concat(-position, "px)");
+    y (position) {
+        return `translateY(${-position}px)`;
     }
 };
-var axisToOffsetKeyMap = {
+const axisToOffsetKeyMap = {
     x: 'offsetLeft',
     y: 'offsetTop'
 };
-var axisToSizeKeyMap = {
+const axisToSizeKeyMap = {
     x: 'offsetWidth',
     y: 'offsetHeight'
 };
-var axisToScrollKeyMap = {
+const axisToScrollKeyMap = {
     x: 'scrollLeft',
     y: 'scrollTop'
 };
 function getCenterPosition(itemSize, itemStart, carouselSize, trackOffset) {
-    var relativeMiddle = itemStart + trackOffset + itemSize / 2;
+    const relativeMiddle = itemStart + trackOffset + itemSize / 2;
     return relativeMiddle - carouselSize / 2;
 }
 function getEndPosition(itemSize, itemStart, carouselSize, trackOffset) {
@@ -184,12 +170,12 @@ function boundPosition(position, trackSize, carouselSize, trackOffset) {
     }
     // если все элементы помещаются в ширину карусели, то считаем trackEnd по-другому
     if (trackSize < carouselSize) {
-        var trackEnd = Math.abs(carouselSize - trackSize - trackOffset);
+        const trackEnd = Math.abs(carouselSize - trackSize - trackOffset);
         return position < trackEnd ? position : trackEnd;
     }
-    var trackEnd1 = trackSize - carouselSize + trackOffset;
-    if (position > trackEnd1) {
-        return trackEnd1;
+    const trackEnd = trackSize - carouselSize + trackOffset;
+    if (position > trackEnd) {
+        return trackEnd;
     }
     return position;
 }
@@ -217,10 +203,10 @@ function setTimingFunction(element, timingFunction) {
     }
 }
 function translateToPosition(element, axis, position) {
-    var translate = axisToTranslateMap[axis];
+    const translate = axisToTranslateMap[axis];
     element.style.transform = translate(position);
 }
-var scrollOptions = {
+const scrollOptions = {
     behavior: 'auto',
     left: 0,
     top: 0
@@ -244,24 +230,24 @@ var scrollOptions = {
     if (track === null || carousel === null) {
         return;
     }
-    var scrollKey = axisToScrollKeyMap[axis];
+    const scrollKey = axisToScrollKeyMap[axis];
     if (disableAnimation === false && scrollMode === 'translate' && carousel[scrollKey] !== 0) {
         carousel.scrollTo(scrollOptions);
     }
-    var itemToTranslateTo = track.children.item(index);
+    const itemToTranslateTo = track.children.item(index);
     if (itemToTranslateTo === null) {
         return;
     }
-    var numberOfItems = track.children.length;
-    var offsetKey = axisToOffsetKeyMap[axis];
-    var sizeKey = axisToSizeKeyMap[axis];
-    var carouselSize = carousel[sizeKey];
-    var trackSize = track[sizeKey];
-    var trackOffset = track[offsetKey];
-    var itemSize = itemToTranslateTo[sizeKey];
-    var itemStart = itemToTranslateTo[offsetKey];
-    var translatePosition = getTranslatePosition(itemSize, itemStart, carouselSize, trackOffset, align);
-    var position = boundPosition(translatePosition, trackSize, carouselSize, trackOffset);
+    const numberOfItems = track.children.length;
+    const offsetKey = axisToOffsetKeyMap[axis];
+    const sizeKey = axisToSizeKeyMap[axis];
+    const carouselSize = carousel[sizeKey];
+    const trackSize = track[sizeKey];
+    const trackOffset = track[offsetKey];
+    const itemSize = itemToTranslateTo[sizeKey];
+    const itemStart = itemToTranslateTo[offsetKey];
+    const translatePosition = getTranslatePosition(itemSize, itemStart, carouselSize, trackOffset, align);
+    const position = boundPosition(translatePosition, trackSize, carouselSize, trackOffset);
     if (scrollMode === 'scroll') {
         carousel.scrollTo({
             behavior: disableAnimation ? 'auto' : 'smooth',

package/es/components/Fade/Fade.js

@@ -1,15 +1,12 @@
 import styled from 'styled-components';
-var gradients = {
+const gradients = {
     top: 'radial-gradient(200% 200% at 50% -100%, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%)',
     bottom: 'radial-gradient(200% 200% at 50% 200%, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%)'
 };
-export var Fade = styled.div.withConfig({
+export const Fade = styled.div.withConfig({
     displayName: "Fade",
     componentId: "sc-1f25e4f8-0"
 })([
-    "position:fixed;top:0;left:0;right:0;bottom:0;z-index:999;background:",
-    ";"
-], function(param) {
-    var _param_placement = param.placement, placement = _param_placement === void 0 ? 'bottom' : _param_placement;
-    return gradients[placement];
-});
+    `position:fixed;top:0;left:0;right:0;bottom:0;z-index:999;background:`,
+    `;`
+], ({ placement = 'bottom' })=>gradients[placement]);