@telefonica/mistica 16.36.0 → 16.37.0

package/dist/theme-context.css.d.ts

@@ -30,34 +30,51 @@ export declare const themeVarsContract: {
         buttonDangerBackground: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonDangerBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonDangerBackgroundHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        buttonLinkDangerBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonLinkDangerBackgroundInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonLinkDangerBackgroundMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonLinkDangerBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonLinkDangerBackgroundInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonLinkDangerBackgroundMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonLinkBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonLinkBackgroundInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonLinkBackgroundMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonPrimaryBackground: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonPrimaryBackgroundInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        buttonPrimaryBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonPrimaryBackgroundMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonPrimaryBackgroundHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonPrimaryBackgroundInverseHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonPrimaryBackgroundMediaHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonPrimaryBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonPrimaryBackgroundInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonPrimaryBackgroundMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonSecondaryBorder: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        buttonSecondaryBorderPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        buttonSecondaryBackgroundHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        buttonSecondaryBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonSecondaryBorderInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBorderMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBorderPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonSecondaryBorderInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBorderMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBackgroundHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonSecondaryBackgroundInverseHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBackgroundMediaHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonSecondaryBackgroundInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBackgroundMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonPrimary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonPrimaryInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textButtonPrimaryMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonPrimaryInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textButtonPrimaryMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonSecondary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        textButtonSecondaryPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonSecondaryInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textButtonSecondaryMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textButtonSecondaryPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonSecondaryInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textButtonSecondaryMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textLink: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textLinkInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textLinkMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textLinkDanger: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textLinkDangerMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textLinkSnackbar: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textActivated: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textBrand: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -152,6 +169,7 @@ export declare const themeVarsContract: {
         tagBackgroundWarningInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         tagBackgroundErrorInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         cardContentOverlay: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        cardFooterOverlay: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     rawColors: {
         background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -184,34 +202,51 @@ export declare const themeVarsContract: {
         buttonDangerBackground: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonDangerBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonDangerBackgroundHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        buttonLinkDangerBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonLinkDangerBackgroundInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonLinkDangerBackgroundMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonLinkDangerBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonLinkDangerBackgroundInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonLinkDangerBackgroundMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonLinkBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonLinkBackgroundInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonLinkBackgroundMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonPrimaryBackground: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonPrimaryBackgroundInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        buttonPrimaryBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonPrimaryBackgroundMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonPrimaryBackgroundHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonPrimaryBackgroundInverseHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonPrimaryBackgroundMediaHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonPrimaryBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonPrimaryBackgroundInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonPrimaryBackgroundMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonSecondaryBorder: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        buttonSecondaryBorderPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        buttonSecondaryBackgroundHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        buttonSecondaryBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonSecondaryBorderInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBorderMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBorderPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonSecondaryBorderInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBorderMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBackgroundHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonSecondaryBackgroundInverseHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBackgroundMediaHover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBackgroundPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         buttonSecondaryBackgroundInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        buttonSecondaryBackgroundMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonPrimary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonPrimaryInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textButtonPrimaryMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonPrimaryInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textButtonPrimaryMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonSecondary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        textButtonSecondaryPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonSecondaryInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textButtonSecondaryMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textButtonSecondaryPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textButtonSecondaryInversePressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textButtonSecondaryMediaPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textLink: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textLinkInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textLinkMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textLinkDanger: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        textLinkDangerMedia: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textLinkSnackbar: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textActivated: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textBrand: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -306,6 +341,7 @@ export declare const themeVarsContract: {
         tagBackgroundWarningInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         tagBackgroundErrorInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         cardContentOverlay: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        cardFooterOverlay: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     borderRadii: {
         button: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;

package/dist/timeline.css-mistica.js

@@ -22,10 +22,10 @@ _export(exports, {
         return n;
     },
     lineContainer: function() {
-        return i;
+        return f;
     },
     timeline: function() {
-        return f;
+        return i;
     },
     timelineItem: function() {
         return p;
@@ -36,14 +36,14 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./timeline.css.ts.vanilla.css-mistica.js");
-var t = "v16_36_w6pat2b", a = "v16_36_w6pat2d v16_36_1y2v1nfjp v16_36_1y2v1nfk5 v16_36_1y2v1nflc v16_36_1y2v1nfis v16_36_1y2v1nfj7 v16_36_1y2v1nfj1 v16_36_1y2v1nf4c", e = "v16_36_w6pat25 v16_36_1y2v1nfje v16_36_1y2v1nfl5 v16_36_1y2v1nfa3", n = {
-    default: "v16_36_w6pat2g v16_36_w6pat2f v16_36_1y2v1nfje",
-    inverse: "v16_36_w6pat2h v16_36_w6pat2f v16_36_1y2v1nfje"
-}, i = "v16_36_w6pat2a v16_36_1y2v1nfis v16_36_1y2v1nfj7", f = {
-    vertical: "v16_36_w6pat20",
-    horizontal: "v16_36_w6pat21"
-}, p = "v16_36_w6pat23 v16_36_1y2v1nfis v16_36_1y2v1nfj5", r = {
-    active: "v16_36_w6pat26",
-    inactive: "v16_36_w6pat27",
-    completed: "v16_36_w6pat28"
+var t = "v16_37_w6pat2b", a = "v16_37_w6pat2d v16_37_1y2v1nfkp v16_37_1y2v1nfl5 v16_37_1y2v1nfmc v16_37_1y2v1nfjs v16_37_1y2v1nfk7 v16_37_1y2v1nfk1 v16_37_1y2v1nf4u", e = "v16_37_w6pat25 v16_37_1y2v1nfke v16_37_1y2v1nfm5 v16_37_1y2v1nfb3", n = {
+    default: "v16_37_w6pat2g v16_37_w6pat2f v16_37_1y2v1nfke",
+    inverse: "v16_37_w6pat2h v16_37_w6pat2f v16_37_1y2v1nfke"
+}, f = "v16_37_w6pat2a v16_37_1y2v1nfjs v16_37_1y2v1nfk7", i = {
+    vertical: "v16_37_w6pat20",
+    horizontal: "v16_37_w6pat21"
+}, p = "v16_37_w6pat23 v16_37_1y2v1nfjs v16_37_1y2v1nfk5", r = {
+    active: "v16_37_w6pat26",
+    inactive: "v16_37_w6pat27",
+    completed: "v16_37_w6pat28"
 };

package/dist/timer.css-mistica.js

@@ -25,17 +25,17 @@ _export(exports, {
         return a;
     },
     timerWrapper: function() {
-        return i;
+        return r;
     },
     unitContainer: function() {
-        return r;
+        return i;
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./timer.css.ts.vanilla.css-mistica.js");
-var y = "v16_36_18fye848", f = {
-    default: "v16_36_18fye84a v16_36_1y2v1nfb9 v16_36_1y2v1nfci v16_36_1y2v1nf8u v16_36_1y2v1nfa3 v16_36_1y2v1nflk v16_36_1y2v1nf7d",
-    inverse: "v16_36_18fye84a v16_36_1y2v1nfb9 v16_36_1y2v1nfci v16_36_1y2v1nf8u v16_36_1y2v1nfa3 v16_36_1y2v1nflk v16_36_1y2v1nf4c",
-    alternative: "v16_36_18fye84a v16_36_1y2v1nfb9 v16_36_1y2v1nfci v16_36_1y2v1nf8u v16_36_1y2v1nfa3 v16_36_1y2v1nflk v16_36_1y2v1nf4c",
-    media: "v16_36_18fye84a v16_36_1y2v1nfb9 v16_36_1y2v1nfci v16_36_1y2v1nf8u v16_36_1y2v1nfa3 v16_36_1y2v1nflk v16_36_18fye84e"
-}, n = "v16_36_18fye841", e = "v16_36_18fye841 v16_36_1y2v1nfiw", a = "v16_36_1y2v1nfis v16_36_1y2v1nfiy v16_36_1y2v1nfj7", i = "v16_36_1y2v1nfiw", r = "v16_36_18fye841 v16_36_1y2v1nfit v16_36_1y2v1nfj1";
+var y = "v16_37_18fye848", f = {
+    default: "v16_37_18fye84a v16_37_1y2v1nfc9 v16_37_1y2v1nfdi v16_37_1y2v1nf9u v16_37_1y2v1nfb3 v16_37_1y2v1nfmk v16_37_1y2v1nf8c",
+    inverse: "v16_37_18fye84a v16_37_1y2v1nfc9 v16_37_1y2v1nfdi v16_37_1y2v1nf9u v16_37_1y2v1nfb3 v16_37_1y2v1nfmk v16_37_1y2v1nf4u",
+    alternative: "v16_37_18fye84a v16_37_1y2v1nfc9 v16_37_1y2v1nfdi v16_37_1y2v1nf9u v16_37_1y2v1nfb3 v16_37_1y2v1nfmk v16_37_1y2v1nf4u",
+    media: "v16_37_18fye84a v16_37_1y2v1nfc9 v16_37_1y2v1nfdi v16_37_1y2v1nf9u v16_37_1y2v1nfb3 v16_37_1y2v1nfmk v16_37_18fye84e"
+}, n = "v16_37_18fye841", e = "v16_37_18fye841 v16_37_1y2v1nfjw", a = "v16_37_1y2v1nfjs v16_37_1y2v1nfjy v16_37_1y2v1nfk7", r = "v16_37_1y2v1nfjw", i = "v16_37_18fye841 v16_37_1y2v1nfjt v16_37_1y2v1nfk1";

package/dist/tooltip.css-mistica.js

@@ -19,22 +19,22 @@ _export(exports, {
         return a;
     },
     closeButtonIcon: function() {
-        return i;
+        return o;
     },
     container: function() {
-        return o;
+        return r;
     },
     content: function() {
-        return r;
+        return y;
     },
     contentContainer: function() {
-        return y;
+        return e;
     },
     tooltip: function() {
-        return e;
+        return f;
     },
     tooltipCenter: function() {
-        return f;
+        return i;
     },
     tooltipTransitionClasses: function() {
         return p;
@@ -42,7 +42,7 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./tooltip.css.ts.vanilla.css-mistica.js");
-var n = 40, t = "v16_36_1xhatbpb v16_36_1y2v1nfjl v16_36_1y2v1nfk1 v16_36_1y2v1nfin v16_36_1y2v1nfm0 v16_36_1y2v1nf4c", a = "v16_36_1xhatbp9 v16_36_1y2v1nfin v16_36_1y2v1nfjn v16_36_1y2v1nflu", i = "v16_36_1xhatbpd v16_36_1y2v1nfin", o = "v16_36_1xhatbp1 v16_36_1y2v1nfin", r = "v16_36_1xhatbp6", y = "v16_36_1xhatbp5 v16_36_1y2v1nfim v16_36_1y2v1nflu", e = "v16_36_1xhatbp3 v16_36_1y2v1nfim v16_36_1y2v1nflm v16_36_1y2v1nf4c", f = "v16_36_1y2v1nfis v16_36_1y2v1nfiy v16_36_1y2v1nfj7", p = {
+var n = 40, t = "v16_37_1xhatbpb v16_37_1y2v1nfkl v16_37_1y2v1nfl1 v16_37_1y2v1nfjn v16_37_1y2v1nfn0 v16_37_1y2v1nf4u", a = "v16_37_1xhatbp9 v16_37_1y2v1nfjn v16_37_1y2v1nfkn v16_37_1y2v1nfmu", o = "v16_37_1xhatbpd v16_37_1y2v1nfjn", r = "v16_37_1xhatbp1 v16_37_1y2v1nfjn", y = "v16_37_1xhatbp6", e = "v16_37_1xhatbp5 v16_37_1y2v1nfjm v16_37_1y2v1nfmu", f = "v16_37_1xhatbp3 v16_37_1y2v1nfjm v16_37_1y2v1nfmm v16_37_1y2v1nf4u", i = "v16_37_1y2v1nfjs v16_37_1y2v1nfjy v16_37_1y2v1nfk7", p = {
     entering: {
         opacity: 1
     },

package/dist/touchable.css-mistica.js

@@ -24,4 +24,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./touchable.css.ts.vanilla.css-mistica.js");
-var n = "v16_36_mhti6u2 v16_36_1y2v1nflt", f = "v16_36_mhti6u0", t = "v16_36_mhti6u5", y = "v16_36_mhti6u2 v16_36_1y2v1nflt v16_36_1y2v1nf8l v16_36_1y2v1nf9u v16_36_1y2v1nfb3 v16_36_1y2v1nfcc v16_36_1y2v1nfiu v16_36_1y2v1nfla v16_36_1y2v1nfjf v16_36_1y2v1nf49 v16_36_1y2v1nf8k v16_36_1y2v1nflv";
+var n = "v16_37_mhti6u2 v16_37_1y2v1nfmt", f = "v16_37_mhti6u0", t = "v16_37_mhti6u5", y = "v16_37_mhti6u2 v16_37_1y2v1nfmt v16_37_1y2v1nf9l v16_37_1y2v1nfau v16_37_1y2v1nfc3 v16_37_1y2v1nfdc v16_37_1y2v1nfju v16_37_1y2v1nfma v16_37_1y2v1nfkf v16_37_1y2v1nf4r v16_37_1y2v1nf9k v16_37_1y2v1nfmv";

package/dist/utils/aspect-ratio-support.css-mistica.js

@@ -13,10 +13,10 @@ _export(exports, {
         return r;
     },
     containerWithWrapper: function() {
-        return a;
+        return n;
     },
     vars: function() {
-        return n;
+        return a;
     },
     wrapper: function() {
         return f;
@@ -24,6 +24,6 @@ _export(exports, {
 });
 require("../sprinkles.css.ts.vanilla.css-mistica.js");
 require("./aspect-ratio-support.css.ts.vanilla.css-mistica.js");
-var r = "v16_36_yqswj62", a = "v16_36_1y2v1nfjf v16_36_1y2v1nfjw v16_36_1y2v1nfm0 v16_36_1y2v1nfmf", n = {
-    aspectRatio: "var(--v16_36_yqswj60)"
-}, f = "v16_36_1y2v1nflu v16_36_1y2v1nfl7 v16_36_1y2v1nfl8 v16_36_1y2v1nfim";
+var r = "v16_37_yqswj62", n = "v16_37_1y2v1nfkf v16_37_1y2v1nfkw v16_37_1y2v1nfn0 v16_37_1y2v1nfnf", a = {
+    aspectRatio: "var(--v16_37_yqswj60)"
+}, f = "v16_37_1y2v1nfmu v16_37_1y2v1nfm7 v16_37_1y2v1nfm8 v16_37_1y2v1nfjm";

package/dist/utils/aspect-ratio-support.d.ts

@@ -16,4 +16,9 @@ type AspectRatioContainerProps = {
     dataAttributes?: DataAttributes;
 };
 export declare const AspectRatioContainer: (props: AspectRatioContainerProps) => JSX.Element;
+/**
+ * @param aspectRatio value in the format of "width:height" or a number, or "auto"
+ * @returns number
+ */
+export declare const aspectRatioToNumber: (aspectRatio?: `${number}:${number}` | number | 'auto') => number;
 export {};

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

@@ -16,8 +16,11 @@ _export(exports, {
     AspectRatioSupportProvider: function() {
         return W;
     },
+    aspectRatioToNumber: function() {
+        return E;
+    },
     useSupportsAspectRatio: function() {
-        return b;
+        return y;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -124,41 +127,41 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-const u = /*#__PURE__*/ _react.createContext(!0), W = (param)=>{
+const d = /*#__PURE__*/ _react.createContext(!0), W = (param)=>{
     let { children: t } = param;
-    const [n, s] = _react.useState(!0);
+    const [s, a] = _react.useState(!0);
     return (0, _hooks.useIsomorphicLayoutEffect)(()=>{
         try {
-            CSS.supports("aspect-ratio", "1 / 1") || s(!1);
+            CSS.supports("aspect-ratio", "1 / 1") || a(!1);
         } catch (e) {
-            s(!1);
+            a(!1);
         }
-    }, []), /* @__PURE__ */ (0, _jsxruntime.jsx)(u.Provider, {
-        value: n,
+    }, []), /* @__PURE__ */ (0, _jsxruntime.jsx)(d.Provider, {
+        value: s,
         children: t
     });
-}, b = ()=>_react.useContext(u), $ = (t)=>{
-    const n = !!t.forceNonCssAspectRatio, s = b() && !n, h = typeof t.width != "number" && typeof t.height != "number" && t.aspectRatio !== 0, a = h ? t.aspectRatio : void 0;
+}, y = ()=>_react.useContext(d), $ = (t)=>{
+    const s = !!t.forceNonCssAspectRatio, a = y() && !s, r = typeof t.width != "number" && typeof t.height != "number" && t.aspectRatio !== 0, n = r ? t.aspectRatio : void 0;
     let e = t.width, i = t.height;
     var _t_aspectRatio, _t_aspectRatio1;
     t.width !== void 0 && t.height !== void 0 ? (e = t.width, i = t.height) : typeof t.width == "number" ? i = t.aspectRatio !== 0 ? t.width / ((_t_aspectRatio = t.aspectRatio) !== null && _t_aspectRatio !== void 0 ? _t_aspectRatio : 1) : void 0 : typeof t.height == "number" ? e = t.aspectRatio !== 0 ? t.height * ((_t_aspectRatio1 = t.aspectRatio) !== null && _t_aspectRatio1 !== void 0 ? _t_aspectRatio1 : 1) : void 0 : t.height ? i = t.height : e = t.width || "100%";
     var _t_as, _ref, _ref1;
-    const c = h && !s, r = /*#__PURE__*/ _react.createElement((_t_as = t.as) !== null && _t_as !== void 0 ? _t_as : "div", _object_spread({
+    const c = r && !a, h = /*#__PURE__*/ _react.createElement((_t_as = t.as) !== null && _t_as !== void 0 ? _t_as : "div", _object_spread({
         className: (0, _classnames.default)(t.className, _aspectratiosupportcssmistica.container, {
             [_aspectratiosupportcssmistica.containerWithWrapper]: c
         }),
         style: _object_spread({}, c ? _object_spread_props(_object_spread({}, t.style), {
-            position: a ? "absolute" : "static",
+            position: n ? "absolute" : "static",
             width: "100%"
         }) : _object_spread_props(_object_spread({}, t.style), {
             width: (_ref = isNaN(Number(e)) ? e : Number(e)) !== null && _ref !== void 0 ? _ref : "fit-content",
             height: (_ref1 = isNaN(Number(i)) ? i : Number(i)) !== null && _ref1 !== void 0 ? _ref1 : "fit-content"
         }), (0, _css.applyCssVars)({
-            [_aspectratiosupportcssmistica.vars.aspectRatio]: a ? String(a) : "unset"
+            [_aspectratiosupportcssmistica.vars.aspectRatio]: n ? String(n) : "unset"
         }))
     }, !c && t.dataAttributes), t.children);
     if (c) {
-        const f = (()=>a ? t.width && typeof t.width == "string" && t.width.endsWith("%") ? `${parseFloat(t.width) / a}%` : `${100 / a}%` : 0)();
+        const f = (()=>n ? t.width && typeof t.width == "string" && t.width.endsWith("%") ? `${parseFloat(t.width) / n}%` : `${100 / n}%` : 0)();
         return /* @__PURE__ */ (0, _jsxruntime.jsx)("div", _object_spread_props(_object_spread({
             style: {
                 width: e,
@@ -167,7 +170,15 @@ const u = /*#__PURE__*/ _react.createContext(!0), W = (param)=>{
             },
             className: _aspectratiosupportcssmistica.wrapper
         }, t.dataAttributes), {
-            children: r
+            children: h
         }));
-    } else return r;
+    } else return h;
+}, E = (t)=>{
+    if (!t) return 0;
+    if (typeof t == "number") return t;
+    if (t.includes(":")) {
+        const [s, a] = t.split(":");
+        return +s / +a;
+    }
+    return 0;
 };

package/dist/utils/color.d.ts

@@ -5,3 +5,14 @@ export declare const fromHexToRgb: (hexColor: string) => [number, number, number
  * @returns The same color with the alpha channel applied
  */
 export declare const applyAlpha: (color: string, alpha: number) => string;
+/**
+ * Given a color returns the RGB components of the color.
+ *
+ * Accepts as color:
+ * - Hex value: '#ff0000', '#f00'
+ * - Color name: 'red'
+ * - RGB value: 'rgb(255, 0, 0)', 'rgba(255, 0, 0, 1)' (opacity is ignored)
+ *
+ * Should work with CSS variables but it won't be reactive
+ */
+export declare const getRGBComponents: (color: string) => [number, number, number] | null;

package/dist/utils/color.js

@@ -10,13 +10,16 @@ function _export(target, all) {
 }
 _export(exports, {
     applyAlpha: function() {
-        return n;
+        return c;
     },
     fromHexToRgb: function() {
-        return s;
+        return u;
+    },
+    getRGBComponents: function() {
+        return d;
     }
 });
-const s = (t)=>{
+const u = (t)=>{
     if (t.length === 4) return [
         parseInt(t.substr(-3, 1).repeat(2), 16),
         parseInt(t.substr(-2, 1).repeat(2), 16),
@@ -28,10 +31,28 @@ const s = (t)=>{
         parseInt(t.substr(-2, 2), 16)
     ];
     throw Error("Bad color");
-}, n = (t, r)=>{
+}, c = (t, s)=>{
     try {
-        return t.startsWith("var(") ? `rgba(${t}, ${r})` : `rgba(${s(t).join(",")}, ${r})`;
+        return t.startsWith("var(") ? `rgba(${t}, ${s})` : `rgba(${u(t).join(",")}, ${s})`;
     } catch (e) {
         return t;
     }
-};
+}, d = (()=>{
+    const t = /* @__PURE__ */ new Map();
+    return (s)=>{
+        const r = s;
+        if (t.has(r)) return t.get(r);
+        const e = document.createElement("div");
+        e.style.display = "none", e.style.position = "absolute", e.style.color = s, document.body.appendChild(e);
+        const p = getComputedStyle(e).color;
+        document.body.removeChild(e);
+        const n = p.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)/);
+        if (!n) return t.set(r, null), null;
+        const a = [
+            parseInt(n[1], 10),
+            parseInt(n[2], 10),
+            parseInt(n[3], 10)
+        ];
+        return t.set(r, a), a;
+    };
+})();

package/dist/utils/headings.d.ts

@@ -1,2 +1,5 @@
 import type { HeadingType } from './types';
+/**
+ * @returns {boolean} - Returns true if the first heading is bigger, false otherwise.
+ */
 export declare const isBiggerHeading: (heading: HeadingType, otherHeading?: HeadingType) => boolean;

package/dist/video.css-mistica.js

@@ -9,4 +9,4 @@ Object.defineProperty(exports, "video", {
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
-var _ = "v16_36_1y2v1nfm0 v16_36_1y2v1nfmf v16_36_1y2v1nfiu v16_36_1y2v1nf8k v16_36_1y2v1nfl7 v16_36_1y2v1nfl8 v16_36_1y2v1nfno";
+var _ = "v16_37_1y2v1nfn0 v16_37_1y2v1nfnf v16_37_1y2v1nfju v16_37_1y2v1nf9k v16_37_1y2v1nfm7 v16_37_1y2v1nfm8 v16_37_1y2v1nfoo";

package/dist/video.js

@@ -137,7 +137,7 @@ const q = {
     "16:9": 16 / 9,
     "4:3": 4 / 3
 }, M = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAAtJREFUGFdjYAACAAAFAAGq1chRAAAAAElFTkSuQmCC", _ = /*#__PURE__*/ _react.forwardRef((_param, A)=>{
-    var { src: s, poster: u, autoPlay: g = "when-loaded", muted: S = !0, loop: k = !0, preload: x = "none", loadingTimeout: b = 1e4, onLoad: y, onError: h, onPause: w, onPlay: v, aspectRatio: c = 0, dataAttributes: U } = _param, n = _object_without_properties(_param, [
+    var { src: s, poster: u, autoPlay: g = "when-loaded", muted: N = !0, loop: k = !0, preload: x = "none", loadingTimeout: b = 1e4, onLoad: y, onError: h, onPause: w, onPlay: v, aspectRatio: c = 0, dataAttributes: U } = _param, n = _object_without_properties(_param, [
         "src",
         "poster",
         "autoPlay",
@@ -189,7 +189,7 @@ const q = {
         playsInline: !0,
         disablePictureInPicture: !0,
         disableRemotePlayback: !0,
-        muted: S,
+        muted: N,
         loop: k,
         className: (0, _classnames.default)(_videocssmistica.video, _imagecssmistica.defaultBorderRadius),
         preload: x,

package/dist/vivinho-loading-animation/vivinho-loading-animation.css-mistica.js

@@ -17,4 +17,4 @@ _export(exports, {
     }
 });
 require("./vivinho-loading-animation.css.ts.vanilla.css-mistica.js");
-var a = "v16_36_1ezqdj90", r = "v16_36_1ezqdj91";
+var a = "v16_37_1ezqdj90", r = "v16_37_1ezqdj91";

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

@@ -1,9 +1,9 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./accordion.css.ts.vanilla.css-mistica.js";
-var n = "v16_36_1y2v1nfjf", s = "v16_36_8s3szx1", e = "v16_36_8s3szx5", a = "v16_36_1y2v1nf8l v16_36_1y2v1nf9u v16_36_1y2v1nfb3 v16_36_1y2v1nfcc v16_36_1y2v1nfjf v16_36_1y2v1nfla v16_36_1y2v1nf8k v16_36_1y2v1nfiu v16_36_1y2v1nfjw", r = "v16_36_8s3szxb", t = "v16_36_8s3szx6", o = {
-    enter: "v16_36_8s3szx7",
-    enterActive: "v16_36_8s3szx8",
-    exit: "v16_36_8s3szx9",
-    exitActive: "v16_36_8s3szxa"
-}, i = "v16_36_8s3szx4", x = "v16_36_8s3szx2", f = "v16_36_8s3szx3";
-export { n as accordionItem, s as boxed, e as chevronContainer, a as itemContent, r as panel, t as panelContainer, o as panelTransitionClasses, i as rightContentContainer, x as touchableBackground, f as touchableBackgroundInverse };
+var n = "v16_37_1y2v1nfkf", s = "v16_37_8s3szx1", a = "v16_37_8s3szx5", e = "v16_37_1y2v1nf9l v16_37_1y2v1nfau v16_37_1y2v1nfc3 v16_37_1y2v1nfdc v16_37_1y2v1nfkf v16_37_1y2v1nfma v16_37_1y2v1nf9k v16_37_1y2v1nfju v16_37_1y2v1nfkw", r = "v16_37_8s3szxb", t = "v16_37_8s3szx6", o = {
+    enter: "v16_37_8s3szx7",
+    enterActive: "v16_37_8s3szx8",
+    exit: "v16_37_8s3szx9",
+    exitActive: "v16_37_8s3szxa"
+}, x = "v16_37_8s3szx4", i = "v16_37_8s3szx2", f = "v16_37_8s3szx3";
+export { n as accordionItem, s as boxed, a as chevronContainer, e as itemContent, r as panel, t as panelContainer, o as panelTransitionClasses, x as rightContentContainer, i as touchableBackground, f as touchableBackgroundInverse };

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

@@ -1,3 +1,3 @@
 import "./align.css.ts.vanilla.css-mistica.js";
-var o = "v16_36_1mfs0fk0";
+var o = "v16_37_1mfs0fk0";
 export { o as container };

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

@@ -1,3 +1,3 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
-var _ = "v16_36_1y2v1nflr v16_36_1y2v1nfis v16_36_1y2v1nfj7 v16_36_1y2v1nfj1 v16_36_1y2v1nflu", n = "v16_36_1y2v1nfno";
-export { _ as avatar, n as image };
+var _ = "v16_37_1y2v1nfmr v16_37_1y2v1nfjs v16_37_1y2v1nfk7 v16_37_1y2v1nfk1 v16_37_1y2v1nfmu", a = "v16_37_1y2v1nfoo";
+export { _ as avatar, a as image };

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

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./badge.css.ts.vanilla.css-mistica.js";
-var r = "v16_36_17szrmd2 v16_36_1y2v1nf65", a = "v16_36_17szrmd7", d = "v16_36_17szrmd3", n = "v16_36_17szrmd5 v16_36_17szrmd2 v16_36_1y2v1nf65 v16_36_1y2v1nfis v16_36_1y2v1nfj7 v16_36_1y2v1nfj1", e = "v16_36_1y2v1nfin", i = "v16_36_1y2v1nfim v16_36_1y2v1nfiw";
-export { r as badge, a as badgeBigNumber, d as badgeBorder, n as badgeNumber, e as badgeWithChildren, i as container };
+var r = "v16_37_17szrmd2 v16_37_1y2v1nf6y", a = "v16_37_17szrmd7", d = "v16_37_17szrmd3", n = "v16_37_17szrmd5 v16_37_17szrmd2 v16_37_1y2v1nf6y v16_37_1y2v1nfjs v16_37_1y2v1nfk7 v16_37_1y2v1nfk1", e = "v16_37_1y2v1nfjn", m = "v16_37_1y2v1nfjm v16_37_1y2v1nfjw";
+export { r as badge, a as badgeBigNumber, d as badgeBorder, n as badgeNumber, e as badgeWithChildren, m as container };

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

@@ -1,24 +1,24 @@
 import "./box.css.ts.vanilla.css-mistica.js";
-var _ = "v16_36_1xgjmkvc", a = {
+var _ = "v16_37_1xgjmkvc", a = {
     paddingTop: {
-        desktop: "var(--v16_36_1xgjmkv0)",
-        tablet: "var(--v16_36_1xgjmkv1)",
-        mobile: "var(--v16_36_1xgjmkv2)"
+        desktop: "var(--v16_37_1xgjmkv0)",
+        tablet: "var(--v16_37_1xgjmkv1)",
+        mobile: "var(--v16_37_1xgjmkv2)"
     },
     paddingBottom: {
-        desktop: "var(--v16_36_1xgjmkv3)",
-        tablet: "var(--v16_36_1xgjmkv4)",
-        mobile: "var(--v16_36_1xgjmkv5)"
+        desktop: "var(--v16_37_1xgjmkv3)",
+        tablet: "var(--v16_37_1xgjmkv4)",
+        mobile: "var(--v16_37_1xgjmkv5)"
     },
     paddingLeft: {
-        desktop: "var(--v16_36_1xgjmkv6)",
-        tablet: "var(--v16_36_1xgjmkv7)",
-        mobile: "var(--v16_36_1xgjmkv8)"
+        desktop: "var(--v16_37_1xgjmkv6)",
+        tablet: "var(--v16_37_1xgjmkv7)",
+        mobile: "var(--v16_37_1xgjmkv8)"
     },
     paddingRight: {
-        desktop: "var(--v16_36_1xgjmkv9)",
-        tablet: "var(--v16_36_1xgjmkva)",
-        mobile: "var(--v16_36_1xgjmkvb)"
+        desktop: "var(--v16_37_1xgjmkv9)",
+        tablet: "var(--v16_37_1xgjmkva)",
+        mobile: "var(--v16_37_1xgjmkvb)"
     }
 };
 export { _ as box, a as vars };

package/dist-es/box.js

@@ -50,27 +50,27 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-import { jsx as C } from "react/jsx-runtime";
-import * as D from "react";
+import { jsx as D } from "react/jsx-runtime";
+import * as N from "react";
 import S from "classnames";
 import { box as q, vars as l } from "./box.css-mistica.js";
 import { applyCssVars as w } from "./utils/css.js";
 import { getPrefixedDataAttributes as B } from "./utils/dom.js";
-const E = /*#__PURE__*/ D.forwardRef((param, n)=>{
+const E = /*#__PURE__*/ N.forwardRef((param, n)=>{
     let { className: p, children: x, as: y = "div", width: m, padding: c = 0, paddingX: f = c, paddingY: i = c, paddingTop: e = i, paddingBottom: o = i, paddingLeft: t = f, paddingRight: r = f, role: k, id: V, dataAttributes: j, "aria-label": u, "aria-hidden": $ } = param;
-    const N = typeof e == "object" ? e : {
+    const P = typeof e == "object" ? e : {
         mobile: e,
         tablet: e,
         desktop: e
-    }, P = typeof o == "object" ? o : {
+    }, z = typeof o == "object" ? o : {
         mobile: o,
         tablet: o,
         desktop: o
-    }, z = typeof t == "object" ? t : {
+    }, A = typeof t == "object" ? t : {
         mobile: t,
         tablet: t,
         desktop: t
-    }, A = typeof r == "object" ? r : {
+    }, C = typeof r == "object" ? r : {
         mobile: r,
         tablet: r,
         desktop: r
@@ -82,13 +82,13 @@ const E = /*#__PURE__*/ D.forwardRef((param, n)=>{
             [a.desktop]: `${b.desktop}px`
         });
     };
-    return /* @__PURE__ */ C(y, _object_spread_props(_object_spread({}, B(j)), {
+    return /* @__PURE__ */ D(y, _object_spread_props(_object_spread({}, B(j)), {
         role: k,
         "aria-label": u,
         "aria-hidden": $,
         ref: n,
         className: S(p, q),
-        style: _object_spread({}, s(l.paddingTop, N), s(l.paddingBottom, P), s(l.paddingLeft, z), s(l.paddingRight, A), m !== void 0 ? {
+        style: _object_spread({}, s(l.paddingTop, P), s(l.paddingBottom, z), s(l.paddingLeft, A), s(l.paddingRight, C), m !== void 0 ? {
             width: m,
             boxSizing: "border-box"
         } : {}),