@telefonica/mistica 14.9.0 → 14.11.0

package/dist/skins/movistar-legacy.js

@@ -12,8 +12,8 @@ _export(exports, {
     getMovistarLegacySkin: ()=>d,
     palette: ()=>e
 });
-const _colorJs = require("../utils/color.js");
 const _constantsJs = require("./constants.js");
+const _colorJs = require("../utils/color.js");
 const e = {
     movistarBlue: "#019DF4",
     movistarBlue10: "#E6F5FD",
@@ -29,7 +29,6 @@ const e = {
     movistarGreen70: "#407F0F",
     pepper: "#FF374A",
     pepper10: "#FFEBED",
-    pepper20: "#FFC3C8",
     pepper40: "#FF7380",
     pepper55: "#D73241",
     pepper70: "#B22634",
@@ -56,29 +55,35 @@ const e = {
     movistarProminentBlueLight70: "#546874",
     darkModeBlack: "#191919",
     darkModeGrey: "#242424"
-}, d = (o)=>{
-    const t = {
-        name: _constantsJs.MOVISTAR_SKIN,
+}, d = (t)=>{
+    const o = {
+        name: _constantsJs.MOVISTAR_LEGACY_SKIN,
         colors: {
-            appBarBackground: e.white,
             background: e.white,
+            backgroundAlternative: e.grey1,
+            backgroundBrand: e.movistarBlue,
+            backgroundBrandSecondary: e.movistarBlue,
             backgroundContainer: e.white,
+            backgroundContainerHover: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.03),
+            backgroundContainerPressed: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.05),
             backgroundContainerBrand: e.movistarBlue,
+            backgroundContainerBrandHover: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.1),
+            backgroundContainerBrandPressed: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.2),
             backgroundContainerBrandOverInverse: e.movistarBlue55,
             backgroundContainerAlternative: e.grey1,
-            backgroundBrand: e.movistarBlue,
-            backgroundBrandSecondary: e.movistarBlue,
             backgroundOverlay: (0, _colorJs.applyAlpha)(e.grey6, 0.6),
             backgroundSkeleton: e.grey2,
             backgroundSkeletonInverse: e.movistarBlue55,
-            navigationBarBackground: e.movistarBlue,
-            backgroundAlternative: e.grey1,
             backgroundFeedbackBottom: e.movistarBlue,
+            appBarBackground: e.white,
+            navigationBarBackground: e.movistarBlue,
             skeletonWave: e.grey2,
             borderLow: e.grey1,
             border: e.grey3,
             borderHigh: e.grey5,
             borderSelected: e.movistarBlue,
+            coverBackgroundHover: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.25),
+            coverBackgroundPressed: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.35),
             buttonDangerBackground: e.pepper,
             buttonDangerBackgroundSelected: e.pepper55,
             buttonDangerBackgroundHover: e.pepper55,
@@ -91,10 +96,10 @@ const e = {
             buttonPrimaryBackgroundInverseSelected: e.movistarBlue30,
             buttonSecondaryBorder: e.movistarBlue,
             buttonSecondaryBorderSelected: e.movistarBlue55,
-            buttonSecondaryBorderInverse: e.white,
-            buttonSecondaryBorderInverseSelected: e.white,
             buttonSecondaryBackgroundHover: e.movistarBlue10,
             buttonSecondaryBackgroundSelected: e.movistarBlue10,
+            buttonSecondaryBorderInverse: e.white,
+            buttonSecondaryBorderInverseSelected: e.white,
             buttonSecondaryBackgroundInverseHover: (0, _colorJs.applyAlpha)(e.white, 0.2),
             buttonSecondaryBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.2),
             textButtonPrimary: e.white,
@@ -127,23 +132,18 @@ const e = {
             inverse: e.white,
             neutralHigh: e.grey6,
             neutralMedium: e.grey5,
+            neutralMediumInverse: e.grey5,
             neutralLow: e.grey1,
             neutralLowAlternative: e.grey2,
-            promo: e.purple,
-            highlight: e.pink,
             textPrimary: e.grey6,
             textPrimaryInverse: e.white,
             textSecondary: e.grey5,
-            textSecondaryInverse: e.white,
-            error: e.pepper,
+            textSecondaryInverse: e.movistarBlue10,
             success: e.movistarGreen,
             warning: e.egg,
-            textNavigationBarPrimary: e.white,
-            textNavigationBarSecondary: e.movistarBlue20,
-            textNavigationSearchBarHint: e.movistarBlue20,
-            textNavigationSearchBarText: e.white,
-            textAppBar: e.grey4,
-            textAppBarSelected: e.movistarBlue,
+            error: e.pepper,
+            promo: e.purple,
+            highlight: e.pink,
             successLow: e.movistarGreen10,
             warningLow: e.egg10,
             errorLow: e.pepper10,
@@ -157,40 +157,56 @@ const e = {
             warningHighInverse: e.egg80,
             errorHighInverse: e.pepper70,
             promoHighInverse: e.purple70,
-            neutralMediumInverse: e.grey5
+            textNavigationBarPrimary: e.white,
+            textNavigationBarSecondary: e.movistarBlue20,
+            textNavigationSearchBarHint: e.movistarBlue20,
+            textNavigationSearchBarText: e.white,
+            textAppBar: e.grey4,
+            textAppBarSelected: e.movistarBlue,
+            customTabsBackground: e.white
         },
         darkModeColors: {
-            brand: e.movistarBlue,
-            appBarBackground: e.darkModeGrey,
             background: e.darkModeBlack,
+            backgroundAlternative: e.darkModeBlack,
+            backgroundBrand: e.darkModeBlack,
+            backgroundBrandSecondary: e.darkModeBlack,
             backgroundContainer: e.darkModeGrey,
+            backgroundContainerHover: (0, _colorJs.applyAlpha)(e.white, 0.03),
+            backgroundContainerPressed: (0, _colorJs.applyAlpha)(e.white, 0.05),
             backgroundContainerBrand: e.darkModeGrey,
+            backgroundContainerBrandHover: (0, _colorJs.applyAlpha)(e.white, 0.03),
+            backgroundContainerBrandPressed: (0, _colorJs.applyAlpha)(e.white, 0.05),
             backgroundContainerBrandOverInverse: e.darkModeGrey,
             backgroundContainerAlternative: e.darkModeGrey,
-            backgroundBrand: e.darkModeBlack,
-            backgroundBrandSecondary: e.darkModeBlack,
             backgroundOverlay: (0, _colorJs.applyAlpha)(e.darkModeGrey, 0.8),
             backgroundSkeleton: e.grey6,
             backgroundSkeletonInverse: e.grey6,
-            navigationBarBackground: e.darkModeBlack,
-            backgroundAlternative: e.darkModeBlack,
             backgroundFeedbackBottom: e.darkModeBlack,
+            appBarBackground: e.darkModeGrey,
+            navigationBarBackground: e.darkModeBlack,
             skeletonWave: e.grey5,
             borderLow: e.darkModeBlack,
             border: e.darkModeGrey,
-            buttonLinkBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.05),
-            buttonLinkBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.05),
+            borderHigh: e.grey5,
+            borderSelected: e.movistarBlue,
+            coverBackgroundHover: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.25),
+            coverBackgroundPressed: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.35),
+            buttonDangerBackground: e.pepper,
+            buttonDangerBackgroundSelected: e.pepper55,
+            buttonDangerBackgroundHover: e.pepper55,
+            buttonLinkBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.08),
+            buttonLinkBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.08),
             buttonPrimaryBackground: e.movistarBlue,
             buttonPrimaryBackgroundInverse: e.movistarBlue,
             buttonPrimaryBackgroundSelected: e.movistarBlue55,
             buttonPrimaryBackgroundHover: e.movistarBlue55,
             buttonPrimaryBackgroundInverseSelected: e.movistarBlue55,
+            buttonSecondaryBackgroundHover: (0, _colorJs.applyAlpha)(e.white, 0.15),
+            buttonSecondaryBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.15),
             buttonSecondaryBorder: e.white,
             buttonSecondaryBorderSelected: e.white,
             buttonSecondaryBorderInverse: e.white,
             buttonSecondaryBorderInverseSelected: e.white,
-            buttonSecondaryBackgroundHover: (0, _colorJs.applyAlpha)(e.white, 0.15),
-            buttonSecondaryBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.15),
             buttonSecondaryBackgroundInverseHover: (0, _colorJs.applyAlpha)(e.white, 0.15),
             buttonSecondaryBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.15),
             textButtonPrimary: e.grey2,
@@ -202,32 +218,39 @@ const e = {
             textButtonSecondaryInverseSelected: e.grey2,
             textLink: e.movistarBlue,
             textLinkInverse: e.movistarBlue,
+            textLinkDanger: e.pepper,
+            textLinkSnackbar: e.movistarBlue30,
             control: e.grey6,
             controlActivated: e.movistarBlue,
+            controlError: e.pepper,
             loadingBar: e.movistarBlue,
-            loadingBarBackground: (0, _colorJs.applyAlpha)(e.white, 0.05),
+            loadingBarBackground: e.darkModeGrey,
             toggleAndroidInactive: e.grey4,
             toggleAndroidBackgroundActive: e.movistarBlue20,
             iosControlKnob: e.grey2,
             divider: (0, _colorJs.applyAlpha)(e.white, 0.05),
             dividerInverse: (0, _colorJs.applyAlpha)(e.white, 0.05),
             navigationBarDivider: e.darkModeBlack,
-            brandHigh: e.grey6,
+            badge: e.pepper55,
+            feedbackErrorBackground: e.pepper,
+            feedbackInfoBackground: e.grey6,
+            brand: e.movistarBlue,
+            brandHigh: (0, _colorJs.applyAlpha)(e.white, 0.05),
             inverse: e.grey2,
             neutralHigh: e.grey2,
             neutralMedium: e.grey5,
+            neutralMediumInverse: e.grey5,
             neutralLow: e.grey6,
             neutralLowAlternative: e.grey6,
             textPrimary: e.grey2,
             textPrimaryInverse: e.grey2,
             textSecondary: e.grey4,
             textSecondaryInverse: e.grey4,
-            textNavigationBarPrimary: e.grey2,
-            textNavigationBarSecondary: e.grey4,
-            textNavigationSearchBarHint: e.grey4,
-            textNavigationSearchBarText: e.grey2,
-            textAppBar: e.grey5,
-            textAppBarSelected: e.grey2,
+            success: e.movistarGreen,
+            warning: e.egg,
+            error: e.pepper,
+            promo: e.purple,
+            highlight: e.pink,
             successLow: e.grey6,
             warningLow: e.grey6,
             errorLow: e.grey6,
@@ -241,9 +264,30 @@ const e = {
             warningHighInverse: e.egg80,
             errorHighInverse: e.pepper70,
             promoHighInverse: e.purple70,
-            neutralMediumInverse: e.grey5
+            textNavigationBarPrimary: e.grey2,
+            textNavigationBarSecondary: e.grey4,
+            textNavigationSearchBarHint: e.grey4,
+            textNavigationSearchBarText: e.grey2,
+            textAppBar: e.grey5,
+            textAppBarSelected: e.grey2,
+            customTabsBackground: e.darkModeBlack
+        },
+        borderRadii: {
+            avatar: "50%",
+            bar: "999px",
+            button: "4px",
+            checkbox: "2px",
+            container: "8px",
+            indicator: "999px",
+            input: "8px",
+            legacyDisplay: "16px",
+            popup: "8px",
+            sheet: "8px"
         },
         textPresets: {
+            cardTitle: {
+                weight: "bold"
+            },
             text5: {
                 weight: "bold"
             },
@@ -264,5 +308,5 @@ const e = {
             }
         }
     };
-    return o === "prominent" && (t.colors.brand = e.movistarProminentBlue, t.colors.brandHigh = e.movistarProminentBlueDark, t.colors.backgroundBrand = e.movistarProminentBlue, t.colors.navigationBarBackground = e.movistarProminentBlue, t.colors.backgroundFeedbackBottom = e.movistarProminentBlue, t.colors.controlActivated = e.movistarProminentBlue, t.colors.dividerInverse = e.movistarProminentBlueDark), t;
+    return t === "prominent" && (o.colors.brand = e.movistarProminentBlue, o.colors.brandHigh = e.movistarProminentBlueDark, o.colors.backgroundBrand = e.movistarProminentBlue, o.colors.navigationBarBackground = e.movistarProminentBlue, o.colors.backgroundFeedbackBottom = e.movistarProminentBlue, o.colors.controlActivated = e.movistarProminentBlue, o.colors.dividerInverse = e.movistarProminentBlueDark), o;
 };

package/dist/skins/movistar.d.ts

@@ -1,51 +1,45 @@
 import type { GetKnownSkin } from './types';
 export declare const palette: {
-    readonly movistarBlue: "#019DF4";
-    readonly movistarBlue10: "#E6F5FD";
-    readonly movistarBlue20: "#B3E1FB";
-    readonly movistarBlue30: "#80CEF9";
-    readonly movistarBlue40: "#4DBAF7";
-    readonly movistarBlue55: "#008EDD";
-    readonly movistarBlueDark: "#0B2739";
-    readonly movistarGreen: "#5CB615";
-    readonly movistarGreen10: "#EFF8E8";
-    readonly movistarGreen30: "#ADDA8A";
-    readonly movistarGreen40: "#8DCC5B";
-    readonly movistarGreen60: "#499110";
-    readonly movistarGreen70: "#407F0F";
-    readonly pepper: "#FF374A";
-    readonly pepper10: "#FFEBED";
-    readonly pepper20: "#FFC3C8";
-    readonly pepper40: "#FF7380";
-    readonly pepper55: "#D73241";
-    readonly pepper70: "#B22634";
-    readonly egg: "#F28D15";
-    readonly egg10: "#FEF4E8";
-    readonly egg40: "#F6AF5B";
-    readonly egg80: "#6D3F09";
-    readonly pink: "#E63780";
-    readonly purple: "#A13EA1";
-    readonly purple10: "#F6ECF6";
-    readonly purple40: "#BD78BD";
-    readonly purple70: "#712B71";
-    readonly grey1: "#F6F6F6";
-    readonly grey2: "#EEEEEE";
-    readonly grey3: "#DDDDDD";
-    readonly grey4: "#999999";
-    readonly grey5: "#86888C";
-    readonly grey6: "#313235";
-    readonly white: "#FFFFFF";
-    readonly movistarProminentBlue: "#0B2739";
-    readonly movistarProminentBlueDark: "#081F2D";
-    readonly movistarProminentBlueLight20: "#CED3D7";
-    readonly movistarProminentBlueLight50: "#85939C";
-    readonly movistarProminentBlueLight70: "#546874";
-    readonly darkModeBlack: "#061824";
-    readonly darkModeGrey: "#081F2E";
-    readonly darkModeGrey2: "#EAEBEE";
-    readonly darkModeGrey3: "#CED4D7";
-    readonly darkModeGrey4: "#85939C";
-    readonly darkModeGrey5: "#6D7D88";
-    readonly darkModeGrey6: "#3C5261";
+    movistarBlue: string;
+    movistarBlue10: string;
+    movistarBlue20: string;
+    movistarBlue30: string;
+    movistarBlue40: string;
+    movistarBlue55: string;
+    movistarGreen: string;
+    movistarGreen10: string;
+    movistarGreen30: string;
+    movistarGreen40: string;
+    movistarGreen60: string;
+    movistarGreen70: string;
+    pepper: string;
+    pepper10: string;
+    pepper40: string;
+    pepper55: string;
+    pepper70: string;
+    egg: string;
+    egg10: string;
+    egg40: string;
+    egg80: string;
+    pink: string;
+    purple: string;
+    purple10: string;
+    purple40: string;
+    purple70: string;
+    grey1: string;
+    grey2: string;
+    grey3: string;
+    grey4: string;
+    grey5: string;
+    grey6: string;
+    white: string;
+    movistarBlueDark: string;
+    darkModeBlack: string;
+    darkModeGrey: string;
+    darkModeGrey2: string;
+    darkModeGrey3: string;
+    darkModeGrey4: string;
+    darkModeGrey5: string;
+    darkModeGrey6: string;
 };
 export declare const getMovistarSkin: GetKnownSkin;

package/dist/skins/movistar.js

@@ -12,8 +12,8 @@ _export(exports, {
     getMovistarSkin: ()=>d,
     palette: ()=>e
 });
-const _colorJs = require("../utils/color.js");
 const _constantsJs = require("./constants.js");
+const _colorJs = require("../utils/color.js");
 const e = {
     movistarBlue: "#019DF4",
     movistarBlue10: "#E6F5FD",
@@ -21,7 +21,6 @@ const e = {
     movistarBlue30: "#80CEF9",
     movistarBlue40: "#4DBAF7",
     movistarBlue55: "#008EDD",
-    movistarBlueDark: "#0B2739",
     movistarGreen: "#5CB615",
     movistarGreen10: "#EFF8E8",
     movistarGreen30: "#ADDA8A",
@@ -30,7 +29,6 @@ const e = {
     movistarGreen70: "#407F0F",
     pepper: "#FF374A",
     pepper10: "#FFEBED",
-    pepper20: "#FFC3C8",
     pepper40: "#FF7380",
     pepper55: "#D73241",
     pepper70: "#B22634",
@@ -50,11 +48,7 @@ const e = {
     grey5: "#86888C",
     grey6: "#313235",
     white: "#FFFFFF",
-    movistarProminentBlue: "#0B2739",
-    movistarProminentBlueDark: "#081F2D",
-    movistarProminentBlueLight20: "#CED3D7",
-    movistarProminentBlueLight50: "#85939C",
-    movistarProminentBlueLight70: "#546874",
+    movistarBlueDark: "#0B2739",
     darkModeBlack: "#061824",
     darkModeGrey: "#081F2E",
     darkModeGrey2: "#EAEBEE",
@@ -65,25 +59,31 @@ const e = {
 }, d = ()=>({
         name: _constantsJs.MOVISTAR_SKIN,
         colors: {
-            appBarBackground: e.white,
             background: e.white,
+            backgroundAlternative: e.grey1,
+            backgroundBrand: e.movistarBlue,
+            backgroundBrandSecondary: e.movistarBlueDark,
             backgroundContainer: e.white,
+            backgroundContainerHover: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.03),
+            backgroundContainerPressed: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.05),
             backgroundContainerBrand: e.movistarBlue,
+            backgroundContainerBrandHover: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.1),
+            backgroundContainerBrandPressed: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.2),
             backgroundContainerBrandOverInverse: e.movistarBlue55,
             backgroundContainerAlternative: e.grey1,
-            backgroundBrand: e.movistarBlue,
-            backgroundBrandSecondary: e.movistarBlueDark,
             backgroundOverlay: (0, _colorJs.applyAlpha)(e.movistarBlueDark, 0.6),
             backgroundSkeleton: e.grey2,
             backgroundSkeletonInverse: e.movistarBlue55,
-            navigationBarBackground: e.movistarBlue,
-            backgroundAlternative: e.grey1,
             backgroundFeedbackBottom: e.movistarBlue,
+            appBarBackground: e.white,
+            navigationBarBackground: e.movistarBlue,
             skeletonWave: e.grey2,
             borderLow: e.grey1,
             border: e.grey3,
             borderHigh: e.grey5,
             borderSelected: e.movistarBlue,
+            coverBackgroundHover: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.25),
+            coverBackgroundPressed: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.35),
             buttonDangerBackground: e.pepper,
             buttonDangerBackgroundSelected: e.pepper55,
             buttonDangerBackgroundHover: e.pepper55,
@@ -96,10 +96,10 @@ const e = {
             buttonPrimaryBackgroundInverseSelected: e.movistarBlue30,
             buttonSecondaryBorder: e.movistarBlue,
             buttonSecondaryBorderSelected: e.movistarBlue55,
-            buttonSecondaryBorderInverse: e.white,
-            buttonSecondaryBorderInverseSelected: e.white,
             buttonSecondaryBackgroundHover: e.movistarBlue10,
             buttonSecondaryBackgroundSelected: e.movistarBlue10,
+            buttonSecondaryBorderInverse: e.white,
+            buttonSecondaryBorderInverseSelected: e.white,
             buttonSecondaryBackgroundInverseHover: (0, _colorJs.applyAlpha)(e.white, 0.2),
             buttonSecondaryBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.2),
             textButtonPrimary: e.white,
@@ -122,7 +122,7 @@ const e = {
             toggleAndroidBackgroundActive: e.movistarBlue20,
             iosControlKnob: e.white,
             divider: e.grey2,
-            dividerInverse: e.movistarBlue55,
+            dividerInverse: (0, _colorJs.applyAlpha)(e.white, 0.2),
             navigationBarDivider: e.movistarBlue,
             badge: e.pepper55,
             feedbackErrorBackground: e.pepper,
@@ -132,23 +132,18 @@ const e = {
             inverse: e.white,
             neutralHigh: e.movistarBlueDark,
             neutralMedium: e.grey5,
+            neutralMediumInverse: e.grey5,
             neutralLow: e.grey1,
             neutralLowAlternative: e.grey2,
-            promo: e.purple,
-            highlight: e.pink,
             textPrimary: e.movistarBlueDark,
             textPrimaryInverse: e.white,
             textSecondary: e.grey5,
             textSecondaryInverse: e.movistarBlue10,
-            error: e.pepper,
             success: e.movistarGreen,
             warning: e.egg,
-            textNavigationBarPrimary: e.white,
-            textNavigationBarSecondary: e.movistarBlue20,
-            textNavigationSearchBarHint: e.movistarBlue20,
-            textNavigationSearchBarText: e.white,
-            textAppBar: e.grey4,
-            textAppBarSelected: e.movistarBlue,
+            error: e.pepper,
+            promo: e.purple,
+            highlight: e.pink,
             successLow: e.movistarGreen10,
             warningLow: e.egg10,
             errorLow: e.pepper10,
@@ -162,77 +157,100 @@ const e = {
             warningHighInverse: e.egg80,
             errorHighInverse: e.pepper70,
             promoHighInverse: e.purple70,
-            neutralMediumInverse: e.grey5
+            textNavigationBarPrimary: e.white,
+            textNavigationBarSecondary: e.movistarBlue20,
+            textNavigationSearchBarHint: e.movistarBlue20,
+            textNavigationSearchBarText: e.white,
+            textAppBar: e.grey4,
+            textAppBarSelected: e.movistarBlue,
+            customTabsBackground: e.movistarBlue
         },
         darkModeColors: {
-            appBarBackground: e.darkModeGrey,
             background: e.darkModeBlack,
+            backgroundAlternative: e.darkModeBlack,
+            backgroundBrand: e.darkModeBlack,
+            backgroundBrandSecondary: e.darkModeBlack,
             backgroundContainer: e.darkModeGrey,
+            backgroundContainerHover: (0, _colorJs.applyAlpha)(e.white, 0.03),
+            backgroundContainerPressed: (0, _colorJs.applyAlpha)(e.white, 0.05),
             backgroundContainerBrand: e.darkModeGrey,
+            backgroundContainerBrandHover: (0, _colorJs.applyAlpha)(e.white, 0.03),
+            backgroundContainerBrandPressed: (0, _colorJs.applyAlpha)(e.white, 0.05),
             backgroundContainerBrandOverInverse: e.darkModeGrey,
             backgroundContainerAlternative: e.darkModeGrey,
-            backgroundBrand: e.darkModeBlack,
-            backgroundBrandSecondary: e.darkModeBlack,
             backgroundOverlay: (0, _colorJs.applyAlpha)(e.darkModeGrey, 0.8),
             backgroundSkeleton: e.movistarBlueDark,
             backgroundSkeletonInverse: e.movistarBlueDark,
-            navigationBarBackground: e.darkModeBlack,
-            backgroundAlternative: e.darkModeBlack,
             backgroundFeedbackBottom: e.darkModeBlack,
+            appBarBackground: e.darkModeGrey,
+            navigationBarBackground: e.darkModeBlack,
             skeletonWave: e.darkModeGrey6,
-            borderHigh: e.darkModeGrey4,
             borderLow: e.darkModeBlack,
             border: e.darkModeGrey,
-            buttonLinkBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.05),
-            buttonLinkBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.05),
+            borderHigh: e.darkModeGrey4,
+            borderSelected: e.movistarBlue,
+            coverBackgroundHover: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.25),
+            coverBackgroundPressed: (0, _colorJs.applyAlpha)(e.darkModeBlack, 0.35),
+            buttonDangerBackground: e.pepper,
+            buttonDangerBackgroundSelected: e.pepper55,
+            buttonDangerBackgroundHover: e.pepper55,
+            buttonLinkBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.08),
+            buttonLinkBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.08),
             buttonPrimaryBackground: e.movistarBlue,
             buttonPrimaryBackgroundInverse: e.movistarBlue,
             buttonPrimaryBackgroundSelected: e.movistarBlue55,
             buttonPrimaryBackgroundHover: e.movistarBlue55,
             buttonPrimaryBackgroundInverseSelected: e.movistarBlue55,
+            buttonSecondaryBackgroundHover: (0, _colorJs.applyAlpha)(e.white, 0.15),
+            buttonSecondaryBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.15),
             buttonSecondaryBorder: e.white,
             buttonSecondaryBorderSelected: e.white,
             buttonSecondaryBorderInverse: e.white,
             buttonSecondaryBorderInverseSelected: e.white,
-            buttonSecondaryBackgroundHover: (0, _colorJs.applyAlpha)(e.white, 0.15),
-            buttonSecondaryBackgroundSelected: (0, _colorJs.applyAlpha)(e.white, 0.15),
             buttonSecondaryBackgroundInverseHover: (0, _colorJs.applyAlpha)(e.white, 0.15),
             buttonSecondaryBackgroundInverseSelected: (0, _colorJs.applyAlpha)(e.white, 0.15),
             textButtonPrimary: e.darkModeGrey2,
             textButtonPrimaryInverse: e.darkModeGrey2,
             textButtonPrimaryInverseSelected: e.darkModeGrey2,
             textButtonSecondary: e.darkModeGrey2,
-            textButtonSecondarySelected: e.darkModeGrey2,
+            textButtonSecondarySelected: e.darkModeGrey4,
             textButtonSecondaryInverse: e.darkModeGrey2,
-            textButtonSecondaryInverseSelected: e.darkModeGrey2,
+            textButtonSecondaryInverseSelected: e.darkModeGrey4,
             textLink: e.movistarBlue,
             textLinkInverse: e.movistarBlue,
+            textLinkDanger: e.pepper,
+            textLinkSnackbar: e.movistarBlue30,
             control: e.darkModeGrey6,
             controlActivated: e.movistarBlue,
+            controlError: e.pepper,
             loadingBar: e.movistarBlue,
-            loadingBarBackground: (0, _colorJs.applyAlpha)(e.white, 0.05),
+            loadingBarBackground: e.darkModeGrey6,
             toggleAndroidInactive: e.darkModeGrey4,
             toggleAndroidBackgroundActive: e.movistarBlue20,
             iosControlKnob: e.darkModeGrey2,
             divider: (0, _colorJs.applyAlpha)(e.white, 0.05),
             dividerInverse: (0, _colorJs.applyAlpha)(e.white, 0.05),
             navigationBarDivider: e.darkModeBlack,
-            brandHigh: e.darkModeGrey6,
+            badge: e.pepper55,
+            feedbackErrorBackground: e.pepper,
+            feedbackInfoBackground: e.movistarBlueDark,
+            brand: e.movistarBlue,
+            brandHigh: e.darkModeGrey,
             inverse: e.darkModeGrey2,
             neutralHigh: e.darkModeGrey2,
             neutralMedium: e.darkModeGrey5,
+            neutralMediumInverse: e.grey5,
             neutralLow: e.movistarBlueDark,
             neutralLowAlternative: e.movistarBlueDark,
             textPrimary: e.darkModeGrey2,
             textPrimaryInverse: e.darkModeGrey2,
             textSecondary: e.darkModeGrey4,
             textSecondaryInverse: e.darkModeGrey4,
-            textNavigationBarPrimary: e.darkModeGrey2,
-            textNavigationBarSecondary: e.darkModeGrey4,
-            textNavigationSearchBarHint: e.darkModeGrey4,
-            textNavigationSearchBarText: e.darkModeGrey2,
-            textAppBar: e.darkModeGrey5,
-            textAppBarSelected: e.darkModeGrey2,
+            success: e.movistarGreen,
+            warning: e.egg,
+            error: e.pepper,
+            promo: e.purple,
+            highlight: e.pink,
             successLow: e.movistarBlueDark,
             warningLow: e.movistarBlueDark,
             errorLow: e.movistarBlueDark,
@@ -246,9 +264,30 @@ const e = {
             warningHighInverse: e.egg80,
             errorHighInverse: e.pepper70,
             promoHighInverse: e.purple70,
-            neutralMediumInverse: e.grey5
+            textNavigationBarPrimary: e.darkModeGrey2,
+            textNavigationBarSecondary: e.darkModeGrey4,
+            textNavigationSearchBarHint: e.darkModeGrey4,
+            textNavigationSearchBarText: e.darkModeGrey2,
+            textAppBar: e.darkModeGrey5,
+            textAppBarSelected: e.darkModeGrey2,
+            customTabsBackground: e.darkModeBlack
+        },
+        borderRadii: {
+            avatar: "50%",
+            bar: "999px",
+            button: "4px",
+            checkbox: "2px",
+            container: "8px",
+            indicator: "999px",
+            input: "8px",
+            legacyDisplay: "16px",
+            popup: "8px",
+            sheet: "8px"
         },
         textPresets: {
+            cardTitle: {
+                weight: "bold"
+            },
             text5: {
                 weight: "bold"
             },
@@ -266,9 +305,6 @@ const e = {
             },
             text10: {
                 weight: "bold"
-            },
-            cardTitle: {
-                weight: "bold"
             }
         }
     });