@telefonica/mistica 15.20.1 → 16.1.0

package/dist/carousel.js

@@ -11,28 +11,28 @@ function _export(target, all) {
 }
 _export(exports, {
     Carousel: function() {
-        return Ft;
+        return qt;
     },
     CarouselContextConsumer: function() {
-        return jt;
+        return Yt;
     },
     CarouselContextProvider: function() {
-        return zt;
+        return Kt;
     },
     CenteredCarousel: function() {
-        return Kt;
+        return Zt;
     },
     PageBullets: function() {
-        return xe;
+        return we;
     },
     Slideshow: function() {
-        return Yt;
+        return Ht;
     },
     useCarouselContext: function() {
-        return _t;
+        return Ut;
     },
     useSlideshowContext: function() {
-        return Ut;
+        return $t;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -53,6 +53,7 @@ const _desktopcontainertypecontext = require("./desktop-container-type-context.j
 const _constants = require("./skins/constants.js");
 const _css = require("./utils/css.js");
 const _responsivelayout = require("./responsive-layout.js");
+const _texttokens = require("./text-tokens.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -151,16 +152,16 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-const ve = (t, e)=>{
+const Pe = (t, e)=>{
     const s = (0, _documentvisibility.useDocumentVisibility)();
     return (0, _hooks.useIsInViewport)(e, !1) && s && !!t;
-}, xe = (param)=>{
+}, we = (param)=>{
     let { currentIndex: t, numPages: e, onPress: s } = param;
     var _e_tablet;
-    const r = (0, _themevariantcontext.useIsInverseVariant)(), { isDesktopOrBigger: i } = (0, _hooks.useScreenSize)(), h = (u)=>{
+    const r = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), { isDesktopOrBigger: i } = (0, _hooks.useScreenSize)(), m = (u)=>{
         const f = u === t;
         return r ? f ? _carouselcssmistica.bulletActiveInverse : _carouselcssmistica.bulletInverse : f ? _carouselcssmistica.bulletActive : _carouselcssmistica.bullet;
-    }, w = typeof e == "number" ? e : Math.max(e.mobile, (_e_tablet = e.tablet) !== null && _e_tablet !== void 0 ? _e_tablet : e.mobile, e.desktop);
+    }, P = typeof e == "number" ? e : Math.max(e.mobile, (_e_tablet = e.tablet) !== null && _e_tablet !== void 0 ? _e_tablet : e.mobile, e.desktop);
     return /* @__PURE__ */ (0, _jsxruntime.jsx)(_inline.default, {
         space: 0,
         alignItems: "center",
@@ -168,7 +169,7 @@ const ve = (t, e)=>{
             "component-name": "PageBullets"
         },
         children: Array.from({
-            length: w
+            length: P
         }, (u, f)=>/* @__PURE__ */ {
             var _e_tablet;
             return (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
@@ -183,24 +184,24 @@ const ve = (t, e)=>{
                 maybe: !0,
                 onPress: i && s ? ()=>s(f) : void 0,
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                    className: h(f)
+                    className: m(f)
                 })
             }, f);
         })
     });
-}, oe = ()=>{
+}, se = ()=>{
     throw new Error("You must wrap your component with a CarouselContextProvider to use CarouselContext");
-}, Ce = oe, Pe = oe, we = oe, Ie = {
+}, Ie = se, Me = se, ke = se, Ne = {
     currentIndex: 0,
     numPages: 0
-}, se = /*#__PURE__*/ _react.createContext({
-    goPrev: Ce,
-    goNext: Pe,
-    goToPage: we,
-    bulletsProps: Ie
-}), re = /*#__PURE__*/ _react.createContext(null), zt = (param)=>{
+}, re = /*#__PURE__*/ _react.createContext({
+    goPrev: Ie,
+    goNext: Me,
+    goToPage: ke,
+    bulletsProps: Ne
+}), le = /*#__PURE__*/ _react.createContext(null), Kt = (param)=>{
     let { children: t } = param;
-    const [e, s] = _react.useState(Ie), r = _react.useRef(Ce), i = _react.useRef(Pe), h = _react.useRef(we), w = _react.useMemo(()=>({
+    const [e, s] = _react.useState(Ne), r = _react.useRef(Ie), i = _react.useRef(Me), m = _react.useRef(ke), P = _react.useMemo(()=>({
             goPrev: ()=>{
                 r.current();
             },
@@ -209,15 +210,15 @@ const ve = (t, e)=>{
             },
             goToPage: function(u) {
                 let f = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0;
-                h.current(u, f);
+                m.current(u, f);
             },
             bulletsProps: e
         }), [
         e
     ]);
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(se.Provider, {
-        value: w,
-        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(re.Provider, {
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(re.Provider, {
+        value: P,
+        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(le.Provider, {
             value: {
                 setGoPrev: (u)=>{
                     r.current = u;
@@ -226,14 +227,14 @@ const ve = (t, e)=>{
                     i.current = u;
                 },
                 setGoToPage: (u)=>{
-                    h.current = u;
+                    m.current = u;
                 },
                 setBulletsProps: s
             },
             children: t
         })
     });
-}, _t = ()=>_react.useContext(se), jt = se.Consumer, ae = (t, e, s)=>s ? typeof s == "number" ? s : s[t] || e[t] : e[t], Ct = (t, e)=>{
+}, Ut = ()=>_react.useContext(re), Yt = re.Consumer, ie = (t, e, s)=>s ? typeof s == "number" ? s : s[t] || e[t] : e[t], It = (t, e)=>{
     const s = {
         mobile: 1,
         tablet: 2,
@@ -244,55 +245,55 @@ const ve = (t, e)=>{
         }
     };
     if (!e) return _object_spread_props(_object_spread({}, s), {
-        desktop: ae(t, s.desktop)
+        desktop: ie(t, s.desktop)
     });
     if (typeof e == "number") return {
         mobile: e,
         tablet: e,
         desktop: e
     };
-    const r = ae(t, s.desktop, e.desktop);
+    const r = ie(t, s.desktop, e.desktop);
     return _object_spread_props(_object_spread({}, s, e), {
         desktop: r
     });
-}, ie = (t, e)=>{
+}, ue = (t, e)=>{
     if (t.length === 0) return [];
     const s = Math.ceil(t.length / e), r = [];
     for(let i = 0; i < t.length; i += s)r.push(t[i]);
     return r[r.length - 1] = t[t.length - s], r;
-}, Pt = (t, e)=>{
+}, Mt = (t, e)=>{
     const s = [];
     for(let r = 0; r < e.length; r++)r === 0 ? s.push(e[0]) : s.push((e[r] + e[r - 1]) / 2);
     for(let r = s.length - 1; r >= 0; r--)if (t - s[r] >= -1) return r;
     return 0;
-}, ke = 5e3, Me = (param)=>{
-    let { items: t, itemStyle: e, itemClassName: s, withBullets: r, renderBullets: i, initialActiveItem: h, itemsPerPage: w, itemsToScroll: u, mobilePageOffset: f, gap: C, free: b, centered: N, autoplay: x, onPageChange: y, dataAttributes: W } = param;
-    const { texts: I, platformOverrides: S, skinName: H } = (0, _hooks.useTheme)(), J = (0, _desktopcontainertypecontext.useDesktopContainerType)(), a = Ct(J || "large", w), { isDesktopOrBigger: R, isTablet: A } = (0, _hooks.useScreenSize)(), F = A ? a.tablet : a.mobile, P = Math.max(Math.floor(R ? a.desktop : F), 1), l = _react.useRef(null), m = Math.ceil(t.length / Math.max(Math.floor(a.mobile), 1)), v = Math.ceil(t.length / Math.max(Math.floor(a.tablet), 1)), k = Math.ceil(t.length / Math.max(Math.floor(a.desktop), 1)), E = Math.ceil(t.length / P), [{ scrollLeft: D, scrollRight: G }, Re] = _react.useState({
+}, Se = 5e3, Re = (param)=>{
+    let { items: t, itemStyle: e, itemClassName: s, withBullets: r, renderBullets: i, initialActiveItem: m, itemsPerPage: P, itemsToScroll: u, mobilePageOffset: f, gap: S, free: I, centered: h, autoplay: x, onPageChange: N, dataAttributes: J } = param;
+    const { texts: R, platformOverrides: w, skinName: j, t: F } = (0, _hooks.useTheme)(), Q = (0, _desktopcontainertypecontext.useDesktopContainerType)(), a = It(Q || "large", P), { isDesktopOrBigger: B, isTablet: W } = (0, _hooks.useScreenSize)(), K = W ? a.tablet : a.mobile, C = Math.max(Math.floor(B ? a.desktop : K), 1), l = _react.useRef(null), p = Math.ceil(t.length / Math.max(Math.floor(a.mobile), 1)), v = Math.ceil(t.length / Math.max(Math.floor(a.tablet), 1)), M = Math.ceil(t.length / Math.max(Math.floor(a.desktop), 1)), E = Math.ceil(t.length / C), [{ scrollLeft: A, scrollRight: D }, Le] = _react.useState({
         scrollLeft: 0,
         scrollRight: 0
-    }), [Q, Ee] = _react.useState([]), K = _react.useMemo(()=>ie(Q, E), [
-        Q,
+    }), [X, Te] = _react.useState([]), U = _react.useMemo(()=>ue(X, E), [
+        X,
         E
-    ]), U = u ? ie(Q, Math.ceil(t.length / u)) : K, Le = G !== 0, Te = D !== 0;
+    ]), Y = u ? ue(X, Math.ceil(t.length / u)) : U, ye = D !== 0, We = A !== 0;
     _react.useEffect(()=>{
         if (l.current) {
             const c = l.current, d = ()=>{
-                const { scrollWidth: q, clientWidth: V } = c, Z = Math.round(c.scrollLeft), $ = Math.round(q - (Z + V));
-                Re({
-                    scrollLeft: Z,
-                    scrollRight: $
+                const { scrollWidth: Z, clientWidth: O } = c, $ = Math.round(c.scrollLeft), H = Math.round(Z - ($ + O));
+                Le({
+                    scrollLeft: $,
+                    scrollRight: H
                 });
-            }, p = ()=>{
-                const q = c.scrollWidth - c.clientWidth;
-                Ee(Array.from(c.querySelectorAll("[data-item]")).map((V, Z)=>{
-                    if (Z === t.length - 1) return q;
-                    const $ = V.offsetLeft, We = parseInt(getComputedStyle(V).scrollMargin), Ae = N && !R ? $ - V.clientWidth / 2 : $;
-                    return Math.min(Ae - We - c.offsetLeft, q);
+            }, b = ()=>{
+                const Z = c.scrollWidth - c.clientWidth;
+                Te(Array.from(c.querySelectorAll("[data-item]")).map((O, $)=>{
+                    if ($ === t.length - 1) return Z;
+                    const H = O.offsetLeft, Ge = parseInt(getComputedStyle(O).scrollMargin), Oe = h && !B ? H - O.clientWidth / 2 : H;
+                    return Math.min(Oe - Ge - c.offsetLeft, Z);
                 }));
             };
-            d(), p(), c.addEventListener("scroll", d);
+            d(), b(), c.addEventListener("scroll", d);
             const g = (0, _dom.listenResize)(c, ()=>{
-                d(), p();
+                d(), b();
             });
             return ()=>{
                 c.removeEventListener("scroll", d), g();
@@ -304,125 +305,125 @@ const ve = (t, e)=>{
         a.tablet,
         a.mobile,
         E,
-        C,
-        N,
-        R,
+        S,
+        h,
+        B,
         t.length
     ]);
     const L = _react.useCallback(function(c) {
         let d = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0;
-        const p = l.current;
-        if (p) {
-            const g = K[c];
-            p.scrollTo({
+        const b = l.current;
+        if (b) {
+            const g = U[c];
+            b.scrollTo({
                 left: g,
                 behavior: d ? "smooth" : "auto"
             });
         }
     }, [
-        K
-    ]), X = _react.useCallback(()=>{
+        U
+    ]), ee = _react.useCallback(()=>{
         const c = l.current;
         if (c) {
-            const { scrollLeft: d } = c, p = [
-                ...U
+            const { scrollLeft: d } = c, b = [
+                ...Y
             ].reverse().find((g)=>g - d < -1);
             c.scrollTo({
-                left: p,
+                left: b,
                 behavior: "smooth"
             });
         }
     }, [
-        U
-    ]), O = _react.useCallback(()=>{
+        Y
+    ]), G = _react.useCallback(()=>{
         const c = l.current;
         if (c) {
-            const { scrollLeft: d } = c, p = U.find((g)=>g - d > 1);
+            const { scrollLeft: d } = c, b = Y.find((g)=>g - d > 1);
             c.scrollTo({
-                left: p,
+                left: b,
                 behavior: "smooth"
             });
         }
     }, [
-        U
-    ]), le = ve(!!x, l);
+        Y
+    ]), ne = Pe(!!x, l);
     _react.useEffect(()=>{
-        h !== void 0 && L(Math.floor(h / P), !1);
+        m !== void 0 && L(Math.floor(m / C), !1);
     }, [
-        h,
+        m,
         L,
-        P
+        C
     ]), _react.useEffect(()=>{
-        if (le && x) {
-            const c = typeof x == "boolean" ? ke : x.time, d = typeof x == "object" && x.loop, p = setInterval(()=>{
+        if (ne && x) {
+            const c = typeof x == "boolean" ? Se : x.time, d = typeof x == "object" && x.loop, b = setInterval(()=>{
                 var g;
-                G !== 0 ? O() : d && ((g = l.current) == null || g.scrollTo({
+                D !== 0 ? G() : d && ((g = l.current) == null || g.scrollTo({
                     left: 0,
                     behavior: "smooth"
                 }));
             }, c);
-            return ()=>clearInterval(p);
+            return ()=>clearInterval(b);
         }
     }, [
         x,
-        O,
         G,
-        le
+        D,
+        ne
     ]);
-    const M = Pt(D, K), ne = _react.useRef(!h), ce = _react.useRef(0);
+    const k = Mt(A, U), ce = _react.useRef(!m), ae = _react.useRef(0);
     _react.useEffect(()=>{
-        if (y) {
-            const c = Math.min((M + 1) * P - 1, t.length - 1), d = [];
-            for(let p = 0; p < P; p++){
-                const g = c - p;
+        if (N) {
+            const c = Math.min((k + 1) * C - 1, t.length - 1), d = [];
+            for(let b = 0; b < C; b++){
+                const g = c - b;
                 g >= 0 && d.unshift(g);
             }
-            ne.current ? ce.current !== M && y({
-                pageIndex: M,
+            ce.current ? ae.current !== k && N({
+                pageIndex: k,
                 shownItemIndexes: d
-            }) : ne.current = d.includes(h || 0), ce.current = M;
+            }) : ce.current = d.includes(m || 0), ae.current = k;
         }
     }, [
-        M,
+        k,
         t.length,
-        P,
-        h,
-        y
+        C,
+        m,
+        N
     ]);
-    const T = _react.useContext(re), ee = _react.useMemo(()=>({
-            currentIndex: M,
+    const T = _react.useContext(le), te = _react.useMemo(()=>({
+            currentIndex: k,
             numPages: {
-                mobile: m,
+                mobile: p,
                 tablet: v,
-                desktop: k
+                desktop: M
             }
         }), [
-        M,
         k,
-        m,
+        M,
+        p,
         v
     ]);
     _react.useEffect(()=>{
-        T && (T.setGoPrev(X), T.setGoNext(O), T.setGoToPage(L), T.setBulletsProps(ee));
+        T && (T.setGoPrev(ee), T.setGoNext(G), T.setGoToPage(L), T.setBulletsProps(te));
     }, [
         T,
-        O,
-        X,
+        G,
         ee,
+        te,
         L
     ]);
-    let Y = null;
-    i ? Y = i({
+    let q = null;
+    i ? q = i({
         numPages: E,
-        currentIndex: M,
+        currentIndex: k,
         onPress: L
-    }) : r && (Y = /* @__PURE__ */ (0, _jsxruntime.jsx)(xe, _object_spread_props(_object_spread({}, ee), {
+    }) : r && (q = /* @__PURE__ */ (0, _jsxruntime.jsx)(we, _object_spread_props(_object_spread({}, te), {
         onPress: L
     })));
-    const Be = "64px", ye = "36px";
+    const Ae = "64px", De = "36px";
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", _object_spread_props(_object_spread({}, (0, _dom.getPrefixedDataAttributes)(_object_spread({
         "component-name": "Carousel"
-    }, W))), {
+    }, J))), {
         children: [
             /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
                 className: _carouselcssmistica.carouselContainer,
@@ -431,16 +432,16 @@ const ve = (t, e)=>{
                         isInverse: !1,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
                             className: _carouselcssmistica.carouselPrevArrowButton,
-                            "aria-label": I.carouselPrevButton,
-                            onPress: X,
-                            disabled: !Te,
+                            "aria-label": R.carouselPrevButton || F(_texttokens.carouselPrevButton),
+                            onPress: ee,
+                            disabled: !We,
                             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconchevronleftregular.default, {})
                         })
                     }),
                     /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                         className: (0, _classnames.default)(_carouselcssmistica.carousel, {
-                            [_carouselcssmistica.centeredCarousel]: N,
-                            [_carouselcssmistica.carouselWithScrollMobile]: m > 1,
+                            [_carouselcssmistica.centeredCarousel]: h,
+                            [_carouselcssmistica.carouselWithScrollMobile]: p > 1,
                             [_carouselcssmistica.carouselWithScrollTablet]: v > 1
                         }),
                         style: _object_spread_props(_object_spread({}, (0, _css.applyCssVars)(_object_spread({
@@ -448,25 +449,25 @@ const ve = (t, e)=>{
                             [_carouselcssmistica.vars.itemsPerPageTablet]: String(a.tablet),
                             [_carouselcssmistica.vars.itemsPerPageMobile]: String(a.mobile)
                         }, f === "large" ? {
-                            [_carouselcssmistica.vars.mobilePageOffset]: Be
-                        } : H === _constants.VIVO_NEW_SKIN ? {
-                            [_carouselcssmistica.vars.mobilePageOffset]: ye
-                        } : {}, C !== void 0 ? {
-                            [_carouselcssmistica.vars.gap]: String(C)
+                            [_carouselcssmistica.vars.mobilePageOffset]: Ae
+                        } : j === _constants.VIVO_NEW_SKIN ? {
+                            [_carouselcssmistica.vars.mobilePageOffset]: De
+                        } : {}, S !== void 0 ? {
+                            [_carouselcssmistica.vars.gap]: String(S)
                         } : {}))), {
-                            scrollSnapType: b ? "initial" : "x mandatory",
+                            scrollSnapType: I ? "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: (0, _platform.isIos)(S) && !(0, _platform.isRunningAcceptanceTest)(S) ? 0.5 : void 0
+                            paddingBottom: (0, _platform.isIos)(w) && !(0, _platform.isRunningAcceptanceTest)(w) ? 0.5 : void 0
                         }),
                         ref: l,
                         children: t.map((c, d)=>/* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                                 className: (0, _classnames.default)(_carouselcssmistica.carouselItem, s),
                                 style: _object_spread_props(_object_spread({}, e), {
-                                    scrollSnapStop: (0, _platform.isAndroid)(S) ? "always" : "normal"
+                                    scrollSnapStop: (0, _platform.isAndroid)(w) ? "always" : "normal"
                                 }),
                                 "data-item": !0,
                                 children: c
@@ -476,25 +477,25 @@ const ve = (t, e)=>{
                         isInverse: !1,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
                             className: _carouselcssmistica.carouselNextArrowButton,
-                            "aria-label": I.carouselNextButton,
-                            onPress: O,
-                            disabled: !Le,
+                            "aria-label": R.carouselNextButton || F(_texttokens.carouselNextButton),
+                            onPress: G,
+                            disabled: !ye,
                             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconchevronrightregular.default, {})
                         })
                     })
                 ]
             }),
-            Y && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+            q && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: (0, _classnames.default)(_carouselcssmistica.carouselBullets, !i && {
-                    [_carouselcssmistica.noCarouselBulletsDesktop]: k <= 1,
+                    [_carouselcssmistica.noCarouselBulletsDesktop]: M <= 1,
                     [_carouselcssmistica.noCarouselBulletsTablet]: v <= 1,
-                    [_carouselcssmistica.noCarouselBulletsMobile]: m <= 1
+                    [_carouselcssmistica.noCarouselBulletsMobile]: p <= 1
                 }),
-                children: Y
+                children: q
             })
         ]
     }));
-}, Ne = ()=>{
+}, Be = ()=>{
     const [t, e] = _react.useState(1);
     return _react.useEffect(()=>{
         const s = ()=>{
@@ -504,15 +505,15 @@ const ve = (t, e)=>{
             window.removeEventListener("resize", s);
         };
     }, []), t;
-}, Ft = (t)=>{
-    const e = Ne();
-    return /* @__PURE__ */ /*#__PURE__*/ (0, _react.createElement)(Me, _object_spread_props(_object_spread({}, t), {
+}, qt = (t)=>{
+    const e = Be();
+    return /* @__PURE__ */ /*#__PURE__*/ (0, _react.createElement)(Re, _object_spread_props(_object_spread({}, t), {
         key: e
     }));
-}, Kt = (param)=>{
-    let { items: t, itemStyle: e, itemClassName: s, withBullets: r, renderBullets: i, initialActiveItem: h, onPageChange: w, dataAttributes: u } = param;
-    const f = Ne();
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(Me, {
+}, Zt = (param)=>{
+    let { items: t, itemStyle: e, itemClassName: s, withBullets: r, renderBullets: i, initialActiveItem: m, onPageChange: P, dataAttributes: u } = param;
+    const f = Be();
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(Re, {
         items: t,
         itemStyle: e,
         itemClassName: s,
@@ -526,62 +527,62 @@ const ve = (t, e)=>{
         gap: 0,
         withBullets: r,
         renderBullets: i,
-        initialActiveItem: h,
-        onPageChange: w,
+        initialActiveItem: m,
+        onPageChange: P,
         dataAttributes: u
     }, f);
-}, Se = /*#__PURE__*/ _react.createContext(void 0), Ut = ()=>_react.useContext(Se), Yt = (param)=>{
-    let { items: t, withBullets: e, autoplay: s, initialPageIndex: r = 0, onPageChange: i, dataAttributes: h, inverseBullets: w = !0 } = param;
-    const { texts: u, platformOverrides: f } = (0, _hooks.useTheme)(), C = _react.useContext(re), b = _react.useRef(null), [{ scrollLeft: N, scrollRight: x }, y] = _react.useState({
+}, Ee = /*#__PURE__*/ _react.createContext(void 0), $t = ()=>_react.useContext(Ee), Ht = (param)=>{
+    let { items: t, withBullets: e, autoplay: s, initialPageIndex: r = 0, onPageChange: i, dataAttributes: m, inverseBullets: P = !0 } = param;
+    const { texts: u, platformOverrides: f, t: S } = (0, _hooks.useTheme)(), I = _react.useContext(le), h = _react.useRef(null), [{ scrollLeft: x, scrollRight: N }, J] = _react.useState({
         scrollLeft: 0,
         scrollRight: 0
-    }), W = _react.useCallback(()=>{
-        const l = b.current;
+    }), R = _react.useCallback(()=>{
+        const l = h.current;
         l && l.scrollBy({
             left: -l.clientWidth,
             behavior: "smooth"
         });
-    }, []), I = _react.useCallback(()=>{
-        const l = b.current;
+    }, []), w = _react.useCallback(()=>{
+        const l = h.current;
         l && l.scrollBy({
             left: l.clientWidth,
             behavior: "smooth"
         });
-    }, []), S = _react.useCallback(function(l) {
-        let m = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0;
-        const v = b.current;
+    }, []), j = _react.useCallback(function(l) {
+        let p = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0;
+        const v = h.current;
         v && v.scrollTo({
             left: v.clientWidth * l,
-            behavior: m ? "smooth" : "auto"
+            behavior: p ? "smooth" : "auto"
         });
     }, [
-        b
-    ]), H = x !== 0, J = N !== 0, a = b.current ? Math.floor((N + b.current.clientWidth / 2) / b.current.clientWidth) : 0;
+        h
+    ]), F = N !== 0, Q = x !== 0, a = h.current ? Math.floor((x + h.current.clientWidth / 2) / h.current.clientWidth) : 0;
     _react.useLayoutEffect(()=>{
-        const l = b.current;
+        const l = h.current;
         if (l) {
-            const m = ()=>{
-                const { scrollWidth: k, clientWidth: E } = l, D = Math.round(l.scrollLeft), G = Math.round(k - (D + E));
-                y({
-                    scrollLeft: D,
-                    scrollRight: G
+            const p = ()=>{
+                const { scrollWidth: M, clientWidth: E } = l, A = Math.round(l.scrollLeft), D = Math.round(M - (A + E));
+                J({
+                    scrollLeft: A,
+                    scrollRight: D
                 });
             };
-            m(), l.addEventListener("scroll", m);
-            const v = (0, _dom.listenResize)(l, m);
+            p(), l.addEventListener("scroll", p);
+            const v = (0, _dom.listenResize)(l, p);
             return ()=>{
-                l.removeEventListener("scroll", m), v();
+                l.removeEventListener("scroll", p), v();
             };
         }
     }, [
         t.length
     ]);
-    const R = ve(!!s, b);
+    const B = Pe(!!s, h);
     _react.useEffect(()=>{
-        if (R && s) {
-            const l = typeof s == "boolean" ? ke : s.time, m = typeof s == "object" && s.loop, v = setInterval(()=>{
-                var k;
-                x !== 0 ? I() : m && ((k = b.current) == null || k.scrollTo({
+        if (B && s) {
+            const l = typeof s == "boolean" ? Se : s.time, p = typeof s == "object" && s.loop, v = setInterval(()=>{
+                var M;
+                N !== 0 ? w() : p && ((M = h.current) == null || M.scrollTo({
                     left: 0,
                     behavior: "smooth"
                 }));
@@ -590,26 +591,26 @@ const ve = (t, e)=>{
         }
     }, [
         s,
-        I,
-        x,
-        R
+        w,
+        N,
+        B
     ]);
-    const A = _react.useRef(!1), F = _react.useRef(0);
+    const W = _react.useRef(!1), K = _react.useRef(0);
     _react.useEffect(()=>{
-        i && (A.current ? F.current !== a && i(a) : A.current = r === a), F.current = a;
+        i && (W.current ? K.current !== a && i(a) : W.current = r === a), K.current = a;
     }, [
         a,
         r,
         i
     ]), _react.useEffect(()=>{
-        const l = b.current;
-        r !== void 0 && l && !A.current && l.scrollTo({
+        const l = h.current;
+        r !== void 0 && l && !W.current && l.scrollTo({
             left: l.clientWidth * r
         });
     }, [
         r
     ]);
-    const P = _react.useMemo(()=>({
+    const C = _react.useMemo(()=>({
             currentIndex: a,
             numPages: t.length
         }), [
@@ -617,14 +618,14 @@ const ve = (t, e)=>{
         t.length
     ]);
     return _react.useEffect(()=>{
-        C && (C.setGoPrev(W), C.setGoNext(I), C.setGoToPage(S), C.setBulletsProps(P));
+        I && (I.setGoPrev(R), I.setGoNext(w), I.setGoToPage(j), I.setBulletsProps(C));
     }, [
-        C,
         I,
-        W,
-        P,
-        S
-    ]), /* @__PURE__ */ (0, _jsxruntime.jsx)(Se.Provider, {
+        w,
+        R,
+        C,
+        j
+    ]), /* @__PURE__ */ (0, _jsxruntime.jsx)(Ee.Provider, {
         value: {
             withBullets: !!e
         },
@@ -634,15 +635,15 @@ const ve = (t, e)=>{
                 className: (0, _classnames.default)(_carouselcssmistica.slideshowContainer, {
                     [_carouselcssmistica.slideshowWithBullets]: !!e
                 })
-            }, (0, _dom.getPrefixedDataAttributes)(h, "SlideShow")), {
+            }, (0, _dom.getPrefixedDataAttributes)(m, "SlideShow")), {
                 children: [
                     /* @__PURE__ */ (0, _jsxruntime.jsx)(_themevariantcontext.ThemeVariant, {
                         isInverse: !1,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
                             className: _carouselcssmistica.slideshowPrevArrowButton,
-                            "aria-label": u.carouselPrevButton,
-                            onPress: W,
-                            disabled: !J,
+                            "aria-label": u.carouselPrevButton || S(_texttokens.carouselPrevButton),
+                            onPress: R,
+                            disabled: !Q,
                             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconchevronleftregular.default, {})
                         })
                     }),
@@ -652,31 +653,31 @@ const ve = (t, e)=>{
                         }),
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                             className: _carouselcssmistica.slideshow,
-                            ref: b,
-                            children: t.map((l, m)=>/* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                            ref: h,
+                            children: t.map((l, p)=>/* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                                     className: _carouselcssmistica.slideshowItem,
                                     style: {
                                         scrollSnapStop: (0, _platform.isAndroid)(f) ? "always" : "normal"
                                     },
                                     children: l
-                                }, m))
+                                }, p))
                         })
                     }),
                     /* @__PURE__ */ (0, _jsxruntime.jsx)(_themevariantcontext.ThemeVariant, {
                         isInverse: !1,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
                             className: _carouselcssmistica.slideshowNextArrowButton,
-                            "aria-label": u.carouselNextButton,
-                            onPress: I,
-                            disabled: !H,
+                            "aria-label": u.carouselNextButton || S(_texttokens.carouselNextButton),
+                            onPress: w,
+                            disabled: !F,
                             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconchevronrightregular.default, {})
                         })
                     }),
                     e && t.length > 1 && /* @__PURE__ */ (0, _jsxruntime.jsx)(_themevariantcontext.ThemeVariant, {
-                        isInverse: w,
+                        isInverse: P,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                             className: _carouselcssmistica.slideshowBullets,
-                            children: /* @__PURE__ */ (0, _jsxruntime.jsx)(xe, _object_spread({}, P))
+                            children: /* @__PURE__ */ (0, _jsxruntime.jsx)(we, _object_spread({}, C))
                         })
                     })
                 ]