@telefonica/mistica 16.27.0 → 16.28.0

package/dist/skins/skin-contract.css.d.ts

@@ -62,6 +62,7 @@ export declare const vars: {
         textActivated: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textBrand: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         inputBorder: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        inputBorderInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         completedStep: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         completedStepInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         control: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -215,6 +216,7 @@ export declare const vars: {
         textActivated: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         textBrand: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         inputBorder: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        inputBorderInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         completedStep: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         completedStepInverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         control: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;

package/dist/skins/telefonica.d.ts

@@ -5,23 +5,33 @@ export declare const palette: {
     telefonicaBlue20: string;
     telefonicaBlue30: string;
     telefonicaBlue70: string;
+    telefonicaBlue80: string;
     ambar: string;
     ambar10: string;
     ambar40: string;
     ambar70: string;
+    yellow: string;
+    yellow15: string;
+    yellow40: string;
+    yellow70: string;
+    yellow80: string;
     coral: string;
     coral10: string;
-    coral40: string;
-    coral70: string;
+    coral30: string;
+    coral60: string;
+    coral65: string;
     coral80: string;
+    coral90: string;
     orchid: string;
     orchid10: string;
     orchid40: string;
     orchid70: string;
+    orchid80: string;
     turquoise: string;
     turquoise10: string;
     turquoise40: string;
     turquoise70: string;
+    turquoise80: string;
     grey1: string;
     grey2: string;
     grey3: string;
@@ -36,5 +46,6 @@ export declare const palette: {
     darkModeBlack: string;
     darkModeGrey: string;
     darkModeGrey6: string;
+    darkModeTelefonicaBlue: string;
 };
 export declare const getTelefonicaSkin: GetKnownSkin;

package/dist/skins/telefonica.js

@@ -24,27 +24,37 @@ const e = {
     telefonicaBlue20: "#B2D1FF",
     telefonicaBlue30: "#80B3FF",
     telefonicaBlue70: "#0356C9",
+    telefonicaBlue80: "#002E73",
     ambar: "#EAC344",
     ambar10: "#FDF9EC",
     ambar40: "#F0D57C",
     ambar70: "#69581F",
-    coral: "#E66C64",
-    coral10: "#FDF0EF",
-    coral40: "#E3A19A",
-    coral70: "#D50000",
-    coral80: "#912C31",
-    orchid: "#C466EF",
-    orchid10: "#F9F0FD",
-    orchid40: "#D694F4",
-    orchid70: "#8A1A93",
-    turquoise: "#59C2C9",
-    turquoise10: "#EEF9FA",
-    turquoise40: "#8BD4D9",
-    turquoise70: "#3E888D",
-    grey1: "#F2F4FF",
+    yellow: "#e4c35c",
+    yellow15: "#fcf7db",
+    yellow40: "#f3e996",
+    yellow70: "#a7863e",
+    yellow80: "#473515",
+    coral: "#d6786b",
+    coral10: "#f9eeed",
+    coral30: "#f2b1a5",
+    coral60: "#D22A1E",
+    coral65: "#C82C1E",
+    coral80: "#843c34",
+    coral90: "#491818",
+    orchid: "#b86be8",
+    orchid10: "#F8F0FD",
+    orchid40: "#CD97EF",
+    orchid70: "#7f258e",
+    orchid80: "#471551",
+    turquoise: "#75c0c7",
+    turquoise10: "#ebffff",
+    turquoise40: "#9ED3D8",
+    turquoise70: "#528889",
+    turquoise80: "#253d3c",
+    grey1: "#F7F7FF",
     grey2: "#D1D5E4",
     grey3: "#B0B6CA",
-    grey4: "#848CA4",
+    grey4: "#8f97af",
     grey5: "#6E7894",
     grey6: "#58617A",
     grey7: "#414B61",
@@ -52,9 +62,10 @@ const e = {
     grey9: "#031A34",
     white: "#FFFFFF",
     black: "#000000",
-    darkModeBlack: "#191919",
-    darkModeGrey: "#242424",
-    darkModeGrey6: "#313235"
+    darkModeBlack: "#000522",
+    darkModeGrey: "#00182F",
+    darkModeGrey6: "#00264D",
+    darkModeTelefonicaBlue: "#227AFF"
 }, i = ()=>({
         name: _constants.TELEFONICA_SKIN,
         colors: {
@@ -85,9 +96,9 @@ const e = {
             borderSelected: e.telefonicaBlue,
             coverBackgroundHover: (0, _color.applyAlpha)(e.darkModeBlack, 0.25),
             coverBackgroundPressed: (0, _color.applyAlpha)(e.darkModeBlack, 0.35),
-            buttonDangerBackground: e.coral,
-            buttonDangerBackgroundPressed: e.coral80,
-            buttonDangerBackgroundHover: e.coral80,
+            buttonDangerBackground: e.coral60,
+            buttonDangerBackgroundPressed: e.coral65,
+            buttonDangerBackgroundHover: e.coral65,
             buttonLinkDangerBackgroundPressed: e.coral10,
             buttonLinkDangerBackgroundInverse: e.white,
             buttonLinkDangerBackgroundInversePressed: e.coral10,
@@ -97,7 +108,7 @@ const e = {
             buttonPrimaryBackgroundInverse: e.white,
             buttonPrimaryBackgroundPressed: e.telefonicaBlue70,
             buttonPrimaryBackgroundHover: e.telefonicaBlue70,
-            buttonPrimaryBackgroundInversePressed: e.telefonicaBlue30,
+            buttonPrimaryBackgroundInversePressed: e.telefonicaBlue10,
             buttonSecondaryBorder: e.telefonicaBlue,
             buttonSecondaryBorderPressed: e.telefonicaBlue70,
             buttonSecondaryBackgroundHover: e.telefonicaBlue10,
@@ -108,25 +119,26 @@ const e = {
             buttonSecondaryBackgroundInversePressed: (0, _color.applyAlpha)(e.white, 0.1),
             textButtonPrimary: e.white,
             textButtonPrimaryInverse: e.telefonicaBlue,
-            textButtonPrimaryInversePressed: e.telefonicaBlue,
+            textButtonPrimaryInversePressed: e.telefonicaBlue70,
             textButtonSecondary: e.telefonicaBlue,
             textButtonSecondaryPressed: e.telefonicaBlue70,
             textButtonSecondaryInverse: e.white,
             textButtonSecondaryInversePressed: e.white,
             textLink: e.telefonicaBlue,
             textLinkInverse: e.white,
-            textLinkDanger: e.coral,
+            textLinkDanger: e.coral60,
             textLinkSnackbar: e.telefonicaBlue30,
-            textActivated: e.telefonicaBlue,
-            textBrand: e.telefonicaBlue,
-            inputBorder: e.grey4,
+            textActivated: e.telefonicaBlue70,
+            textBrand: e.telefonicaBlue70,
+            inputBorder: e.grey5,
+            inputBorderInverse: e.white,
             completedStep: e.telefonicaBlue,
             completedStepInverse: e.telefonicaBlue70,
-            control: e.grey3,
+            control: e.grey5,
             controlActivated: e.telefonicaBlue,
             controlInverse: e.grey1,
             controlActivatedInverse: e.white,
-            controlError: e.coral,
+            controlError: e.coral60,
             barTrack: e.grey2,
             barTrackInverse: (0, _color.applyAlpha)(e.white, 0.3),
             loadingBar: e.telefonicaBlue30,
@@ -138,8 +150,8 @@ const e = {
             divider: e.grey2,
             dividerInverse: (0, _color.applyAlpha)(e.white, 0.2),
             navigationBarDivider: e.telefonicaBlue,
-            badge: e.coral70,
-            feedbackErrorBackground: e.coral,
+            badge: e.coral60,
+            feedbackErrorBackground: e.coral60,
             feedbackInfoBackground: e.grey9,
             brand: e.telefonicaBlue,
             brandHigh: e.telefonicaBlue70,
@@ -152,61 +164,61 @@ const e = {
             textPrimary: e.grey9,
             textPrimaryInverse: e.white,
             textSecondary: e.grey6,
-            textSecondaryInverse: e.telefonicaBlue10,
-            error: e.coral,
-            textError: e.coral,
+            textSecondaryInverse: e.white,
+            error: e.coral60,
+            textError: e.coral60,
             textErrorInverse: e.white,
             success: e.turquoise,
-            warning: e.ambar,
+            warning: e.yellow70,
             promo: e.orchid,
-            highlight: e.coral40,
+            highlight: e.coral30,
             successLow: e.turquoise10,
-            warningLow: e.ambar10,
+            warningLow: e.yellow15,
             errorLow: e.coral10,
             promoLow: e.orchid10,
             brandLow: e.telefonicaBlue10,
             successHigh: e.turquoise70,
-            warningHigh: e.ambar70,
-            errorHigh: e.coral70,
+            warningHigh: e.yellow70,
+            errorHigh: e.coral65,
             promoHigh: e.orchid70,
             successHighInverse: e.turquoise70,
-            warningHighInverse: e.ambar70,
-            errorHighInverse: e.coral70,
+            warningHighInverse: e.yellow70,
+            errorHighInverse: e.coral65,
             promoHighInverse: e.orchid70,
             textNavigationBarPrimary: e.white,
             textNavigationBarSecondary: e.grey1,
             textNavigationSearchBarHint: e.grey1,
             textNavigationSearchBarText: e.white,
             textAppBar: e.grey4,
-            textAppBarSelected: e.telefonicaBlue,
-            customTabsBackground: e.telefonicaBlue,
-            tagTextPromo: e.orchid70,
-            tagTextActive: e.telefonicaBlue,
-            tagTextInactive: e.grey5,
-            tagTextInfo: e.telefonicaBlue,
-            tagTextSuccess: e.turquoise70,
-            tagTextWarning: e.ambar70,
-            tagTextError: e.coral70,
+            textAppBarSelected: e.telefonicaBlue70,
+            customTabsBackground: e.telefonicaBlue70,
+            tagTextPromo: e.orchid80,
+            tagTextActive: e.telefonicaBlue70,
+            tagTextInactive: e.grey6,
+            tagTextInfo: e.telefonicaBlue70,
+            tagTextSuccess: e.turquoise80,
+            tagTextWarning: e.yellow80,
+            tagTextError: e.coral65,
             tagBackgroundPromo: e.orchid10,
-            tagBackgroundActive: e.telefonicaBlue10,
+            tagBackgroundActive: e.grey1,
             tagBackgroundInactive: e.grey1,
             tagBackgroundInfo: e.telefonicaBlue10,
             tagBackgroundSuccess: e.turquoise10,
-            tagBackgroundWarning: e.ambar10,
+            tagBackgroundWarning: e.yellow15,
             tagBackgroundError: e.coral10,
-            tagTextPromoInverse: e.orchid70,
-            tagTextActiveInverse: e.telefonicaBlue,
-            tagTextInactiveInverse: e.grey5,
-            tagTextInfoInverse: e.telefonicaBlue,
-            tagTextSuccessInverse: e.turquoise70,
-            tagTextWarningInverse: e.ambar70,
-            tagTextErrorInverse: e.coral70,
+            tagTextPromoInverse: e.orchid80,
+            tagTextActiveInverse: e.telefonicaBlue70,
+            tagTextInactiveInverse: e.grey6,
+            tagTextInfoInverse: e.telefonicaBlue70,
+            tagTextSuccessInverse: e.turquoise80,
+            tagTextWarningInverse: e.yellow80,
+            tagTextErrorInverse: e.coral65,
             tagBackgroundPromoInverse: e.orchid10,
-            tagBackgroundActiveInverse: e.telefonicaBlue10,
+            tagBackgroundActiveInverse: e.grey1,
             tagBackgroundInactiveInverse: e.grey1,
             tagBackgroundInfoInverse: e.telefonicaBlue10,
             tagBackgroundSuccessInverse: e.turquoise10,
-            tagBackgroundWarningInverse: e.ambar10,
+            tagBackgroundWarningInverse: e.yellow15,
             tagBackgroundErrorInverse: e.coral10,
             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%)`
         },
@@ -217,40 +229,40 @@ const e = {
             backgroundBrandSecondary: e.darkModeBlack,
             backgroundContainer: e.darkModeGrey,
             backgroundContainerError: e.darkModeGrey,
-            backgroundContainerHover: (0, _color.applyAlpha)(e.white, 0.05),
-            backgroundContainerPressed: (0, _color.applyAlpha)(e.white, 0.08),
+            backgroundContainerHover: (0, _color.applyAlpha)(e.telefonicaBlue70, 0.05),
+            backgroundContainerPressed: (0, _color.applyAlpha)(e.telefonicaBlue70, 0.08),
             backgroundContainerBrand: e.darkModeGrey,
             backgroundContainerBrandHover: (0, _color.applyAlpha)(e.white, 0.03),
             backgroundContainerBrandPressed: (0, _color.applyAlpha)(e.white, 0.05),
             backgroundContainerBrandOverInverse: e.darkModeGrey,
             backgroundContainerAlternative: e.darkModeGrey,
             backgroundOverlay: (0, _color.applyAlpha)(e.darkModeGrey, 0.8),
-            backgroundSkeleton: e.grey6,
-            backgroundSkeletonInverse: e.grey6,
+            backgroundSkeleton: e.grey8,
+            backgroundSkeletonInverse: e.grey8,
             backgroundBrandTop: e.darkModeBlack,
             backgroundBrandBottom: e.darkModeBlack,
             appBarBackground: e.darkModeGrey,
             navigationBarBackground: e.darkModeBlack,
-            skeletonWave: e.grey5,
+            skeletonWave: e.grey8,
             borderLow: e.darkModeBlack,
             border: e.darkModeGrey,
             borderHigh: e.grey5,
-            borderSelected: e.telefonicaBlue,
+            borderSelected: e.darkModeTelefonicaBlue,
             coverBackgroundHover: (0, _color.applyAlpha)(e.darkModeBlack, 0.25),
             coverBackgroundPressed: (0, _color.applyAlpha)(e.darkModeBlack, 0.35),
-            buttonDangerBackground: e.coral,
-            buttonDangerBackgroundPressed: e.coral80,
-            buttonDangerBackgroundHover: e.coral80,
-            buttonLinkDangerBackgroundPressed: (0, _color.applyAlpha)(e.white, 0.08),
-            buttonLinkDangerBackgroundInverse: (0, _color.applyAlpha)(e.white, 0),
-            buttonLinkDangerBackgroundInversePressed: (0, _color.applyAlpha)(e.white, 0.08),
-            buttonLinkBackgroundPressed: (0, _color.applyAlpha)(e.white, 0.08),
-            buttonLinkBackgroundInversePressed: (0, _color.applyAlpha)(e.white, 0.08),
+            buttonDangerBackground: e.coral60,
+            buttonDangerBackgroundPressed: e.coral65,
+            buttonDangerBackgroundHover: e.coral65,
+            buttonLinkDangerBackgroundPressed: (0, _color.applyAlpha)(e.coral60, 0.16),
+            buttonLinkDangerBackgroundInverse: (0, _color.applyAlpha)(e.coral60, 0.16),
+            buttonLinkDangerBackgroundInversePressed: (0, _color.applyAlpha)(e.coral60, 0.16),
+            buttonLinkBackgroundPressed: (0, _color.applyAlpha)(e.telefonicaBlue30, 0.16),
+            buttonLinkBackgroundInversePressed: (0, _color.applyAlpha)(e.telefonicaBlue30, 0.16),
             buttonPrimaryBackground: e.telefonicaBlue,
-            buttonPrimaryBackgroundInverse: e.telefonicaBlue,
+            buttonPrimaryBackgroundInverse: e.white,
             buttonPrimaryBackgroundPressed: e.telefonicaBlue70,
             buttonPrimaryBackgroundHover: e.telefonicaBlue70,
-            buttonPrimaryBackgroundInversePressed: e.telefonicaBlue70,
+            buttonPrimaryBackgroundInversePressed: e.telefonicaBlue10,
             buttonSecondaryBackgroundPressed: (0, _color.applyAlpha)(e.white, 0.15),
             buttonSecondaryBorder: e.white,
             buttonSecondaryBackgroundHover: (0, _color.applyAlpha)(e.white, 0.15),
@@ -259,108 +271,109 @@ const e = {
             buttonSecondaryBorderInversePressed: e.white,
             buttonSecondaryBackgroundInverseHover: (0, _color.applyAlpha)(e.white, 0.15),
             buttonSecondaryBackgroundInversePressed: (0, _color.applyAlpha)(e.white, 0.15),
-            textButtonPrimary: e.grey2,
-            textButtonPrimaryInverse: e.grey2,
-            textButtonPrimaryInversePressed: e.grey2,
-            textButtonSecondary: e.grey2,
-            textButtonSecondaryPressed: e.grey2,
-            textButtonSecondaryInverse: e.grey2,
-            textButtonSecondaryInversePressed: e.grey2,
-            textLink: e.telefonicaBlue,
-            textLinkInverse: e.telefonicaBlue,
+            textButtonPrimary: e.white,
+            textButtonPrimaryInverse: e.telefonicaBlue,
+            textButtonPrimaryInversePressed: e.telefonicaBlue70,
+            textButtonSecondary: e.white,
+            textButtonSecondaryPressed: e.white,
+            textButtonSecondaryInverse: e.white,
+            textButtonSecondaryInversePressed: e.white,
+            textLink: e.darkModeTelefonicaBlue,
+            textLinkInverse: e.darkModeTelefonicaBlue,
             textLinkDanger: e.coral,
-            textLinkSnackbar: e.telefonicaBlue30,
-            textActivated: e.telefonicaBlue,
-            textBrand: e.telefonicaBlue,
+            textLinkSnackbar: e.darkModeTelefonicaBlue,
+            textActivated: e.telefonicaBlue30,
+            textBrand: e.telefonicaBlue30,
             inputBorder: e.grey5,
+            inputBorderInverse: e.grey5,
             completedStep: e.telefonicaBlue,
             completedStepInverse: e.telefonicaBlue,
-            control: e.darkModeGrey6,
-            controlActivated: e.telefonicaBlue,
-            controlInverse: e.darkModeGrey6,
-            controlActivatedInverse: e.telefonicaBlue,
+            control: e.grey5,
+            controlActivated: e.darkModeTelefonicaBlue,
+            controlInverse: e.grey5,
+            controlActivatedInverse: e.darkModeTelefonicaBlue,
             controlError: e.coral,
             barTrack: e.darkModeGrey6,
             barTrackInverse: e.darkModeGrey6,
-            loadingBar: e.telefonicaBlue,
+            loadingBar: e.darkModeTelefonicaBlue,
             loadingBarBackground: e.grey6,
-            toggleAndroidInactive: e.grey4,
+            toggleAndroidInactive: e.grey2,
             toggleAndroidBackgroundActive: e.telefonicaBlue20,
-            iosControlKnob: e.grey2,
-            controlKnobInverse: e.grey2,
-            divider: (0, _color.applyAlpha)(e.white, 0.05),
+            iosControlKnob: e.grey1,
+            controlKnobInverse: e.grey1,
+            divider: (0, _color.applyAlpha)(e.white, 0.2),
             dividerInverse: (0, _color.applyAlpha)(e.white, 0.05),
             navigationBarDivider: e.darkModeBlack,
-            badge: e.coral70,
-            feedbackErrorBackground: e.coral,
-            feedbackInfoBackground: e.grey8,
-            brand: e.telefonicaBlue,
+            badge: e.coral60,
+            feedbackErrorBackground: e.coral65,
+            feedbackInfoBackground: e.darkModeGrey,
+            brand: e.darkModeTelefonicaBlue,
             brandHigh: (0, _color.applyAlpha)(e.white, 0.05),
-            inverse: e.grey2,
+            inverse: e.grey1,
             neutralHigh: e.grey2,
             neutralMedium: e.grey5,
             neutralMediumInverse: e.grey5,
             neutralLow: e.darkModeGrey6,
             neutralLowAlternative: e.darkModeGrey6,
-            textPrimary: e.grey2,
-            textPrimaryInverse: e.grey2,
+            textPrimary: e.grey1,
+            textPrimaryInverse: e.grey1,
             textSecondary: e.grey3,
             textSecondaryInverse: e.grey3,
             error: e.coral,
             textError: e.coral,
             textErrorInverse: e.coral,
             success: e.turquoise,
-            warning: e.ambar,
+            warning: e.yellow,
             promo: e.orchid,
-            highlight: e.coral40,
+            highlight: e.coral30,
             successLow: e.darkModeGrey6,
             warningLow: e.darkModeGrey6,
             errorLow: e.darkModeGrey6,
             promoLow: e.darkModeGrey6,
             brandLow: e.darkModeGrey6,
             successHigh: e.turquoise40,
-            warningHigh: e.ambar40,
-            errorHigh: e.coral40,
+            warningHigh: e.yellow40,
+            errorHigh: e.coral30,
             promoHigh: e.orchid40,
             successHighInverse: e.turquoise70,
-            warningHighInverse: e.ambar70,
-            errorHighInverse: e.coral70,
+            warningHighInverse: e.yellow70,
+            errorHighInverse: e.coral65,
             promoHighInverse: e.orchid70,
-            textNavigationBarPrimary: e.grey2,
+            textNavigationBarPrimary: e.white,
             textNavigationBarSecondary: e.grey4,
             textNavigationSearchBarHint: e.grey4,
-            textNavigationSearchBarText: e.grey2,
-            textAppBar: e.grey5,
-            textAppBarSelected: e.grey2,
+            textNavigationSearchBarText: e.white,
+            textAppBar: e.grey2,
+            textAppBarSelected: e.white,
             customTabsBackground: e.darkModeBlack,
             tagTextPromo: e.orchid40,
-            tagTextActive: e.telefonicaBlue,
-            tagTextInactive: e.grey5,
-            tagTextInfo: e.telefonicaBlue,
+            tagTextActive: e.telefonicaBlue20,
+            tagTextInactive: e.grey3,
+            tagTextInfo: e.telefonicaBlue20,
             tagTextSuccess: e.turquoise40,
-            tagTextWarning: e.ambar40,
-            tagTextError: e.coral40,
-            tagBackgroundPromo: e.darkModeGrey6,
-            tagBackgroundActive: e.darkModeGrey6,
-            tagBackgroundInactive: e.darkModeGrey6,
-            tagBackgroundInfo: e.darkModeGrey6,
-            tagBackgroundSuccess: e.darkModeGrey6,
-            tagBackgroundWarning: e.darkModeGrey6,
-            tagBackgroundError: e.darkModeGrey6,
+            tagTextWarning: e.yellow40,
+            tagTextError: e.coral30,
+            tagBackgroundPromo: e.orchid80,
+            tagBackgroundActive: e.telefonicaBlue80,
+            tagBackgroundInactive: e.grey8,
+            tagBackgroundInfo: e.telefonicaBlue80,
+            tagBackgroundSuccess: e.turquoise80,
+            tagBackgroundWarning: e.yellow80,
+            tagBackgroundError: e.coral90,
             tagTextPromoInverse: e.orchid40,
-            tagTextActiveInverse: e.telefonicaBlue,
-            tagTextInactiveInverse: e.grey5,
-            tagTextInfoInverse: e.telefonicaBlue,
+            tagTextActiveInverse: e.telefonicaBlue20,
+            tagTextInactiveInverse: e.grey3,
+            tagTextInfoInverse: e.telefonicaBlue20,
             tagTextSuccessInverse: e.turquoise40,
-            tagTextWarningInverse: e.ambar40,
-            tagTextErrorInverse: e.coral40,
-            tagBackgroundPromoInverse: e.darkModeGrey6,
-            tagBackgroundActiveInverse: e.darkModeGrey6,
-            tagBackgroundInactiveInverse: e.darkModeGrey6,
-            tagBackgroundInfoInverse: e.darkModeGrey6,
-            tagBackgroundSuccessInverse: e.darkModeGrey6,
-            tagBackgroundWarningInverse: e.darkModeGrey6,
-            tagBackgroundErrorInverse: e.darkModeGrey6,
+            tagTextWarningInverse: e.yellow40,
+            tagTextErrorInverse: e.coral30,
+            tagBackgroundPromoInverse: e.orchid80,
+            tagBackgroundActiveInverse: e.telefonicaBlue80,
+            tagBackgroundInactiveInverse: e.grey8,
+            tagBackgroundInfoInverse: e.telefonicaBlue80,
+            tagBackgroundSuccessInverse: e.turquoise80,
+            tagBackgroundWarningInverse: e.yellow80,
+            tagBackgroundErrorInverse: e.coral90,
             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/skins/tu.js

@@ -124,6 +124,7 @@ const e = {
             textActivated: e.primary,
             textBrand: e.blue,
             inputBorder: e.grey5,
+            inputBorderInverse: e.white,
             completedStep: e.primary,
             completedStepInverse: e.primary80,
             control: e.grey5,
@@ -277,6 +278,7 @@ const e = {
             textActivated: e.blue30,
             textBrand: e.blue30,
             inputBorder: e.grey5,
+            inputBorderInverse: e.grey5,
             completedStep: e.grey2,
             completedStepInverse: e.grey2,
             control: e.darkModeGrey6,

package/dist/skins/types/colors.d.ts

@@ -61,6 +61,7 @@ export type Colors = {
     textActivated: string;
     textBrand: string;
     inputBorder: string;
+    inputBorderInverse: string;
     completedStep: string;
     completedStepInverse: string;
     control: string;

package/dist/skins/vivo-new.js

@@ -120,6 +120,7 @@ const e = {
             textActivated: e.vivoPurple,
             textBrand: e.vivoPurple,
             inputBorder: e.grey4,
+            inputBorderInverse: e.white,
             completedStep: e.vivoPurple,
             completedStepInverse: e.vivoPurpleDark,
             control: e.grey4,
@@ -273,6 +274,7 @@ const e = {
             textActivated: e.vivoPurpleLight80,
             textBrand: e.vivoPurpleLight80,
             inputBorder: e.darkModeGrey5,
+            inputBorderInverse: e.darkModeGrey5,
             completedStep: e.vivoPurpleLight80,
             completedStepInverse: e.vivoPurpleLight80,
             control: e.darkModeGrey6,

package/dist/skins/vivo.js

@@ -119,6 +119,7 @@ const e = {
             textActivated: e.vivoPurple,
             textBrand: e.vivoPurple,
             inputBorder: e.grey3,
+            inputBorderInverse: e.white,
             completedStep: e.vivoPurple,
             completedStepInverse: e.vivoPurpleDark,
             control: e.grey3,
@@ -272,6 +273,7 @@ const e = {
             textActivated: e.vivoPurpleLight80,
             textBrand: e.vivoPurpleLight80,
             inputBorder: e.darkModeGrey6,
+            inputBorderInverse: e.darkModeGrey6,
             completedStep: e.vivoPurpleLight80,
             completedStepInverse: e.vivoPurpleLight80,
             control: e.darkModeGrey6,

package/dist/slider.css-mistica.js

@@ -16,19 +16,19 @@ _export(exports, {
         return f;
     },
     disabled: function() {
-        return l;
+        return y;
     },
     input: function() {
-        return y;
+        return l;
     },
     iosThumb: function() {
-        return a;
+        return j;
     },
     thumbActive: function() {
         return r;
     },
     thumbContainer: function() {
-        return j;
+        return a;
     },
     thumbHover: function() {
         return e;
@@ -39,13 +39,13 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./slider.css.ts.vanilla.css-mistica.js");
-var n = "v16_27_1j1wlhk1 v16_27_1y2v1nfjd v16_27_1y2v1nfik v16_27_1y2v1nfiq v16_27_1y2v1nfj5 v16_27_1y2v1nflr", f = {
-    default: "v16_27_1j1wlhk7 v16_27_1y2v1nfjl v16_27_1y2v1nfk1 v16_27_1y2v1nfla v16_27_1y2v1nf5l",
-    inverse: "v16_27_1j1wlhk7 v16_27_1y2v1nfjl v16_27_1y2v1nfk1 v16_27_1y2v1nfla v16_27_1y2v1nf5n"
-}, l = "v16_27_1j1wlhk2", y = "v16_27_1j1wlhkj v16_27_1y2v1nfil v16_27_1y2v1nfly", a = "v16_27_1j1wlhkd v16_27_1y2v1nf5x v16_27_1y2v1nfla", r = {
-    default: "v16_27_1j1wlhkg",
-    inverse: "v16_27_1j1wlhkh"
-}, j = "v16_27_1j1wlhk5 v16_27_1y2v1nfil v16_27_1y2v1nfiq v16_27_1y2v1nfj5 v16_27_1y2v1nfiz", e = {
-    default: "v16_27_1j1wlhke",
-    inverse: "v16_27_1j1wlhkf"
-}, h = "v16_27_1y2v1nfjd v16_27_1y2v1nfjx v16_27_1y2v1nflo";
+var n = "v16_28_1j1wlhk1 v16_28_1y2v1nfjf v16_28_1y2v1nfim v16_28_1y2v1nfis v16_28_1y2v1nfj7 v16_28_1y2v1nflt", f = {
+    default: "v16_28_1j1wlhk7 v16_28_1y2v1nfjn v16_28_1y2v1nfk3 v16_28_1y2v1nflc v16_28_1y2v1nf5n",
+    inverse: "v16_28_1j1wlhk7 v16_28_1y2v1nfjn v16_28_1y2v1nfk3 v16_28_1y2v1nflc v16_28_1y2v1nf5p"
+}, y = "v16_28_1j1wlhk2", l = "v16_28_1j1wlhkj v16_28_1y2v1nfin v16_28_1y2v1nfm0", j = "v16_28_1j1wlhkd v16_28_1y2v1nf5z v16_28_1y2v1nflc", r = {
+    default: "v16_28_1j1wlhkg",
+    inverse: "v16_28_1j1wlhkh"
+}, a = "v16_28_1j1wlhk5 v16_28_1y2v1nfin v16_28_1y2v1nfis v16_28_1y2v1nfj7 v16_28_1y2v1nfj1", e = {
+    default: "v16_28_1j1wlhke",
+    inverse: "v16_28_1j1wlhkf"
+}, h = "v16_28_1y2v1nfjf v16_28_1y2v1nfjz v16_28_1y2v1nflq";