@telefonica/mistica 14.45.0 → 14.46.0

package/dist-es/loading-bar.js

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

package/dist-es/loading-screen.js

@@ -80,7 +80,7 @@ function _object_without_properties_loose(source, excluded) {
 }
 import { jsxs as g, jsx as n } from "react/jsx-runtime";
 import * as i from "react";
-import N from "./overscroll-color-context.js";
+import x from "./overscroll-color-context.js";
 import { ThemeVariant as B } from "./theme-variant-context.js";
 import { vars as S } from "./skins/skin-contract.css-mistica.js";
 import E from "./responsive-layout.js";
@@ -92,7 +92,7 @@ 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 { useTheme as R } from "./hooks.js";
+import { useTheme as N } from "./hooks.js";
 import { VIVO_NEW_SKIN as H } from "./skins/constants.js";
 import { getPrefixedDataAttributes as J } from "./utils/dom.js";
 const L = (param)=>{
@@ -168,7 +168,7 @@ const L = (param)=>{
             })
         }, o)
     });
-}, x = /*#__PURE__*/ i.forwardRef((param, d)=>{
+}, R = /*#__PURE__*/ i.forwardRef((param, d)=>{
     let { isInverse: e, children: r, isLoading: t = !0, animateText: c, animateBackground: o, onClose: s, dataAttributes: a, title: l, description: u, texts: m = [
         {
             title: l,
@@ -216,7 +216,7 @@ const L = (param)=>{
     return /* @__PURE__ */ g(B, {
         isInverse: e,
         children: [
-            e && /* @__PURE__ */ n(N, {}),
+            e && /* @__PURE__ */ n(x, {}),
             /* @__PURE__ */ g("div", _object_spread_props(_object_spread({
                 ref: d
             }, J(a)), {
@@ -257,7 +257,7 @@ const L = (param)=>{
             })
         ]
     });
-}), he = /*#__PURE__*/ i.forwardRef((e, r)=>/* @__PURE__ */ n(x, _object_spread_props(_object_spread({
+}), he = /*#__PURE__*/ i.forwardRef((e, r)=>/* @__PURE__ */ n(R, _object_spread_props(_object_spread({
         ref: r
     }, e), {
         dataAttributes: _object_spread({
@@ -266,7 +266,7 @@ const L = (param)=>{
         animateBackground: !0
     }))), U = (param)=>{
     let { isLoading: e, onCloseStart: r, onCloseEnd: t } = param;
-    const { texts: c } = R(), [o, s] = i.useState(!0), a = ()=>{
+    const { texts: c } = N(), [o, s] = i.useState(!0), a = ()=>{
         e || (r == null || r(), s(!1), t == null || t());
     };
     return /* @__PURE__ */ g("div", {
@@ -287,7 +287,7 @@ const L = (param)=>{
     });
 }, X = /*#__PURE__*/ i.lazy(()=>import("./vivinho-loading-animation/index.js")), Y = (param)=>{
     let { isLoading: e, onCloseStart: r, onCloseEnd: t } = param;
-    const { skinName: c } = R();
+    const { skinName: c } = N();
     return c === H ? /* @__PURE__ */ n(i.Suspense, {
         fallback: null,
         children: /* @__PURE__ */ n(X, {
@@ -311,7 +311,7 @@ const L = (param)=>{
     }, d = ()=>{
         l.current && u.current && (r == null || r());
     };
-    return /* @__PURE__ */ n(x, _object_spread_props(_object_spread({
+    return /* @__PURE__ */ n(R, _object_spread_props(_object_spread({
         ref: o,
         isInverse: !0
     }, c), {

package/dist-es/logo.js

@@ -80,7 +80,7 @@ function _object_without_properties_loose(source, excluded) {
 }
 import { jsx as C, jsxs as d } from "react/jsx-runtime";
 import { useTheme as M } from "./hooks.js";
-import { useIsInverseVariant as Z } from "./theme-variant-context.js";
+import { useIsInverseVariant as c } from "./theme-variant-context.js";
 import L from "./touchable.js";
 import { getMovistarSkin as v } from "./skins/movistar.js";
 import { getVivoSkin as m } from "./skins/vivo.js";
@@ -89,8 +89,8 @@ import { getBlauSkin as g } from "./skins/blau.js";
 import { getTuSkin as u } from "./skins/tu.js";
 import { getTelefonicaSkin as k } from "./skins/telefonica.js";
 import { getPrefixedDataAttributes as N } from "./utils/dom.js";
-import { logoContainer as o, svg as i, vars as h } from "./logo.css-mistica.js";
-import { applyCssVars as V } from "./utils/css.js";
+import { logoContainer as o, svg as V, vars as h } from "./logo.css-mistica.js";
+import { applyCssVars as i } from "./utils/css.js";
 const s = (t)=>{
     if (typeof t == "number") return {
         [h.size]: `${t}px`
@@ -102,10 +102,10 @@ const s = (t)=>{
     return t.tablet && (a[h.sizeTablet] = `${t.tablet}px`), a;
 }, x = (param)=>{
     let { size: t, type: a } = param;
-    const { isDarkMode: e } = M(), { colors: H } = v(), r = Z() && !e ? H.inverse : H.brand;
+    const { isDarkMode: e } = M(), { colors: H } = v(), r = c() && !e ? H.inverse : H.brand;
     return a === "vertical" ? /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 72 72",
         fill: r,
         children: [
@@ -138,8 +138,8 @@ const s = (t)=>{
             })
         ]
     }) : a === "imagotype" ? /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 195 72",
         fill: r,
         children: [
@@ -172,8 +172,8 @@ const s = (t)=>{
             })
         ]
     }) : /* @__PURE__ */ C("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 72 72",
         fill: r,
         children: /* @__PURE__ */ C("path", {
@@ -182,10 +182,10 @@ const s = (t)=>{
     });
 }, y = (param)=>{
     let { size: t, type: a } = param;
-    const { isDarkMode: e } = M(), H = Z(), { colors: n } = m(), r = H && !e ? n.inverse : n.brand;
+    const { isDarkMode: e } = M(), H = c(), { colors: n } = m(), r = H && !e ? n.inverse : n.brand;
     return a === "vertical" ? /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 72 72",
         fill: r,
         children: [
@@ -209,8 +209,8 @@ const s = (t)=>{
             })
         ]
     }) : a === "imagotype" ? /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 195 72",
         fill: r,
         children: [
@@ -234,8 +234,8 @@ const s = (t)=>{
             })
         ]
     }) : /* @__PURE__ */ C("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 72 72",
         fill: r,
         children: /* @__PURE__ */ C("path", {
@@ -244,26 +244,26 @@ const s = (t)=>{
     });
 }, B = (param)=>{
     let { size: t, type: a } = param;
-    const { isDarkMode: e } = M(), H = Z(), { colors: n } = f(), r = H && !e ? n.inverse : n.brand;
+    const { isDarkMode: e } = M(), H = c(), { colors: n } = f(), r = H && !e ? n.inverse : n.brand;
     return a === "vertical" ? /* @__PURE__ */ C("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 72 72",
         fill: r,
         children: /* @__PURE__ */ C("path", {
             d: "M64.6464 48.1005C65.5273 48.3194 66.3797 48.7244 67.0163 49.3673C67.555 49.8826 67.9234 50.5497 68.1381 51.2513C68.3932 52.1193 68.4578 53.0409 68.3406 53.9362C68.2286 54.7438 67.9502 55.5225 67.5851 56.2533C66.899 57.5977 65.9414 58.7894 64.9183 59.9048C63.8168 61.0986 62.6299 62.214 61.4443 63.3281C63.8331 63.3205 66.222 63.3277 68.6108 63.3243C68.7406 63.3231 68.8729 63.3164 69 63.3499V66.1656C68.9276 66.1744 68.8561 66.1841 68.7849 66.187L56.6515 66.1866V63.1532C56.9278 62.8849 57.223 62.6362 57.5061 62.3746C58.7357 61.2826 59.9476 60.1702 61.0896 58.9906C62.1882 57.8312 63.2582 56.619 64.0232 55.2197C64.3697 54.5626 64.6602 53.8473 64.655 53.0979C64.6516 52.5621 64.4529 52.0228 64.0723 51.6312C63.578 51.1099 62.8587 50.8466 62.1481 50.7611C61.1887 50.6609 60.2199 50.855 59.327 51.1913C58.6379 51.4458 57.9983 51.8056 57.3725 52.1792C57.2747 51.1712 57.173 50.1635 57.0791 49.1551C58.6163 48.4104 60.3087 47.9609 62.0261 47.8824C62.9031 47.8313 63.7918 47.895 64.6464 48.1005ZM44.5216 15.9479C46.2174 16.5777 47.8288 17.4272 49.2842 18.4844C51.7084 20.2329 53.6818 22.5547 55.0432 25.1725C56.3106 27.5865 57.064 30.2404 57.3669 32.9308C57.5113 34.2801 57.5716 35.6404 57.4945 36.9961C57.3885 39.1497 56.97 41.2895 56.2443 43.3274C55.1022 46.5373 53.168 49.4901 50.5956 51.7934C48.1348 54.0137 45.0922 55.6109 41.841 56.4164C39.4569 57.011 36.9711 57.1964 34.5189 57.0169C32.0275 56.8353 29.5623 56.2462 27.2864 55.2382C24.6566 54.0787 22.2902 52.3616 20.3927 50.2449C18.0655 47.6619 16.445 44.5002 15.6352 41.1616C15.2392 39.5413 15.0384 37.8792 15 36.2153V35.3469C15.0353 33.9564 15.1603 32.5664 15.4189 31.1973C16.0352 27.8905 17.3992 24.692 19.5312 22.0352C21.1736 19.9734 23.2664 18.2546 25.6285 17.0201C28.6633 15.4237 32.1089 14.6354 35.5471 14.5511C38.5915 14.4593 41.6699 14.8883 44.5216 15.9479ZM35.3058 20.656C34.0556 20.7554 32.817 21.0309 31.6603 21.5068C30.4359 22.0054 29.3042 22.714 28.3199 23.5799C27.0856 24.6597 26.078 25.9726 25.3009 27.397C24.1179 29.5695 23.456 31.9948 23.2715 34.442C23.1655 35.8798 23.2284 37.3286 23.4426 38.7551C23.7215 40.5808 24.2533 42.3768 25.0885 44.0369C25.797 45.4479 26.7296 46.7608 27.8988 47.8476C29.1348 49.0096 30.6453 49.8935 32.2813 50.4072C33.7802 50.8797 35.3705 51.0542 36.9413 50.9883C38.4027 50.9208 39.8611 50.6344 41.2092 50.0734C43.2433 49.2406 44.9767 47.7906 46.2355 46.037C47.8603 43.7815 48.7769 41.0966 49.1372 38.3786C49.613 34.8311 49.0941 31.1331 47.4931 27.8998C46.776 26.4703 45.8494 25.1281 44.6828 24.0085C43.4299 22.7706 41.8862 21.8075 40.1968 21.241C38.632 20.7114 36.9543 20.5386 35.3058 20.656Z"
         })
     }) : a === "imagotype" ? /* @__PURE__ */ C("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 72 72",
         fill: r,
         children: /* @__PURE__ */ C("path", {
             d: "M64.6464 48.1005C65.5273 48.3194 66.3797 48.7244 67.0163 49.3673C67.555 49.8826 67.9234 50.5497 68.1381 51.2513C68.3932 52.1193 68.4578 53.0409 68.3406 53.9362C68.2286 54.7438 67.9502 55.5225 67.5851 56.2533C66.899 57.5977 65.9414 58.7894 64.9183 59.9048C63.8168 61.0986 62.6299 62.214 61.4443 63.3281C63.8331 63.3205 66.222 63.3277 68.6108 63.3243C68.7406 63.3231 68.8729 63.3164 69 63.3499V66.1656C68.9276 66.1744 68.8561 66.1841 68.7849 66.187L56.6515 66.1866V63.1532C56.9278 62.8849 57.223 62.6362 57.5061 62.3746C58.7357 61.2826 59.9476 60.1702 61.0896 58.9906C62.1882 57.8312 63.2582 56.619 64.0232 55.2197C64.3697 54.5626 64.6602 53.8473 64.655 53.0979C64.6516 52.5621 64.4529 52.0228 64.0723 51.6312C63.578 51.1099 62.8587 50.8466 62.1481 50.7611C61.1887 50.6609 60.2199 50.855 59.327 51.1913C58.6379 51.4458 57.9983 51.8056 57.3725 52.1792C57.2747 51.1712 57.173 50.1635 57.0791 49.1551C58.6163 48.4104 60.3087 47.9609 62.0261 47.8824C62.9031 47.8313 63.7918 47.895 64.6464 48.1005ZM44.5216 15.9479C46.2174 16.5777 47.8288 17.4272 49.2842 18.4844C51.7084 20.2329 53.6818 22.5547 55.0432 25.1725C56.3106 27.5865 57.064 30.2404 57.3669 32.9308C57.5113 34.2801 57.5716 35.6404 57.4945 36.9961C57.3885 39.1497 56.97 41.2895 56.2443 43.3274C55.1022 46.5373 53.168 49.4901 50.5956 51.7934C48.1348 54.0137 45.0922 55.6109 41.841 56.4164C39.4569 57.011 36.9711 57.1964 34.5189 57.0169C32.0275 56.8353 29.5623 56.2462 27.2864 55.2382C24.6566 54.0787 22.2902 52.3616 20.3927 50.2449C18.0655 47.6619 16.445 44.5002 15.6352 41.1616C15.2392 39.5413 15.0384 37.8792 15 36.2153V35.3469C15.0353 33.9564 15.1603 32.5664 15.4189 31.1973C16.0352 27.8905 17.3992 24.692 19.5312 22.0352C21.1736 19.9734 23.2664 18.2546 25.6285 17.0201C28.6633 15.4237 32.1089 14.6354 35.5471 14.5511C38.5915 14.4593 41.6699 14.8883 44.5216 15.9479ZM35.3058 20.656C34.0556 20.7554 32.817 21.0309 31.6603 21.5068C30.4359 22.0054 29.3042 22.714 28.3199 23.5799C27.0856 24.6597 26.078 25.9726 25.3009 27.397C24.1179 29.5695 23.456 31.9948 23.2715 34.442C23.1655 35.8798 23.2284 37.3286 23.4426 38.7551C23.7215 40.5808 24.2533 42.3768 25.0885 44.0369C25.797 45.4479 26.7296 46.7608 27.8988 47.8476C29.1348 49.0096 30.6453 49.8935 32.2813 50.4072C33.7802 50.8797 35.3705 51.0542 36.9413 50.9883C38.4027 50.9208 39.8611 50.6344 41.2092 50.0734C43.2433 49.2406 44.9767 47.7906 46.2355 46.037C47.8603 43.7815 48.7769 41.0966 49.1372 38.3786C49.613 34.8311 49.0941 31.1331 47.4931 27.8998C46.776 26.4703 45.8494 25.1281 44.6828 24.0085C43.4299 22.7706 41.8862 21.8075 40.1968 21.241C38.632 20.7114 36.9543 20.5386 35.3058 20.656Z"
         })
     }) : /* @__PURE__ */ C("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 72 72",
         fill: r,
         children: /* @__PURE__ */ C("path", {
@@ -272,10 +272,10 @@ const s = (t)=>{
     });
 }, w = (param)=>{
     let { size: t, type: a } = param;
-    const { isDarkMode: e } = M(), H = Z(), { colors: n } = k(), r = H && !e ? n.inverse : n.brand;
+    const { isDarkMode: e } = M(), H = c(), { colors: n } = k(), r = H && !e ? n.inverse : n.brand;
     return a === "vertical" ? /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 73 72",
         fill: r,
         children: [
@@ -332,8 +332,8 @@ const s = (t)=>{
             })
         ]
     }) : a === "imagotype" ? /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 195 72",
         fill: r,
         children: [
@@ -390,8 +390,8 @@ const s = (t)=>{
             })
         ]
     }) : /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 72 72",
         fill: r,
         children: [
@@ -450,10 +450,10 @@ const s = (t)=>{
     });
 }, I = (param)=>{
     let { size: t, type: a } = param;
-    const { isDarkMode: e } = M(), H = Z(), { colors: n } = g(), r = H && !e ? n.inverse : n.brand, p = H && !e ? n.inverse : n.promo;
+    const { isDarkMode: e } = M(), H = c(), { colors: n } = g(), r = H && !e ? n.inverse : n.brand, p = H && !e ? n.inverse : n.promo;
     return a === "vertical" ? /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 73 72",
         fill: r,
         children: [
@@ -466,8 +466,8 @@ const s = (t)=>{
             })
         ]
     }) : a === "imagotype" ? /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 138 72",
         fill: r,
         children: [
@@ -489,8 +489,8 @@ const s = (t)=>{
             })
         ]
     }) : /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 72 72",
         fill: r,
         children: [
@@ -503,28 +503,19 @@ const s = (t)=>{
             })
         ]
     });
-}, b = (param)=>{
+}, D = (param)=>{
     let { size: t } = param;
-    const { isDarkMode: a } = M(), e = Z(), { colors: H } = u(), n = e && !a ? H.backgroundBrand : H.inverse, r = e && !a ? H.inverse : H.backgroundBrand;
-    return /* @__PURE__ */ d("svg", {
-        className: i,
-        style: V(s(t)),
+    const { isDarkMode: a } = M(), e = c(), { colors: H } = u(), n = a || e ? H.inverse : H.backgroundBrand;
+    return /* @__PURE__ */ C("svg", {
+        className: V,
+        style: i(s(t)),
         viewBox: "0 0 72 72",
-        fill: r,
-        children: [
-            /* @__PURE__ */ C("circle", {
-                cx: "36",
-                cy: "36",
-                r: "32",
-                fill: r
-            }),
-            /* @__PURE__ */ C("path", {
-                d: "M56.9231 30.5142V41.4859C56.9231 43.3057 56.4469 44.9175 55.5077 46.2953C54.5685 47.6731 53.2331 48.7649 51.5055 49.5591C49.7245 50.3624 47.6367 50.7692 45.3034 50.7692C42.9168 50.7692 40.7849 50.3598 38.9653 49.5565C37.1936 48.7584 35.8129 47.6497 34.8617 46.2654C33.9105 44.8811 33.4369 43.2693 33.4369 41.4872V33.1385C33.4366 32.8712 33.3273 32.615 33.1332 32.4261C32.9391 32.2373 32.676 32.1312 32.4017 32.1312H25.3311C25.0569 32.1312 24.794 32.2373 24.6001 32.4262C24.4062 32.6151 24.2973 32.8714 24.2973 33.1385V41.8655C24.2973 43.099 24.7548 44.1467 25.6313 44.8993C26.4504 45.5895 27.5444 45.9391 28.8878 45.9391C29.1552 45.9401 29.4225 45.9258 29.6882 45.8962C29.7162 45.8926 29.7448 45.8948 29.7719 45.9026C29.799 45.9105 29.8241 45.9238 29.8456 45.9417C29.863 45.9541 29.877 45.9703 29.8866 45.9891C29.8961 46.0079 29.9008 46.0287 29.9003 46.0496L30.0764 49.0886C30.087 49.2807 30.0338 49.471 29.9247 49.6314C29.8157 49.7917 29.6565 49.9136 29.4707 49.9789C29.0361 50.125 28.594 50.2486 28.146 50.3494C27.0248 50.6213 25.8742 50.7618 24.7188 50.7679C22.2214 50.7679 20.3578 50.118 19.0237 48.7753C17.6896 47.4326 17.0253 45.5687 17.0253 43.0743V33.5077C17.0249 33.1425 16.8758 32.7924 16.6106 32.5343C16.3455 32.2762 15.986 32.1312 15.6112 32.1312H15.4657C15.2529 32.131 15.0421 32.09 14.8456 32.0105C14.649 31.9309 14.4704 31.8145 14.32 31.6677C14.1696 31.5209 14.0504 31.3467 13.9691 31.1551C13.8878 30.9634 13.846 30.758 13.8462 30.5506V28.8751C13.8462 28.6152 14.097 28.4605 14.161 28.4267C17.3795 26.7175 19.9583 24.0574 21.5264 20.8293C21.6477 20.581 21.8389 20.3712 22.0776 20.2244C22.3163 20.0777 22.5929 19.9998 22.8751 20C23.2521 20.001 23.6133 20.1473 23.88 20.4069C24.1467 20.6665 24.2972 21.0183 24.2986 21.3856V27.2348C24.2986 28.4878 24.3213 28.5476 25.6487 28.5476H38.5597C39.095 28.5476 39.6085 28.7548 39.987 29.1236C40.3655 29.4924 40.5782 29.9926 40.5782 30.5142V41.3352C40.5782 42.8157 41.0384 44.0141 41.9429 44.8967C42.8474 45.7792 43.9987 46.2277 45.3514 46.2277C46.7042 46.2277 47.8088 45.7701 48.6866 44.8668C49.5644 43.9634 49.9887 42.7871 49.9887 41.3352V30.5142C49.9885 30.256 50.0405 30.0003 50.1418 29.7617C50.2431 29.5231 50.3917 29.3063 50.579 29.1237C50.7663 28.941 50.9887 28.7962 51.2335 28.6973C51.4784 28.5985 51.7408 28.5476 52.0058 28.5476H54.9047C55.44 28.5476 55.9534 28.7548 56.3319 29.1236C56.7105 29.4924 56.9231 29.9926 56.9231 30.5142Z",
-                fill: n
-            })
-        ]
+        fill: n,
+        children: /* @__PURE__ */ C("path", {
+            d: "M36 4C18.3263 4 4 18.3272 4 36C4 53.6728 18.3272 68 36 68C53.6728 68 68 53.6728 68 36C68 18.3272 53.6728 4 36 4ZM55.8772 41.6009C55.8772 43.5342 55.3842 45.257 54.4088 46.7228C53.4333 48.1886 52.0518 49.3518 50.264 50.1991C49.4684 50.5667 48.6149 50.857 47.7088 51.0675C45.8456 51.5 43.8991 51.5 42.036 51.0675C41.1298 50.857 40.2763 50.5675 39.4807 50.1991C37.693 49.3526 36.3114 48.1895 35.336 46.7228C34.3605 45.257 33.8675 43.5342 33.8675 41.6009V33.9974C33.8675 31.9053 33.0009 31.6412 32.2123 31.6412H25.3842L25.3798 41.9404C25.3877 43.2421 25.9368 44.2711 26.7597 45.1465C27.4991 45.9333 29.0526 46.1781 29.0526 46.1781C30.2316 46.3518 31.1386 47.3649 31.1386 48.5921C31.1386 49.8193 30.2325 50.8325 29.0526 51.0061V51.0167C27.9895 51.257 26.9035 51.3825 25.8132 51.3886C23.2211 51.3886 21.2886 50.6956 19.9018 49.2649C18.5167 47.8333 17.8342 45.8509 17.8342 43.1974V31.6412H15.8474C14.7246 31.6412 13.7553 30.7842 13.6939 29.664C13.6763 29.3439 13.7307 29.0386 13.843 28.7623C13.9947 28.3877 14.2737 28.0789 14.6088 27.8544L15.5368 27.2325C18.1184 25.5035 20.193 23.1158 21.5447 20.3184L21.8193 19.7553C21.9939 19.3982 22.2667 19.0912 22.6219 18.9132C22.8781 18.7851 23.1658 18.7132 23.4719 18.7132C24.5184 18.7132 25.3667 19.5544 25.3816 20.5974H25.3833V27.8202H37.4465C37.4518 27.8202 37.457 27.8202 37.4623 27.8202C39.4482 27.8202 41.0588 29.4298 41.0588 31.4167C41.0588 31.4202 41.0588 31.4228 41.0588 31.4263V41.4439C41.0588 42.9851 41.5035 44.2439 42.4088 45.2053C42.4158 45.2123 42.4228 45.2202 42.4298 45.2272C43.75 46.614 45.993 46.614 47.314 45.2272C47.3211 45.2202 47.3281 45.2123 47.3351 45.2053C48.2403 44.243 48.6851 42.9842 48.6851 41.4439V31.5123C48.6851 29.5623 50.2018 27.9018 52.15 27.8325C54.1956 27.7597 55.8772 29.3965 55.8772 31.4263V41.6035V41.6009Z"
+        })
     });
-}, c = (param)=>{
+}, Z = (param)=>{
     let { size: t = 48, skinName: a, type: e = "isotype" } = param;
     switch(a){
         case "Movistar":
@@ -555,7 +546,7 @@ const s = (t)=>{
                 type: e
             });
         case "Tu":
-            return /* @__PURE__ */ C(b, {
+            return /* @__PURE__ */ C(D, {
                 size: t,
                 type: e
             });
@@ -601,7 +592,7 @@ const s = (t)=>{
     ]);
     const { skinName: H } = M();
     return /* @__PURE__ */ C(l, _object_spread_props(_object_spread({}, e), {
-        children: /* @__PURE__ */ C(c, {
+        children: /* @__PURE__ */ C(Z, {
             skinName: H,
             type: a,
             size: t
@@ -613,7 +604,7 @@ const s = (t)=>{
         "size"
     ]);
     return /* @__PURE__ */ C(l, _object_spread_props(_object_spread({}, e), {
-        children: /* @__PURE__ */ C(c, {
+        children: /* @__PURE__ */ C(Z, {
             skinName: "Movistar",
             type: t,
             size: a
@@ -625,7 +616,7 @@ const s = (t)=>{
         "type"
     ]);
     return /* @__PURE__ */ C(l, _object_spread_props(_object_spread({}, e), {
-        children: /* @__PURE__ */ C(c, {
+        children: /* @__PURE__ */ C(Z, {
             skinName: "Vivo",
             type: a,
             size: t
@@ -637,7 +628,7 @@ const s = (t)=>{
         "type"
     ]);
     return /* @__PURE__ */ C(l, _object_spread_props(_object_spread({}, e), {
-        children: /* @__PURE__ */ C(c, {
+        children: /* @__PURE__ */ C(Z, {
             skinName: "O2",
             type: a,
             size: t
@@ -649,7 +640,7 @@ const s = (t)=>{
         "type"
     ]);
     return /* @__PURE__ */ C(l, _object_spread_props(_object_spread({}, e), {
-        children: /* @__PURE__ */ C(c, {
+        children: /* @__PURE__ */ C(Z, {
             skinName: "Telefonica",
             type: a,
             size: t
@@ -661,7 +652,7 @@ const s = (t)=>{
         "type"
     ]);
     return /* @__PURE__ */ C(l, _object_spread_props(_object_spread({}, e), {
-        children: /* @__PURE__ */ C(c, {
+        children: /* @__PURE__ */ C(Z, {
             skinName: "Blau",
             type: a,
             size: t
@@ -673,7 +664,7 @@ const s = (t)=>{
         "type"
     ]);
     return /* @__PURE__ */ C(l, _object_spread_props(_object_spread({}, e), {
-        children: /* @__PURE__ */ C(c, {
+        children: /* @__PURE__ */ C(Z, {
             skinName: "Tu",
             type: a,
             size: t

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

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./maybe-dismissable.css.ts.vanilla.css-mistica.js";
-var f = "cim30m2 _1y2v1nfgd _1y2v1nfjp _1y2v1nfkj _1y2v1nfhh _1y2v1nfhx _1y2v1nfgi _1y2v1nfgx _1y2v1nfgr", y = "cim30m4 _1y2v1nfgi _1y2v1nfgx _1y2v1nfgr _1y2v1nfhe _1y2v1nfhu _1y2v1nfj1", _ = "_1y2v1nfgc _1y2v1nfgi _1y2v1nfh0";
-export { f as dismissableButton, y as dismissableCircleContainer, _ as dismissableContainer };
+var f = "cim30m2 _1y2v1nf6k _1y2v1nf7t _1y2v1nf92 _1y2v1nfab _1y2v1nfgd _1y2v1nfjp _1y2v1nfkj", y = "_1y2v1nfgc _1y2v1nfgi _1y2v1nfh0";
+export { f as dismissableButton, y as dismissableContainer };

package/dist-es/maybe-dismissable.js

@@ -1,45 +1,43 @@
 "use client";
-import { jsx as e, Fragment as m, jsxs as n } from "react/jsx-runtime";
-import * as i from "react";
-import c from "./generated/mistica-icons/icon-close-regular.js";
-import { useTheme as b } from "./hooks.js";
-import u from "./icon-button.js";
-import { vars as d } from "./skins/skin-contract.css-mistica.js";
-import { dismissableContainer as f, dismissableButton as h, dismissableCircleContainer as p } from "./maybe-dismissable.css-mistica.js";
-const a = /*#__PURE__*/ i.createContext(!1), I = ()=>i.useContext(a), x = (param)=>{
-    let { children: s, width: r, onClose: t, "aria-label": o } = param;
-    const { texts: l } = b();
-    return t ? /* @__PURE__ */ n("section", {
-        className: f,
+import { jsx as e, Fragment as c, jsxs as u } from "react/jsx-runtime";
+import * as a from "react";
+import b from "./generated/mistica-icons/icon-close-regular.js";
+import { useTheme as f } from "./hooks.js";
+import { InternalIconButton as d } from "./icon-button.js";
+import { dismissableContainer as p, dismissableButton as h } from "./maybe-dismissable.css-mistica.js";
+import { ThemeVariant as x } from "./theme-variant-context.js";
+const r = /*#__PURE__*/ a.createContext(!1), j = ()=>a.useContext(r), I = (param)=>{
+    let { children: s, width: i, onClose: t, "aria-label": o, isOverMedia: l, isInverse: m } = param;
+    const { texts: n } = f();
+    return t ? /* @__PURE__ */ u("section", {
+        className: p,
         "aria-label": o,
         style: {
-            width: r || "100%",
+            width: i || "100%",
             minHeight: "100%"
         },
         children: [
-            /* @__PURE__ */ e(a.Provider, {
+            /* @__PURE__ */ e(r.Provider, {
                 value: !0,
                 children: s
             }),
-            /* @__PURE__ */ e(u, {
-                className: h,
-                onPress: t,
-                "aria-label": l.closeButtonLabel,
-                style: {
-                    display: "flex",
-                    width: 48,
-                    height: 48
-                },
+            /* @__PURE__ */ e(x, {
+                isInverse: m,
                 children: /* @__PURE__ */ e("div", {
-                    className: p,
-                    children: /* @__PURE__ */ e(c, {
-                        color: d.colors.neutralHigh
+                    className: h,
+                    children: /* @__PURE__ */ e(d, {
+                        onPress: t,
+                        "aria-label": n.closeButtonLabel,
+                        small: !0,
+                        isOverMedia: l,
+                        hasInteractiveAreaBleed: !0,
+                        Icon: b
                     })
                 })
             })
         ]
-    }) : /* @__PURE__ */ e(m, {
+    }) : /* @__PURE__ */ e(c, {
         children: s
     });
-}, N = x;
-export { N as default, I as useIsDismissable };
+}, M = I;
+export { M as default, j as useIsDismissable };

package/dist-es/month-field.js

@@ -88,9 +88,9 @@ import A from "./generated/mistica-icons/icon-calendar-regular.js";
 import { getLocalYearMonthString as r } from "./utils/time.js";
 import { useTheme as N } from "./hooks.js";
 import { iconContainer as j } from "./date-field.css-mistica.js";
-import { iconSize as v } from "./text-field-base.css-mistica.js";
+import { iconSize as v } from "./icon-button.css-mistica.js";
 const B = /*#__PURE__*/ a.lazy(()=>import(/* webpackChunkName: "date-time-picker" */ "./date-time-picker.js")), C = (_param)=>{
-    var { disabled: h, error: g, helperText: D, name: F, optional: f, validate: n, onChange: S, onChangeValue: s, onBlur: y, value: R, defaultValue: k, min: o, max: i, dataAttributes: d } = _param, p = _object_without_properties(_param, [
+    var { disabled: h, error: g, helperText: D, name: F, optional: f, validate: n, onChange: S, onChangeValue: s, onBlur: y, value: R, defaultValue: k, min: o, max: i, dataAttributes: d } = _param, u = _object_without_properties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -106,7 +106,7 @@ const B = /*#__PURE__*/ a.lazy(()=>import(/* webpackChunkName: "date-time-picker
         "max",
         "dataAttributes"
     ]);
-    const I = (e)=>e, M = a.useMemo(()=>b("month"), []), { texts: T } = N(), m = (e)=>!(o && e && e < r(o) || i && e && e > r(i)), u = z({
+    const I = (e)=>e, M = a.useMemo(()=>b("month"), []), { texts: T } = N(), m = (e)=>!(o && e && e < r(o) || i && e && e > r(i)), l = z({
         name: F,
         value: R,
         defaultValue: k,
@@ -121,23 +121,23 @@ const B = /*#__PURE__*/ a.lazy(()=>import(/* webpackChunkName: "date-time-picker
         onChangeValue: (e, c)=>{
             m(e) && (s == null || s(e, c));
         }
-    }), l = /* @__PURE__ */ t(O, _object_spread_props(_object_spread({}, p, u), {
+    }), p = /* @__PURE__ */ t(O, _object_spread_props(_object_spread({}, u, l), {
         min: o ? r(o) : void 0,
         max: i ? r(i) : void 0,
         type: "month",
         endIconOverlay: /* @__PURE__ */ t("div", {
             className: j,
             children: /* @__PURE__ */ t(A, {
-                size: v
+                size: v.default
             })
         }),
         dataAttributes: _object_spread({
             "component-name": "MonthField"
         }, d)
     }));
-    return M || x() ? l : /* @__PURE__ */ t(a.Suspense, {
-        fallback: l,
-        children: /* @__PURE__ */ t(B, _object_spread_props(_object_spread({}, p, u), {
+    return M || x() ? p : /* @__PURE__ */ t(a.Suspense, {
+        fallback: p,
+        children: /* @__PURE__ */ t(B, _object_spread_props(_object_spread({}, u, l), {
             optional: f,
             isValidDate: (e)=>m(r(e.toDate())),
             mode: "year-month",

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

@@ -6,18 +6,15 @@ var y = "_1vcy5dz1 _1y2v1nfgc _1y2v1nfhe _1y2v1nfhu", _ = "_1vcy5dz12 _1y2v1nfge
     exiting: "_1vcy5dzu",
     exited: "_1vcy5dzv",
     unmounted: "_1vcy5dzw"
-}, d = "_1vcy5dzm", a = {
-    default: "_1vcy5dz15 _1y2v1nf1s",
-    inverse: "_1vcy5dz16 _1y2v1nf1r"
-}, c = "_1vcy5dz5 _1vcy5dz3 _1y2v1nfgd", i = "_1vcy5dz4 _1vcy5dz3 _1y2v1nfgd", f = "_1vcy5dz7 _1vcy5dz3 _1y2v1nfgd", t = "_1vcy5dz6 _1vcy5dz3 _1y2v1nfgd", z = "_1vcy5dz17", o = "_1vcy5dzz _1y2v1nfgi _1y2v1nfgr", g = "_1vcy5dzx", u = {
+}, d = "_1vcy5dzm", a = "_1vcy5dz5 _1vcy5dz3 _1y2v1nfgd", c = "_1vcy5dz4 _1vcy5dz3 _1y2v1nfgd", i = "_1vcy5dz7 _1vcy5dz3 _1y2v1nfgd", f = "_1vcy5dz6 _1vcy5dz3 _1y2v1nfgd", z = "_1vcy5dz17", t = "_1vcy5dzz _1y2v1nfgi _1y2v1nfgr", o = "_1vcy5dzx", g = {
     default: "_1vcy5dzc _1vcy5dzb _1y2v1nfgi _1y2v1nfgx _1y2v1nfh5",
     noBorder: "_1vcy5dzd _1vcy5dzb _1y2v1nfgi _1y2v1nfgx _1y2v1nfh5",
     menuOpen: "_1vcy5dze _1vcy5dzb _1y2v1nfgi _1y2v1nfgx _1y2v1nfh5"
-}, s = "_1vcy5dzl", p = "_1vcy5dzn", l = "_1vcy5dzg _1y2v1nf92 _1y2v1nfab _1y2v1nfi1 _1y2v1nfgi _1y2v1nfgx _1y2v1nfj0 _1y2v1nf6a", x = {
+}, u = "_1vcy5dzl", s = "_1vcy5dzn", p = "_1vcy5dzg _1y2v1nf92 _1y2v1nfab _1y2v1nfi1 _1y2v1nfgi _1y2v1nfgx _1y2v1nfj0 _1y2v1nf6a", l = {
     default: "_1vcy5dzh",
     inverse: "_1vcy5dzi"
-}, b = "_1y2v1nfi1 _1vcy5dzo", h = "_1vcy5dzr _1vcy5dzo", C = {
+}, x = "_1y2v1nfi1 _1vcy5dzo", b = "_1vcy5dzr _1vcy5dzo", h = {
     default: "_1vcy5dzj",
     inverse: "_1vcy5dzk"
-}, k = "_1vcy5dz9 _1y2v1nfge _1y2v1nfjp _1y2v1nfk4 _1y2v1nfkj";
-export { y as burgerIconContainer, _ as burgerMenu, e as burgerMenuButton, r as burgerMenuTransition, d as desktopOnly, a as iconButtonVariants, c as iconCloseHidden, i as iconCloseOpen, f as iconMenuHidden, t as iconMenuOpen, z as lineHeightFix, o as logoContainer, g as mainNavbarContent, u as navbarBorderColorVariants, s as navigationBarContent, p as navigationBarContentRight, l as section, x as selectedSectionVariantes, b as spacer, h as spacerLarge, C as textWrapperVariants, k as topFixed };
+}, C = "_1vcy5dz9 _1y2v1nfge _1y2v1nfjp _1y2v1nfk4 _1y2v1nfkj";
+export { y as burgerIconContainer, _ as burgerMenu, e as burgerMenuButton, r as burgerMenuTransition, d as desktopOnly, a as iconCloseHidden, c as iconCloseOpen, i as iconMenuHidden, f as iconMenuOpen, z as lineHeightFix, t as logoContainer, o as mainNavbarContent, g as navbarBorderColorVariants, u as navigationBarContent, s as navigationBarContentRight, p as section, l as selectedSectionVariantes, x as spacer, b as spacerLarge, h as textWrapperVariants, C as topFixed };