@telefonica/mistica 15.2.0 → 15.3.0

package/dist-es/text-field-base.js

@@ -82,14 +82,14 @@ import { jsx as n, jsxs as ie } from "react/jsx-runtime";
 import * as d from "react";
 import { FieldContainer as ne, HelperText as ae, Label as re } from "./text-field-components.js";
 import { LABEL_SCALE_MOBILE as le, LABEL_SCALE_DESKTOP as oe } from "./text-field-components.css-mistica.js";
-import { Text3 as N } from "./text.js";
+import { Text3 as F } from "./text.js";
 import { isFirefox as de, isRunningAcceptanceTest as se } from "./utils/platform.js";
 import { useAriaId as L, useScreenSize as ce, useIsomorphicLayoutEffect as fe, useTheme as ue } from "./hooks.js";
 import v from "classnames";
 import { combineRefs as k } from "./utils/common.js";
 import { startIcon as me, prefix as he, inputWithLabel as _, inputWithoutLabel as G, fullWidth as ge, fieldRightPadding as j, fieldLeftPadding as T, textArea as pe, textAreaWithLabel as Se, textAreaWithoutLabel as xe, input as be, inputFirefoxStyles as ye, hiddenDatePlaceholder as Ce, emptyDateValue as Ee, endIconContainer as Ie, menuItem as Re, menuItemSelected as Te, suggestionsContainer as ve, fieldEndIconContainer as Le, fieldElementsGap as Ae, iconButtonSize as $e, fieldEndIconGap as We } from "./text-field-base.css-mistica.js";
-import { vars as Ne } from "./skins/skin-contract.css-mistica.js";
-import { InternalToggleIconButton as Fe, InternalIconButton as we } from "./icon-button.js";
+import { vars as Fe } from "./skins/skin-contract.css-mistica.js";
+import { InternalToggleIconButton as Ne, InternalIconButton as we } from "./icon-button.js";
 import { ThemeVariant as Pe } from "./theme-variant-context.js";
 import { iconSize as Oe } from "./icon-button.css-mistica.js";
 const Be = (o, f)=>{
@@ -100,7 +100,7 @@ const Be = (o, f)=>{
     let { hasBackgroundColor: o = !0, onPress: f, onChange: i, disabled: m, Icon: g, checkedProps: r, uncheckedProps: a, "aria-label": h } = param;
     return /* @__PURE__ */ n("div", {
         className: Le,
-        children: r ? /* @__PURE__ */ n(Fe, {
+        children: r ? /* @__PURE__ */ n(Ne, {
             checkedProps: _object_spread_props(_object_spread({}, r), {
                 "aria-label": r["aria-label"] || ""
             }),
@@ -119,7 +119,7 @@ const Be = (o, f)=>{
         })
     });
 }, W = /*#__PURE__*/ d.forwardRef((_param, U)=>{
-    var { error: o, helperText: f, label: i, inputProps: m, inputRef: g, defaultValue: r, value: a, onFocus: h, onBlur: x, inputComponent: p, prefix: b, startIcon: t, endIcon: u, endIconOverlay: S, shrinkLabel: F, multiline: R = !1, focus: y, fieldRef: H, maxLength: C, id: K, autoComplete: M, fullWidth: J, dataAttributes: Q } = _param, l = _object_without_properties(_param, [
+    var { error: o, helperText: f, label: i, inputProps: m, inputRef: g, defaultValue: r, value: a, onFocus: h, onBlur: x, inputComponent: p, prefix: b, startIcon: t, endIcon: u, endIconOverlay: S, shrinkLabel: N, multiline: R = !1, focus: y, fieldRef: H, maxLength: C, id: K, autoComplete: M, fullWidth: J, dataAttributes: Q } = _param, l = _object_without_properties(_param, [
         "error",
         "helperText",
         "label",
@@ -167,7 +167,7 @@ const Be = (o, f)=>{
     }, I = _object_spread(_object_spread_props(_object_spread({}, l), {
         maxLength: C,
         autoComplete: M
-    }), m), $ = `calc(${Oe.default} + ${Ae}px)`, q = `calc(${$e} + ${We}px)`, V = F || s === "focused" || s === "filled" ? X ? le : oe : 1, ee = {
+    }), m), $ = `calc(${Oe.default} + ${Ae}px)`, q = `calc(${$e} + ${We}px)`, V = N || s === "focused" || s === "filled" ? X ? le : oe : 1, ee = {
         left: `calc(${T}px + ${t ? $ : "0px"})`,
         // shrinking means applying a scale transformation, so width will be proportionally reduced.
         // Let's keep the original width.
@@ -198,8 +198,8 @@ const Be = (o, f)=>{
                     style: {
                         opacity: s === "default" ? 0 : 1
                     },
-                    children: /* @__PURE__ */ n(N, {
-                        color: Ne.colors.textSecondary,
+                    children: /* @__PURE__ */ n(F, {
+                        color: Fe.colors.textSecondary,
                         regular: !0,
                         wordBreak: !1,
                         children: b
@@ -207,7 +207,7 @@ const Be = (o, f)=>{
                 }),
                 /* @__PURE__ */ n("div", {
                     className: ge,
-                    children: /* @__PURE__ */ n(N, {
+                    children: /* @__PURE__ */ n(F, {
                         as: "div",
                         regular: !0,
                         children: /*#__PURE__*/ d.createElement(p || Y, _object_spread(_object_spread_props(_object_spread({}, Z, I), {
@@ -249,7 +249,7 @@ const Be = (o, f)=>{
                     error: o,
                     forId: w,
                     inputState: s,
-                    shrinkLabel: F,
+                    shrinkLabel: N,
                     optional: !l.required,
                     children: i
                 }),
@@ -308,7 +308,7 @@ const Be = (o, f)=>{
                     className: v(Re, {
                         [Te]: u
                     }),
-                    children: /* @__PURE__ */ n(N, {
+                    children: /* @__PURE__ */ n(F, {
                         regular: !0,
                         children: t
                     })

package/dist-es/text-field-components.js

@@ -51,32 +51,32 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-import { jsxs as m, jsx as o, Fragment as g } from "react/jsx-runtime";
+import { jsxs as m, jsx as o, Fragment as y } from "react/jsx-runtime";
 import * as x from "react";
 import c from "classnames";
-import { useIsInverseVariant as y } from "./theme-variant-context.js";
+import { useIsInverseVariant as N } from "./theme-variant-context.js";
 import { useTheme as C } from "./hooks.js";
 import { Text1 as v } from "./text.js";
 import { labelContainer as k, shrinked as S, labelText as I, helperText as b, leftText as F, rightText as E, fieldContainer as L, fullWidth as P, normalWidth as W, disabled as j, field as w, helperContainer as A } from "./text-field-components.css-mistica.js";
-import { sprinkles as N } from "./sprinkles.css-mistica.js";
+import { sprinkles as T } from "./sprinkles.css-mistica.js";
 import { vars as e } from "./skins/skin-contract.css-mistica.js";
 import { getPrefixedDataAttributes as D } from "./utils/dom.js";
 const J = (param)=>{
     let { shrinkLabel: t, forId: s, inputState: r, error: l, children: i, style: n, optional: a } = param;
     const f = t || r === "focused" || r === "filled", [u, h] = x.useState("initial"), { texts: d } = C();
     x.useEffect(()=>{
-        const T = setTimeout(()=>{
+        const g = setTimeout(()=>{
             process.env.NODE_ENV !== "test" && h("transform 150ms, width 150ms");
         });
         return ()=>{
-            clearTimeout(T);
+            clearTimeout(g);
         };
     }, []);
     let p = e.colors.textSecondary;
     return l && r !== "default" ? p = e.colors.error : r === "focused" && (p = e.colors.controlActivated), /* @__PURE__ */ m("label", {
         className: c(k, {
             [S]: f
-        }, N({
+        }, T({
             color: p
         })),
         htmlFor: s,
@@ -99,8 +99,8 @@ const J = (param)=>{
     });
 }, K = (param)=>{
     let { leftText: t, rightText: s, error: r, id: l } = param;
-    const i = y(), n = i ? e.colors.textPrimaryInverse : r ? e.colors.error : e.colors.textSecondary, a = i ? e.colors.textPrimaryInverse : e.colors.textSecondary;
-    return /* @__PURE__ */ m(g, {
+    const i = N(), n = i ? e.colors.textPrimaryInverse : r ? e.colors.error : e.colors.textSecondary, a = i ? e.colors.textPrimaryInverse : e.colors.textSecondary;
+    return /* @__PURE__ */ m(y, {
         children: [
             t && /* @__PURE__ */ o("div", {
                 className: c(b, F),
@@ -137,7 +137,7 @@ const J = (param)=>{
     }, D(u)), {
         children: [
             /* @__PURE__ */ o("div", {
-                className: c(w, N({
+                className: c(w, T({
                     background: f ? e.colors.neutralLow : e.colors.backgroundContainer
                 }), i),
                 ref: n,

package/dist-es/text-link.js

@@ -84,9 +84,9 @@ import l from "classnames";
 import { useTheme as p } from "./hooks.js";
 import { useIsInverseVariant as k } from "./theme-variant-context.js";
 import { useForm as d } from "./form-context.js";
-import { getTextFromChildren as n } from "./utils/common.js";
+import { getTextFromChildren as o } from "./utils/common.js";
 import { useTrackingConfig as T, eventNames as x, eventCategories as I, eventActions as y } from "./utils/analytics.js";
-import { variants as o } from "./text-link.css-mistica.js";
+import { variants as n } from "./text-link.css-mistica.js";
 const E = (_param)=>{
     var { children: t, className: r = "", disabled: a, style: s } = _param, e = _object_without_properties(_param, [
         "children",
@@ -97,11 +97,11 @@ const E = (_param)=>{
     const i = k(), { isDarkMode: m } = p(), { formStatus: c } = d(), { eventFormat: f } = T(), u = ()=>f === "google-analytics-4" ? {
             name: x.userInteraction,
             component_type: "link",
-            component_copy: n(t)
+            component_copy: o(t)
         } : {
             category: I.userInteraction,
             action: y.linkTapped,
-            label: n(t)
+            label: o(t)
         };
     var _e_trackingEvent;
     return /* @__PURE__ */ v(g, _object_spread_props(_object_spread({}, e), {
@@ -109,7 +109,7 @@ const E = (_param)=>{
         as: e.onPress ? "a" : void 0,
         trackingEvent: (_e_trackingEvent = e.trackingEvent) !== null && _e_trackingEvent !== void 0 ? _e_trackingEvent : e.trackEvent ? u() : void 0,
         disabled: a || c === "sending",
-        className: l(i ? m ? o.inverseDark : o.inverseLight : o.default, r),
+        className: l(i ? m ? n.inverseDark : n.inverseLight : n.default, r),
         style: s,
         children: t
     }));

package/dist-es/text.js

@@ -78,250 +78,271 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-import { jsx as r } from "react/jsx-runtime";
-import * as j from "react";
+import { jsx as r, Fragment as z, jsxs as w } from "react/jsx-runtime";
+import * as v from "react";
 import B from "classnames";
-import { useIsInverseVariant as E } from "./theme-variant-context.js";
+import { useIsInverseVariant as K } from "./theme-variant-context.js";
 import { applyCssVars as L, pxToRem as p } from "./utils/css.js";
 import { getPrefixedDataAttributes as M } from "./utils/dom.js";
-import { useTheme as a } from "./hooks.js";
-import { vars as m } from "./skins/skin-contract.css-mistica.js";
-import { text as O, withWordBreak as q, withoutWordBreak as F, truncate as G, truncateToOneLine as J, vars as x } from "./text.css-mistica.js";
-const K = {
+import { useTheme as m } from "./hooks.js";
+import { vars as a } from "./skins/skin-contract.css-mistica.js";
+import { text as q, withWordBreak as G, withoutWordBreak as J, truncate as Q, truncateToOneLine as U, vars as l } from "./text.css-mistica.js";
+import { VIVO_NEW_SKIN as X } from "./skins/constants.js";
+import Y from "./screen-reader-only.js";
+const Z = {
     light: 300,
     regular: 400,
     medium: 500,
     bold: 700
-}, Q = (e)=>e === !0 ? 1 : e || "initial", n = (param)=>{
-    let { weight: e, color: i = m.colors.textPrimary, decoration: t, truncate: o, transform: h, wordBreak: c = !0, hyphens: u = "auto", as: z = "span", children: g, size: d, mobileSize: b = d, desktopSize: T = d, lineHeight: k, mobileLineHeight: S = k, desktopLineHeight: f = k, letterSpacing: w, textAlign: H, textShadow: v, id: A, role: P, "aria-level": y, dataAttributes: W } = param;
-    const I = E(), C = Q(o), V = {
-        [m.colors.textPrimary]: m.colors.textPrimaryInverse,
-        [m.colors.textSecondary]: m.colors.textSecondaryInverse,
-        [m.colors.textLink]: m.colors.textLinkInverse
+}, $ = (e)=>e === !0 ? 1 : e || "initial", g = "Ħ", ee = /* @__PURE__ */ w(z, {
+    children: [
+        /* @__PURE__ */ r("span", {
+            "aria-hidden": !0,
+            children: g
+        }),
+        /* @__PURE__ */ r(Y, {
+            children: /* @__PURE__ */ r("span", {
+                children: "Vivo"
+            })
+        })
+    ]
+}), te = (e)=>e.includes(g) ? /* @__PURE__ */ r(z, {
+        children: e.split(g).map((i, t)=>/* @__PURE__ */ w(v.Fragment, {
+                children: [
+                    t > 0 && ee,
+                    i
+                ]
+            }, t))
+    }) : e, o = (param)=>{
+    let { weight: e, color: i = a.colors.textPrimary, decoration: t, truncate: n, transform: c, wordBreak: d = !0, hyphens: u = "auto", as: A = "span", children: x, size: b, mobileSize: T = b, desktopSize: S = b, lineHeight: f, mobileLineHeight: k = f, desktopLineHeight: H = f, letterSpacing: V, textAlign: y, textShadow: I, id: P, role: W, "aria-level": C, dataAttributes: R } = param;
+    const { skinName: N } = m(), F = K(), O = $(n), _ = {
+        [a.colors.textPrimary]: a.colors.textPrimaryInverse,
+        [a.colors.textSecondary]: a.colors.textSecondaryInverse,
+        [a.colors.textLink]: a.colors.textLinkInverse
     };
-    if (!g && g !== 0) return null;
-    const D = B(O, c ? q : F, {
-        [G]: o,
-        [J]: o === 1 || o === !0
-    }), N = L({
-        [x.mobileSize]: b ? p(b) : "inherit",
-        [x.mobileLineHeight]: S ? p(S) : "inherit",
-        [x.desktopSize]: T ? p(T) : "inherit",
-        [x.desktopLineHeight]: f ? p(f) : "inherit"
-    }), R = o ? L({
-        [x.lineClamp]: String(C)
+    if (!x && x !== 0) return null;
+    const j = B(q, d ? G : J, {
+        [Q]: n,
+        [U]: n === 1 || n === !0
+    }), D = L({
+        [l.mobileSize]: T ? p(T) : "inherit",
+        [l.mobileLineHeight]: k ? p(k) : "inherit",
+        [l.desktopSize]: S ? p(S) : "inherit",
+        [l.desktopLineHeight]: H ? p(H) : "inherit"
+    }), E = n ? L({
+        [l.lineClamp]: String(O)
     }) : {};
-    var _V_i;
-    return /*#__PURE__*/ j.createElement(z, _object_spread_props(_object_spread({
-        className: D,
-        id: A,
-        role: P,
-        "aria-level": y
-    }, M(W, "Text")), {
-        style: _object_spread_props(_object_spread({}, N, R), {
+    var __i;
+    return /*#__PURE__*/ v.createElement(A, _object_spread_props(_object_spread({
+        className: j,
+        id: P,
+        role: W,
+        "aria-level": C
+    }, M(R, "Text")), {
+        style: _object_spread_props(_object_spread({}, D, E), {
             hyphens: u,
             WebkitHyphens: u,
-            letterSpacing: w,
-            fontWeight: e ? K[e] : "inherit",
-            textTransform: h || "inherit",
+            letterSpacing: V,
+            fontWeight: e ? Z[e] : "inherit",
+            textTransform: c || "inherit",
             textDecoration: t !== null && t !== void 0 ? t : "inherit",
-            overflowWrap: c ? "anywhere" : "inherit",
-            color: I ? (_V_i = V[i]) !== null && _V_i !== void 0 ? _V_i : i : i,
-            textAlign: H,
-            textShadow: v
+            overflowWrap: d ? "anywhere" : "inherit",
+            color: F ? (__i = _[i]) !== null && __i !== void 0 ? __i : i : i,
+            textAlign: y,
+            textShadow: I
         })
-    }), g);
-}, l = (e)=>{
+    }), typeof x == "string" && N === X ? te(x) : x);
+}, h = (e)=>{
     if (e.light) return "light";
     if (e.regular) return "regular";
     if (e.medium) return "medium";
     if (e.weight) return e.weight;
 }, s = (param)=>{
-    let { forceMobileSizes: e, mobileSize: i, mobileLineHeight: t, desktopSize: o, desktopLineHeight: h } = param;
+    let { forceMobileSizes: e, mobileSize: i, mobileLineHeight: t, desktopSize: n, desktopLineHeight: c } = param;
     return e ? {
         size: i,
         lineHeight: t
     } : {
         mobileSize: i,
         mobileLineHeight: t,
-        desktopSize: o,
-        desktopLineHeight: h
+        desktopSize: n,
+        desktopLineHeight: c
     };
-}, ie = (_param)=>{
+}, he = (_param)=>{
     var { dataAttributes: e, forceMobileSizes: i } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "forceMobileSizes"
     ]);
-    const { textPresets: o } = a();
-    return /* @__PURE__ */ r(n, _object_spread(_object_spread_props(_object_spread({}, s({
+    const { textPresets: n } = m();
+    return /* @__PURE__ */ r(o, _object_spread(_object_spread_props(_object_spread({}, s({
         forceMobileSizes: i,
         mobileSize: 48,
         mobileLineHeight: "56px",
         desktopSize: 64,
         desktopLineHeight: "72px"
     })), {
-        weight: o.text10.weight,
+        weight: n.text10.weight,
         dataAttributes: _object_spread({
             "component-name": "Text10"
         }, e)
     }), t));
-}, oe = (_param)=>{
+}, ce = (_param)=>{
     var { dataAttributes: e, forceMobileSizes: i } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "forceMobileSizes"
     ]);
-    const { textPresets: o } = a();
-    return /* @__PURE__ */ r(n, _object_spread(_object_spread_props(_object_spread({}, s({
+    const { textPresets: n } = m();
+    return /* @__PURE__ */ r(o, _object_spread(_object_spread_props(_object_spread({}, s({
         forceMobileSizes: i,
         mobileSize: 40,
         mobileLineHeight: "48px",
         desktopSize: 56,
         desktopLineHeight: "64px"
     })), {
-        weight: o.text9.weight,
+        weight: n.text9.weight,
         dataAttributes: _object_spread({
             "component-name": "Text9"
         }, e)
     }), t));
-}, ne = (_param)=>{
+}, ge = (_param)=>{
     var { dataAttributes: e, forceMobileSizes: i } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "forceMobileSizes"
     ]);
-    const { textPresets: o } = a();
-    return /* @__PURE__ */ r(n, _object_spread(_object_spread_props(_object_spread({}, s({
+    const { textPresets: n } = m();
+    return /* @__PURE__ */ r(o, _object_spread(_object_spread_props(_object_spread({}, s({
         forceMobileSizes: i,
         mobileSize: 32,
         mobileLineHeight: "40px",
         desktopSize: 48,
         desktopLineHeight: "56px"
     })), {
-        weight: o.text8.weight,
+        weight: n.text8.weight,
         dataAttributes: _object_spread({
             "component-name": "Text8"
         }, e)
     }), t));
-}, re = (_param)=>{
+}, de = (_param)=>{
     var { dataAttributes: e, forceMobileSizes: i } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "forceMobileSizes"
     ]);
-    const { textPresets: o } = a();
-    return /* @__PURE__ */ r(n, _object_spread(_object_spread_props(_object_spread({}, s({
+    const { textPresets: n } = m();
+    return /* @__PURE__ */ r(o, _object_spread(_object_spread_props(_object_spread({}, s({
         forceMobileSizes: i,
         mobileSize: 28,
         mobileLineHeight: "32px",
         desktopSize: 40,
         desktopLineHeight: "48px"
     })), {
-        weight: o.text7.weight,
+        weight: n.text7.weight,
         dataAttributes: _object_spread({
             "component-name": "Text7"
         }, e)
     }), t));
-}, se = (_param)=>{
+}, ue = (_param)=>{
     var { dataAttributes: e, forceMobileSizes: i } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "forceMobileSizes"
     ]);
-    const { textPresets: o } = a();
-    return /* @__PURE__ */ r(n, _object_spread(_object_spread_props(_object_spread({}, s({
+    const { textPresets: n } = m();
+    return /* @__PURE__ */ r(o, _object_spread(_object_spread_props(_object_spread({}, s({
         forceMobileSizes: i,
         mobileSize: 24,
         mobileLineHeight: "32px",
         desktopSize: 32,
         desktopLineHeight: "40px"
     })), {
-        weight: o.text6.weight,
+        weight: n.text6.weight,
         dataAttributes: _object_spread({
             "component-name": "Text6"
         }, e)
     }), t));
-}, me = (_param)=>{
+}, be = (_param)=>{
     var { dataAttributes: e, forceMobileSizes: i } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "forceMobileSizes"
     ]);
-    const { textPresets: o } = a();
-    return /* @__PURE__ */ r(n, _object_spread(_object_spread_props(_object_spread({}, s({
+    const { textPresets: n } = m();
+    return /* @__PURE__ */ r(o, _object_spread(_object_spread_props(_object_spread({}, s({
         forceMobileSizes: i,
         mobileSize: 20,
         mobileLineHeight: "24px",
         desktopSize: 28,
         desktopLineHeight: "32px"
     })), {
-        weight: o.text5.weight,
+        weight: n.text5.weight,
         dataAttributes: _object_spread({
             "component-name": "Text5"
         }, e)
     }), t));
-}, ae = (_param)=>{
+}, Te = (_param)=>{
     var { dataAttributes: e, forceMobileSizes: i } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "forceMobileSizes"
     ]);
-    return /* @__PURE__ */ r(n, _object_spread(_object_spread_props(_object_spread({}, s({
+    return /* @__PURE__ */ r(o, _object_spread(_object_spread_props(_object_spread({}, s({
         forceMobileSizes: i,
         mobileSize: 18,
         mobileLineHeight: "24px",
         desktopSize: 20,
         desktopLineHeight: "28px"
     })), {
-        weight: l(t),
+        weight: h(t),
         dataAttributes: _object_spread({
             "component-name": "Text4"
         }, e)
     }), t));
-}, xe = (_param)=>{
+}, Se = (_param)=>{
     var { dataAttributes: e, forceMobileSizes: i } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "forceMobileSizes"
     ]);
-    return /* @__PURE__ */ r(n, _object_spread(_object_spread_props(_object_spread({}, s({
+    return /* @__PURE__ */ r(o, _object_spread(_object_spread_props(_object_spread({}, s({
         forceMobileSizes: i,
         mobileSize: 16,
         mobileLineHeight: "24px",
         desktopSize: 18,
         desktopLineHeight: "24px"
     })), {
-        weight: l(t),
+        weight: h(t),
         dataAttributes: _object_spread({
             "component-name": "Text3"
         }, e)
     }), t));
-}, pe = (_param)=>{
+}, fe = (_param)=>{
     var { dataAttributes: e, forceMobileSizes: i } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "forceMobileSizes"
     ]);
-    return /* @__PURE__ */ r(n, _object_spread(_object_spread_props(_object_spread({}, s({
+    return /* @__PURE__ */ r(o, _object_spread(_object_spread_props(_object_spread({}, s({
         forceMobileSizes: i,
         mobileSize: 14,
         mobileLineHeight: "20px",
         desktopSize: 16,
         desktopLineHeight: "24px"
     })), {
-        weight: l(t),
+        weight: h(t),
         dataAttributes: _object_spread({
             "component-name": "Text2"
         }, e)
     }), t));
-}, le = (_param)=>{
+}, ke = (_param)=>{
     var { dataAttributes: e, forceMobileSizes: i } = _param, t = _object_without_properties(_param, [
         "dataAttributes",
         "forceMobileSizes"
     ]);
-    return /* @__PURE__ */ r(n, _object_spread(_object_spread_props(_object_spread({}, s({
+    return /* @__PURE__ */ r(o, _object_spread(_object_spread_props(_object_spread({}, s({
         forceMobileSizes: i,
         mobileSize: 12,
         mobileLineHeight: "16px",
         desktopSize: 14,
         desktopLineHeight: "20px"
     })), {
-        weight: l(t),
+        weight: h(t),
         dataAttributes: _object_spread({
             "component-name": "Text1"
         }, e)
     }), t));
-}, he = n;
-export { n as Text, le as Text1, ie as Text10, pe as Text2, xe as Text3, ae as Text4, me as Text5, se as Text6, re as Text7, ne as Text8, oe as Text9, he as default };
+}, He = o;
+export { o as Text, ke as Text1, he as Text10, fe as Text2, Se as Text3, Te as Text4, be as Text5, ue as Text6, de as Text7, ge as Text8, ce as Text9, He as default };

package/dist-es/utils/aspect-ratio-support.js

@@ -53,13 +53,13 @@ function _object_spread_props(target, source) {
 }
 import { jsx as h } from "react/jsx-runtime";
 import m from "classnames";
-import * as o from "react";
+import * as n from "react";
 import { useIsomorphicLayoutEffect as l } from "../hooks.js";
-import { container as f, containerWithWrapper as w, vars as R, wrapper as N } from "./aspect-ratio-support.css-mistica.js";
-import { applyCssVars as b } from "./css.js";
-const u = /*#__PURE__*/ o.createContext(!0), x = (param)=>{
+import { container as f, containerWithWrapper as w, vars as R, wrapper as b } from "./aspect-ratio-support.css-mistica.js";
+import { applyCssVars as y } from "./css.js";
+const u = /*#__PURE__*/ n.createContext(!0), x = (param)=>{
     let { children: t } = param;
-    const [r, s] = o.useState(!0);
+    const [o, s] = n.useState(!0);
     return l(()=>{
         try {
             CSS.supports("aspect-ratio", "1 / 1") || s(!1);
@@ -67,16 +67,16 @@ const u = /*#__PURE__*/ o.createContext(!0), x = (param)=>{
             s(!1);
         }
     }, []), /* @__PURE__ */ h(u.Provider, {
-        value: r,
+        value: o,
         children: t
     });
-}, y = ()=>o.useContext(u), W = (t)=>{
-    const r = y(), s = typeof t.width != "number" && typeof t.height != "number" && t.aspectRatio !== 0, e = s ? t.aspectRatio : void 0;
+}, N = ()=>n.useContext(u), W = (t)=>{
+    const o = N(), s = typeof t.width != "number" && typeof t.height != "number" && t.aspectRatio !== 0, e = s ? t.aspectRatio : void 0;
     let i = t.width, a = t.height;
     var _t_aspectRatio, _t_aspectRatio1;
     t.width !== void 0 && t.height !== void 0 ? (i = t.width, a = t.height) : typeof t.width == "number" ? a = t.aspectRatio !== 0 ? t.width / ((_t_aspectRatio = t.aspectRatio) !== null && _t_aspectRatio !== void 0 ? _t_aspectRatio : 1) : void 0 : typeof t.height == "number" ? i = t.aspectRatio !== 0 ? t.height * ((_t_aspectRatio1 = t.aspectRatio) !== null && _t_aspectRatio1 !== void 0 ? _t_aspectRatio1 : 1) : void 0 : i = t.width || "100%";
     var _t_as;
-    const c = s && !r, n = /*#__PURE__*/ o.createElement((_t_as = t.as) !== null && _t_as !== void 0 ? _t_as : "div", _object_spread({
+    const c = s && !o, r = /*#__PURE__*/ n.createElement((_t_as = t.as) !== null && _t_as !== void 0 ? _t_as : "div", _object_spread({
         className: m(t.className, f, {
             [w]: c
         }),
@@ -86,7 +86,7 @@ const u = /*#__PURE__*/ o.createContext(!0), x = (param)=>{
         }) : _object_spread_props(_object_spread({}, t.style), {
             width: isNaN(Number(i)) ? i : Number(i),
             height: isNaN(Number(a)) ? a : Number(a)
-        }), b({
+        }), y({
             [R.aspectRatio]: e ? String(e) : "unset"
         }))
     }, !c && t.dataAttributes), t.children);
@@ -98,10 +98,10 @@ const u = /*#__PURE__*/ o.createContext(!0), x = (param)=>{
                 height: a,
                 paddingTop: d
             },
-            className: N
+            className: b
         }, t.dataAttributes), {
-            children: n
+            children: r
         }));
-    } else return n;
+    } else return r;
 };
-export { W as AspectRatioContainer, x as AspectRatioSupportProvider, y as useSupportsAspectRatio };
+export { W as AspectRatioContainer, x as AspectRatioSupportProvider, N as useSupportsAspectRatio };

package/dist-es/utils/browser.js

@@ -1,5 +1,5 @@
 const i = function(e) {
     let o = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1, n = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
-    o ? window.open(e, "_blank") : n ? window.open(e, "_top") : document.location.href = e;
+    o ? window.open(e, "_blank") : n ? window.open(e, "_top") : window.location.assign(e);
 };
 export { i as redirect };

package/dist-es/video.js

@@ -32,7 +32,7 @@ import { ImageContent as J, ImageError as O } from "./image.js";
 import { AspectRatioContainer as P } from "./utils/aspect-ratio-support.js";
 import { isRunningAcceptanceTest as Q } from "./utils/platform.js";
 import { video as X } from "./video.css-mistica.js";
-import { defaultBorderRadius as N } from "./image.css-mistica.js";
+import { defaultBorderRadius as S } from "./image.css-mistica.js";
 import { getPrefixedDataAttributes as Y } from "./utils/dom.js";
 import $ from "classnames";
 const q = {
@@ -73,7 +73,7 @@ const q = {
     "16:9": 16 / 9,
     "4:3": 4 / 3
 }, M = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAAtJREFUGFdjYAACAAAFAAGq1chRAAAAAElFTkSuQmCC", _ = /*#__PURE__*/ a.forwardRef((_param, A)=>{
-    var { src: s, poster: u, autoPlay: g = "when-loaded", muted: S = !0, loop: k = !0, preload: x = "none", loadingTimeout: b = 1e4, onLoad: y, onError: h, onPause: w, onPlay: v, aspectRatio: c = "1:1", dataAttributes: U } = _param, n = _object_without_properties(_param, [
+    var { src: s, poster: u, autoPlay: g = "when-loaded", muted: N = !0, loop: k = !0, preload: x = "none", loadingTimeout: b = 1e4, onLoad: y, onError: h, onPause: w, onPlay: v, aspectRatio: c = "1:1", dataAttributes: U } = _param, n = _object_without_properties(_param, [
         "src",
         "poster",
         "autoPlay",
@@ -125,9 +125,9 @@ const q = {
         playsInline: !0,
         disablePictureInPicture: !0,
         disableRemotePlayback: !0,
-        muted: S,
+        muted: N,
         loop: k,
-        className: $(X, N),
+        className: $(X, S),
         preload: x,
         onError: R,
         onPause: ()=>{
@@ -169,7 +169,7 @@ const q = {
                 height: "100%"
             },
             children: /* @__PURE__ */ d(O, {
-                className: N,
+                className: S,
                 withIcon: E
             })
         }) : void 0, [

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@telefonica/mistica",
-    "version": "15.2.0",
+    "version": "15.3.0",
     "license": "MIT",
     "repository": {
         "type": "git",