@telefonica/mistica 15.9.0 → 15.11.0

package/dist/navigation-bar.js

@@ -224,7 +224,7 @@ const we = (param)=>{
         ]
     });
 }, mn = (param)=>{
-    let { sections: n, selectedIndex: a, right: t, isInverse: r = !1, topFixed: o = !0, withBorder: s = !0, burgerMenuExtra: c, logo: l, large: p = !1 } = param;
+    let { sections: n = [], selectedIndex: a, right: t, isInverse: r = !1, topFixed: o = !0, withBorder: s = !0, burgerMenuExtra: c, logo: l, large: p = !1 } = param;
     const { texts: m, isDarkMode: q } = (0, _hooks.useTheme)(), [d, I] = _react.useState(!1), [O, h] = _react.useState("closed"), R = (0, _hooks.useAriaId)(), J = q ? 1 : 0.2, { isTabletOrSmaller: K } = (0, _hooks.useScreenSize)(), y = (0, _modalcontextprovider.useSetModalState)();
     l = l !== null && l !== void 0 ? l : /* @__PURE__ */ (0, _jsxruntime.jsx)(_logo.Logo, {
         size: {

package/dist/package-version.js

@@ -8,4 +8,4 @@ Object.defineProperty(exports, "PACKAGE_VERSION", {
         return o;
     }
 });
-const o = "15.9.0";
+const o = "15.11.0";

package/dist/select.js

@@ -142,9 +142,9 @@ const st = (param)=>{
     }, I = (e)=>{
         if (e) {
             if (S != null && S.current) {
-                const o = S.current.getBoundingClientRect(), p = o.top, E = o.width, O = o.left, Re = o.height, b = p + Re, _ = Math.min(f.length, 8) * 48 + 16;
-                if (b + _ + 12 > window.innerHeight) {
-                    const Ae = window.innerHeight - b;
+                const o = S.current.getBoundingClientRect(), p = o.top, E = o.width, O = o.left, Re = o.height, y = p + Re, _ = Math.min(f.length, 8) * 48 + 16;
+                if (y + _ + 12 > window.innerHeight) {
+                    const Ae = window.innerHeight - y;
                     if (p > Ae) {
                         const _e = p - _;
                         F({
@@ -156,14 +156,14 @@ const st = (param)=>{
                         });
                     } else F({
                         minWidth: E,
-                        top: b,
+                        top: y,
                         left: O,
-                        maxHeight: window.innerHeight - b - 12,
+                        maxHeight: window.innerHeight - y - 12,
                         transformOrigin: "center top"
                     });
                 } else F({
                     minWidth: E,
-                    top: b,
+                    top: y,
                     left: O,
                     maxHeight: _,
                     transformOrigin: "center top"
@@ -187,7 +187,7 @@ const st = (param)=>{
             }
             o && o.top + o.height / 2 <= t.top && (c == null || c.scrollIntoView(!1));
         }
-    }, Oe = d.current, be = h.current;
+    }, Oe = d.current, ye = h.current;
     _react.useEffect(()=>{
         Z({
             name: i,
@@ -215,7 +215,7 @@ const st = (param)=>{
         d,
         h,
         Oe,
-        be
+        ye
     ]), _react.useEffect(()=>{
         const e = (s)=>{
             var p;
@@ -260,7 +260,7 @@ const st = (param)=>{
     ]), _react.useEffect(()=>{
         ve(!1);
     }, []);
-    const ye = (e)=>{
+    const be = (e)=>{
         var t;
         return e ? (t = f.find((param)=>{
             let { value: s } = param;
@@ -337,10 +337,14 @@ const st = (param)=>{
                         }),
                         f.map((param)=>{
                             let { value: e, text: t } = param;
-                            return /* @__PURE__ */ (0, _jsxruntime.jsx)("option", {
+                            return(// Similar issue in another lib: https://github.com/chakra-ui/chakra-ui/issues/417#issue-566611352
+                            /* @__PURE__ */ (0, _jsxruntime.jsx)("option", {
                                 value: e,
+                                style: {
+                                    color: "initial"
+                                },
                                 children: t
-                            }, e);
+                            }, e));
                         })
                     ]
                 }),
@@ -390,7 +394,7 @@ const st = (param)=>{
                         }),
                         /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                             className: (0, _classnames.default)(_selectcssmistica.selectTextVariants[T ? "disabled" : "default"], w ? _textfieldbasecssmistica.inputWithLabel : _textfieldbasecssmistica.inputWithoutLabel),
-                            children: ye(a !== null && a !== void 0 ? a : l)
+                            children: be(a !== null && a !== void 0 ? a : l)
                         })
                     ]
                 })),

package/dist/skins/movistar.d.ts

@@ -2,28 +2,40 @@ import type { GetKnownSkin } from './types';
 export declare const palette: {
     movistarBlue: string;
     movistarBlue10: string;
+    movistarBlue15: string;
     movistarBlue20: string;
     movistarBlue30: string;
     movistarBlue40: string;
     movistarBlue55: string;
+    movistarBlueHC: string;
+    movistarBlueHC55: string;
+    movistarBlueHC65: string;
     movistarGreen: string;
     movistarGreen10: string;
     movistarGreen30: string;
     movistarGreen40: string;
+    movistarGreen55: string;
     movistarGreen60: string;
     movistarGreen70: string;
     pepper: string;
     pepper10: string;
     pepper40: string;
+    pepper45: string;
     pepper55: string;
+    pepper60: string;
+    pepper65: string;
     pepper70: string;
     egg: string;
     egg10: string;
     egg40: string;
+    egg55: string;
     egg80: string;
     pink: string;
+    pink45: string;
+    pink55: string;
     purple: string;
     purple10: string;
+    purple35: string;
     purple40: string;
     purple70: string;
     grey1: string;
@@ -42,5 +54,6 @@ export declare const palette: {
     darkModeGrey4: string;
     darkModeGrey5: string;
     darkModeGrey6: string;
+    darkModeGrey7: string;
 };
 export declare const getMovistarSkin: GetKnownSkin;

package/dist/skins/movistar.js

@@ -19,37 +19,49 @@ _export(exports, {
 const _constants = require("./constants.js");
 const _color = require("../utils/color.js");
 const e = {
-    movistarBlue: "#019DF4",
+    movistarBlue: "#0B9CEA",
     movistarBlue10: "#E6F5FD",
+    movistarBlue15: "#CEEBFB",
     movistarBlue20: "#B3E1FB",
     movistarBlue30: "#80CEF9",
     movistarBlue40: "#4DBAF7",
     movistarBlue55: "#008EDD",
+    movistarBlueHC: "#066FCB",
+    movistarBlueHC55: "#055EAC",
+    movistarBlueHC65: "#055398",
     movistarGreen: "#5CB615",
     movistarGreen10: "#EFF8E8",
     movistarGreen30: "#ADDA8A",
     movistarGreen40: "#8DCC5B",
+    movistarGreen55: "#52A413",
     movistarGreen60: "#499110",
     movistarGreen70: "#407F0F",
     pepper: "#FF374A",
     pepper10: "#FFEBED",
     pepper40: "#FF7380",
+    pepper45: "#FF5F6E",
     pepper55: "#D73241",
+    pepper60: "#CC2C3B",
+    pepper65: "#BF2937",
     pepper70: "#B22634",
     egg: "#F28D15",
     egg10: "#FEF4E8",
     egg40: "#F6AF5B",
+    egg55: "#D97D0D",
     egg80: "#6D3F09",
     pink: "#E63780",
+    pink45: "#EB5F99",
+    pink55: "#C42F6D",
     purple: "#A13EA1",
     purple10: "#F6ECF6",
+    purple35: "#C78BC7",
     purple40: "#BD78BD",
     purple70: "#712B71",
     grey1: "#F6F6F6",
     grey2: "#EEEEEE",
     grey3: "#DDDDDD",
-    grey4: "#999999",
-    grey5: "#86888C",
+    grey4: "#949494",
+    grey5: "#6B6C6F",
     grey6: "#313235",
     white: "#FFFFFF",
     black: "#000000",
@@ -60,7 +72,8 @@ const e = {
     darkModeGrey3: "#CED4D7",
     darkModeGrey4: "#85939C",
     darkModeGrey5: "#6D7D88",
-    darkModeGrey6: "#3C5261"
+    darkModeGrey6: "#3C5261",
+    darkModeGrey7: "#032F46"
 }, d = ()=>({
         name: _constants.MOVISTAR_SKIN,
         colors: {
@@ -70,11 +83,11 @@ const e = {
             backgroundBrandSecondary: e.movistarBlueDark,
             backgroundContainer: e.white,
             backgroundContainerError: e.pepper10,
-            backgroundContainerHover: (0, _color.applyAlpha)(e.darkModeBlack, 0.03),
-            backgroundContainerPressed: (0, _color.applyAlpha)(e.darkModeBlack, 0.05),
+            backgroundContainerHover: (0, _color.applyAlpha)(e.black, 0.03),
+            backgroundContainerPressed: (0, _color.applyAlpha)(e.black, 0.05),
             backgroundContainerBrand: e.movistarBlue,
-            backgroundContainerBrandHover: (0, _color.applyAlpha)(e.darkModeBlack, 0.1),
-            backgroundContainerBrandPressed: (0, _color.applyAlpha)(e.darkModeBlack, 0.2),
+            backgroundContainerBrandHover: (0, _color.applyAlpha)(e.black, 0.1),
+            backgroundContainerBrandPressed: (0, _color.applyAlpha)(e.black, 0.2),
             backgroundContainerBrandOverInverse: e.movistarBlue55,
             backgroundContainerAlternative: e.grey1,
             backgroundOverlay: (0, _color.applyAlpha)(e.movistarBlueDark, 0.6),
@@ -89,58 +102,58 @@ const e = {
             border: e.grey3,
             borderHigh: e.grey5,
             borderSelected: e.movistarBlue,
-            coverBackgroundHover: (0, _color.applyAlpha)(e.darkModeBlack, 0.25),
-            coverBackgroundPressed: (0, _color.applyAlpha)(e.darkModeBlack, 0.35),
-            buttonDangerBackground: e.pepper,
-            buttonDangerBackgroundSelected: e.pepper55,
-            buttonDangerBackgroundHover: e.pepper55,
+            coverBackgroundHover: (0, _color.applyAlpha)(e.black, 0.25),
+            coverBackgroundPressed: (0, _color.applyAlpha)(e.black, 0.35),
+            buttonDangerBackground: e.pepper55,
+            buttonDangerBackgroundSelected: e.pepper70,
+            buttonDangerBackgroundHover: e.pepper65,
             buttonLinkDangerBackgroundSelected: e.pepper10,
             buttonLinkDangerBackgroundInverse: e.white,
             buttonLinkDangerBackgroundInverseSelected: e.pepper10,
             buttonLinkBackgroundSelected: e.movistarBlue10,
             buttonLinkBackgroundInverseSelected: (0, _color.applyAlpha)(e.white, 0.2),
-            buttonPrimaryBackground: e.movistarBlue,
+            buttonPrimaryBackground: e.movistarBlueHC,
             buttonPrimaryBackgroundInverse: e.white,
-            buttonPrimaryBackgroundSelected: e.movistarBlue55,
-            buttonPrimaryBackgroundHover: e.movistarBlue55,
-            buttonPrimaryBackgroundInverseSelected: e.movistarBlue30,
-            buttonSecondaryBorder: e.movistarBlue,
-            buttonSecondaryBorderSelected: e.movistarBlue55,
+            buttonPrimaryBackgroundSelected: e.movistarBlueHC65,
+            buttonPrimaryBackgroundHover: e.movistarBlueHC55,
+            buttonPrimaryBackgroundInverseSelected: e.movistarBlue10,
+            buttonSecondaryBorder: e.movistarBlueHC,
+            buttonSecondaryBorderSelected: e.movistarBlueHC65,
             buttonSecondaryBackgroundHover: e.movistarBlue10,
-            buttonSecondaryBackgroundSelected: e.movistarBlue10,
+            buttonSecondaryBackgroundSelected: e.movistarBlue15,
             buttonSecondaryBorderInverse: e.white,
             buttonSecondaryBorderInverseSelected: e.white,
             buttonSecondaryBackgroundInverseHover: (0, _color.applyAlpha)(e.white, 0.2),
-            buttonSecondaryBackgroundInverseSelected: (0, _color.applyAlpha)(e.white, 0.2),
+            buttonSecondaryBackgroundInverseSelected: (0, _color.applyAlpha)(e.white, 0.3),
             textButtonPrimary: e.white,
-            textButtonPrimaryInverse: e.movistarBlue,
-            textButtonPrimaryInverseSelected: e.movistarBlue,
-            textButtonSecondary: e.movistarBlue,
-            textButtonSecondarySelected: e.movistarBlue55,
+            textButtonPrimaryInverse: e.movistarBlueHC,
+            textButtonPrimaryInverseSelected: e.movistarBlueHC,
+            textButtonSecondary: e.movistarBlueHC,
+            textButtonSecondarySelected: e.movistarBlueHC55,
             textButtonSecondaryInverse: e.white,
             textButtonSecondaryInverseSelected: e.white,
-            textLink: e.movistarBlue,
+            textLink: e.movistarBlueHC,
             textLinkInverse: e.white,
-            textLinkDanger: e.pepper,
+            textLinkDanger: e.pepper60,
             textLinkSnackbar: e.movistarBlue30,
-            textActivated: e.movistarBlue,
-            textBrand: e.movistarBlue,
-            control: e.grey3,
+            textActivated: e.movistarBlueHC,
+            textBrand: e.movistarBlueHC,
+            control: e.grey4,
             controlActivated: e.movistarBlue,
             controlInverse: e.movistarBlue20,
             controlActivatedInverse: e.white,
-            controlError: e.pepper,
+            controlError: e.pepper55,
             barTrack: e.grey3,
-            loadingBar: e.movistarBlue30,
-            loadingBarBackground: e.movistarBlue55,
+            loadingBar: e.movistarBlue,
+            loadingBarBackground: e.grey2,
             toggleAndroidInactive: e.grey2,
             toggleAndroidBackgroundActive: e.movistarBlue20,
             iosControlKnob: e.white,
-            divider: e.grey2,
+            divider: e.grey3,
             dividerInverse: (0, _color.applyAlpha)(e.white, 0.2),
             navigationBarDivider: e.movistarBlue,
             badge: e.pepper55,
-            feedbackErrorBackground: e.pepper,
+            feedbackErrorBackground: e.pepper55,
             feedbackInfoBackground: e.movistarBlueDark,
             brand: e.movistarBlue,
             brandHigh: e.movistarBlue55,
@@ -154,13 +167,13 @@ const e = {
             textPrimaryInverse: e.white,
             textSecondary: e.grey5,
             textSecondaryInverse: e.movistarBlue10,
-            success: e.movistarGreen,
-            warning: e.egg,
-            error: e.pepper,
-            textError: e.pepper,
+            success: e.movistarGreen55,
+            warning: e.egg55,
+            error: e.pepper55,
+            textError: e.pepper55,
             textErrorInverse: e.white,
             promo: e.purple,
-            highlight: e.pink,
+            highlight: e.pink55,
             successLow: e.movistarGreen10,
             warningLow: e.egg10,
             errorLow: e.pepper10,
@@ -178,11 +191,11 @@ const e = {
             textNavigationBarSecondary: e.movistarBlue20,
             textNavigationSearchBarHint: e.movistarBlue20,
             textNavigationSearchBarText: e.white,
-            textAppBar: e.grey4,
-            textAppBarSelected: e.movistarBlue,
-            customTabsBackground: e.movistarBlue,
+            textAppBar: e.grey5,
+            textAppBarSelected: e.movistarBlueHC,
+            customTabsBackground: e.white,
             tagTextPromo: e.purple70,
-            tagTextActive: e.movistarBlue,
+            tagTextActive: e.movistarBlueHC,
             tagTextInactive: e.grey5,
             tagTextSuccess: e.movistarGreen70,
             tagTextWarning: e.egg80,
@@ -210,8 +223,8 @@ const e = {
             backgroundContainerBrandOverInverse: e.darkModeGrey,
             backgroundContainerAlternative: e.darkModeGrey,
             backgroundOverlay: (0, _color.applyAlpha)(e.darkModeGrey, 0.8),
-            backgroundSkeleton: e.movistarBlueDark,
-            backgroundSkeletonInverse: e.movistarBlueDark,
+            backgroundSkeleton: e.darkModeGrey6,
+            backgroundSkeletonInverse: e.darkModeGrey6,
             backgroundBrandTop: e.darkModeBlack,
             backgroundBrandBottom: e.darkModeBlack,
             appBarBackground: e.darkModeGrey,
@@ -219,89 +232,89 @@ const e = {
             skeletonWave: e.darkModeGrey6,
             borderLow: e.darkModeBlack,
             border: e.darkModeGrey,
-            borderHigh: e.darkModeGrey4,
+            borderHigh: e.darkModeGrey5,
             borderSelected: e.movistarBlue,
             coverBackgroundHover: (0, _color.applyAlpha)(e.darkModeBlack, 0.25),
             coverBackgroundPressed: (0, _color.applyAlpha)(e.darkModeBlack, 0.35),
-            buttonDangerBackground: e.pepper,
-            buttonDangerBackgroundSelected: e.pepper55,
-            buttonDangerBackgroundHover: e.pepper55,
+            buttonDangerBackground: e.pepper55,
+            buttonDangerBackgroundSelected: e.pepper70,
+            buttonDangerBackgroundHover: e.pepper65,
             buttonLinkDangerBackgroundSelected: (0, _color.applyAlpha)(e.white, 0.08),
             buttonLinkDangerBackgroundInverse: (0, _color.applyAlpha)(e.white, 0),
             buttonLinkDangerBackgroundInverseSelected: (0, _color.applyAlpha)(e.white, 0.08),
             buttonLinkBackgroundSelected: (0, _color.applyAlpha)(e.white, 0.08),
             buttonLinkBackgroundInverseSelected: (0, _color.applyAlpha)(e.white, 0.08),
-            buttonPrimaryBackground: e.movistarBlue,
-            buttonPrimaryBackgroundInverse: e.movistarBlue,
-            buttonPrimaryBackgroundSelected: e.movistarBlue55,
-            buttonPrimaryBackgroundHover: e.movistarBlue55,
-            buttonPrimaryBackgroundInverseSelected: e.movistarBlue55,
+            buttonPrimaryBackground: e.movistarBlueHC,
+            buttonPrimaryBackgroundInverse: e.movistarBlueHC,
+            buttonPrimaryBackgroundSelected: e.movistarBlueHC65,
+            buttonPrimaryBackgroundHover: e.movistarBlueHC55,
+            buttonPrimaryBackgroundInverseSelected: e.movistarBlueHC65,
             buttonSecondaryBackgroundHover: (0, _color.applyAlpha)(e.white, 0.15),
-            buttonSecondaryBackgroundSelected: (0, _color.applyAlpha)(e.white, 0.15),
+            buttonSecondaryBackgroundSelected: (0, _color.applyAlpha)(e.white, 0.25),
             buttonSecondaryBorder: e.white,
             buttonSecondaryBorderSelected: e.white,
-            buttonSecondaryBorderInverse: e.white,
-            buttonSecondaryBorderInverseSelected: e.white,
+            buttonSecondaryBorderInverse: e.darkModeGrey2,
+            buttonSecondaryBorderInverseSelected: e.darkModeGrey2,
             buttonSecondaryBackgroundInverseHover: (0, _color.applyAlpha)(e.white, 0.15),
-            buttonSecondaryBackgroundInverseSelected: (0, _color.applyAlpha)(e.white, 0.15),
-            textButtonPrimary: e.darkModeGrey2,
-            textButtonPrimaryInverse: e.darkModeGrey2,
-            textButtonPrimaryInverseSelected: e.darkModeGrey2,
+            buttonSecondaryBackgroundInverseSelected: (0, _color.applyAlpha)(e.white, 0.25),
+            textButtonPrimary: e.white,
+            textButtonPrimaryInverse: e.white,
+            textButtonPrimaryInverseSelected: e.white,
             textButtonSecondary: e.darkModeGrey2,
-            textButtonSecondarySelected: e.darkModeGrey4,
+            textButtonSecondarySelected: e.darkModeGrey2,
             textButtonSecondaryInverse: e.darkModeGrey2,
-            textButtonSecondaryInverseSelected: e.darkModeGrey4,
+            textButtonSecondaryInverseSelected: e.darkModeGrey2,
             textLink: e.movistarBlue,
             textLinkInverse: e.movistarBlue,
-            textLinkDanger: e.pepper,
-            textLinkSnackbar: e.movistarBlue30,
+            textLinkDanger: e.pepper45,
+            textLinkSnackbar: e.movistarBlue,
             textActivated: e.movistarBlue,
             textBrand: e.movistarBlue,
-            control: e.darkModeGrey6,
+            control: e.darkModeGrey4,
             controlActivated: e.movistarBlue,
-            controlInverse: e.darkModeGrey6,
+            controlInverse: e.darkModeGrey4,
             controlActivatedInverse: e.movistarBlue,
-            controlError: e.pepper,
+            controlError: e.pepper45,
             barTrack: e.darkModeGrey6,
             loadingBar: e.movistarBlue,
             loadingBarBackground: e.darkModeGrey6,
-            toggleAndroidInactive: e.darkModeGrey4,
+            toggleAndroidInactive: e.darkModeGrey2,
             toggleAndroidBackgroundActive: e.movistarBlue20,
             iosControlKnob: e.darkModeGrey2,
-            divider: (0, _color.applyAlpha)(e.white, 0.05),
-            dividerInverse: (0, _color.applyAlpha)(e.white, 0.05),
+            divider: (0, _color.applyAlpha)(e.white, 0.1),
+            dividerInverse: (0, _color.applyAlpha)(e.white, 0.1),
             navigationBarDivider: e.darkModeBlack,
             badge: e.pepper55,
-            feedbackErrorBackground: e.pepper,
+            feedbackErrorBackground: e.pepper55,
             feedbackInfoBackground: e.movistarBlueDark,
             brand: e.movistarBlue,
-            brandHigh: e.darkModeGrey,
+            brandHigh: e.movistarBlue40,
             inverse: e.darkModeGrey2,
             neutralHigh: e.darkModeGrey2,
             neutralMedium: e.darkModeGrey5,
             neutralMediumInverse: e.grey5,
-            neutralLow: e.movistarBlueDark,
-            neutralLowAlternative: e.movistarBlueDark,
+            neutralLow: e.darkModeGrey6,
+            neutralLowAlternative: e.darkModeGrey6,
             textPrimary: e.darkModeGrey2,
             textPrimaryInverse: e.darkModeGrey2,
             textSecondary: e.darkModeGrey4,
             textSecondaryInverse: e.darkModeGrey4,
             success: e.movistarGreen,
             warning: e.egg,
-            error: e.pepper,
-            textError: e.pepper,
-            textErrorInverse: e.pepper,
-            promo: e.purple,
-            highlight: e.pink,
-            successLow: e.movistarBlueDark,
-            warningLow: e.movistarBlueDark,
-            errorLow: e.movistarBlueDark,
-            promoLow: e.movistarBlueDark,
-            brandLow: e.movistarBlueDark,
+            error: e.pepper45,
+            textError: e.pepper45,
+            textErrorInverse: e.pepper45,
+            promo: e.purple40,
+            highlight: e.pink45,
+            successLow: e.darkModeGrey7,
+            warningLow: e.darkModeGrey7,
+            errorLow: e.darkModeGrey7,
+            promoLow: e.darkModeGrey7,
+            brandLow: e.darkModeGrey7,
             successHigh: e.movistarGreen40,
             warningHigh: e.egg40,
-            errorHigh: e.pepper40,
-            promoHigh: e.purple40,
+            errorHigh: e.pepper45,
+            promoHigh: e.purple35,
             successHighInverse: e.movistarGreen70,
             warningHighInverse: e.egg80,
             errorHighInverse: e.pepper70,
@@ -310,21 +323,21 @@ const e = {
             textNavigationBarSecondary: e.darkModeGrey4,
             textNavigationSearchBarHint: e.darkModeGrey4,
             textNavigationSearchBarText: e.darkModeGrey2,
-            textAppBar: e.darkModeGrey5,
-            textAppBarSelected: e.darkModeGrey2,
+            textAppBar: e.darkModeGrey4,
+            textAppBarSelected: e.movistarBlue,
             customTabsBackground: e.darkModeBlack,
-            tagTextPromo: e.purple40,
+            tagTextPromo: e.purple35,
             tagTextActive: e.movistarBlue,
-            tagTextInactive: e.darkModeGrey5,
+            tagTextInactive: e.darkModeGrey3,
             tagTextSuccess: e.movistarGreen40,
             tagTextWarning: e.egg40,
-            tagTextError: e.pepper40,
-            tagBackgroundPromo: e.movistarBlueDark,
-            tagBackgroundActive: e.movistarBlueDark,
-            tagBackgroundInactive: e.movistarBlueDark,
-            tagBackgroundSuccess: e.movistarBlueDark,
-            tagBackgroundWarning: e.movistarBlueDark,
-            tagBackgroundError: e.movistarBlueDark,
+            tagTextError: e.pepper45,
+            tagBackgroundPromo: e.darkModeGrey7,
+            tagBackgroundActive: e.darkModeGrey7,
+            tagBackgroundInactive: e.darkModeGrey7,
+            tagBackgroundSuccess: e.darkModeGrey7,
+            tagBackgroundWarning: e.darkModeGrey7,
+            tagBackgroundError: e.darkModeGrey7,
             cardContentOverlay: `linear-gradient(180deg, ${(0, _color.applyAlpha)(e.black, 0)} 0%, ${(0, _color.applyAlpha)(e.black, 0.4)} 30%, ${(0, _color.applyAlpha)(e.black, 0.7)} 100%)`
         },
         borderRadii: {

package/dist/spinner.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return V;
+        return j;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -15,6 +15,7 @@ const _fadein = /*#__PURE__*/ _interop_require_default(require("./fade-in.js"));
 const _hooks = require("./hooks.js");
 const _spinnercssmistica = require("./spinner.css-mistica.js");
 const _skincontractcssmistica = require("./skins/skin-contract.css-mistica.js");
+const _themevariantcontext = require("./theme-variant-context.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -48,12 +49,12 @@ function _object_spread(target) {
     }
     return target;
 }
-const Z = (param)=>{
-    let { color: t, delay: s = "500ms", size: a = 24, style: m, rolePresentation: p } = param;
-    const { texts: h, platformOverrides: o } = (0, _hooks.useTheme)();
-    t = t || _skincontractcssmistica.vars.colors.controlActivated;
-    const l = (0, _hooks.useAriaId)(), n = !p, C = h.loading, d = (0, _platform.getPlatform)(o) === "ios" ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", {
-        "aria-labelledby": l,
+const x = (param)=>{
+    let { color: t, delay: i = "500ms", size: a = 24, style: m, rolePresentation: p } = param;
+    const { texts: c, platformOverrides: h } = (0, _hooks.useTheme)(), f = (0, _themevariantcontext.useIsInverseVariant)();
+    t = t || (f ? _skincontractcssmistica.vars.colors.controlActivatedInverse : _skincontractcssmistica.vars.colors.controlActivated);
+    const n = (0, _hooks.useAriaId)(), r = !p, o = c.loading, C = (0, _platform.getPlatform)(h) === "ios" ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", {
+        "aria-labelledby": n,
         className: _spinnercssmistica.spinnerIos,
         height: a,
         style: _object_spread({}, m),
@@ -61,9 +62,9 @@ const Z = (param)=>{
         viewBox: "0 0 30 30",
         width: a,
         children: [
-            n && /* @__PURE__ */ (0, _jsxruntime.jsx)("title", {
-                id: l,
-                children: C
+            r && /* @__PURE__ */ (0, _jsxruntime.jsx)("title", {
+                id: n,
+                children: o
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsxs)("g", {
                 role: "presentation",
@@ -112,7 +113,7 @@ const Z = (param)=>{
             })
         ]
     }) : /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", {
-        "aria-labelledby": n ? l : void 0,
+        "aria-labelledby": r ? n : void 0,
         className: _spinnercssmistica.spinnerDefault,
         height: a,
         style: _object_spread({}, m),
@@ -120,9 +121,9 @@ const Z = (param)=>{
         viewBox: "0 0 66 66",
         width: a,
         children: [
-            n && /* @__PURE__ */ (0, _jsxruntime.jsx)("title", {
-                id: l,
-                children: C
+            r && /* @__PURE__ */ (0, _jsxruntime.jsx)("title", {
+                id: n,
+                children: o
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsx)("circle", {
                 className: _spinnercssmistica.spinnerDefaultPath,
@@ -136,11 +137,11 @@ const Z = (param)=>{
             })
         ]
     });
-    return s === "0" || s === "0s" || s === "0ms" ? d : /* @__PURE__ */ (0, _jsxruntime.jsx)(_fadein.default, {
-        delay: s,
+    return i === "0" || i === "0s" || i === "0ms" ? C : /* @__PURE__ */ (0, _jsxruntime.jsx)(_fadein.default, {
+        delay: i,
         dataAttributes: {
             "component-name": "Spinner"
         },
-        children: d
+        children: C
     });
-}, V = Z;
+}, j = x;

package/dist/table.css-mistica.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    boxed: function() {
+        return l;
+    },
+    cellTextAlign: function() {
+        return a;
+    },
+    collapsedRowTittle: function() {
+        return k;
+    },
+    collapsedRowsInMobile: function() {
+        return t;
+    },
+    fullWidth: function() {
+        return _;
+    },
+    mobileCellHeading: function() {
+        return i;
+    },
+    scrollContainer: function() {
+        return v;
+    },
+    scrollOverResponsiveLayout: function() {
+        return c;
+    },
+    table: function() {
+        return d;
+    },
+    vars: function() {
+        return n;
+    },
+    verticalAlign: function() {
+        return p;
+    }
+});
+require("./sprinkles.css.ts.vanilla.css-mistica.js");
+require("./responsive-layout.css.ts.vanilla.css-mistica.js");
+require("./table.css.ts.vanilla.css-mistica.js");
+var l = "_107ok884", a = {
+    left: "_107ok886 _107ok885",
+    right: "_107ok887 _107ok885",
+    center: "_107ok888 _107ok885"
+}, k = "_107ok88e", t = "_107ok883", _ = "_107ok882", i = "_107ok88d", v = "_107ok889", c = "_107ok88a", d = "_107ok881", n = {
+    maxHeight: "var(--_107ok880)"
+}, p = {
+    top: "_107ok88b",
+    middle: "_107ok88c"
+};