@telefonica/mistica 14.7.1 → 14.8.0

package/dist/image.js

@@ -9,10 +9,12 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    MediaBorderRadiusProvider: ()=>r1,
-    RATIO: ()=>U,
-    default: ()=>s1,
-    useMediaBorderRadius: ()=>O
+    ImageContent: ()=>q,
+    ImageError: ()=>Z,
+    MediaBorderRadiusProvider: ()=>n1,
+    RATIO: ()=>x,
+    default: ()=>a1,
+    useMediaBorderRadius: ()=>K
 });
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 const _classnames = /*#__PURE__*/ _interopRequireDefault(require("classnames"));
@@ -150,29 +152,29 @@ function _objectWithoutPropertiesLoose(source, excluded) {
     }
     return target;
 }
-const k = /*#__PURE__*/ _react.createContext(!0), O = ()=>_react.useContext(k), r1 = (param)=>/* @__PURE__ */ {
-    let { children: t , value: s  } = param;
-    return (0, _jsxRuntimeJs.jsx)(k.Provider, {
-        value: s,
-        children: t
+const I = /*#__PURE__*/ _react.createContext(!0), K = ()=>_react.useContext(I), n1 = (param)=>/* @__PURE__ */ {
+    let { children: e , value: r  } = param;
+    return (0, _jsxRuntimeJs.jsx)(I.Provider, {
+        value: r,
+        children: e
     });
-}, P = (param)=>/* @__PURE__ */ {
-    let { style: t  } = param;
+}, U = (param)=>/* @__PURE__ */ {
+    let { style: e  } = param;
     return (0, _jsxRuntimeJs.jsx)("svg", {
         width: "48",
         height: "48",
         viewBox: "0 0 48 48",
         fill: "none",
-        style: t,
+        style: e,
         children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("path", {
             d: "M24.021 35.7235C24.8145 35.7694 25.0467 36.1913 25.3157 36.5138C25.586 36.8362 29.515 41.551 29.7823 41.8569C30.0475 42.1662 30.7822 42.7329 31.5901 42.8405C32.3967 42.9473 33.282 42.7842 33.8484 42.3748C34.4135 41.965 35.1313 41.4073 35.3833 41.0356C35.6337 40.6638 36.061 40.1302 35.9823 39.2534C35.9028 38.3783 35.7112 37.9204 35.0268 37.1691C34.3433 36.4185 30.2992 31.6657 29.5382 30.7537C29.5382 30.7537 28.8467 29.9423 28.9469 28.7956C29.0476 27.6468 29.567 27.1343 30.6608 26.8487C31.7534 26.5647 36.0267 25.5306 36.0267 25.5306C36.0267 25.5306 38.4728 24.3723 37.9182 22.0776L37.5997 20.904C37.5997 20.904 37.0672 18.2264 33.5519 19.0556C30.0344 19.8869 28.0803 20.377 28.0803 20.377C28.0803 20.377 26.9602 20.4838 26.7999 19.744C26.6417 19.0038 26.8494 18.6218 27.3443 18.4156C27.8387 18.209 30.9611 16.7175 31.3617 12.6853C31.7652 8.65158 28.3882 5.06573 24.0091 5.08104C19.6288 5.0976 16.4594 8.39988 16.4725 11.8185C16.4856 15.2387 18.7033 17.5144 20.4079 18.3638C21.3752 18.8453 21.0656 19.7122 21.0656 19.7122C21.0656 19.7122 20.8334 20.5554 19.8153 20.3311C18.7972 20.1025 13.8657 18.9736 13.8657 18.9736C13.8657 18.9736 10.8914 18.4226 10.1732 21.359C9.4541 24.2978 11.1261 25.4143 12.3532 25.6908C13.5798 25.9669 17.7296 26.9716 17.7296 26.9716C17.7296 26.9716 18.9643 27.581 19.0125 28.8308C19.0425 29.5697 19.0438 30.1824 18.266 31.2832C17.4894 32.3835 12.6598 38.0148 12.6598 38.0148C12.6598 38.0148 10.9997 39.9862 13.4051 41.763C15.8106 43.5401 17.1641 43.1262 18.5921 41.4889C20.0188 39.852 22.8383 36.4243 22.8383 36.4243C22.8383 36.4243 23.2275 35.6788 24.021 35.7235Z",
             stroke: _skinContractCssMisticaJs.vars.colors.brand,
             strokeWidth: "2"
         })
     });
-}, K = (param)=>{
-    let { noBorderRadius: t  } = param;
-    const s = (0, _themeVariantContextJs.useIsInverseVariant)(), { skinName: c  } = (0, _hooksJs.useTheme)();
+}, Z = /*#__PURE__*/ _react.forwardRef((param, a)=>{
+    let { noBorderRadius: e , withIcon: r = !0  } = param;
+    const o = (0, _themeVariantContextJs.useIsInverseVariant)(), { skinName: d  } = (0, _hooksJs.useTheme)();
     return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
         style: {
             height: "100%",
@@ -180,10 +182,11 @@ const k = /*#__PURE__*/ _react.createContext(!0), O = ()=>_react.useContext(k),
             display: "flex",
             alignItems: "center",
             justifyContent: "center",
-            backgroundColor: s ? _skinContractCssMisticaJs.vars.colors.backgroundSkeletonInverse : _skinContractCssMisticaJs.vars.colors.backgroundSkeleton,
-            borderRadius: t ? void 0 : _skinContractCssMisticaJs.vars.borderRadii.container
+            backgroundColor: o ? _skinContractCssMisticaJs.vars.colors.backgroundSkeletonInverse : _skinContractCssMisticaJs.vars.colors.backgroundSkeleton,
+            borderRadius: e ? void 0 : _skinContractCssMisticaJs.vars.borderRadii.container
         },
-        children: c === _constantsJs.VIVO_SKIN ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(P, {
+        ref: a,
+        children: r ? d === _constantsJs.VIVO_SKIN ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(U, {
             style: {
                 width: "10%",
                 minWidth: 24,
@@ -198,18 +201,18 @@ const k = /*#__PURE__*/ _react.createContext(!0), O = ()=>_react.useContext(k),
                 maxWidth: 48
             },
             children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("path", {
-                fill: s ? _skinContractCssMisticaJs.vars.colors.inverse : _skinContractCssMisticaJs.vars.colors.neutralMedium,
+                fill: o ? _skinContractCssMisticaJs.vars.colors.inverse : _skinContractCssMisticaJs.vars.colors.neutralMedium,
                 d: "M20.25 4.622c.832 0 1.591.664 1.591 1.393v11.98c0 .728-.76 1.392-1.591 1.392H3.746c-.863 0-1.591-.639-1.591-1.392V6.015c0-.754.728-1.393 1.59-1.393H20.25zm0 13.558c.193 0 .367-.146.39-.207l-.003-11.956a.555.555 0 00-.384-.182H3.746c-.21 0-.364.132-.387.19v11.973c.014.044.171.182.387.182H20.25zM6.152 9.068c0 .554.451 1.005 1.003 1.005a1.006 1.006 0 000-2.01c-.552 0-1.003.45-1.003 1.005zm1.003 2.215a2.216 2.216 0 010-4.43c1.218 0 2.207.993 2.207 2.215a2.213 2.213 0 01-2.207 2.215zm12.42 1.337l-3.18-2.44a.605.605 0 00-.742.005l-3.636 2.9-.879-.83a.6.6 0 00-.798-.025l-5.168 4.317a.607.607 0 00.386 1.07.59.59 0 00.384-.14l4.759-3.975 3.308 3.123c.241.23.625.221.852-.025a.605.605 0 00-.026-.854l-1.932-1.824 3.131-2.496 2.807 2.154a.603.603 0 00.846-.112.609.609 0 00-.112-.848z"
             })
-        })
+        }) : void 0
     });
-}, U = {
+}), x = {
     "1:1": 1,
     "16:9": 16 / 9,
     "7:10": 7 / 10,
     "4:3": 4 / 3
-}, s1 = /*#__PURE__*/ _react.forwardRef((_param, x)=>{
-    var { aspectRatio: t = "1:1" , alt: s = "" , dataAttributes: c , noBorderRadius: l , src: I , onError: d , onLoad: a , loadingFallback: R = !0 , errorFallback: p = !0  } = _param, o = _objectWithoutProperties(_param, [
+}, q = /*#__PURE__*/ _react.forwardRef((_param, p)=>{
+    var { aspectRatio: e = "1:1" , alt: r = "" , dataAttributes: a , noBorderRadius: o , src: d , onError: l , onLoad: c , loadingFallback: y = !0 , errorFallback: R = !0  } = _param, n = _objectWithoutProperties(_param, [
         "aspectRatio",
         "alt",
         "dataAttributes",
@@ -220,66 +223,78 @@ const k = /*#__PURE__*/ _react.createContext(!0), O = ()=>_react.useContext(k),
         "loadingFallback",
         "errorFallback"
     ]);
-    const C = _react.useRef(), y = O(), m = l != null ? l : !y, [u, f] = _react.useState(!1), [S, g] = _react.useState(!0), [M, b] = _react.useState(!1), n = typeof t == "number" ? t : U[t], v = R && !!(n !== 0 || o.width && o.height), H = p && !!(n !== 0 || o.width && o.height), h = _react.useCallback(()=>{
-        f(!1), g(!1), setTimeout(()=>{
-            b(!0);
-        }, _imageCssMisticaJs.FADE_IN_DURATION_MS), a == null || a();
+    const C = _react.useRef(), S = K(), m = o != null ? o : !S, [f, g] = _react.useState(!1), [M, b] = _react.useState(!0), [F, v] = _react.useState(!1), h = typeof e == "number" ? e : x[e], w = y && !!(h !== 0 || n.width && n.height), H = R && !!(h !== 0 || n.width && n.height), u = _react.useCallback(()=>{
+        g(!1), b(!1), setTimeout(()=>{
+            v(!0);
+        }, _imageCssMisticaJs.FADE_IN_DURATION_MS), c == null || c();
     }, [
-        a
-    ]), z = /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("img", _objectSpreadProps(_objectSpread({}, (0, _domJs.getPrefixedDataAttributes)(c)), {
-        style: _objectSpread({}, S && v ? {
+        c
+    ]), z = /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("img", _objectSpreadProps(_objectSpread({}, (0, _domJs.getPrefixedDataAttributes)(a)), {
+        style: _objectSpread({}, M && w ? {
             opacity: 0
         } : {
             opacity: 1
         }),
-        ref: (0, _commonJs.combineRefs)(C, x),
-        src: I,
+        ref: (0, _commonJs.combineRefs)(C, p),
+        src: d,
         className: (0, _classnames.default)(_imageCssMisticaJs.image, (0, _sprinklesCssMisticaJs.sprinkles)({
-            position: n !== 0 ? "absolute" : "static",
+            position: h !== 0 ? "absolute" : "static",
             borderRadius: m ? void 0 : _skinContractCssMisticaJs.vars.borderRadii.container
         })),
-        alt: s,
+        alt: r,
         onError: ()=>{
-            f(!0), g(!1), b(!0), d == null || d();
+            g(!0), b(!1), v(!0), l == null || l();
         },
-        onLoad: h
+        onLoad: u
     }));
     return _react.useEffect(()=>{
-        var w;
-        (w = C.current) != null && w.complete && h();
+        var k;
+        (k = C.current) != null && k.complete && u();
     }, [
-        h
-    ]), /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_aspectRatioSupportJs.AspectRatioElement, {
-        style: {
-            position: "relative"
-        },
-        aspectRatio: n,
-        width: o.width,
-        height: o.height,
+        u
+    ]), /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_jsxRuntimeJs.Fragment, {
         children: [
-            v && !M && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
+            w && !F && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
                 style: {
                     position: "absolute",
                     width: "100%",
                     height: "100%"
                 },
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_skeletonsJs.SkeletonRectangle, {
-                    width: o.width,
-                    height: o.height,
+                    width: n.width,
+                    height: n.height,
                     noBorderRadius: m
                 })
             }),
-            u && H && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
+            f && H && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
                 style: {
                     position: "absolute",
                     width: "100%",
                     height: "100%"
                 },
-                children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(K, {
+                children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(Z, {
                     noBorderRadius: m
                 })
             }),
-            !u && z
+            !f && z
         ]
     });
+}), a1 = /*#__PURE__*/ _react.forwardRef((_param, a)=>{
+    var { aspectRatio: e = "1:1"  } = _param, r = _objectWithoutProperties(_param, [
+        "aspectRatio"
+    ]);
+    const o = typeof e == "number" ? e : x[e];
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_aspectRatioSupportJs.AspectRatioElement, {
+        style: {
+            position: "relative"
+        },
+        aspectRatio: o,
+        width: r.width,
+        height: r.height,
+        children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(q, _objectSpreadProps(_objectSpread({
+            aspectRatio: e
+        }, r), {
+            ref: a
+        }))
+    });
 });

package/dist/list.css-mistica.js

@@ -10,20 +10,20 @@ function _export(target, all) {
 }
 _export(exports, {
     asset: ()=>_,
-    badge: ()=>f,
-    center: ()=>y,
+    badge: ()=>y,
+    center: ()=>f,
     content: ()=>r,
     disabled: ()=>a,
     dualActionContainer: ()=>o,
     dualActionDivider: ()=>t,
-    dualActionLeft: ()=>i,
-    dualActionRight: ()=>e,
-    hoverBackground: ()=>b,
+    dualActionLeft: ()=>d,
+    dualActionRight: ()=>i,
+    hoverBackground: ()=>e,
     pointer: ()=>u,
-    right: ()=>d,
+    right: ()=>b,
     rowBody: ()=>g,
-    rowContent: ()=>c
+    rowContent: ()=>j
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./list.css.ts.vanilla.js");
-var _ = "_1y2v1nf5o _1y2v1nf66 _1y2v1nf68", f = "_1y2v1nf5x _1y2v1nf8w _1y2v1nf8b _1y2v1nf66", y = "_1y2v1nf5o _1y2v1nf63", r = "_1y2v1nf5o _1y2v1nf7v _1y2v1nf9h", a = "_2buj9g0", o = "_1y2v1nf5o _1y2v1nf5t", t = "_2buj9gi _1y2v1nf5o", i = "_1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h _1y2v1nf5q _1y2v1nf9m _1y2v1nf5i _1y2v1nf78 _1y2v1nf7m _1y2v1nf69", e = "_2buj9gk _1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h _1y2v1nf5q _1y2v1nf9m _1y2v1nf5i _1y2v1nf78 _1y2v1nf7m _1y2v1nf5o _1y2v1nf63 _1y2v1nf68 _1y2v1nf7w", b = "_2buj9g1", u = "_1y2v1nfa3", d = "_2buj9gb", g = "_1y2v1nf5o _1y2v1nf5u _1y2v1nf6a", c = "_1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h _1y2v1nf7v _1y2v1nf9m _1y2v1nf5i";
+var _ = "_1y2v1nf5q _1y2v1nf68 _1y2v1nf6a", y = "_1y2v1nf5z _1y2v1nf8y _1y2v1nf8d _1y2v1nf68", f = "_1y2v1nf5q _1y2v1nf65", r = "_1y2v1nf5q _1y2v1nf7x _1y2v1nf9j", a = "_2buj9g0", o = "_1y2v1nf5q _1y2v1nf5v", t = "_2buj9gi _1y2v1nf5q", d = "_1y2v1nf6d _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf5s _1y2v1nf9o _1y2v1nf5k _1y2v1nf7a _1y2v1nf7o _1y2v1nf6b", i = "_2buj9gk _1y2v1nf6d _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf5s _1y2v1nf9o _1y2v1nf5k _1y2v1nf7a _1y2v1nf7o _1y2v1nf5q _1y2v1nf65 _1y2v1nf6a _1y2v1nf7y", e = "_2buj9g1", u = "_1y2v1nfa5", b = "_2buj9gb", g = "_1y2v1nf5q _1y2v1nf5w _1y2v1nf6c", j = "_1y2v1nf6d _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf7x _1y2v1nf9o _1y2v1nf5k";

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

@@ -13,12 +13,12 @@ _export(exports, {
     enter: ()=>_,
     enterActive: ()=>a,
     exit: ()=>e,
-    exitActive: ()=>y,
-    innerProgress: ()=>f,
-    portal: ()=>t,
-    progress: ()=>g,
-    progressContainer: ()=>m
+    exitActive: ()=>f,
+    innerProgress: ()=>y,
+    portal: ()=>g,
+    progress: ()=>m,
+    progressContainer: ()=>t
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./loading-bar.css.ts.vanilla.js");
-var r = 400, _ = "_1num3qg9", a = "_1num3qga", e = "_1num3qgb", y = "_1num3qgc", f = "_1num3qg8 _1y2v1nf8b", t = "_1num3qg3 _1y2v1nf5l _1y2v1nfa6 _1y2v1nfak _1y2v1nfay", g = "_1num3qg6 _1y2v1nf5k _1y2v1nf8b _1y2v1nf7v", m = "_1y2v1nf7v _1y2v1nfa4 _1y2v1nf5j _1y2v1nf3v _1y2v1nf8e";
+var r = 400, _ = "_1num3qg9", a = "_1num3qga", e = "_1num3qgb", f = "_1num3qgc", y = "_1num3qg8 _1y2v1nf8d", g = "_1num3qg3 _1y2v1nf5n _1y2v1nfa8 _1y2v1nfam _1y2v1nfb0", m = "_1num3qg6 _1y2v1nf5m _1y2v1nf8d _1y2v1nf7x", t = "_1y2v1nf7x _1y2v1nfa6 _1y2v1nf5l _1y2v1nf3x _1y2v1nf8g";

package/dist/maybe-dismissable.css-mistica.js

@@ -9,10 +9,10 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    dismissableButton: ()=>y,
-    dismissableCircleContainer: ()=>f,
+    dismissableButton: ()=>f,
+    dismissableCircleContainer: ()=>y,
     dismissableContainer: ()=>_
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./maybe-dismissable.css.ts.vanilla.js");
-var y = "cim30m2 _1y2v1nf5k _1y2v1nfa6 _1y2v1nfay _1y2v1nf86 _1y2v1nf8l _1y2v1nf5o _1y2v1nf63 _1y2v1nf5x", f = "cim30m4 _1y2v1nf5o _1y2v1nf63 _1y2v1nf5x _1y2v1nf83 _1y2v1nf8i _1y2v1nf9n", _ = "_1y2v1nf5j _1y2v1nf5o _1y2v1nf66";
+var f = "cim30m2 _1y2v1nf5m _1y2v1nfa8 _1y2v1nfb0 _1y2v1nf88 _1y2v1nf8n _1y2v1nf5q _1y2v1nf65 _1y2v1nf5z", y = "cim30m4 _1y2v1nf5q _1y2v1nf65 _1y2v1nf5z _1y2v1nf85 _1y2v1nf8k _1y2v1nf9p", _ = "_1y2v1nf5l _1y2v1nf5q _1y2v1nf68";

package/dist/menu.css-mistica.js

@@ -9,14 +9,14 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    hideItems: ()=>r,
+    hideItems: ()=>k,
     menuContainer: ()=>_,
     showItems: ()=>a,
     vars: ()=>n
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./menu.css.ts.vanilla.js");
-var r = "_2k0k3u9", _ = "_2k0k3u7 _1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h _1y2v1nf2t _1y2v1nf9v _1y2v1nf5o _1y2v1nf5u _1y2v1nf5k", a = "_2k0k3u8", n = {
+var k = "_2k0k3u9", _ = "_2k0k3u7 _1y2v1nf6d _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf2u _1y2v1nf9x _1y2v1nf5q _1y2v1nf5w _1y2v1nf5m", a = "_2k0k3u8", n = {
     top: "var(--_2k0k3u0)",
     bottom: "var(--_2k0k3u1)",
     left: "var(--_2k0k3u2)",

package/dist/navigation-bar.css-mistica.js

@@ -22,24 +22,24 @@ _export(exports, {
     logoContainer: ()=>z,
     navbarBorderColorVariants: ()=>o,
     section: ()=>u,
-    selectedSectionVariantes: ()=>g,
-    spacer: ()=>p,
-    textWrapperVariants: ()=>s,
-    topFixed: ()=>l
+    selectedSectionVariantes: ()=>s,
+    spacer: ()=>l,
+    textWrapperVariants: ()=>b,
+    topFixed: ()=>g
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./navigation-bar.css.ts.vanilla.js");
-var y = "_1vcy5dz1 _1y2v1nf5j _1y2v1nf83 _1y2v1nf8i", _ = "_1vcy5dzr _1y2v1nf5l _1y2v1nfag _1y2v1nfak _1y2v1nfay _1y2v1nf2s", r = "_1vcy5dzl", e = "_1vcy5dzm", f = "_1vcy5dzn", a = "_1vcy5dzo", c = {
-    default: "_1vcy5dzu _1y2v1nf1h",
-    inverse: "_1vcy5dzv _1y2v1nf1g"
-}, d = "_1vcy5dz4 _1vcy5dz3 _1y2v1nf5k", i = "_1vcy5dz5 _1vcy5dz3 _1y2v1nf5k", t = "_1vcy5dzw", z = "_1y2v1nf5o _1y2v1nf5x", o = {
-    default: "_1vcy5dza _1vcy5dz9 _1y2v1nf6g _1y2v1nf6u _1y2v1nf5o _1y2v1nf63 _1y2v1nf7v _1y2v1nf8p",
-    inverse: "_1vcy5dzb _1vcy5dz9 _1y2v1nf6g _1y2v1nf6u _1y2v1nf5o _1y2v1nf63 _1y2v1nf7v _1y2v1nf8p",
-    menuOpen: "_1vcy5dzc _1vcy5dz9 _1y2v1nf6g _1y2v1nf6u _1y2v1nf5o _1y2v1nf63 _1y2v1nf7v _1y2v1nf8p"
-}, u = "_1vcy5dze _1y2v1nf76 _1y2v1nf7k _1y2v1nf8p _1y2v1nf5o _1y2v1nf63 _1y2v1nf9m _1y2v1nf5i", g = {
+var y = "_1vcy5dz1 _1y2v1nf5l _1y2v1nf85 _1y2v1nf8k", _ = "_1vcy5dzr _1y2v1nf5n _1y2v1nfai _1y2v1nfam _1y2v1nfb0 _1y2v1nf2t", r = "_1vcy5dzl", e = "_1vcy5dzm", f = "_1vcy5dzn", a = "_1vcy5dzo", c = {
+    default: "_1vcy5dzu _1y2v1nf1i",
+    inverse: "_1vcy5dzv _1y2v1nf1h"
+}, d = "_1vcy5dz4 _1vcy5dz3 _1y2v1nf5m", i = "_1vcy5dz5 _1vcy5dz3 _1y2v1nf5m", t = "_1vcy5dzw", z = "_1y2v1nf5q _1y2v1nf5z", o = {
+    default: "_1vcy5dza _1vcy5dz9 _1y2v1nf6i _1y2v1nf6w _1y2v1nf5q _1y2v1nf65 _1y2v1nf7x _1y2v1nf8r",
+    inverse: "_1vcy5dzb _1vcy5dz9 _1y2v1nf6i _1y2v1nf6w _1y2v1nf5q _1y2v1nf65 _1y2v1nf7x _1y2v1nf8r",
+    menuOpen: "_1vcy5dzc _1vcy5dz9 _1y2v1nf6i _1y2v1nf6w _1y2v1nf5q _1y2v1nf65 _1y2v1nf7x _1y2v1nf8r"
+}, u = "_1vcy5dze _1y2v1nf78 _1y2v1nf7m _1y2v1nf8r _1y2v1nf5q _1y2v1nf65 _1y2v1nf9o _1y2v1nf5k", s = {
     default: "_1vcy5dzf",
     inverse: "_1vcy5dzg"
-}, p = "_1vcy5dzk _1y2v1nf8p", s = {
+}, l = "_1vcy5dzk _1y2v1nf8r", b = {
     default: "_1vcy5dzh",
     inverse: "_1vcy5dzi"
-}, l = "_1vcy5dz7 _1y2v1nf5l _1y2v1nfa6 _1y2v1nfak _1y2v1nfay";
+}, g = "_1vcy5dz7 _1y2v1nf5n _1y2v1nfa8 _1y2v1nfam _1y2v1nfb0";

package/dist/navigation-breadcrumbs.css-mistica.js

@@ -12,8 +12,8 @@ _export(exports, {
     current: ()=>v,
     link: ()=>f,
     list: ()=>i,
-    listItem: ()=>_
+    listItem: ()=>t
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./navigation-breadcrumbs.css.ts.vanilla.js");
-var v = "_1fniauj3", f = "_1fniauj2", i = "_1fniauj5 _1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h", _ = "_1y2v1nf5r";
+var v = "_1fniauj3", f = "_1fniauj2", i = "_1fniauj5 _1y2v1nf6d _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j", t = "_1y2v1nf5t";

package/dist/package-version.js

@@ -6,4 +6,4 @@ Object.defineProperty(exports, "PACKAGE_VERSION", {
     enumerable: true,
     get: ()=>o
 });
-const o = "14.7.1";
+const o = "14.8.0";

package/dist/password-field.css-mistica.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "shadow", {
     enumerable: true,
-    get: ()=>y
+    get: ()=>f
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./password-field.css.ts.vanilla.js");
-var y = "ptqylz1 _1y2v1nf6e _1y2v1nf6s _1y2v1nf76 _1y2v1nf7k _1y2v1nf9n _1y2v1nf5i";
+var f = "ptqylz1 _1y2v1nf6g _1y2v1nf6u _1y2v1nf78 _1y2v1nf7m _1y2v1nf9p _1y2v1nf5k";

package/dist/popover.css-mistica.js

@@ -9,19 +9,19 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    arrow: ()=>t,
-    arrowSize: ()=>a,
-    arrowWrapper: ()=>r,
-    closeButtonIcon: ()=>o,
-    container: ()=>_,
+    arrow: ()=>a,
+    arrowSize: ()=>r,
+    arrowWrapper: ()=>t,
+    closeButtonIcon: ()=>_,
+    container: ()=>o,
     defaultPositionDesktop: ()=>f,
     defaultPositionMobile: ()=>i,
     distanceToTarget: ()=>y,
     marginLeftRightMobile: ()=>e,
-    maxWidthDesktop: ()=>g,
-    textAlign: ()=>l,
-    textContent: ()=>p
+    maxWidthDesktop: ()=>u,
+    textAlign: ()=>g,
+    textContent: ()=>m
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./popover.css.ts.vanilla.js");
-var t = "_12igu661 _1y2v1nf5k _1y2v1nfa6 _1y2v1nf9l _1y2v1nf9o _1y2v1nf2t", a = 12, r = "_12igu663 _1y2v1nf5k _1y2v1nf2 _1y2v1nfa4", o = "_12igu669 _1y2v1nf5k _1y2v1nfa9 _1y2v1nfb1", _ = "_12igu665 _1y2v1nf5k _1y2v1nf7w _1y2v1nf2t _1y2v1nf9l _1y2v1nf9x", f = "bottom", i = "top", y = 20, e = 16, g = 488, l = "_1y2v1nf5o _1y2v1nf63 _1y2v1nf8b", p = "_12igu667";
+var a = "_12igu661 _1y2v1nf5m _1y2v1nfa8 _1y2v1nf9n _1y2v1nf9q _1y2v1nf2u", r = 12, t = "_12igu663 _1y2v1nf5m _1y2v1nf2 _1y2v1nfa6", _ = "_12igu669 _1y2v1nf5m _1y2v1nfab _1y2v1nfb3", o = "_12igu665 _1y2v1nf5m _1y2v1nf7y _1y2v1nf2u _1y2v1nf9n _1y2v1nf9z", f = "bottom", i = "top", y = 20, e = 16, u = 488, g = "_1y2v1nf5q _1y2v1nf65 _1y2v1nf8d", m = "_12igu667";

package/dist/progress-bar.css-mistica.js

@@ -16,4 +16,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./progress-bar.css.ts.vanilla.js");
-var v = "_1y2v1nf8b _1y2v1nfa1", n = "_1y2v1nfa1 _1y2v1nf8e _1y2v1nf3r", y = "j0y7r95", f = "j0y7r94";
+var v = "_1y2v1nf8d _1y2v1nfa3", n = "_1y2v1nfa3 _1y2v1nf8g _1y2v1nf3t", y = "j0y7r95", f = "j0y7r94";

package/dist/radio-button.css-mistica.js

@@ -11,17 +11,17 @@ function _export(target, all) {
 _export(exports, {
     disabled: ()=>r,
     innerCircle: ()=>f,
-    innerCircleChecked: ()=>s,
-    outerCircleCheckedVariants: ()=>a,
-    outerCircleVariants: ()=>d,
-    radioButton: ()=>y
+    innerCircleChecked: ()=>a,
+    outerCircleCheckedVariants: ()=>d,
+    outerCircleVariants: ()=>y,
+    radioButton: ()=>_
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./radio-button.css.ts.vanilla.js");
-var r = "c6dmsub", f = "c6dmsu5 _1y2v1nf5o _1y2v1nf9n", s = "c6dmsu7 _1y2v1nf3s", a = {
+var r = "c6dmsub", f = "c6dmsu5 _1y2v1nf5q _1y2v1nf9p", a = "c6dmsu7 _1y2v1nf3u", d = {
     default: "c6dmsu9",
     ios: "c6dmsua"
-}, d = {
-    default: "c6dmsu2 c6dmsu1 _1y2v1nf5p _1y2v1nf63 _1y2v1nf5x _1y2v1nfa3 _1y2v1nf66 _1y2v1nf9n _1y2v1nf2s",
-    ios: "c6dmsu3 c6dmsu1 _1y2v1nf5p _1y2v1nf63 _1y2v1nf5x _1y2v1nfa3 _1y2v1nf66 _1y2v1nf9n _1y2v1nf2s"
-}, y = "c6dmsu8";
+}, y = {
+    default: "c6dmsu2 c6dmsu1 _1y2v1nf5r _1y2v1nf65 _1y2v1nf5z _1y2v1nfa5 _1y2v1nf68 _1y2v1nf9p _1y2v1nf2t",
+    ios: "c6dmsu3 c6dmsu1 _1y2v1nf5r _1y2v1nf65 _1y2v1nf5z _1y2v1nfa5 _1y2v1nf68 _1y2v1nf9p _1y2v1nf2t"
+}, _ = "c6dmsu8";

package/dist/responsive-layout.css-mistica.js

@@ -9,14 +9,14 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    backgroundVariant: ()=>a,
-    container: ()=>n,
+    backgroundVariant: ()=>n,
+    container: ()=>v,
     fullWidth: ()=>o,
     responsiveLayout: ()=>t
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./responsive-layout.css.ts.vanilla.js");
-var a = {
-    inverse: "_1y2v1nf2w",
-    alternative: "_1y2v1nf31"
-}, n = "_1y2v1nf7v", o = "_17lofg76 _1y2v1nf7v", t = "_17lofg74";
+var n = {
+    inverse: "_1y2v1nf2y",
+    alternative: "_1y2v1nf33"
+}, v = "_1y2v1nf7x", o = "_17lofg76 _1y2v1nf7x", t = "_17lofg74";

package/dist/screen-reader-only.css-mistica.js

@@ -8,4 +8,4 @@ Object.defineProperty(exports, "screenReaderOnly", {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./screen-reader-only.css.ts.vanilla.js");
-var y = "gwdgwo1 _1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h _1y2v1nf5k _1y2v1nfa4 _1y2v1nf9m";
+var y = "gwdgwo1 _1y2v1nf6d _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf5m _1y2v1nfa6 _1y2v1nf9o";

package/dist/select.css-mistica.js

@@ -10,10 +10,10 @@ function _export(target, all) {
 }
 _export(exports, {
     arrowDown: ()=>n,
-    menuItem: ()=>i,
-    menuItemSelected: ()=>f,
-    optionsAnimationsVariants: ()=>y,
-    optionsContainer: ()=>s,
+    menuItem: ()=>f,
+    menuItemSelected: ()=>i,
+    optionsAnimationsVariants: ()=>s,
+    optionsContainer: ()=>y,
     selectContainerVariants: ()=>a,
     selectTextVariants: ()=>r,
     selectVariants: ()=>p,
@@ -21,18 +21,18 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./select.css.ts.vanilla.js");
-var n = "_1sqpivvo _1y2v1nf5k _1y2v1nfb3", i = "_1sqpivvq _1y2v1nf78 _1y2v1nf7m _1y2v1nf6e _1y2v1nf6s _1y2v1nf1r _1y2v1nf5o _1y2v1nf63 _1y2v1nfa3 _1y2v1nf8l", f = "_1y2v1nf31", y = {
+var n = "_1sqpivvo _1y2v1nf5m _1y2v1nfb5", f = "_1sqpivvq _1y2v1nf7a _1y2v1nf7o _1y2v1nf6g _1y2v1nf6u _1y2v1nf1s _1y2v1nf5q _1y2v1nf65 _1y2v1nfa5 _1y2v1nf8n", i = "_1y2v1nf33", s = {
     show: "_1sqpivv7",
     hide: "_1sqpivv8"
-}, s = "_1sqpivv6 _1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h _1y2v1nf5k _1y2v1nf9u _1y2v1nf2t", a = {
-    default: "_1sqpivvd _1sqpivvc _1y2v1nf5j",
-    fullWidth: "_1sqpivve _1sqpivvc _1y2v1nf5j"
+}, y = "_1sqpivv6 _1y2v1nf6d _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf5m _1y2v1nf9w _1y2v1nf2u", a = {
+    default: "_1sqpivvd _1sqpivvc _1y2v1nf5l",
+    fullWidth: "_1sqpivve _1sqpivvc _1y2v1nf5l"
 }, r = {
-    default: "_1sqpivvl _1sqpivvk _1y2v1nf5k _1y2v1nfa4 _1y2v1nf9j _1y2v1nf1r",
-    disabled: "_1sqpivvm _1sqpivvk _1y2v1nf5k _1y2v1nfa4 _1y2v1nf9j _1y2v1nf1r"
+    default: "_1sqpivvl _1sqpivvk _1y2v1nf5m _1y2v1nfa6 _1y2v1nf9l _1y2v1nf1s",
+    disabled: "_1sqpivvm _1sqpivvk _1y2v1nf5m _1y2v1nfa6 _1y2v1nf9l _1y2v1nf1s"
 }, p = {
-    default: "_1sqpivvh _1sqpivvg _1y2v1nf9m _1y2v1nf1r _1y2v1nf5i _1y2v1nf7v _1y2v1nf8b",
-    disabled: "_1sqpivvi _1sqpivvg _1y2v1nf9m _1y2v1nf1r _1y2v1nf5i _1y2v1nf7v _1y2v1nf8b"
+    default: "_1sqpivvh _1sqpivvg _1y2v1nf9o _1y2v1nf1s _1y2v1nf5k _1y2v1nf7x _1y2v1nf8d",
+    disabled: "_1sqpivvi _1sqpivvg _1y2v1nf9o _1y2v1nf1s _1y2v1nf5k _1y2v1nf7x _1y2v1nf8d"
 }, t = {
     top: "var(--_1sqpivv0)",
     left: "var(--_1sqpivv1)",

package/dist/skeletons.css-mistica.js

@@ -11,9 +11,9 @@ function _export(target, all) {
 _export(exports, {
     animation: ()=>o,
     circle: ()=>r,
-    line: ()=>f,
-    row: ()=>y
+    line: ()=>a,
+    row: ()=>f
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./skeletons.css.ts.vanilla.js");
-var o = "zopolw2 _1y2v1nf5q", r = "_1y2v1nf66 _1y2v1nf68", f = "zopolw6 _1y2v1nf67", y = "_1y2v1nf5o _1y2v1nf63 _1y2v1nf5x";
+var o = "zopolw2 _1y2v1nf5s", r = "_1y2v1nf68 _1y2v1nf6a", a = "zopolw6 _1y2v1nf69", f = "_1y2v1nf5q _1y2v1nf65 _1y2v1nf5z";

package/dist/skins/blau.js

@@ -59,12 +59,13 @@ const e = {
             background: e.white,
             backgroundContainer: e.white,
             backgroundContainerBrand: e.blauBluePrimary,
+            backgroundContainerBrandOverInverse: e.blauBlueSecondary,
             backgroundContainerAlternative: e.blauBluePrimary20,
             backgroundBrand: e.blauBluePrimary,
             backgroundBrandSecondary: e.blauBluePrimary,
             backgroundOverlay: (0, _colorJs.applyAlpha)(e.blauBlueSecondary, 0.75),
             backgroundSkeleton: e.grey2,
-            backgroundSkeletonInverse: (0, _colorJs.applyAlpha)(e.white, 0.3),
+            backgroundSkeletonInverse: e.blauBlueSecondary,
             navigationBarBackground: e.blauBluePrimary,
             backgroundAlternative: e.blauBluePrimary20,
             backgroundFeedbackBottom: e.blauBluePrimary,
@@ -160,11 +161,12 @@ const e = {
             appBarBackground: e.darkModeGrey,
             backgroundContainer: e.darkModeGrey,
             backgroundContainerBrand: e.darkModeGrey,
+            backgroundContainerBrandOverInverse: e.darkModeGrey,
             backgroundContainerAlternative: e.darkModeGrey,
             backgroundAlternative: e.darkModeBlack,
             backgroundOverlay: (0, _colorJs.applyAlpha)(e.darkModeGrey, 0.8),
-            backgroundSkeleton: e.darkModeGrey,
-            backgroundSkeletonInverse: e.darkModeGrey,
+            backgroundSkeleton: e.darkModeGrey6,
+            backgroundSkeletonInverse: e.darkModeGrey6,
             backgroundFeedbackBottom: e.darkModeBlack,
             navigationBarBackground: e.darkModeBlack,
             skeletonWave: e.grey5,

package/dist/skins/movistar-legacy.js

@@ -64,6 +64,7 @@ const e = {
             background: e.white,
             backgroundContainer: e.white,
             backgroundContainerBrand: e.movistarBlue,
+            backgroundContainerBrandOverInverse: e.movistarBlue55,
             backgroundContainerAlternative: e.grey1,
             backgroundBrand: e.movistarBlue,
             backgroundBrandSecondary: e.movistarBlue,
@@ -164,6 +165,7 @@ const e = {
             background: e.darkModeBlack,
             backgroundContainer: e.darkModeGrey,
             backgroundContainerBrand: e.darkModeGrey,
+            backgroundContainerBrandOverInverse: e.darkModeGrey,
             backgroundContainerAlternative: e.darkModeGrey,
             backgroundBrand: e.darkModeBlack,
             backgroundBrandSecondary: e.darkModeBlack,

package/dist/skins/movistar.js

@@ -69,12 +69,13 @@ const e = {
             background: e.white,
             backgroundContainer: e.white,
             backgroundContainerBrand: e.movistarBlue,
+            backgroundContainerBrandOverInverse: e.movistarBlue55,
             backgroundContainerAlternative: e.grey1,
             backgroundBrand: e.movistarBlue,
             backgroundBrandSecondary: e.movistarBlueDark,
             backgroundOverlay: (0, _colorJs.applyAlpha)(e.movistarBlueDark, 0.6),
             backgroundSkeleton: e.grey2,
-            backgroundSkeletonInverse: (0, _colorJs.applyAlpha)(e.white, 0.2),
+            backgroundSkeletonInverse: e.movistarBlue55,
             navigationBarBackground: e.movistarBlue,
             backgroundAlternative: e.grey1,
             backgroundFeedbackBottom: e.movistarBlue,
@@ -168,6 +169,7 @@ const e = {
             background: e.darkModeBlack,
             backgroundContainer: e.darkModeGrey,
             backgroundContainerBrand: e.darkModeGrey,
+            backgroundContainerBrandOverInverse: e.darkModeGrey,
             backgroundContainerAlternative: e.darkModeGrey,
             backgroundBrand: e.darkModeBlack,
             backgroundBrandSecondary: e.darkModeBlack,

package/dist/skins/o2-classic.js

@@ -71,6 +71,7 @@ const e = {
             background: e.white,
             backgroundContainer: e.white,
             backgroundContainerBrand: `linear-gradient(to bottom, ${e.o2Blue}, ${e.o2GradientSecond} 51%, ${e.o2GradientThird} 72%, ${e.o2GradientFourth})`,
+            backgroundContainerBrandOverInverse: `linear-gradient(to bottom, ${e.o2Blue}, ${e.o2GradientSecond} 51%, ${e.o2GradientThird} 72%, ${e.o2GradientFourth})`,
             backgroundContainerAlternative: e.grey1,
             backgroundBrand: `linear-gradient(to bottom, ${e.o2Blue}, ${e.o2GradientSecond} 51%, ${e.o2GradientThird} 72%, ${e.o2GradientFourth})`,
             backgroundBrandSecondary: `linear-gradient(to bottom, ${e.o2Blue}, ${e.o2GradientSecond} 51%, ${e.o2GradientThird} 72%, ${e.o2GradientFourth})`,
@@ -170,6 +171,7 @@ const e = {
             background: e.darkModeBlack,
             backgroundContainer: e.darkModeGrey,
             backgroundContainerBrand: e.darkModeGrey,
+            backgroundContainerBrandOverInverse: e.darkModeGrey,
             backgroundContainerAlternative: e.darkModeGrey,
             backgroundBrand: e.darkModeBlack,
             backgroundBrandSecondary: e.darkModeBlack,