@telefonica/mistica 16.70.0 → 16.72.0

package/dist-es/loading-bar.css-mistica.js

@@ -1,2 +1,2 @@
-/* empty css                                     */ /* empty css                                       */ var n = "v16_70_1num3qg2 v16_70_1num3qg1 v16_70_1y2v1nfq0 v16_70_1y2v1nfte v16_70_1y2v1nftt v16_70_1y2v1nfu8", r = "v16_70_1num3qg3", y = "v16_70_1num3qg4 v16_70_1y2v1nfqr v16_70_1y2v1nft8 v16_70_1y2v1nfpy v16_70_1y2v1nfbx v16_70_1y2v1nfrb", f = "v16_70_1num3qg7 v16_70_1num3qg6 v16_70_1y2v1nfpz v16_70_1y2v1nfqr v16_70_1y2v1nfr8";
+/* empty css                                     */ /* empty css                                       */ var n = "v16_72_1num3qg2 v16_72_1num3qg1 v16_72_1y2v1nfq0 v16_72_1y2v1nftd v16_72_1y2v1nfts v16_72_1y2v1nfu7", r = "v16_72_1num3qg3", y = "v16_72_1num3qg4 v16_72_1y2v1nfqr v16_72_1y2v1nft7 v16_72_1y2v1nfpy v16_72_1y2v1nfbx v16_72_1y2v1nfrb", f = "v16_72_1num3qg7 v16_72_1num3qg6 v16_72_1y2v1nfpz v16_72_1y2v1nfqr v16_72_1y2v1nfr8";
 export { r as hidden, n as portal, f as progress, y as progressContainer };

package/dist-es/loading-bar.js

@@ -52,21 +52,23 @@ function _object_spread_props(target, source) {
     return target;
 }
 import { jsx as r } from "react/jsx-runtime";
-import { Portal as e } from "./portal.js";
-import { progressContainer as s, progress as t, portal as i, hidden as m } from "./loading-bar.css-mistica.js";
+import { Portal as t } from "./portal.js";
+import { progressContainer as e, progress as s, portal as i, hidden as m } from "./loading-bar.css-mistica.js";
 import { getPrefixedDataAttributes as d } from "./utils/dom.js";
 import n from "classnames";
 const h = (param)=>{
     let { visible: a, dataAttributes: o } = param;
-    return /* @__PURE__ */ r(e, {
+    return /* @__PURE__ */ r(t, {
         className: n(i, {
             [m]: !a
         }),
         children: /* @__PURE__ */ r("div", _object_spread_props(_object_spread({
-            className: s
-        }, d(o, "LoadingBar")), {
+            className: e
+        }, d(_object_spread({
+            testid: "LoadingBar"
+        }, o))), {
             children: /* @__PURE__ */ r("div", {
-                className: t
+                className: s
             })
         }))
     });

package/dist-es/loading-screen.css-mistica.js

@@ -1,5 +1,5 @@
-/* empty css                                     */ /* empty css                                          */ var e = "v16_70_flke8b1 v16_70_flke8b0 v16_70_1y2v1nfq4 v16_70_1y2v1nfqa v16_70_1y2v1nfqj", n = 500, a = "v16_70_flke8b3", r = {
-    default: "v16_70_flke8b4",
-    brand: "v16_70_flke8b5"
-}, f = "v16_70_flke8b6", l = "v16_70_flke8b7 v16_70_1y2v1nfqq v16_70_1y2v1nfq4 v16_70_1y2v1nfqa v16_70_1y2v1nfqj v16_70_1y2v1nfqd", d = "v16_70_flke8b9 v16_70_flke8b8 v16_70_1y2v1nfgi", k = "v16_70_flke8bb", o = "v16_70_flke8bc", b = "v16_70_flke8be", i = "v16_70_flke8bf";
+/* empty css                                     */ /* empty css                                          */ var e = "v16_72_flke8b1 v16_72_flke8b0 v16_72_1y2v1nfq4 v16_72_1y2v1nfqa v16_72_1y2v1nfqj", n = 500, a = "v16_72_flke8b3", r = {
+    default: "v16_72_flke8b4",
+    brand: "v16_72_flke8b5"
+}, f = "v16_72_flke8b6", l = "v16_72_flke8b7 v16_72_1y2v1nfqq v16_72_1y2v1nfq4 v16_72_1y2v1nfqa v16_72_1y2v1nfqj v16_72_1y2v1nfqd", d = "v16_72_flke8b9 v16_72_flke8b8 v16_72_1y2v1nfgi", k = "v16_72_flke8bb", o = "v16_72_flke8bc", b = "v16_72_flke8be", i = "v16_72_flke8bf";
 export { n as inOutAnimationMs, e as loadingScreen, l as loadingScreenChildren, d as loadingScreenText, k as loadingScreenTextAnimated, o as loadingScreenTextAnimatedOut, i as logo, b as pulseLogo, r as screenBackground, a as screenBackgroundAnimated, f as screenBackgroundFadeOut };

package/dist-es/loading-screen.js

@@ -78,43 +78,43 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-import { jsx as t, jsxs as b } from "react/jsx-runtime";
-import * as o from "react";
-import { useSetOverscrollColor as k } from "./overscroll-color-context.js";
-import { ThemeVariant as R } from "./theme-variant-context.js";
+import { jsx as t, jsxs as T } from "react/jsx-runtime";
+import * as s from "react";
+import { useSetOverscrollColor as I } from "./overscroll-color-context.js";
+import { ThemeVariant as k } from "./theme-variant-context.js";
 import { vars as h } from "./skins/skin-contract.css-mistica.js";
-import B from "./responsive-layout.js";
-import { Text as I, getTextSizes as N, Text2 as O } from "./text.js";
-import w from "./stack.js";
-import { inOutAnimationMs as x, loadingScreenChildren as V, loadingScreen as P, screenBackground as z, screenBackgroundAnimated as j, screenBackgroundFadeOut as D, loadingScreenTextAnimated as y, loadingScreenText as L, loadingScreenTextAnimatedOut as _, logo as F, pulseLogo as K } from "./loading-screen.css-mistica.js";
+import N from "./responsive-layout.js";
+import { Text as R, getTextSizes as B, Text2 as O } from "./text.js";
+import V from "./stack.js";
+import { inOutAnimationMs as x, loadingScreenChildren as w, loadingScreen as P, screenBackground as z, screenBackgroundAnimated as j, screenBackgroundFadeOut as D, loadingScreenTextAnimated as y, loadingScreenText as L, loadingScreenTextAnimatedOut as _, logo as K, pulseLogo as F } from "./loading-screen.css-mistica.js";
 import M from "./spinner.js";
-import v from "classnames";
-import { Logo as W } from "./logo.js";
+import C from "classnames";
+import { Logo as U } from "./logo.js";
 import $ from "./screen-reader-only.js";
-import { useTheme as T } from "./hooks.js";
-import { VIVO_NEW_SKIN as q } from "./skins/constants.js";
-import { getPrefixedDataAttributes as G } from "./utils/dom.js";
-import { loading as H } from "./text-tokens.js";
-const J = (param)=>{
+import { useTheme as b } from "./hooks.js";
+import { VIVO_SKIN as q, VIVO_EVOLUTION_SKIN as G } from "./skins/constants.js";
+import { getPrefixedDataAttributes as H } from "./utils/dom.js";
+import { loading as J } from "./text-tokens.js";
+const Q = (param)=>{
     let { isBrandVariant: e } = param;
     const r = `body {background:${e ? h.colors.backgroundBrand : h.colors.background}}`;
     return /* @__PURE__ */ t("style", {
         children: r
     });
-}, Q = (param)=>{
-    let { animateText: e, isLoading: r, onClose: n, texts: s } = param;
-    const { textPresets: c } = T(), [i, u] = o.useState(0), [a, d] = o.useState(!1), l = o.useCallback(()=>{
-        u((i + 1) % s.length), d(!1);
+}, W = (param)=>{
+    let { animateText: e, isLoading: r, onClose: n, texts: o } = param;
+    const { textPresets: c } = b(), [i, u] = s.useState(0), [a, d] = s.useState(!1), l = s.useCallback(()=>{
+        u((i + 1) % o.length), d(!1);
     }, [
         i,
-        s.length
+        o.length
     ]);
-    o.useEffect(()=>{
-        if (!r || s.length === 1) return;
-        var _s_i_duration;
+    s.useEffect(()=>{
+        if (!r || o.length === 1) return;
+        var _o_i_duration;
         const S = setTimeout(()=>{
             e ? d(!0) : l();
-        }, (_s_i_duration = s[i].duration) !== null && _s_i_duration !== void 0 ? _s_i_duration : 5e3);
+        }, (_o_i_duration = o[i].duration) !== null && _o_i_duration !== void 0 ? _o_i_duration : 5e3);
         return ()=>{
             clearTimeout(S);
         };
@@ -124,7 +124,7 @@ const J = (param)=>{
         a,
         r,
         l,
-        s
+        o
     ]);
     const f = ()=>{
         if (!r) {
@@ -132,19 +132,19 @@ const J = (param)=>{
             return;
         }
         a && l();
-    }, { title: m, description: g } = s[i % s.length];
-    return /* @__PURE__ */ t(B, {
+    }, { title: m, description: g } = o[i % o.length];
+    return /* @__PURE__ */ t(N, {
         children: /* @__PURE__ */ t("div", {
-            className: v(L, {
+            className: C(L, {
                 [_]: e && (!r || a)
             }),
             onTransitionEnd: f,
-            children: /* @__PURE__ */ b(w, {
+            children: /* @__PURE__ */ T(V, {
                 space: 8,
                 children: [
                     m && /* @__PURE__ */ t("div", {
                         className: e ? y : void 0,
-                        children: /* @__PURE__ */ t(I, _object_spread_props(_object_spread({}, N({
+                        children: /* @__PURE__ */ t(R, _object_spread_props(_object_spread({}, B({
                             textPreset: c.loadingScreenTitle
                         })), {
                             textAlign: "center",
@@ -170,15 +170,15 @@ const J = (param)=>{
             })
         }, i)
     });
-}, E = /*#__PURE__*/ o.forwardRef((param, f)=>{
-    let { variant: e, children: r, isLoading: n = !0, animateText: s, animateBackground: c, onClose: i, dataAttributes: u, title: a, description: d, texts: l = [
+}, E = /*#__PURE__*/ s.forwardRef((param, f)=>{
+    let { variant: e, children: r, isLoading: n = !0, animateText: o, animateBackground: c, onClose: i, dataAttributes: u, title: a, description: d, texts: l = [
         {
             title: a,
             description: d
         }
     ] } = param;
-    const [m, g] = o.useState(!1);
-    o.useEffect(()=>{
+    const [m, g] = s.useState(!1);
+    s.useEffect(()=>{
         if (!n) return;
         const A = setTimeout(()=>{
             g(!0);
@@ -189,15 +189,15 @@ const J = (param)=>{
     }, [
         n
     ]);
-    const S = o.useRef(!1), p = o.useCallback(()=>{
+    const S = s.useRef(!1), p = s.useCallback(()=>{
         !n && !S.current && (S.current = !0, i === null || i === void 0 ? void 0 : i());
     }, [
         n,
         i
     ]);
-    o.useEffect(()=>{
+    s.useEffect(()=>{
         if (n) return;
-        if (!s && !c) {
+        if (!o && !c) {
             i === null || i === void 0 ? void 0 : i();
             return;
         }
@@ -209,26 +209,26 @@ const J = (param)=>{
         };
     }, [
         c,
-        s,
+        o,
         p,
         n,
         i
     ]);
-    const C = !r;
-    return k(e === "brand" ? {
+    const v = !r;
+    return I(e === "brand" ? {
         topColor: h.colors.backgroundBrandTop
-    } : {}), /* @__PURE__ */ b(R, {
+    } : {}), /* @__PURE__ */ T(k, {
         variant: e,
         children: [
-            /* @__PURE__ */ b("div", _object_spread_props(_object_spread({
+            /* @__PURE__ */ T("div", _object_spread_props(_object_spread({
                 ref: f
-            }, G(u)), {
-                className: v(P, z[e], {
+            }, H(u)), {
+                className: C(P, z[e], {
                     [D]: !n && c,
                     [j]: c
                 }),
                 style: {
-                    justifyContent: C ? "center" : "space-between"
+                    justifyContent: v ? "center" : "space-between"
                 },
                 onAnimationEnd: ()=>{
                     g(!0);
@@ -236,85 +236,85 @@ const J = (param)=>{
                 onTransitionEnd: p,
                 children: [
                     r ? /* @__PURE__ */ t("div", {
-                        className: V,
+                        className: w,
                         children: r
                     }) : /* @__PURE__ */ t(M, {
                         delay: "0s",
                         size: 32,
                         color: e === "brand" ? h.colors.inverse : void 0
                     }),
-                    /* @__PURE__ */ t(Q, {
-                        animateText: s,
+                    /* @__PURE__ */ t(W, {
+                        animateText: o,
                         isLoading: n,
                         texts: l,
                         onClose: p
                     }),
-                    !C && /* @__PURE__ */ t("div", {
+                    !v && /* @__PURE__ */ t("div", {
                         style: {
                             height: 104
                         }
                     })
                 ]
             })),
-            n && m && /* @__PURE__ */ t(J, {
+            n && m && /* @__PURE__ */ t(Q, {
                 isBrandVariant: e === "brand"
             })
         ]
     });
-}), he = /*#__PURE__*/ o.forwardRef((e, r)=>{
+}), Se = /*#__PURE__*/ s.forwardRef((e, r)=>{
     var _e_variant;
     return /* @__PURE__ */ t(E, _object_spread_props(_object_spread({
         ref: r
     }, e), {
-        variant: (_e_variant = e.variant) !== null && _e_variant !== void 0 ? _e_variant : e.isInverse ? "brand" : "default",
+        variant: (_e_variant = e.variant) !== null && _e_variant !== void 0 ? _e_variant : "default",
         dataAttributes: _object_spread({
             "component-name": "LoadingScreen"
         }, e.dataAttributes),
         animateBackground: !0
     }));
-}), U = (param)=>{
+}), X = (param)=>{
     let { isLoading: e, onCloseStart: r, onCloseEnd: n } = param;
-    const { texts: s, t: c } = T(), [i, u] = o.useState(!0), a = ()=>{
+    const { texts: o, t: c } = b(), [i, u] = s.useState(!0), a = ()=>{
         e || (r === null || r === void 0 ? void 0 : r(), u(!1), n === null || n === void 0 ? void 0 : n());
     };
-    return /* @__PURE__ */ b("div", {
-        className: v(F, {
-            [K]: i
+    return /* @__PURE__ */ T("div", {
+        className: C(K, {
+            [F]: i
         }),
         onAnimationIteration: a,
         children: [
             /* @__PURE__ */ t($, {
                 children: /* @__PURE__ */ t("div", {
-                    children: s.loading || c(H)
+                    children: o.loading || c(J)
                 })
             }),
-            /* @__PURE__ */ t(W, {
+            /* @__PURE__ */ t(U, {
                 size: 128
             })
         ]
     });
-}, X = /*#__PURE__*/ o.lazy(()=>import("./vivinho-loading-animation/index.js")), Y = (param)=>{
+}, Y = /*#__PURE__*/ s.lazy(()=>import("./vivinho-loading-animation/index.js")), Z = (param)=>{
     let { isLoading: e, onCloseStart: r, onCloseEnd: n } = param;
-    const { skinName: s } = T();
-    return s === q ? /* @__PURE__ */ t(o.Suspense, {
+    const { skinName: o } = b();
+    return o === q || o === G ? /* @__PURE__ */ t(s.Suspense, {
         fallback: null,
-        children: /* @__PURE__ */ t(X, {
+        children: /* @__PURE__ */ t(Y, {
             isLoading: e,
             onCloseStart: r,
             onCloseEnd: n
         })
-    }) : /* @__PURE__ */ t(U, {
+    }) : /* @__PURE__ */ t(X, {
         isLoading: e,
         onCloseStart: r,
         onCloseEnd: n
     });
-}, Se = /*#__PURE__*/ o.forwardRef((_param, c)=>{
-    var { isLoading: e = !0, onClose: r, dataAttributes: n } = _param, s = _object_without_properties(_param, [
+}, pe = /*#__PURE__*/ s.forwardRef((_param, c)=>{
+    var { isLoading: e = !0, onClose: r, dataAttributes: n } = _param, o = _object_without_properties(_param, [
         "isLoading",
         "onClose",
         "dataAttributes"
     ]);
-    const { themeVariants: i } = T(), [u, a] = o.useState(!1), d = o.useRef(!1), l = o.useRef(!1), f = ()=>{
+    const { themeVariants: i } = b(), [u, a] = s.useState(!1), d = s.useRef(!1), l = s.useRef(!1), f = ()=>{
         a(!0);
     }, m = ()=>{
         d.current && l.current && (r === null || r === void 0 ? void 0 : r());
@@ -322,16 +322,16 @@ const J = (param)=>{
     return /* @__PURE__ */ t(E, _object_spread_props(_object_spread({
         ref: c,
         variant: i.brandLoadingScreen === "inverse" || i.brandLoadingScreen === "brand" ? "brand" : "default"
-    }, s), {
+    }, o), {
         isLoading: e || !u,
         onClose: ()=>{
             l.current = !0, m();
         },
         animateText: !0,
         dataAttributes: _object_spread({
-            "component-name": "BrandLoadingScreen"
+            testid: "BrandLoadingScreen"
         }, n),
-        children: /* @__PURE__ */ t(Y, {
+        children: /* @__PURE__ */ t(Z, {
             isLoading: e,
             onCloseStart: f,
             onCloseEnd: ()=>{
@@ -340,4 +340,4 @@ const J = (param)=>{
         })
     }));
 });
-export { Se as BrandLoadingScreen, he as LoadingScreen };
+export { pe as BrandLoadingScreen, Se as LoadingScreen };

package/dist-es/logo-movistar-shell.js

@@ -4,7 +4,7 @@ import { calcInlineVars as m } from "./logo-common.js";
 import { applyCssVars as i } from "./utils/css.js";
 const f = (param)=>{
     let { size: o, type: r, children: s } = param;
-    const t = r === "imagotype" ? "0 0 195 72" : "0 0 72 72";
+    const t = r === "imagotype" ? "0 0 203 72" : "0 0 72 72";
     return /* @__PURE__ */ e("svg", {
         className: a,
         style: i(m(o)),