@telefonica/mistica 12.12.0 → 13.0.0

package/dist/carousel.d.ts

@@ -6,14 +6,16 @@ declare type PageBulletsProps = {
     onPress?: (index: number) => void;
 };
 export declare const PageBullets: React.FC<PageBulletsProps>;
+declare type DesktopItemsPerPage = {
+    small?: number;
+    medium?: number;
+    large?: number;
+} | number;
 declare type ItemsPerPageProp = {
     mobile?: number;
-    desktop?: number;
+    tablet?: number;
+    desktop?: DesktopItemsPerPage;
 } | number;
-declare type MobilePageOffset = number | {
-    prev: number;
-    next: number;
-};
 declare type CarouselProps = {
     items: ReadonlyArray<React.ReactNode>;
     itemStyle?: React.CSSProperties;
@@ -24,8 +26,6 @@ declare type CarouselProps = {
     itemsPerPage?: ItemsPerPageProp;
     /** scrolls one page by default */
     itemsToScroll?: number;
-    /** number of pixels to show for the next/prev page in mobile */
-    mobilePageOffset?: MobilePageOffset;
     /** If true, scroll snap doesn't apply and the user has a free scroll */
     free?: boolean;
     autoplay?: boolean | {

package/dist/carousel.js

@@ -10,16 +10,16 @@ function _export(target, all) {
 }
 _export(exports, {
     Carousel: function() {
-        return lt;
+        return it;
     },
     CenteredCarousel: function() {
-        return nt;
+        return at;
     },
     PageBullets: function() {
         return re;
     },
     Slideshow: function() {
-        return ct;
+        return ut;
     }
 });
 var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
@@ -38,6 +38,7 @@ var _documentVisibilityJs = require("./utils/document-visibility.js");
 var _carouselCssMisticaJs = require("./carousel.css-mistica.js");
 var _dynamic = require("@vanilla-extract/dynamic");
 var _sprinklesCssMisticaJs = require("./sprinkles.css-mistica.js");
+var _desktopContainerTypeContextJs = require("./desktop-container-type-context.js");
 var _jsxRuntimeJs = require("./_virtual/jsx-runtime.js");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
@@ -193,24 +194,24 @@ function _unsupportedIterableToArray(o, minLen) {
     if (n === "Map" || n === "Set") return Array.from(n);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
 }
-var te = function te(e, c) {
-    var l = (0, _documentVisibilityJs.useDocumentVisibility)();
-    return (0, _hooksJs.useIsInViewport)(c, !1) && l && !!e;
+var oe = function oe(e, r) {
+    var t = (0, _documentVisibilityJs.useDocumentVisibility)();
+    return (0, _hooksJs.useIsInViewport)(r, !1) && t && !!e;
 }, re = function re(param) {
-    var e = param.currentIndex, c = param.numPages, l = param.onPress;
-    var r = (0, _themeVariantContextJs.useIsInverseVariant)(), ref = (0, _hooksJs.useScreenSize)(), d = ref.isDesktopOrBigger, g = function g(b) {
-        var n = b === e;
-        return r ? n ? _carouselCssMisticaJs.bulletActiveInverse : _carouselCssMisticaJs.bulletInverse : n ? _carouselCssMisticaJs.bulletActive : _carouselCssMisticaJs.bullet;
+    var e = param.currentIndex, r = param.numPages, t = param.onPress;
+    var s = (0, _themeVariantContextJs.useIsInverseVariant)(), ref = (0, _hooksJs.useScreenSize)(), f = ref.isDesktopOrBigger, p = function p(v) {
+        var c = v === e;
+        return s ? c ? _carouselCssMisticaJs.bulletActiveInverse : _carouselCssMisticaJs.bulletInverse : c ? _carouselCssMisticaJs.bulletActive : _carouselCssMisticaJs.bullet;
     };
     return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_inlineJs.default, {
-        space: d ? 16 : 8,
+        space: f ? 16 : 8,
         alignItems: "center",
         dataAttributes: {
             "component-name": "PageBullets"
         },
         children: Array.from({
-            length: c
-        }, function(b, n) {
+            length: r
+        }, function(v, c) {
             return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, {
                 className: (0, _sprinklesCssMisticaJs.sprinkles)({
                     display: "block",
@@ -219,178 +220,187 @@ var te = function te(e, c) {
                     background: "transparent"
                 }),
                 maybe: !0,
-                onPress: d && l ? function() {
-                    return l(n);
+                onPress: f && t ? function() {
+                    return t(c);
                 } : void 0,
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
-                    className: g(n)
+                    className: p(c)
                 })
-            }, n);
+            }, c);
         })
     });
-}, je = function je(e) {
-    var c = {
+}, K = function K(e, r, t) {
+    return t ? typeof t == "number" ? t : t[e] || r[e] : r[e];
+}, Ue = function Ue(e, r) {
+    var t = {
         mobile: 1,
-        desktop: 3
+        tablet: 2,
+        desktop: {
+            small: 1,
+            medium: 2,
+            large: 3
+        }
     };
-    return e ? typeof e == "number" ? {
-        mobile: e,
-        desktop: e
-    } : _objectSpread({}, c, e) : c;
-}, _e = function _e(e) {
-    return typeof e == "number" || e === void 0 ? {
-        next: e,
-        prev: e
-    } : e;
-}, H = function H(e, c) {
+    if (!r) return _objectSpreadProps(_objectSpread({}, t), {
+        desktop: K(e, t.desktop)
+    });
+    if (typeof r == "number") return {
+        mobile: r,
+        tablet: r,
+        desktop: r
+    };
+    var s = K(e, t.desktop, r.desktop);
+    return _objectSpreadProps(_objectSpread({}, t, r), {
+        desktop: s
+    });
+}, Q = function Q(e, r) {
     if (e.length === 0) return [];
-    var l = Math.ceil(e.length / c), r = [];
-    for(var d = 0; d < e.length; d += l)r.push(e[d]);
-    return r[r.length - 1] = e[e.length - l], r;
-}, Fe = function Fe(e, c) {
-    var l = [];
-    for(var r = 0; r < c.length; r++)r === 0 ? l.push(c[0]) : l.push((c[r] + c[r - 1]) / 2);
-    for(var r1 = l.length - 1; r1 >= 0; r1--)if (e - l[r1] >= -1) return r1;
+    var t = Math.ceil(e.length / r), s = [];
+    for(var f = 0; f < e.length; f += t)s.push(e[f]);
+    return s[s.length - 1] = e[e.length - t], s;
+}, qe = function qe(e, r) {
+    var t = [];
+    for(var s = 0; s < r.length; s++)s === 0 ? t.push(r[0]) : t.push((r[s] + r[s - 1]) / 2);
+    for(var s1 = t.length - 1; s1 >= 0; s1--)if (e - t[s1] >= -1) return s1;
     return 0;
-}, oe = 5e3, se = function se(param) {
-    var e = param.items, c = param.itemStyle, l = param.itemClassName, r = param.withBullets, d = param.renderBullets, g = param.initialActiveItem, b = param.itemsPerPage, n = param.itemsToScroll, k = param.mobilePageOffset, P = param.gap, j = param.free, L = param.centered, p = param.autoplay, S = param.onPageChange, _ = param.dataAttributes;
-    var ref = (0, _hooksJs.useTheme)(), w = ref.texts, B = ref.platformOverrides, o = je(b), u = _e(k), ref1 = (0, _hooksJs.useScreenSize)(), x = ref1.isDesktopOrBigger, h = _react.useRef(null), I = Math.floor(x ? o.desktop : o.mobile), v = Math.ceil(e.length / I), ref2 = _slicedToArray(_react.useState({
+}, le = 5e3, ne = function ne(param) {
+    var e = param.items, r = param.itemStyle, t = param.itemClassName, s = param.withBullets, f = param.renderBullets, p = param.initialActiveItem, v = param.itemsPerPage, c = param.itemsToScroll, w = param.gap, S = param.free, k = param.centered, g = param.autoplay, P = param.onPageChange, _ = param.dataAttributes;
+    var ref = (0, _hooksJs.useTheme)(), B = ref.texts, L = ref.platformOverrides, E = (0, _desktopContainerTypeContextJs.useDesktopContainerType)(), o = Ue(E || "large", v), ref1 = (0, _hooksJs.useScreenSize)(), h = ref1.isDesktopOrBigger, N = ref1.isMobile, x = N ? o.mobile : o.tablet, I = Math.max(Math.floor(h ? o.desktop : x), 1), m = _react.useRef(null), b = Math.ceil(e.length / I), ref2 = _slicedToArray(_react.useState({
         scrollLeft: 0,
         scrollRight: 0
-    }), 2), ref3 = ref2[0], E = ref3.scrollLeft, F = ref3.scrollRight, le = ref2[1], ref4 = _slicedToArray(_react.useState([]), 2), U = ref4[0], ne = ref4[1], y = _react.useMemo(function() {
-        return H(U, v);
+    }), 2), ref3 = ref2[0], G = ref3.scrollLeft, F = ref3.scrollRight, ce = ref2[1], ref4 = _slicedToArray(_react.useState([]), 2), U = ref4[0], ie = ref4[1], y = _react.useMemo(function() {
+        return Q(U, b);
     }, [
         U,
-        v
-    ]), T = n ? H(U, Math.ceil(e.length / n)) : y, ce = F !== 0, ie = E !== 0;
+        b
+    ]), T = c ? Q(U, Math.ceil(e.length / c)) : y, ae = F !== 0, ue = G !== 0;
     (0, _hooksJs.useIsomorphicLayoutEffect)(function() {
-        if (h.current) {
-            var s = h.current, i = function i() {
-                var V = s.scrollWidth, A = s.clientWidth, z = Math.round(s.scrollLeft), O = Math.round(V - (z + A));
-                le({
-                    scrollLeft: z,
-                    scrollRight: O
+        if (m.current) {
+            var n = m.current, i = function i() {
+                var V = n.scrollWidth, C = n.clientWidth, O = Math.round(n.scrollLeft), z = Math.round(V - (O + C));
+                ce({
+                    scrollLeft: O,
+                    scrollRight: z
                 });
-            }, f = function f() {
-                var V = s.scrollWidth - s.clientWidth;
-                ne(Array.from(s.querySelectorAll("[data-item]")).map(function(A, z) {
-                    if (z === e.length - 1) return V;
-                    var O = A.offsetLeft, ue = parseInt(getComputedStyle(A).scrollMargin), fe = L && !x ? O - A.clientWidth / 2 : O;
-                    return Math.min(fe - ue - s.offsetLeft, V);
+            }, u = function u() {
+                var V = n.scrollWidth - n.clientWidth;
+                ie(Array.from(n.querySelectorAll("[data-item]")).map(function(C, O) {
+                    if (O === e.length - 1) return V;
+                    var z = C.offsetLeft, de = parseInt(getComputedStyle(C).scrollMargin), he = k && !h ? z - C.clientWidth / 2 : z;
+                    return Math.min(he - de - n.offsetLeft, V);
                 }));
             };
-            i(), f(), s.addEventListener("scroll", i);
-            var m = (0, _domJs.listenResize)(s, function() {
-                i(), f();
+            i(), u(), n.addEventListener("scroll", i);
+            var d = (0, _domJs.listenResize)(n, function() {
+                i(), u();
             });
             return function() {
-                s.removeEventListener("scroll", i), m();
+                n.removeEventListener("scroll", i), d();
             };
         }
         return function() {};
     }, [
         o.desktop,
+        o.tablet,
         o.mobile,
-        u.next,
-        u.prev,
-        v,
-        P,
-        L,
-        x,
+        b,
+        w,
+        k,
+        h,
         e.length
     ]);
-    var W = _react.useCallback(function(s) {
+    var W = _react.useCallback(function(n) {
         var i = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0;
-        var f = h.current;
-        if (f) {
-            var m = y[s];
-            f.scrollTo({
-                left: m,
+        var u = m.current;
+        if (u) {
+            var d = y[n];
+            u.scrollTo({
+                left: d,
                 behavior: i ? "smooth" : "auto"
             });
         }
     }, [
         y
-    ]), ae = _react.useCallback(function() {
-        var s = h.current;
-        if (s) {
-            var i = s.scrollLeft, f = _toConsumableArray(T).reverse().find(function(m) {
-                return m - i < -1;
+    ]), fe = _react.useCallback(function() {
+        var n = m.current;
+        if (n) {
+            var i = n.scrollLeft, u = _toConsumableArray(T).reverse().find(function(d) {
+                return d - i < -1;
             });
-            s.scrollTo({
-                left: f,
+            n.scrollTo({
+                left: u,
                 behavior: "smooth"
             });
         }
     }, [
         T
-    ]), $ = _react.useCallback(function() {
-        var s = h.current;
-        if (s) {
-            var i = s.scrollLeft, f = T.find(function(m) {
-                return m - i > 1;
+    ]), q = _react.useCallback(function() {
+        var n = m.current;
+        if (n) {
+            var i = n.scrollLeft, u = T.find(function(d) {
+                return d - i > 1;
             });
-            s.scrollTo({
-                left: f,
+            n.scrollTo({
+                left: u,
                 behavior: "smooth"
             });
         }
     }, [
         T
-    ]), Y = te(!!p, h);
+    ]), H = oe(!!g, m);
     _react.useEffect(function() {
-        g !== void 0 && W(Math.floor(g / I), !1);
+        p !== void 0 && W(Math.floor(p / I), !1);
     }, [
-        g,
+        p,
         W,
         I
     ]), _react.useEffect(function() {
-        if (Y && p) {
-            var s = typeof p == "boolean" ? oe : p.time, i = typeof p == "object" && p.loop, f = setInterval(function() {
-                var m;
-                F !== 0 ? $() : i && ((m = h.current) == null || m.scrollTo({
+        if (H && g) {
+            var n = typeof g == "boolean" ? le : g.time, i = typeof g == "object" && g.loop, u = setInterval(function() {
+                var d;
+                F !== 0 ? q() : i && ((d = m.current) == null || d.scrollTo({
                     left: 0,
                     behavior: "smooth"
                 }));
-            }, s);
+            }, n);
             return function() {
-                return clearInterval(f);
+                return clearInterval(u);
             };
         }
     }, [
-        p,
-        $,
+        g,
+        q,
         F,
-        Y
+        H
     ]);
-    var N = Fe(E, y);
+    var A = qe(G, y);
     _react.useEffect(function() {
-        if (S) {
-            var s = Math.min((N + 1) * I - 1, e.length - 1), i = [];
-            for(var f = 0; f < I; f++){
-                var m = s - f;
-                m >= 0 && i.unshift(m);
+        if (P) {
+            var n = Math.min((A + 1) * I - 1, e.length - 1), i = [];
+            for(var u = 0; u < I; u++){
+                var d = n - u;
+                d >= 0 && i.unshift(d);
             }
-            S({
-                pageIndex: N,
+            P({
+                pageIndex: A,
                 shownItemIndexes: i
             });
         }
     }, [
-        N,
+        A,
         e.length,
         I,
-        S
+        P
     ]);
     var D = null;
     var _obj, _obj1;
-    return d ? D = d({
-        numPages: v,
-        currentIndex: N,
+    return f ? D = f({
+        numPages: b,
+        currentIndex: A,
         onPress: W
-    }) : r && (D = v > 1 && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(re, {
-        numPages: v,
-        currentIndex: N,
+    }) : s && (D = b > 1 && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(re, {
+        numPages: b,
+        currentIndex: A,
         onPress: W
     })), /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_stackJs.default, {
         space: 24,
@@ -405,26 +415,26 @@ var te = function te(e, c) {
                         isInverse: !1,
                         children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, {
                             className: _carouselCssMisticaJs.carouselPrevArrowButton,
-                            "aria-label": w.carouselPrevButton,
-                            onPress: ae,
-                            disabled: !ie,
+                            "aria-label": B.carouselPrevButton,
+                            onPress: fe,
+                            disabled: !ue,
                             children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconChevronLeftRegularJs.default, {})
                         })
                     }),
                     /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
-                        className: (0, _classnames.default)(_carouselCssMisticaJs.carousel, (_obj = {}, _defineProperty(_obj, _carouselCssMisticaJs.centeredCarousel, L), _defineProperty(_obj, _carouselCssMisticaJs.carouselWithScroll, v > 1), _obj)),
-                        style: _objectSpreadProps(_objectSpread({}, (0, _dynamic.assignInlineVars)(_objectSpread((_obj1 = {}, _defineProperty(_obj1, _carouselCssMisticaJs.vars.itemsPerPageDesktop, String(o.desktop)), _defineProperty(_obj1, _carouselCssMisticaJs.vars.itemsPerPageMobile, String(o.mobile)), _defineProperty(_obj1, _carouselCssMisticaJs.vars.mobilePageOffsetNext, u.next ? "".concat(u.next, "px") : ""), _defineProperty(_obj1, _carouselCssMisticaJs.vars.mobilePageOffsetPrev, u.prev ? "".concat(u.prev, "px") : ""), _obj1), P !== void 0 ? _defineProperty({}, _carouselCssMisticaJs.vars.gap, String(P)) : {}))), {
-                            scrollSnapType: j ? "initial" : "x mandatory"
+                        className: (0, _classnames.default)(_carouselCssMisticaJs.carousel, (_obj = {}, _defineProperty(_obj, _carouselCssMisticaJs.centeredCarousel, k), _defineProperty(_obj, _carouselCssMisticaJs.carouselWithScroll, b > 1), _obj)),
+                        style: _objectSpreadProps(_objectSpread({}, (0, _dynamic.assignInlineVars)(_objectSpread((_obj1 = {}, _defineProperty(_obj1, _carouselCssMisticaJs.vars.itemsPerPageDesktop, String(o.desktop)), _defineProperty(_obj1, _carouselCssMisticaJs.vars.itemsPerPageTablet, String(o.tablet)), _defineProperty(_obj1, _carouselCssMisticaJs.vars.itemsPerPageMobile, String(o.mobile)), _obj1), w !== void 0 ? _defineProperty({}, _carouselCssMisticaJs.vars.gap, String(w)) : {}))), {
+                            scrollSnapType: S ? "initial" : "x mandatory"
                         }),
-                        ref: h,
-                        children: e.map(function(s, i) {
+                        ref: m,
+                        children: e.map(function(n, i) {
                             return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
-                                className: (0, _classnames.default)(_carouselCssMisticaJs.carouselItem, l),
-                                style: _objectSpreadProps(_objectSpread({}, c), {
-                                    scrollSnapStop: (0, _platformJs.isAndroid)(B) ? "always" : "normal"
+                                className: (0, _classnames.default)(_carouselCssMisticaJs.carouselItem, t),
+                                style: _objectSpreadProps(_objectSpread({}, r), {
+                                    scrollSnapStop: (0, _platformJs.isAndroid)(L) ? "always" : "normal"
                                 }),
                                 "data-item": !0,
-                                children: s
+                                children: n
                             }, i);
                         })
                     }),
@@ -432,9 +442,9 @@ var te = function te(e, c) {
                         isInverse: !1,
                         children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, {
                             className: _carouselCssMisticaJs.carouselNextArrowButton,
-                            "aria-label": w.carouselNextButton,
-                            onPress: $,
-                            disabled: !ce,
+                            "aria-label": B.carouselNextButton,
+                            onPress: q,
+                            disabled: !ae,
                             children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconChevronRightRegularJs.default, {})
                         })
                     })
@@ -446,115 +456,115 @@ var te = function te(e, c) {
             })
         ]
     });
-}, lt = function lt(e) {
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(se, _objectSpread({}, e));
-}, nt = function nt(param) {
-    var e = param.items, c = param.itemStyle, l = param.itemClassName, r = param.withBullets, d = param.renderBullets, g = param.initialActiveItem, b = param.onPageChange, n = param.dataAttributes;
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(se, {
+}, it = function it(e) {
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(ne, _objectSpread({}, e));
+}, at = function at(param) {
+    var e = param.items, r = param.itemStyle, t = param.itemClassName, s = param.withBullets, f = param.renderBullets, p = param.initialActiveItem, v = param.onPageChange, c = param.dataAttributes;
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(ne, {
         items: e,
-        itemStyle: c,
-        itemClassName: l,
+        itemStyle: r,
+        itemClassName: t,
         itemsPerPage: {
             mobile: 1,
+            tablet: 1,
             desktop: 3
         },
         centered: !0,
         itemsToScroll: 1,
-        mobilePageOffset: 0,
         gap: 0,
-        withBullets: r,
-        renderBullets: d,
-        initialActiveItem: g,
-        onPageChange: b,
-        dataAttributes: n
+        withBullets: s,
+        renderBullets: f,
+        initialActiveItem: p,
+        onPageChange: v,
+        dataAttributes: c
     });
-}, ct = function ct(param) {
-    var e = param.items, c = param.withBullets, l = param.autoplay, r = param.onPageChange, d = param.dataAttributes;
-    var ref = (0, _hooksJs.useTheme)(), g = ref.texts, b = ref.platformOverrides, n = _react.useRef(null), ref1 = _slicedToArray(_react.useState({
+}, ut = function ut(param) {
+    var e = param.items, r = param.withBullets, t = param.autoplay, s = param.onPageChange, f = param.dataAttributes;
+    var ref = (0, _hooksJs.useTheme)(), p = ref.texts, v = ref.platformOverrides, c = _react.useRef(null), ref1 = _slicedToArray(_react.useState({
         scrollLeft: 0,
         scrollRight: 0
-    }), 2), ref2 = ref1[0], k = ref2.scrollLeft, P = ref2.scrollRight, j = ref1[1], L = _react.useCallback(function() {
-        var o = n.current;
+    }), 2), ref2 = ref1[0], w = ref2.scrollLeft, S = ref2.scrollRight, k = ref1[1], g = _react.useCallback(function() {
+        var o = c.current;
         o && o.scrollBy({
             left: -o.clientWidth,
             behavior: "smooth"
         });
-    }, []), p = _react.useCallback(function() {
-        var o = n.current;
+    }, []), P = _react.useCallback(function() {
+        var o = c.current;
         o && o.scrollBy({
             left: o.clientWidth,
             behavior: "smooth"
         });
-    }, []), S = P !== 0, _ = k !== 0, w = n.current ? Math.floor((k + n.current.clientWidth / 2) / n.current.clientWidth) : 0;
+    }, []), _ = S !== 0, B = w !== 0, L = c.current ? Math.floor((w + c.current.clientWidth / 2) / c.current.clientWidth) : 0;
     _react.useLayoutEffect(function() {
-        var o = n.current;
+        var o = c.current;
         if (o) {
-            var u = function u() {
-                var h = o.scrollWidth, I = o.clientWidth, v = Math.round(o.scrollLeft), E = Math.round(h - (v + I));
-                j({
-                    scrollLeft: v,
-                    scrollRight: E
+            var h = function h() {
+                var x = o.scrollWidth, I = o.clientWidth, m = Math.round(o.scrollLeft), b = Math.round(x - (m + I));
+                k({
+                    scrollLeft: m,
+                    scrollRight: b
                 });
             };
-            u(), o.addEventListener("scroll", u);
-            var x = (0, _domJs.listenResize)(o, u);
+            h(), o.addEventListener("scroll", h);
+            var N = (0, _domJs.listenResize)(o, h);
             return function() {
-                o.removeEventListener("scroll", u), x();
+                o.removeEventListener("scroll", h), N();
             };
         }
     }, [
         e.length
     ]);
-    var B = te(!!l, n);
+    var E = oe(!!t, c);
     return _react.useEffect(function() {
-        if (B && l) {
-            var o = typeof l == "boolean" ? oe : l.time, u = typeof l == "object" && l.loop, x = setInterval(function() {
-                var h;
-                P !== 0 ? p() : u && ((h = n.current) == null || h.scrollTo({
+        if (E && t) {
+            var o = typeof t == "boolean" ? le : t.time, h = typeof t == "object" && t.loop, N = setInterval(function() {
+                var x;
+                S !== 0 ? P() : h && ((x = c.current) == null || x.scrollTo({
                     left: 0,
                     behavior: "smooth"
                 }));
             }, o);
             return function() {
-                return clearInterval(x);
+                return clearInterval(N);
             };
         }
     }, [
-        l,
-        p,
+        t,
         P,
-        B
+        S,
+        E
     ]), _react.useEffect(function() {
-        r && r(w);
+        s && s(L);
     }, [
-        w,
-        r
+        L,
+        s
     ]), /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("div", _objectSpreadProps(_objectSpread({
         className: _carouselCssMisticaJs.slideshowContainer
-    }, (0, _domJs.getPrefixedDataAttributes)(d, "SlideShow")), {
+    }, (0, _domJs.getPrefixedDataAttributes)(f, "SlideShow")), {
         children: [
             /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_themeVariantContextJs.ThemeVariant, {
                 isInverse: !1,
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, {
                     className: _carouselCssMisticaJs.slideshowPrevArrowButton,
-                    "aria-label": g.carouselPrevButton,
-                    onPress: L,
-                    disabled: !_,
+                    "aria-label": p.carouselPrevButton,
+                    onPress: g,
+                    disabled: !B,
                     children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconChevronLeftRegularJs.default, {})
                 })
             }),
             /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_imageJs.DisableBorderRadiusProvider, {
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
                     className: _carouselCssMisticaJs.slideshow,
-                    ref: n,
-                    children: e.map(function(o, u) {
+                    ref: c,
+                    children: e.map(function(o, h) {
                         return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
                             className: _carouselCssMisticaJs.slideshowItem,
                             style: {
-                                scrollSnapStop: (0, _platformJs.isAndroid)(b) ? "always" : "normal"
+                                scrollSnapStop: (0, _platformJs.isAndroid)(v) ? "always" : "normal"
                             },
                             children: o
-                        }, u);
+                        }, h);
                     })
                 })
             }),
@@ -562,19 +572,19 @@ var te = function te(e, c) {
                 isInverse: !1,
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_touchableJs.BaseTouchable, {
                     className: _carouselCssMisticaJs.slideshowNextArrowButton,
-                    "aria-label": g.carouselNextButton,
-                    onPress: p,
-                    disabled: !S,
+                    "aria-label": p.carouselNextButton,
+                    onPress: P,
+                    disabled: !_,
                     children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconChevronRightRegularJs.default, {})
                 })
             }),
-            c && e.length > 1 && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_themeVariantContextJs.ThemeVariant, {
+            r && e.length > 1 && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_themeVariantContextJs.ThemeVariant, {
                 isInverse: !0,
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
                     className: _carouselCssMisticaJs.slideshowBullets,
                     children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(re, {
                         numPages: e.length,
-                        currentIndex: w
+                        currentIndex: L
                     })
                 })
             })