@telefonica/mistica 14.39.0 → 14.40.0

package/dist-es/carousel.js

@@ -51,61 +51,62 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-import { jsx as s, jsxs as $ } from "react/jsx-runtime";
-import * as n from "react";
-import te from "./generated/mistica-icons/icon-chevron-left-regular.js";
-import se from "./generated/mistica-icons/icon-chevron-right-regular.js";
-import { useScreenSize as oe, useTheme as re, useIsInViewport as we } from "./hooks.js";
-import Se from "./inline.js";
-import ke from "./stack.js";
-import { BaseTouchable as M } from "./touchable.js";
-import X from "classnames";
-import { useIsInverseVariant as Ne, ThemeVariant as E } from "./theme-variant-context.js";
-import { listenResize as le, getPrefixedDataAttributes as Ce } from "./utils/dom.js";
-import { isAndroid as ne, isIos as Le, isRunningAcceptanceTest as Re } from "./utils/platform.js";
-import { useDocumentVisibility as Ae } from "./utils/document-visibility.js";
-import { slideshowContainer as Be, slideshowPrevArrowButton as Ee, slideshow as Me, slideshowItem as Te, slideshowNextArrowButton as ye, slideshowBullets as We, bulletActiveInverse as Oe, bulletInverse as De, bulletActive as Ve, bullet as ze, carouselContainer as _e, carouselPrevArrowButton as je, carousel as Fe, centeredCarousel as Ue, carouselWithScroll as qe, vars as L, carouselItem as Ke, carouselNextArrowButton as Ye, carouselBullets as $e } from "./carousel.css-mistica.js";
-import { vars as Ge } from "./image.css-mistica.js";
-import { sprinkles as He } from "./sprinkles.css-mistica.js";
-import { useDesktopContainerType as Je } from "./desktop-container-type-context.js";
-import { VIVO_NEW_SKIN as Qe } from "./skins/constants.js";
-import { applyCssVars as ce } from "./utils/css.js";
-const ie = (e, r)=>{
-    const t = Ae();
-    return we(r, !1) && t && !!e;
-}, ae = (param)=>{
-    let { currentIndex: e, numPages: r, onPress: t } = param;
-    const o = Ne(), { isDesktopOrBigger: h } = oe(), m = (b)=>{
-        const f = b === e;
-        return o ? f ? Oe : De : f ? Ve : ze;
-    };
-    return /* @__PURE__ */ s(Se, {
-        space: {
-            mobile: 8,
-            desktop: 16
-        },
+import { jsx as s, jsxs as J } from "react/jsx-runtime";
+import * as c from "react";
+import le from "./generated/mistica-icons/icon-chevron-left-regular.js";
+import re from "./generated/mistica-icons/icon-chevron-right-regular.js";
+import { useScreenSize as ne, useTheme as ce, useIsInViewport as Pe } from "./hooks.js";
+import Ne from "./inline.js";
+import { BaseTouchable as T } from "./touchable.js";
+import F from "classnames";
+import { useIsInverseVariant as Be, ThemeVariant as R } from "./theme-variant-context.js";
+import { listenResize as ie, getPrefixedDataAttributes as ae } from "./utils/dom.js";
+import { isAndroid as ue, isIos as Le, isRunningAcceptanceTest as Re } from "./utils/platform.js";
+import { useDocumentVisibility as Te } from "./utils/document-visibility.js";
+import { bulletButton as Ae, bulletButtonMobile as Ee, bulletButtonTablet as ye, bulletButtonDesktop as We, slideshowContainer as De, slideshowPrevArrowButton as Oe, slideshow as Ve, slideshowItem as ze, slideshowNextArrowButton as _e, slideshowBullets as je, bulletActiveInverse as Fe, bulletInverse as Ue, bulletActive as qe, bullet as Ke, carouselContainer as Ye, carouselPrevArrowButton as $e, carousel as Ge, centeredCarousel as He, carouselWithScrollMobile as Je, carouselWithScrollTablet as Qe, vars as P, carouselItem as Xe, carouselNextArrowButton as Ze, carouselBullets as et, noCarouselBulletsDesktop as tt, noCarouselBulletsTablet as ot, noCarouselBulletsMobile as st } from "./carousel.css-mistica.js";
+import { vars as lt } from "./image.css-mistica.js";
+import { useDesktopContainerType as rt } from "./desktop-container-type-context.js";
+import { VIVO_NEW_SKIN as nt } from "./skins/constants.js";
+import { applyCssVars as fe } from "./utils/css.js";
+const de = (e, t)=>{
+    const o = Te();
+    return Pe(t, !1) && o && !!e;
+}, he = (param)=>{
+    let { currentIndex: e, numPages: t, onPress: o } = param;
+    var _t_tablet;
+    const l = Be(), { isDesktopOrBigger: h } = ne(), m = (p)=>{
+        const n = p === e;
+        return l ? n ? Fe : Ue : n ? qe : Ke;
+    }, I = typeof t == "number" ? t : Math.max(t.mobile, (_t_tablet = t.tablet) !== null && _t_tablet !== void 0 ? _t_tablet : t.mobile, t.desktop);
+    return /* @__PURE__ */ s(Ne, {
+        space: 0,
         alignItems: "center",
         dataAttributes: {
             "component-name": "PageBullets"
         },
         children: Array.from({
-            length: r
-        }, (b, f)=>/* @__PURE__ */ s(M, {
-                className: He({
-                    display: "block",
-                    padding: 0,
-                    border: "none",
-                    background: "transparent"
+            length: I
+        }, (p, n)=>/* @__PURE__ */ {
+            var _t_tablet;
+            return s(T, {
+                className: F(typeof t == "number" ? Ae : {
+                    [Ee]: n < t.mobile,
+                    [ye]: n < ((_t_tablet = t.tablet) !== null && _t_tablet !== void 0 ? _t_tablet : t.mobile),
+                    [We]: n < t.desktop
                 }),
+                style: n === 0 ? {
+                    paddingLeft: 0
+                } : {},
                 maybe: !0,
-                onPress: h && t ? ()=>t(f) : void 0,
+                onPress: h && o ? ()=>o(n) : void 0,
                 children: /* @__PURE__ */ s("div", {
-                    className: m(f)
+                    className: m(n)
                 })
-            }, f))
+            }, n);
+        })
     });
-}, Z = (e, r, t)=>t ? typeof t == "number" ? t : t[e] || r[e] : r[e], Xe = (e, r)=>{
-    const t = {
+}, oe = (e, t, o)=>o ? typeof o == "number" ? o : o[e] || t[e] : t[e], ct = (e, t)=>{
+    const o = {
         mobile: 1,
         tablet: 2,
         desktop: {
@@ -114,59 +115,59 @@ const ie = (e, r)=>{
             large: 3
         }
     };
-    if (!r) return _object_spread_props(_object_spread({}, t), {
-        desktop: Z(e, t.desktop)
+    if (!t) return _object_spread_props(_object_spread({}, o), {
+        desktop: oe(e, o.desktop)
     });
-    if (typeof r == "number") return {
-        mobile: r,
-        tablet: r,
-        desktop: r
+    if (typeof t == "number") return {
+        mobile: t,
+        tablet: t,
+        desktop: t
     };
-    const o = Z(e, t.desktop, r.desktop);
-    return _object_spread_props(_object_spread({}, t, r), {
-        desktop: o
+    const l = oe(e, o.desktop, t.desktop);
+    return _object_spread_props(_object_spread({}, o, t), {
+        desktop: l
     });
-}, ee = (e, r)=>{
+}, se = (e, t)=>{
     if (e.length === 0) return [];
-    const t = Math.ceil(e.length / r), o = [];
-    for(let h = 0; h < e.length; h += t)o.push(e[h]);
-    return o[o.length - 1] = e[e.length - t], o;
-}, Ze = (e, r)=>{
-    const t = [];
-    for(let o = 0; o < r.length; o++)o === 0 ? t.push(r[0]) : t.push((r[o] + r[o - 1]) / 2);
-    for(let o = t.length - 1; o >= 0; o--)if (e - t[o] >= -1) return o;
+    const o = Math.ceil(e.length / t), l = [];
+    for(let h = 0; h < e.length; h += o)l.push(e[h]);
+    return l[l.length - 1] = e[e.length - o], l;
+}, it = (e, t)=>{
+    const o = [];
+    for(let l = 0; l < t.length; l++)l === 0 ? o.push(t[0]) : o.push((t[l] + t[l - 1]) / 2);
+    for(let l = o.length - 1; l >= 0; l--)if (e - o[l] >= -1) return l;
     return 0;
-}, ue = 5e3, fe = (param)=>{
-    let { items: e, itemStyle: r, itemClassName: t, withBullets: o, renderBullets: h, initialActiveItem: m, itemsPerPage: b, itemsToScroll: f, mobilePageOffset: p, gap: N, free: R, centered: A, autoplay: v, onPageChange: P, dataAttributes: F } = param;
-    const { texts: T, platformOverrides: x, skinName: y } = re(), c = Je(), i = Xe(c || "large", b), { isDesktopOrBigger: w, isTablet: C } = oe(), U = C ? i.tablet : i.mobile, I = Math.max(Math.floor(w ? i.desktop : U), 1), g = n.useRef(null), S = Math.ceil(e.length / I), [{ scrollLeft: G, scrollRight: q }, he] = n.useState({
+}, me = 5e3, be = (param)=>{
+    let { items: e, itemStyle: t, itemClassName: o, withBullets: l, renderBullets: h, initialActiveItem: m, itemsPerPage: I, itemsToScroll: p, mobilePageOffset: n, gap: S, free: N, centered: B, autoplay: g, onPageChange: x, dataAttributes: U } = param;
+    const { texts: A, platformOverrides: M, skinName: E } = ce(), a = rt(), i = ct(a || "large", I), { isDesktopOrBigger: C, isTablet: k } = ne(), q = k ? i.tablet : i.mobile, v = Math.max(Math.floor(C ? i.desktop : q), 1), b = c.useRef(null), K = Math.ceil(e.length / Math.max(Math.floor(i.mobile), 1)), Y = Math.ceil(e.length / Math.max(Math.floor(i.tablet), 1)), Q = Math.ceil(e.length / Math.max(Math.floor(i.desktop), 1)), y = Math.ceil(e.length / v), [{ scrollLeft: X, scrollRight: $ }, ge] = c.useState({
         scrollLeft: 0,
         scrollRight: 0
-    }), [K, me] = n.useState([]), W = n.useMemo(()=>ee(K, S), [
-        K,
-        S
-    ]), O = f ? ee(K, Math.ceil(e.length / f)) : W, pe = q !== 0, ge = G !== 0;
-    n.useEffect(()=>{
-        if (g.current) {
-            const l = g.current, a = ()=>{
-                const { scrollWidth: z, clientWidth: B } = l, _ = Math.round(l.scrollLeft), j = Math.round(z - (_ + B));
-                he({
+    }), [G, ve] = c.useState([]), W = c.useMemo(()=>se(G, y), [
+        G,
+        y
+    ]), D = p ? se(G, Math.ceil(e.length / p)) : W, Ie = $ !== 0, xe = X !== 0;
+    c.useEffect(()=>{
+        if (b.current) {
+            const r = b.current, u = ()=>{
+                const { scrollWidth: z, clientWidth: L } = r, _ = Math.round(r.scrollLeft), j = Math.round(z - (_ + L));
+                ge({
                     scrollLeft: _,
                     scrollRight: j
                 });
-            }, u = ()=>{
-                const z = l.scrollWidth - l.clientWidth;
-                me(Array.from(l.querySelectorAll("[data-item]")).map((B, _)=>{
+            }, f = ()=>{
+                const z = r.scrollWidth - r.clientWidth;
+                ve(Array.from(r.querySelectorAll("[data-item]")).map((L, _)=>{
                     if (_ === e.length - 1) return z;
-                    const j = B.offsetLeft, Pe = parseInt(getComputedStyle(B).scrollMargin), xe = A && !w ? j - B.clientWidth / 2 : j;
-                    return Math.min(xe - Pe - l.offsetLeft, z);
+                    const j = L.offsetLeft, Se = parseInt(getComputedStyle(L).scrollMargin), ke = B && !C ? j - L.clientWidth / 2 : j;
+                    return Math.min(ke - Se - r.offsetLeft, z);
                 }));
             };
-            a(), u(), l.addEventListener("scroll", a);
-            const d = le(l, ()=>{
-                a(), u();
+            u(), f(), r.addEventListener("scroll", u);
+            const d = ie(r, ()=>{
+                u(), f();
             });
             return ()=>{
-                l.removeEventListener("scroll", a), d();
+                r.removeEventListener("scroll", u), d();
             };
         }
         return ()=>{};
@@ -174,180 +175,187 @@ const ie = (e, r)=>{
         i.desktop,
         i.tablet,
         i.mobile,
+        y,
         S,
-        N,
-        A,
-        w,
+        B,
+        C,
         e.length
     ]);
-    const D = n.useCallback(function(l) {
-        let a = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0;
-        const u = g.current;
-        if (u) {
-            const d = W[l];
-            u.scrollTo({
+    const O = c.useCallback(function(r) {
+        let u = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0;
+        const f = b.current;
+        if (f) {
+            const d = W[r];
+            f.scrollTo({
                 left: d,
-                behavior: a ? "smooth" : "auto"
+                behavior: u ? "smooth" : "auto"
             });
         }
     }, [
         W
-    ]), be = n.useCallback(()=>{
-        const l = g.current;
-        if (l) {
-            const { scrollLeft: a } = l, u = [
-                ...O
-            ].reverse().find((d)=>d - a < -1);
-            l.scrollTo({
-                left: u,
+    ]), Me = c.useCallback(()=>{
+        const r = b.current;
+        if (r) {
+            const { scrollLeft: u } = r, f = [
+                ...D
+            ].reverse().find((d)=>d - u < -1);
+            r.scrollTo({
+                left: f,
                 behavior: "smooth"
             });
         }
     }, [
-        O
-    ]), Y = n.useCallback(()=>{
-        const l = g.current;
-        if (l) {
-            const { scrollLeft: a } = l, u = O.find((d)=>d - a > 1);
-            l.scrollTo({
-                left: u,
+        D
+    ]), H = c.useCallback(()=>{
+        const r = b.current;
+        if (r) {
+            const { scrollLeft: u } = r, f = D.find((d)=>d - u > 1);
+            r.scrollTo({
+                left: f,
                 behavior: "smooth"
             });
         }
     }, [
-        O
-    ]), H = ie(!!v, g);
-    n.useEffect(()=>{
-        m !== void 0 && D(Math.floor(m / I), !1);
+        D
+    ]), Z = de(!!g, b);
+    c.useEffect(()=>{
+        m !== void 0 && O(Math.floor(m / v), !1);
     }, [
         m,
-        D,
-        I
-    ]), n.useEffect(()=>{
-        if (H && v) {
-            const l = typeof v == "boolean" ? ue : v.time, a = typeof v == "object" && v.loop, u = setInterval(()=>{
+        O,
+        v
+    ]), c.useEffect(()=>{
+        if (Z && g) {
+            const r = typeof g == "boolean" ? me : g.time, u = typeof g == "object" && g.loop, f = setInterval(()=>{
                 var d;
-                q !== 0 ? Y() : a && ((d = g.current) == null || d.scrollTo({
+                $ !== 0 ? H() : u && ((d = b.current) == null || d.scrollTo({
                     left: 0,
                     behavior: "smooth"
                 }));
-            }, l);
-            return ()=>clearInterval(u);
+            }, r);
+            return ()=>clearInterval(f);
         }
     }, [
-        v,
-        Y,
-        q,
-        H
+        g,
+        H,
+        $,
+        Z
     ]);
-    const k = Ze(G, W), J = n.useRef(!m), Q = n.useRef(0);
-    n.useEffect(()=>{
-        if (P) {
-            const l = Math.min((k + 1) * I - 1, e.length - 1), a = [];
-            for(let u = 0; u < I; u++){
-                const d = l - u;
-                d >= 0 && a.unshift(d);
+    const w = it(X, W), ee = c.useRef(!m), te = c.useRef(0);
+    c.useEffect(()=>{
+        if (x) {
+            const r = Math.min((w + 1) * v - 1, e.length - 1), u = [];
+            for(let f = 0; f < v; f++){
+                const d = r - f;
+                d >= 0 && u.unshift(d);
             }
-            J.current ? Q.current !== k && P({
-                pageIndex: k,
-                shownItemIndexes: a
-            }) : J.current = a.includes(m || 0), Q.current = k;
+            ee.current ? te.current !== w && x({
+                pageIndex: w,
+                shownItemIndexes: u
+            }) : ee.current = u.includes(m || 0), te.current = w;
         }
     }, [
-        k,
+        w,
         e.length,
-        I,
+        v,
         m,
-        P
+        x
     ]);
     let V = null;
     h ? V = h({
-        numPages: S,
-        currentIndex: k,
-        onPress: D
-    }) : o && (V = S > 1 && /* @__PURE__ */ s(ae, {
-        numPages: S,
-        currentIndex: k,
-        onPress: D
+        numPages: y,
+        currentIndex: w,
+        onPress: O
+    }) : l && (V = /* @__PURE__ */ s(he, {
+        numPages: {
+            mobile: K,
+            tablet: Y,
+            desktop: Q
+        },
+        currentIndex: w,
+        onPress: O
     }));
-    const ve = "64px", Ie = "36px";
-    return /* @__PURE__ */ $(ke, {
-        space: 24,
-        dataAttributes: _object_spread({
-            "component-name": "Carousel"
-        }, F),
+    const Ce = "64px", we = "36px";
+    return /* @__PURE__ */ J("div", _object_spread_props(_object_spread({}, ae(_object_spread({
+        "component-name": "Carousel"
+    }, U))), {
         children: [
-            /* @__PURE__ */ $("div", {
-                className: _e,
+            /* @__PURE__ */ J("div", {
+                className: Ye,
                 children: [
-                    /* @__PURE__ */ s(E, {
+                    /* @__PURE__ */ s(R, {
                         isInverse: !1,
-                        children: /* @__PURE__ */ s(M, {
-                            className: je,
-                            "aria-label": T.carouselPrevButton,
-                            onPress: be,
-                            disabled: !ge,
-                            children: /* @__PURE__ */ s(te, {})
+                        children: /* @__PURE__ */ s(T, {
+                            className: $e,
+                            "aria-label": A.carouselPrevButton,
+                            onPress: Me,
+                            disabled: !xe,
+                            children: /* @__PURE__ */ s(le, {})
                         })
                     }),
                     /* @__PURE__ */ s("div", {
-                        className: X(Fe, {
-                            [Ue]: A,
-                            [qe]: S > 1
+                        className: F(Ge, {
+                            [He]: B,
+                            [Je]: K > 1,
+                            [Qe]: Y > 1
                         }),
-                        style: _object_spread_props(_object_spread({}, ce(_object_spread({
-                            [L.itemsPerPageDesktop]: String(i.desktop),
-                            [L.itemsPerPageTablet]: String(i.tablet),
-                            [L.itemsPerPageMobile]: String(i.mobile)
-                        }, p === "large" ? {
-                            [L.mobilePageOffset]: ve
-                        } : y === Qe ? {
-                            [L.mobilePageOffset]: Ie
-                        } : {}, N !== void 0 ? {
-                            [L.gap]: String(N)
+                        style: _object_spread_props(_object_spread({}, fe(_object_spread({
+                            [P.itemsPerPageDesktop]: String(i.desktop),
+                            [P.itemsPerPageTablet]: String(i.tablet),
+                            [P.itemsPerPageMobile]: String(i.mobile)
+                        }, n === "large" ? {
+                            [P.mobilePageOffset]: Ce
+                        } : E === nt ? {
+                            [P.mobilePageOffset]: we
+                        } : {}, S !== void 0 ? {
+                            [P.gap]: String(S)
                         } : {}))), {
-                            scrollSnapType: R ? "initial" : "x mandatory",
+                            scrollSnapType: N ? "initial" : "x mandatory",
                             // Hack to fix https://jira.tid.es/browse/NOVUMCC-8988
                             // there is a webkit rendering bug that causes a half pixel white line to appear at
                             // the bottom of the scrollable area in retina displays when it has a height with
                             // decimals. This extra padding avoids that line to partially cover the carousel
                             // slides border:
-                            paddingBottom: Le(x) && !Re(x) ? 0.5 : void 0
+                            paddingBottom: Le(M) && !Re(M) ? 0.5 : void 0
                         }),
-                        ref: g,
-                        children: e.map((l, a)=>/* @__PURE__ */ s("div", {
-                                className: X(Ke, t),
-                                style: _object_spread_props(_object_spread({}, r), {
-                                    scrollSnapStop: ne(x) ? "always" : "normal"
+                        ref: b,
+                        children: e.map((r, u)=>/* @__PURE__ */ s("div", {
+                                className: F(Xe, o),
+                                style: _object_spread_props(_object_spread({}, t), {
+                                    scrollSnapStop: ue(M) ? "always" : "normal"
                                 }),
                                 "data-item": !0,
-                                children: l
-                            }, a))
+                                children: r
+                            }, u))
                     }),
-                    /* @__PURE__ */ s(E, {
+                    /* @__PURE__ */ s(R, {
                         isInverse: !1,
-                        children: /* @__PURE__ */ s(M, {
-                            className: Ye,
-                            "aria-label": T.carouselNextButton,
-                            onPress: Y,
-                            disabled: !pe,
-                            children: /* @__PURE__ */ s(se, {})
+                        children: /* @__PURE__ */ s(T, {
+                            className: Ze,
+                            "aria-label": A.carouselNextButton,
+                            onPress: H,
+                            disabled: !Ie,
+                            children: /* @__PURE__ */ s(re, {})
                         })
                     })
                 ]
             }),
             V && /* @__PURE__ */ s("div", {
-                className: $e,
+                className: F(et, {
+                    [tt]: Q <= 1,
+                    [ot]: Y <= 1,
+                    [st]: K <= 1
+                }),
                 children: V
             })
         ]
-    });
-}, It = (e)=>/* @__PURE__ */ s(fe, _object_spread({}, e)), Pt = (param)=>/* @__PURE__ */ {
-    let { items: e, itemStyle: r, itemClassName: t, withBullets: o, renderBullets: h, initialActiveItem: m, onPageChange: b, dataAttributes: f } = param;
-    return s(fe, {
+    }));
+}, Pt = (e)=>/* @__PURE__ */ s(be, _object_spread({}, e)), Nt = (param)=>{
+    let { items: e, itemStyle: t, itemClassName: o, withBullets: l, renderBullets: h, initialActiveItem: m, onPageChange: I, dataAttributes: p } = param;
+    return /* @__PURE__ */ s(be, {
         items: e,
-        itemStyle: r,
-        itemClassName: t,
+        itemStyle: t,
+        itemClassName: o,
         itemsPerPage: {
             mobile: 1,
             tablet: 1,
@@ -356,125 +364,125 @@ const ie = (e, r)=>{
         centered: !0,
         itemsToScroll: 1,
         gap: 0,
-        withBullets: o,
+        withBullets: l,
         renderBullets: h,
         initialActiveItem: m,
-        onPageChange: b,
-        dataAttributes: f
+        onPageChange: I,
+        dataAttributes: p
     });
-}, de = /*#__PURE__*/ n.createContext(!1), xt = ()=>n.useContext(de), et = (param)=>/* @__PURE__ */ {
+}, pe = /*#__PURE__*/ c.createContext(!1), Bt = ()=>c.useContext(pe), at = (param)=>{
     let { children: e } = param;
-    return s(de.Provider, {
+    return /* @__PURE__ */ s(pe.Provider, {
         value: !0,
         children: e
     });
-}, wt = (param)=>{
-    let { items: e, withBullets: r, autoplay: t, onPageChange: o, dataAttributes: h, inverseBullets: m = !0 } = param;
-    const { texts: b, platformOverrides: f } = re(), p = n.useRef(null), [{ scrollLeft: N, scrollRight: R }, A] = n.useState({
+}, Lt = (param)=>{
+    let { items: e, withBullets: t, autoplay: o, onPageChange: l, dataAttributes: h, inverseBullets: m = !0 } = param;
+    const { texts: I, platformOverrides: p } = ce(), n = c.useRef(null), [{ scrollLeft: S, scrollRight: N }, B] = c.useState({
         scrollLeft: 0,
         scrollRight: 0
-    }), v = n.useCallback(()=>{
-        const c = p.current;
-        c && c.scrollBy({
-            left: -c.clientWidth,
+    }), g = c.useCallback(()=>{
+        const a = n.current;
+        a && a.scrollBy({
+            left: -a.clientWidth,
             behavior: "smooth"
         });
-    }, []), P = n.useCallback(()=>{
-        const c = p.current;
-        c && c.scrollBy({
-            left: c.clientWidth,
+    }, []), x = c.useCallback(()=>{
+        const a = n.current;
+        a && a.scrollBy({
+            left: a.clientWidth,
             behavior: "smooth"
         });
-    }, []), F = R !== 0, T = N !== 0, x = p.current ? Math.floor((N + p.current.clientWidth / 2) / p.current.clientWidth) : 0;
-    n.useLayoutEffect(()=>{
-        const c = p.current;
-        if (c) {
+    }, []), U = N !== 0, A = S !== 0, M = n.current ? Math.floor((S + n.current.clientWidth / 2) / n.current.clientWidth) : 0;
+    c.useLayoutEffect(()=>{
+        const a = n.current;
+        if (a) {
             const i = ()=>{
-                const { scrollWidth: C, clientWidth: U } = c, I = Math.round(c.scrollLeft), g = Math.round(C - (I + U));
-                A({
-                    scrollLeft: I,
-                    scrollRight: g
+                const { scrollWidth: k, clientWidth: q } = a, v = Math.round(a.scrollLeft), b = Math.round(k - (v + q));
+                B({
+                    scrollLeft: v,
+                    scrollRight: b
                 });
             };
-            i(), c.addEventListener("scroll", i);
-            const w = le(c, i);
+            i(), a.addEventListener("scroll", i);
+            const C = ie(a, i);
             return ()=>{
-                c.removeEventListener("scroll", i), w();
+                a.removeEventListener("scroll", i), C();
             };
         }
     }, [
         e.length
     ]);
-    const y = ie(!!t, p);
-    return n.useEffect(()=>{
-        if (y && t) {
-            const c = typeof t == "boolean" ? ue : t.time, i = typeof t == "object" && t.loop, w = setInterval(()=>{
-                var C;
-                R !== 0 ? P() : i && ((C = p.current) == null || C.scrollTo({
+    const E = de(!!o, n);
+    return c.useEffect(()=>{
+        if (E && o) {
+            const a = typeof o == "boolean" ? me : o.time, i = typeof o == "object" && o.loop, C = setInterval(()=>{
+                var k;
+                N !== 0 ? x() : i && ((k = n.current) == null || k.scrollTo({
                     left: 0,
                     behavior: "smooth"
                 }));
-            }, c);
-            return ()=>clearInterval(w);
+            }, a);
+            return ()=>clearInterval(C);
         }
     }, [
-        t,
-        P,
-        R,
-        y
-    ]), n.useEffect(()=>{
-        o && o(x);
-    }, [
+        o,
         x,
-        o
-    ]), /* @__PURE__ */ s(et, {
-        children: /* @__PURE__ */ $("div", _object_spread_props(_object_spread({
-            className: Be
-        }, Ce(h, "SlideShow")), {
+        N,
+        E
+    ]), c.useEffect(()=>{
+        l && l(M);
+    }, [
+        M,
+        l
+    ]), /* @__PURE__ */ s(at, {
+        children: /* @__PURE__ */ J("div", _object_spread_props(_object_spread({
+            className: De
+        }, ae(h, "SlideShow")), {
             children: [
-                /* @__PURE__ */ s(E, {
+                /* @__PURE__ */ s(R, {
                     isInverse: !1,
-                    children: /* @__PURE__ */ s(M, {
-                        className: Ee,
-                        "aria-label": b.carouselPrevButton,
-                        onPress: v,
-                        disabled: !T,
-                        children: /* @__PURE__ */ s(te, {})
+                    children: /* @__PURE__ */ s(T, {
+                        className: Oe,
+                        "aria-label": I.carouselPrevButton,
+                        onPress: g,
+                        disabled: !A,
+                        children: /* @__PURE__ */ s(le, {})
                     })
                 }),
                 /* @__PURE__ */ s("div", {
-                    style: ce({
-                        [Ge.mediaBorderRadius]: "0px"
+                    style: fe({
+                        [lt.mediaBorderRadius]: "0px"
                     }),
                     children: /* @__PURE__ */ s("div", {
-                        className: Me,
-                        ref: p,
-                        children: e.map((c, i)=>/* @__PURE__ */ s("div", {
-                                className: Te,
+                        className: Ve,
+                        ref: n,
+                        children: e.map((a, i)=>/* @__PURE__ */ s("div", {
+                                className: ze,
                                 style: {
-                                    scrollSnapStop: ne(f) ? "always" : "normal"
+                                    scrollSnapStop: ue(p) ? "always" : "normal"
                                 },
-                                children: c
+                                children: a
                             }, i))
                     })
                 }),
-                /* @__PURE__ */ s(E, {
+                /* @__PURE__ */ s(R, {
                     isInverse: !1,
-                    children: /* @__PURE__ */ s(M, {
-                        className: ye,
-                        "aria-label": b.carouselNextButton,
-                        onPress: P,
-                        disabled: !F,
-                        children: /* @__PURE__ */ s(se, {})
+                    children: /* @__PURE__ */ s(T, {
+                        className: _e,
+                        "aria-label": I.carouselNextButton,
+                        onPress: x,
+                        disabled: !U,
+                        children: /* @__PURE__ */ s(re, {})
                     })
                 }),
-                r && e.length > 1 && /* @__PURE__ */ s(E, {
+                t && e.length > 1 && /* @__PURE__ */ s(R, {
                     isInverse: m,
                     children: /* @__PURE__ */ s("div", {
-                        className: We,
-                        children: /* @__PURE__ */ s(ae, {
+                        className: je,
+                        children: /* @__PURE__ */ s(he, {
                             numPages: e.length,
-                            currentIndex: x
+                            currentIndex: M
                         })
                     })
                 })
@@ -482,4 +490,4 @@ const ie = (e, r)=>{
         }))
     });
 };
-export { It as Carousel, Pt as CenteredCarousel, et as IsInsideSlideshowProvider, ae as PageBullets, wt as Slideshow, xt as useIsInsideSlideshowContext };
+export { Pt as Carousel, Nt as CenteredCarousel, at as IsInsideSlideshowProvider, he as PageBullets, Lt as Slideshow, Bt as useIsInsideSlideshowContext };