@telefonica/mistica 16.1.0 → 16.2.0

package/dist-es/inline.js

@@ -52,15 +52,14 @@ function _object_spread_props(target, source) {
     return target;
 }
 import { jsx as m } from "react/jsx-runtime";
-import * as g from "react";
-import y from "classnames";
-import { sprinkles as v } from "./sprinkles.css-mistica.js";
-import { getPrefixedDataAttributes as h } from "./utils/dom.js";
-import { inline as I, wrap as S, fullWidth as W, noFullWidth as x, stringSpaceWithWrap as k, stringSpace as T, marginInline as V, vars as r } from "./inline.css-mistica.js";
-import { applyCssVars as $ } from "./utils/css.js";
-import { isIos as A, isRunningAcceptanceTest as C } from "./utils/platform.js";
-import { useTheme as D } from "./hooks.js";
-const i = (t)=>typeof t == "number" ? `${t}px` : `space-${t}`, R = (t)=>{
+import * as b from "react";
+import g from "classnames";
+import { getPrefixedDataAttributes as y } from "./utils/dom.js";
+import { inline as v, wrap as h, fullWidth as S, noFullWidth as I, stringSpaceWithWrap as W, stringSpace as x, marginInline as T, vars as r } from "./inline.css-mistica.js";
+import { applyCssVars as V } from "./utils/css.js";
+import { isIos as $, isRunningAcceptanceTest as k } from "./utils/platform.js";
+import { useTheme as A } from "./hooks.js";
+const i = (t)=>typeof t == "number" ? `${t}px` : `space-${t}`, C = (t)=>{
     if (typeof t == "number" || typeof t == "string") return {
         [r.space]: i(t)
     };
@@ -69,27 +68,27 @@ const i = (t)=>typeof t == "number" ? `${t}px` : `space-${t}`, R = (t)=>{
         [r.spaceDesktop]: i(t.desktop)
     };
     return t.tablet && (e[r.spaceTablet] = i(t.tablet)), e;
-}, j = (param)=>{
-    let { space: t, className: e, children: p, role: l, alignItems: f = "stretch", "aria-label": o, "aria-labelledby": c, fullWidth: d, wrap: s, dataAttributes: u } = param;
-    const { platformOverrides: a } = D(), b = typeof t == "string";
+}, D = (param)=>{
+    let { space: t, className: e, children: p, role: l, alignItems: f = "stretch", "aria-label": o, "aria-labelledby": c, fullWidth: d, wrap: a, dataAttributes: u } = param;
+    const { platformOverrides: s } = A();
     return /* @__PURE__ */ m("div", _object_spread_props(_object_spread({
-        className: y(e, I, v({
+        className: g(e, v, a ? h : d ? S : I, typeof t == "string" ? a ? W : x : T),
+        style: _object_spread_props(_object_spread({}, V(C(t))), {
             alignItems: f
-        }), s ? S : d ? W : x, b ? s ? k : T : V),
-        style: $(R(t)),
+        }),
         role: l,
         "aria-label": o,
         "aria-labelledby": o ? void 0 : c
-    }, h(u, "Inline")), {
-        children: g.Children.map(p, (n)=>n || n === 0 ? /* @__PURE__ */ m("div", {
+    }, y(u, "Inline")), {
+        children: b.Children.map(p, (n)=>n || n === 0 ? /* @__PURE__ */ m("div", {
                 role: l === "list" ? "listitem" : void 0,
                 style: {
                     // Hack to fix https://jira.tid.es/browse/WEB-1683
                     // In iOS the inline component sometimes cuts the last line of the content
-                    paddingBottom: A(a) && !C(a) ? 1 : void 0
+                    paddingBottom: $(s) && !k(s) ? 1 : void 0
                 },
                 children: n
             }) : null)
     }));
-}, z = j;
-export { z as default };
+}, P = D;
+export { P as default };

package/dist-es/list.css-mistica.js

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./list.css.ts.vanilla.css-mistica.js";
-var _ = "_1y2v1nfhk _1y2v1nfi2 _1y2v1nfi4", f = "_1y2v1nfhk _1y2v1nfhz _1y2v1nfht _1y2v1nfja _1y2v1nfio _1y2v1nfi2", y = "_1y2v1nfhk _1y2v1nfhz", a = "_1y2v1nfhk _1y2v1nfi7 _1y2v1nfjx", r = "_2buj9ge _1y2v1nfhk _1y2v1nfhz", i = "_2buj9gd", t = "_2buj9g0", h = "_1y2v1nfhk _1y2v1nfhp _1y2v1nfio", o = "_2buj9gk _1y2v1nfhk", e = "_1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfaa _1y2v1nfbj _1y2v1nfhm _1y2v1nfi5", b = "_2buj9gm _1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfaa _1y2v1nfbj _1y2v1nfhk _1y2v1nfhz _1y2v1nfi4 _1y2v1nfi8 _1y2v1nfio", d = "_1y2v1nfkk", k = "_2buj9gb", u = "_2buj9gc", g = "_1y2v1nfhk _1y2v1nfhq _1y2v1nfi6", c = "_1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfi7 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfhm _1y2v1nfio", j = "_2buj9g1", l = "_2buj9g2";
-export { _ as asset, f as badge, y as center, a as content, r as detail, i as detailRight, t as disabled, h as dualActionContainer, o as dualActionDivider, e as dualActionLeft, b as dualActionRight, d as pointer, k as rightContent, u as rightRestrictedWidth, g as rowBody, c as rowContent, j as touchableBackground, l as touchableBackgroundInverse };
+var _ = "_1y2v1nfhk _1y2v1nfi2 _1y2v1nfi4", f = "_1y2v1nfhk _1y2v1nfhz _1y2v1nfht _1y2v1nfja _1y2v1nfio _1y2v1nfi2", y = "_1y2v1nfhk _1y2v1nfhz", a = "_1y2v1nfhk _1y2v1nfi7 _1y2v1nfjx", r = "_2buj9gf _1y2v1nfhk _1y2v1nfhz", i = "_2buj9ge", t = "_2buj9g0", h = "_1y2v1nfhk _1y2v1nfhp _1y2v1nfio", o = "_2buj9gl _1y2v1nfhk", e = "_1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfaa _1y2v1nfbj _1y2v1nfhm _1y2v1nfi5", d = "_2buj9gn _1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfaa _1y2v1nfbj _1y2v1nfhk _1y2v1nfhz _1y2v1nfi4 _1y2v1nfi8 _1y2v1nfio", b = "_1y2v1nfkk", u = "_2buj9gc", g = "_2buj9gd", k = "_1y2v1nfi7", c = "_1y2v1nfhk _1y2v1nfhq _1y2v1nfi6", j = "_1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfi7 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfhm _1y2v1nfio", l = "_2buj9g2", m = "_2buj9g3";
+export { _ as asset, f as badge, y as center, a as content, r as detail, i as detailRight, t as disabled, h as dualActionContainer, o as dualActionDivider, e as dualActionLeft, d as dualActionRight, b as pointer, u as rightContent, g as rightRestrictedWidth, k as row, c as rowBody, j as rowContent, l as touchableBackground, m as touchableBackgroundInverse };

package/dist-es/list.js

@@ -79,8 +79,8 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 import { jsx as t, jsxs as X } from "react/jsx-runtime";
-import * as u from "react";
-import m from "classnames";
+import * as m from "react";
+import u from "classnames";
 import { BaseTouchable as te } from "./touchable.js";
 import { Text3 as xe, Text1 as ve, Text2 as Y } from "./text.js";
 import o from "./box.js";
@@ -94,12 +94,11 @@ import Re from "./checkbox.js";
 import { Boxed as Ie } from "./boxed.js";
 import Ce from "./divider.js";
 import { getPrefixedDataAttributes as K } from "./utils/dom.js";
-import { rowContent as q, touchableBackground as z, touchableBackgroundInverse as G, pointer as re, content as Te, center as J, disabled as I, asset as Ne, rowBody as ke, badge as Le, rightContent as Ae, rightRestrictedWidth as Se, detail as Ve, detailRight as Xe, dualActionContainer as Ee, dualActionLeft as Pe, dualActionDivider as De, dualActionRight as Me } from "./list.css-mistica.js";
-import { vars as Oe } from "./image.css-mistica.js";
+import { rowContent as q, touchableBackground as z, touchableBackgroundInverse as G, pointer as re, row as Te, content as Ne, center as J, disabled as I, asset as Le, rowBody as ke, badge as Ae, rightContent as Se, rightRestrictedWidth as Ve, detail as Xe, detailRight as Ee, dualActionContainer as Pe, dualActionLeft as De, dualActionDivider as Me, dualActionRight as Oe } from "./list.css-mistica.js";
+import { vars as We } from "./image.css-mistica.js";
 import { vars as d } from "./skins/skin-contract.css-mistica.js";
-import { applyCssVars as We } from "./utils/css.js";
-import { IconButton as ie, ToggleIconButton as ne } from "./icon-button.js";
-import { sprinkles as je } from "./sprinkles.css-mistica.js";
+import { applyCssVars as je } from "./utils/css.js";
+import { IconButton as ne, ToggleIconButton as ie } from "./icon-button.js";
 const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         centerY: a
     }) : a ? /* @__PURE__ */ t("div", {
@@ -112,37 +111,37 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
             children: e
         })
     }) : e, Fe = (param)=>{
-    let { withChevron: e, headline: a, headlineRef: r, extraRef: l, title: c, titleAs: v, titleLinesMax: g, subtitle: x, subtitleLinesMax: P, description: w, descriptionLinesMax: D, detail: h, asset: E, danger: T, badge: N, right: y, rightRef: f, extra: k, labelId: M, disabled: s, control: L } = param;
+    let { withChevron: e, headline: a, headlineRef: r, extraRef: l, title: c, titleAs: v, titleLinesMax: g, subtitle: x, subtitleLinesMax: P, description: w, descriptionLinesMax: D, detail: h, asset: E, danger: T, badge: N, right: y, rightRef: f, extra: L, labelId: M, disabled: s, control: k } = param;
     const A = oe(), S = [
         a,
         c,
         x,
         w,
-        k
+        L
     ].filter(Boolean).length === 1;
     return /* @__PURE__ */ X(o, {
         paddingY: 16,
-        className: Te,
+        className: Ne,
         id: M,
         children: [
             E && /* @__PURE__ */ t(o, {
                 paddingRight: 16,
-                className: m({
+                className: u({
                     [J]: S,
                     [I]: s
                 }),
                 "aria-hidden": !0,
                 children: /* @__PURE__ */ t("div", {
-                    className: Ne,
-                    style: We({
+                    className: Le,
+                    style: je({
                         color: T ? A ? d.colors.textErrorInverse : d.colors.textError : A ? d.colors.textPrimaryInverse : d.colors.textPrimary,
-                        [Oe.mediaBorderRadius]: d.borderRadii.mediaSmall
+                        [We.mediaBorderRadius]: d.borderRadii.mediaSmall
                     }),
                     children: E
                 })
             }),
             /* @__PURE__ */ X("div", {
-                className: m(ke, {
+                className: u(ke, {
                     [I]: s
                 }),
                 style: {
@@ -190,17 +189,17 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
                             children: w
                         })
                     }),
-                    k && /* @__PURE__ */ t(o, {
+                    L && /* @__PURE__ */ t(o, {
                         ref: l,
                         paddingTop: 2,
-                        children: k
+                        children: L
                     })
                 ]
             }),
             N && /* @__PURE__ */ t(o, {
                 paddingLeft: 16,
                 children: /* @__PURE__ */ t("div", {
-                    className: m(Le, {
+                    className: u(Ae, {
                         [I]: s
                     }),
                     children: /* @__PURE__ */ t(ge, {
@@ -208,13 +207,13 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
                     })
                 })
             }),
-            (h || y || e || L) && /* @__PURE__ */ X("div", {
-                className: m(Ae, {
-                    [Se]: !!h
+            (h || y || e || k) && /* @__PURE__ */ X("div", {
+                className: u(Se, {
+                    [Ve]: !!h
                 }),
                 children: [
                     h && /* @__PURE__ */ t("div", {
-                        className: m(Ve, {
+                        className: u(Xe, {
                             [I]: s
                         }),
                         children: /* @__PURE__ */ t(Y, {
@@ -225,8 +224,8 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
                         })
                     }),
                     y && /* @__PURE__ */ t("div", {
-                        className: m({
-                            [Xe]: !!h,
+                        className: u({
+                            [Ee]: !!h,
                             [I]: s
                         }),
                         ref: f,
@@ -234,7 +233,7 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
                     }),
                     e && /* @__PURE__ */ t(o, {
                         paddingLeft: h || y ? 4 : 0,
-                        className: m(J, {
+                        className: u(J, {
                             [I]: s
                         }),
                         children: /* @__PURE__ */ t(ye, {
@@ -242,10 +241,10 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
                             direction: "right"
                         })
                     }),
-                    L && /* @__PURE__ */ t(o, {
+                    k && /* @__PURE__ */ t(o, {
                         paddingLeft: h || y ? 8 : 0,
                         className: J,
-                        children: L
+                        children: k
                     })
                 ]
             })
@@ -253,7 +252,7 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
     });
 }, Ye = (param)=>{
     let { value: e, defaultValue: a, onChange: r } = param;
-    const l = e !== void 0, [c, v] = u.useState(!!a);
+    const l = e !== void 0, [c, v] = m.useState(!!a);
     return [
         l ? !!e : c,
         ()=>{
@@ -265,9 +264,9 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         "checkbox",
         "radioValue",
         "iconButton"
-    ].some((a)=>e[a] !== void 0), le = /*#__PURE__*/ u.forwardRef((e, a)=>{
+    ].some((a)=>e[a] !== void 0), le = /*#__PURE__*/ m.forwardRef((e, a)=>{
     var p, ee;
-    const r = u.useId(), l = oe(), { asset: c, headline: v, title: g, titleAs: x, titleLinesMax: P, subtitle: w, subtitleLinesMax: D, description: h, descriptionLinesMax: E, detail: T, danger: N, badge: y, role: f, extra: k, withChevron: M, dataAttributes: s, right: L, "aria-label": A } = e, [Q, S] = u.useState(""), [de, ce] = u.useState(""), [se, he] = u.useState(""), me = [
+    const r = m.useId(), l = oe(), { asset: c, headline: v, title: g, titleAs: x, titleLinesMax: P, subtitle: w, subtitleLinesMax: D, description: h, descriptionLinesMax: E, detail: T, danger: N, badge: y, role: f, extra: L, withChevron: M, dataAttributes: s, right: k, "aria-label": A } = e, [Q, S] = m.useState(""), [de, ce] = m.useState(""), [se, he] = m.useState(""), ue = [
         g,
         Q,
         w,
@@ -275,7 +274,7 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         de,
         T,
         se
-    ].filter(Boolean).join(" "), B = A !== null && A !== void 0 ? A : e.href || e.to ? me : void 0, ue = Be(), b = e.disabled || e.radioValue !== void 0 && ue.disabled, O = !b && !l, W = !b && l, U = qe(e), V = !!e.onPress || !!e.href || !!e.to, fe = U ? !1 : M !== null && M !== void 0 ? M : V, Z = {
+    ].filter(Boolean).join(" "), B = A !== null && A !== void 0 ? A : e.href || e.to ? ue : void 0, me = Be(), b = e.disabled || e.radioValue !== void 0 && me.disabled, O = !b && !l, W = !b && l, U = qe(e), V = !!e.onPress || !!e.href || !!e.to, fe = U ? !1 : M !== null && M !== void 0 ? M : V, Z = {
         href: e.href,
         newTab: e.newTab,
         loadOnTop: e.loadOnTop,
@@ -285,11 +284,11 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         onNavigate: e.onNavigate,
         onPress: e.onPress,
         trackingEvent: e.trackingEvent
-    }, [_, $] = Ye(e.switch || e.checkbox || {}), R = (i)=>/* @__PURE__ */ t(Fe, {
+    }, [_, $] = Ye(e.switch || e.checkbox || {}), R = (n)=>/* @__PURE__ */ t(Fe, {
             asset: c,
             headline: v,
-            headlineRef: (n)=>{
-                n && S(n.textContent || "");
+            headlineRef: (i)=>{
+                i && S(i.textContent || "");
             },
             title: g,
             titleAs: x,
@@ -301,22 +300,22 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
             descriptionLinesMax: E,
             detail: T,
             danger: N,
-            right: L,
-            rightRef: (n)=>{
-                n && he(n.innerText || n.textContent || "");
+            right: k,
+            rightRef: (i)=>{
+                i && he(i.innerText || i.textContent || "");
             },
-            control: i == null ? void 0 : i.control,
-            extra: k,
-            extraRef: (n)=>{
-                n && ce(n.innerText || n.textContent || "");
+            control: n == null ? void 0 : n.control,
+            extra: L,
+            extraRef: (i)=>{
+                i && ce(i.innerText || i.textContent || "");
             },
-            labelId: i == null ? void 0 : i.labelId,
+            labelId: n == null ? void 0 : n.labelId,
             disabled: b,
             withChevron: fe
         });
     if (V && !U) return /* @__PURE__ */ t(te, _object_spread_props(_object_spread({
         ref: a,
-        className: m(q, {
+        className: u(q, {
             [z]: O,
             [G]: W,
             [re]: !b
@@ -332,8 +331,8 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
             children: R()
         })
     }));
-    const j = (i)=>/* @__PURE__ */ X("div", _object_spread_props(_object_spread({
-            className: Ee,
+    const j = (n)=>/* @__PURE__ */ X("div", _object_spread_props(_object_spread({
+            className: Pe,
             ref: a
         }, K(s)), {
             children: [
@@ -341,7 +340,7 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
                     disabled: b
                 }, Z), {
                     role: f,
-                    className: m(Pe, {
+                    className: u(De, {
                         [z]: O,
                         [G]: W
                     }),
@@ -351,26 +350,26 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
                     })
                 })),
                 /* @__PURE__ */ t("div", {
-                    className: De
+                    className: Me
                 }),
-                i
+                n
             ]
-        })), H = (i, n)=>/* @__PURE__ */ t("div", _object_spread_props(_object_spread({
-            className: m(q, {
-                [z]: O && n,
-                [G]: W && n,
-                [re]: !b && n
+        })), H = (n, i)=>/* @__PURE__ */ t("div", _object_spread_props(_object_spread({
+            className: u(q, {
+                [z]: O && i,
+                [G]: W && i,
+                [re]: !b && i
             }),
             ref: a
         }, K(s)), {
-            children: i
+            children: n
         }));
     if (e.switch || e.checkbox) {
         var _ref, _ref1;
-        const i = e.switch ? we : Re, n = (_ref1 = (_ref = (p = e.switch) == null ? void 0 : p.name) !== null && _ref !== void 0 ? _ref : (ee = e.checkbox) == null ? void 0 : ee.name) !== null && _ref1 !== void 0 ? _ref1 : r;
-        return V ? j(/* @__PURE__ */ t(i, {
+        const n = e.switch ? we : Re, i = (_ref1 = (_ref = (p = e.switch) == null ? void 0 : p.name) !== null && _ref !== void 0 ? _ref : (ee = e.checkbox) == null ? void 0 : ee.name) !== null && _ref1 !== void 0 ? _ref1 : r;
+        return V ? j(/* @__PURE__ */ t(n, {
             disabled: b,
-            name: n,
+            name: i,
             checked: _,
             "aria-label": B,
             "aria-labelledby": r,
@@ -378,13 +377,13 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
             render: (param)=>{
                 let { controlElement: F } = param;
                 return /* @__PURE__ */ t("div", {
-                    className: Me,
+                    className: Oe,
                     children: F
                 });
             }
-        })) : H(/* @__PURE__ */ t(i, {
+        })) : H(/* @__PURE__ */ t(n, {
             disabled: b,
-            name: n,
+            name: i,
             checked: _,
             "aria-label": B,
             "aria-labelledby": r,
@@ -410,12 +409,12 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         "aria-label": B,
         "aria-labelledby": r,
         render: (param)=>{
-            let { controlElement: i } = param;
+            let { controlElement: n } = param;
             return /* @__PURE__ */ t(C, {
                 space: "around",
                 children: /* @__PURE__ */ t(o, {
                     paddingX: 16,
-                    children: i
+                    children: n
                 })
             });
         }
@@ -424,7 +423,7 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         "aria-label": B,
         "aria-labelledby": r,
         render: (param)=>{
-            let { controlElement: i } = param;
+            let { controlElement: n } = param;
             return /* @__PURE__ */ t(o, {
                 paddingX: 16,
                 role: f,
@@ -432,7 +431,7 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
                     labelId: r,
                     control: /* @__PURE__ */ t(C, {
                         space: "around",
-                        children: i
+                        children: n
                     })
                 })
             });
@@ -441,9 +440,9 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         padding: 16,
         children: /* @__PURE__ */ t(C, {
             space: "around",
-            children: e.iconButton.Icon ? /* @__PURE__ */ t(ie, _object_spread_props(_object_spread({}, e.iconButton), {
+            children: e.iconButton.Icon ? /* @__PURE__ */ t(ne, _object_spread_props(_object_spread({}, e.iconButton), {
                 disabled: e.disabled
-            })) : /* @__PURE__ */ t(ne, _object_spread_props(_object_spread({}, e.iconButton), {
+            })) : /* @__PURE__ */ t(ie, _object_spread_props(_object_spread({}, e.iconButton), {
                 disabled: e.disabled
             }))
         })
@@ -453,10 +452,10 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
             labelId: r,
             control: /* @__PURE__ */ t(C, {
                 space: "around",
-                children: e.iconButton.Icon ? /* @__PURE__ */ t(ie, _object_spread_props(_object_spread({}, e.iconButton), {
+                children: e.iconButton.Icon ? /* @__PURE__ */ t(ne, _object_spread_props(_object_spread({}, e.iconButton), {
                     disabled: e.disabled,
                     role: f
-                })) : /* @__PURE__ */ t(ne, _object_spread_props(_object_spread({}, e.iconButton), {
+                })) : /* @__PURE__ */ t(ie, _object_spread_props(_object_spread({}, e.iconButton), {
                     disabled: e.disabled,
                     role: f
                 }))
@@ -470,16 +469,14 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         ref: a,
         children: R()
     });
-}), ht = /*#__PURE__*/ u.forwardRef((_param, l)=>{
+}), st = /*#__PURE__*/ m.forwardRef((_param, l)=>{
     var { dataAttributes: e, role: a = "listitem" } = _param, r = _object_without_properties(_param, [
         "dataAttributes",
         "role"
     ]);
     return /* @__PURE__ */ t("div", {
         role: a,
-        className: je({
-            width: "100%"
-        }),
+        className: Te,
         children: /* @__PURE__ */ t(le, _object_spread_props(_object_spread({}, r), {
             ref: l,
             dataAttributes: _object_spread({
@@ -487,14 +484,14 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
             }, e)
         }))
     });
-}), mt = (param)=>{
+}), ht = (param)=>{
     let { children: e, ariaLabelledby: a, role: r = "list", dataAttributes: l } = param;
-    const c = u.Children.toArray(e).filter(Boolean), v = c.length - 1;
+    const c = m.Children.toArray(e).filter(Boolean), v = c.length - 1;
     return /* @__PURE__ */ t("div", _object_spread_props(_object_spread({
         role: r,
         "aria-labelledby": a
     }, K(l, "RowList")), {
-        children: c.map((g, x)=>/* @__PURE__ */ X(u.Fragment, {
+        children: c.map((g, x)=>/* @__PURE__ */ X(m.Fragment, {
                 children: [
                     g,
                     x < v && /* @__PURE__ */ t(o, {
@@ -504,7 +501,7 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
                 ]
             }, x))
     }));
-}, ut = /*#__PURE__*/ u.forwardRef((_param, r)=>{
+}, ut = /*#__PURE__*/ m.forwardRef((_param, r)=>{
     var { dataAttributes: e } = _param, a = _object_without_properties(_param, [
         "dataAttributes"
     ]);
@@ -516,7 +513,7 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         }, e),
         children: /* @__PURE__ */ t(le, _object_spread({}, a))
     });
-}), ft = (param)=>{
+}), mt = (param)=>{
     let { children: e, ariaLabelledby: a, role: r = "list", dataAttributes: l } = param;
     return /* @__PURE__ */ t(C, {
         space: 16,
@@ -528,4 +525,4 @@ const He = (e, a)=>typeof e == "function" ? e == null ? void 0 : e({
         children: e
     });
 };
-export { ut as BoxedRow, ft as BoxedRowList, Fe as Content, ht as Row, mt as RowList };
+export { ut as BoxedRow, mt as BoxedRowList, Fe as Content, st as Row, ht as RowList };

package/dist-es/loading-screen.js

@@ -86,23 +86,22 @@ import { vars as f } from "./skins/skin-contract.css-mistica.js";
 import E from "./responsive-layout.js";
 import { Text4 as I, Text2 as O } from "./text.js";
 import w from "./stack.js";
-import { inOutAnimationMs as k, loadingScreen as V, screenBackground as j, screenBackgroundFadeOut as z, screenBackgroundAnimated as D, loadingScreenChildren as P, loadingScreenText as _, loadingScreenTextAnimatedOut as F, loadingScreenTextAnimated as y, logo as K, pulseLogo as M } from "./loading-screen.css-mistica.js";
+import { inOutAnimationMs as y, loadingScreen as V, screenBackground as j, screenBackgroundFadeOut as z, screenBackgroundAnimated as D, loadingScreenChildren as P, loadingScreenText as _, loadingScreenTextAnimatedOut as F, loadingScreenTextAnimated as k, logo as K, pulseLogo as M } from "./loading-screen.css-mistica.js";
 import W from "./spinner.js";
 import T from "classnames";
-import { sprinkles as $ } from "./sprinkles.css-mistica.js";
-import { Logo as q } from "./logo.js";
-import G from "./screen-reader-only.js";
+import { Logo as $ } from "./logo.js";
+import q from "./screen-reader-only.js";
 import { useTheme as R } from "./hooks.js";
-import { VIVO_NEW_SKIN as H } from "./skins/constants.js";
-import { getPrefixedDataAttributes as J } from "./utils/dom.js";
-import { loading as L } from "./text-tokens.js";
-const Q = (param)=>{
+import { VIVO_NEW_SKIN as G } from "./skins/constants.js";
+import { getPrefixedDataAttributes as H } from "./utils/dom.js";
+import { loading as J } from "./text-tokens.js";
+const L = (param)=>{
     let { isInverse: e } = param;
     const r = `body {background:${e ? f.colors.backgroundBrand : f.colors.background}}`;
     return /* @__PURE__ */ n("style", {
         children: r
     });
-}, U = (param)=>{
+}, Q = (param)=>{
     let { animateText: e, isLoading: r, onClose: t, texts: i } = param;
     const [c, s] = o.useState(0), [a, u] = o.useState(!1), l = o.useCallback(()=>{
         s((c + 1) % i.length), u(!1);
@@ -144,7 +143,7 @@ const Q = (param)=>{
                 space: 8,
                 children: [
                     d && /* @__PURE__ */ n("div", {
-                        className: e ? y : void 0,
+                        className: e ? k : void 0,
                         children: /* @__PURE__ */ n(I, {
                             textAlign: "center",
                             regular: !0,
@@ -153,7 +152,7 @@ const Q = (param)=>{
                         })
                     }),
                     p && /* @__PURE__ */ n("div", {
-                        className: e ? y : void 0,
+                        className: e ? k : void 0,
                         style: {
                             animationDelay: "200ms"
                         },
@@ -181,7 +180,7 @@ const Q = (param)=>{
         if (!t) return;
         const A = setTimeout(()=>{
             h(!0);
-        }, k);
+        }, y);
         return ()=>{
             clearTimeout(A);
         };
@@ -202,7 +201,7 @@ const Q = (param)=>{
         }
         const A = setTimeout(()=>{
             g();
-        }, k);
+        }, y);
         return ()=>{
             clearTimeout(A);
         };
@@ -221,13 +220,14 @@ const Q = (param)=>{
         children: [
             /* @__PURE__ */ S("div", _object_spread_props(_object_spread({
                 ref: d
-            }, J(a)), {
+            }, H(a)), {
                 className: T(V, j[e ? "inverse" : "default"], {
                     [z]: !t && c,
                     [D]: c
-                }, $({
+                }),
+                style: {
                     justifyContent: b ? "center" : "space-between"
-                })),
+                },
                 onAnimationEnd: ()=>{
                     h(!0);
                 },
@@ -241,7 +241,7 @@ const Q = (param)=>{
                         size: 32,
                         color: e ? f.colors.inverse : void 0
                     }),
-                    /* @__PURE__ */ n(U, {
+                    /* @__PURE__ */ n(Q, {
                         animateText: i,
                         isLoading: t,
                         texts: m,
@@ -254,19 +254,19 @@ const Q = (param)=>{
                     })
                 ]
             })),
-            t && p && /* @__PURE__ */ n(Q, {
+            t && p && /* @__PURE__ */ n(L, {
                 isInverse: !!e
             })
         ]
     });
-}), ge = /*#__PURE__*/ o.forwardRef((e, r)=>/* @__PURE__ */ n(x, _object_spread_props(_object_spread({
+}), pe = /*#__PURE__*/ o.forwardRef((e, r)=>/* @__PURE__ */ n(x, _object_spread_props(_object_spread({
         ref: r
     }, e), {
         dataAttributes: _object_spread({
             "component-name": "LoadingScreen"
         }, e.dataAttributes),
         animateBackground: !0
-    }))), X = (param)=>{
+    }))), U = (param)=>{
     let { isLoading: e, onCloseStart: r, onCloseEnd: t } = param;
     const { texts: i, t: c } = R(), [s, a] = o.useState(!0), u = ()=>{
         e || (r == null || r(), a(!1), t == null || t());
@@ -277,32 +277,32 @@ const Q = (param)=>{
         }),
         onAnimationIteration: u,
         children: [
-            /* @__PURE__ */ n(G, {
+            /* @__PURE__ */ n(q, {
                 children: /* @__PURE__ */ n("div", {
-                    children: i.loading || c(L)
+                    children: i.loading || c(J)
                 })
             }),
-            /* @__PURE__ */ n(q, {
+            /* @__PURE__ */ n($, {
                 size: 128
             })
         ]
     });
-}, Y = /*#__PURE__*/ o.lazy(()=>import("./vivinho-loading-animation/index.js")), Z = (param)=>{
+}, X = /*#__PURE__*/ o.lazy(()=>import("./vivinho-loading-animation/index.js")), Y = (param)=>{
     let { isLoading: e, onCloseStart: r, onCloseEnd: t } = param;
     const { skinName: i } = R();
-    return i === H ? /* @__PURE__ */ n(o.Suspense, {
+    return i === G ? /* @__PURE__ */ n(o.Suspense, {
         fallback: null,
-        children: /* @__PURE__ */ n(Y, {
+        children: /* @__PURE__ */ n(X, {
             isLoading: e,
             onCloseStart: r,
             onCloseEnd: t
         })
-    }) : /* @__PURE__ */ n(X, {
+    }) : /* @__PURE__ */ n(U, {
         isLoading: e,
         onCloseStart: r,
         onCloseEnd: t
     });
-}, Se = /*#__PURE__*/ o.forwardRef((_param, c)=>{
+}, he = /*#__PURE__*/ o.forwardRef((_param, c)=>{
     var { isLoading: e = !0, onClose: r, dataAttributes: t } = _param, i = _object_without_properties(_param, [
         "isLoading",
         "onClose",
@@ -325,7 +325,7 @@ const Q = (param)=>{
         dataAttributes: _object_spread({
             "component-name": "BrandLoadingScreen"
         }, t),
-        children: /* @__PURE__ */ n(Z, {
+        children: /* @__PURE__ */ n(Y, {
             isLoading: e,
             onCloseStart: m,
             onCloseEnd: ()=>{
@@ -334,4 +334,4 @@ const Q = (param)=>{
         })
     }));
 });
-export { Se as BrandLoadingScreen, ge as LoadingScreen };
+export { he as BrandLoadingScreen, pe as LoadingScreen };