@sage/design-tokens 5.2.0 → 6.0.0

package/js/es6/product/large/dark/components/status.d.ts

@@ -8,79 +8,103 @@
 
 /** transparent override used for hiding colors when needed. */
 export const statusColorNone: string;
-export const statusColorBgDefault: string;
-/** Pill (all types, readonly, when nested in disabled parent components) */
-export const statusColorBgReadonly: string;
-/** Pill (all types, readonly, when nested in disabled parent components) */
-export const statusColorBorderReadonly: string;
-/** Decorative message icons */
-export const statusColorIconDefault: string;
-export const statusColorLabelDefault: string;
-/** Pill (all types, readonly, when nested in disabled parent components) */
-export const statusColorLabelReadonly: string;
-export const statusColorLabelHover: string;
-export const statusColorLabelAltDefault: string;
-/** Pill (all types, readonly, when nested in disabled parent components) */
-export const statusColorLabelAltReadonly: string;
-export const statusColorLabelAltHover: string;
+export const statusColorMessageGlobalLabelDefault: string;
+export const statusColorMessageGlobalLabelHover: string;
+/** Global message bg */
+export const statusColorMessageGlobalCalloutBgDefault: string;
+/** global message bg hover */
+export const statusColorMessageGlobalCalloutBgHover: string;
+/** Icon on tinted bgs */
+export const statusColorMessageGlobalCalloutIcon: string;
+/** Global message bg */
+export const statusColorMessageGlobalInfoBgDefault: string;
+export const statusColorMessageGlobalInfoBgHover: string;
+/** Icon on tinted bgs */
+export const statusColorMessageGlobalInfoIcon: string;
+/** Global message bg */
+export const statusColorMessageGlobalWarningBgDefault: string;
+export const statusColorMessageGlobalWarningBgHover: string;
+/** Icon on tinted bgs */
+export const statusColorMessageGlobalWarningIcon: string;
+export const statusColorMessageContextualBg: string;
+/** decorative icon on standard contextual messages */
+export const statusColorMessageContextualIcon: string;
 /** Message text. */
-export const statusColorText: string;
-export const statusColorAiBgDefault: string;
-export const statusColorAiBorderDefault: string;
+export const statusColorMessageContextualText: string;
+export const statusColorMessageContextualAiBgDefault: string;
+export const statusColorMessageContextualAiBgAlt: string;
+export const statusColorMessageContextualAiBorderDefault: string;
 /** Subtle message bg */
-export const statusColorCalloutBgAlt: string;
-/** Global message bg */
-export const statusColorCalloutBgAltDefault: string;
+export const statusColorMessageContextualCalloutBgAlt: string;
+export const statusColorMessageContextualCalloutIcon: string;
+export const statusColorMessageContextualErrorBgDefault: string;
 /** Subtle message bg */
-export const statusColorCalloutBgAltHover: string;
-export const statusColorErrorBgDefault: string;
+export const statusColorMessageContextualErrorBgAlt: string;
+export const statusColorMessageContextualErrorBorderDefault: string;
+/** Icon on tinted bgs */
+export const statusColorMessageContextualErrorIcon: string;
+export const statusColorMessageContextualInfoBgDefault: string;
 /** Subtle message bg */
-export const statusColorErrorBgAlt: string;
-export const statusColorErrorBgAltHover: string;
-export const statusColorErrorBgHover: string;
-export const statusColorErrorBorderDefault: string;
+export const statusColorMessageContextualInfoBgAlt: string;
+export const statusColorMessageContextualInfoBorderDefault: string;
 /** Icon on tinted bgs */
-export const statusColorErrorIcon: string;
-export const statusColorInfoBgDefault: string;
+export const statusColorMessageContextualInfoIcon: string;
+export const statusColorMessageContextualSuccessBgDefault: string;
 /** Subtle message bg */
-export const statusColorInfoBgAlt: string;
-/** Global message bg */
-export const statusColorInfoBgAltDefault: string;
-export const statusColorInfoBgAltHover: string;
-export const statusColorInfoBgHover: string;
-export const statusColorInfoBorderDefault: string;
+export const statusColorMessageContextualSuccessBgAlt: string;
+export const statusColorMessageContextualSuccessBorderDefault: string;
 /** Icon on tinted bgs */
-export const statusColorInfoIcon: string;
-export const statusColorNeutralBgDefault: string;
+export const statusColorMessageContextualSuccessIcon: string;
+export const statusColorMessageContextualWarningBgDefault: string;
 /** Subtle message bg */
-export const statusColorNeutralBgAlt: string;
-export const statusColorNeutralBgAltHover: string;
-export const statusColorNeutralBgHover: string;
-export const statusColorNeutralBorderDefault: string;
+export const statusColorMessageContextualWarningBgAlt: string;
+export const statusColorMessageContextualWarningBorderDefault: string;
 /** Icon on tinted bgs */
-export const statusColorNeutralIcon: string;
+export const statusColorMessageContextualWarningIcon: string;
+export const statusColorPillLabelDefault: string;
+export const statusColorPillLabelHover: string;
+export const statusColorPillLabelAltDefault: string;
+export const statusColorPillLabelAltHover: string;
+export const statusColorPillErrorBgDefault: string;
+/** outline pill bg */
+export const statusColorPillErrorBgAltDefault: string;
+export const statusColorPillErrorBgAltHover: string;
+export const statusColorPillErrorBgHover: string;
+export const statusColorPillErrorBorderDefault: string;
+export const statusColorPillInfoBgDefault: string;
+/** outline pill bg */
+export const statusColorPillInfoBgAltDefault: string;
+export const statusColorPillInfoBgAltHover: string;
+export const statusColorPillInfoBgHover: string;
+export const statusColorPillInfoBorderDefault: string;
+export const statusColorPillNeutralBgDefault: string;
+/** outline pill bg */
+export const statusColorPillNeutralBgAltDefault: string;
+export const statusColorPillNeutralBgAltHover: string;
+export const statusColorPillNeutralBgHover: string;
+export const statusColorPillNeutralBorderDefault: string;
+export const statusColorPillSuccessBgDefault: string;
+/** outline pill bg */
+export const statusColorPillSuccessBgAltDefault: string;
+export const statusColorPillSuccessBgAltHover: string;
+export const statusColorPillSuccessBgHover: string;
+export const statusColorPillSuccessBorderDefault: string;
+export const statusColorPillWarningBgDefault: string;
+/** Global message bg */
+export const statusColorPillWarningBgAltDefault: string;
+export const statusColorPillWarningBgAltHover: string;
+export const statusColorPillWarningBgHover: string;
+export const statusColorPillWarningBorderDefault: string;
+/** Pill (all types, readonly, when nested in disabled parent components) */
+export const statusColorPillReadonlyBgDefault: string;
+/** Pill (all types, readonly, when nested in disabled parent components) */
+export const statusColorPillReadonlyBorderDefault: string;
+/** Pill (all types, readonly, when nested in disabled parent components) */
+export const statusColorPillReadonlyLabel: string;
 export const statusColorRatingBgDefault: string;
 export const statusColorRatingBgDefaultAlt: string;
 export const statusColorRatingBgHover: string;
 export const statusColorRatingBorderDefault: string;
-export const statusColorSuccessBgDefault: string;
-/** Subtle message bg */
-export const statusColorSuccessBgAlt: string;
-export const statusColorSuccessBgAltHover: string;
-export const statusColorSuccessBgHover: string;
-export const statusColorSuccessBorderDefault: string;
-/** Icon on tinted bgs */
-export const statusColorSuccessIcon: string;
-export const statusColorWarningBgDefault: string;
-/** Subtle message bg */
-export const statusColorWarningBgAlt: string;
-/** Global message bg */
-export const statusColorWarningBgAltDefault: string;
-export const statusColorWarningBgAltHover: string;
-export const statusColorWarningBgHover: string;
-export const statusColorWarningBorderDefault: string;
-/** Icon on tinted bgs */
-export const statusColorWarningIcon: string;
 /** Min height */
 export const statusSizePillS: number;
 /** Min height and removable button. */

package/js/es6/product/large/dark/components/status.js

@@ -7,59 +7,78 @@
  */
 
 export const statusColorNone = "#fff0"; // transparent override used for hiding colors when needed.
-export const statusColorBgDefault = "#000000";
-export const statusColorBgReadonly = "#4b4b4b"; // Pill (all types, readonly, when nested in disabled parent components)
-export const statusColorBorderReadonly = "#4b4b4b"; // Pill (all types, readonly, when nested in disabled parent components)
-export const statusColorIconDefault = "#000000"; // Decorative message icons
-export const statusColorLabelDefault = "#000000";
-export const statusColorLabelReadonly = "#000000"; // Pill (all types, readonly, when nested in disabled parent components)
-export const statusColorLabelHover = "#000000";
-export const statusColorLabelAltDefault = "#fffffff2";
-export const statusColorLabelAltReadonly = "#ffffffab"; // Pill (all types, readonly, when nested in disabled parent components)
-export const statusColorLabelAltHover = "#FFFFFF";
-export const statusColorText = "#FFFFFF"; // Message text.
-export const statusColorAiBgDefault = "#FFFFFF";
-export const statusColorAiBorderDefault = "#FFFFFF";
-export const statusColorCalloutBgAlt = "#122211"; // Subtle message bg
-export const statusColorCalloutBgAltDefault = "#122211"; // Global message bg
-export const statusColorCalloutBgAltHover = "#223121"; // Subtle message bg
-export const statusColorErrorBgDefault = "#E13E53";
-export const statusColorErrorBgAlt = "#241212"; // Subtle message bg
-export const statusColorErrorBgAltHover = "#332122";
-export const statusColorErrorBgHover = "#eb646c";
-export const statusColorErrorBorderDefault = "#E13E53";
-export const statusColorErrorIcon = "#E13E53"; // Icon on tinted bgs
-export const statusColorInfoBgDefault = "#007ED9";
-export const statusColorInfoBgAlt = "#111722"; // Subtle message bg
-export const statusColorInfoBgAltDefault = "#111722"; // Global message bg
-export const statusColorInfoBgAltHover = "#212631";
-export const statusColorInfoBgHover = "#5291e0";
-export const statusColorInfoBorderDefault = "#007ED9";
-export const statusColorInfoIcon = "#007ED9"; // Icon on tinted bgs
-export const statusColorNeutralBgDefault = "#7C7C7C";
-export const statusColorNeutralBgAlt = "#171717"; // Subtle message bg
-export const statusColorNeutralBgAltHover = "#262626";
-export const statusColorNeutralBgHover = "#909090";
-export const statusColorNeutralBorderDefault = "#7C7C7C";
-export const statusColorNeutralIcon = "#7C7C7C"; // Icon on tinted bgs
+export const statusColorMessageGlobalLabelDefault = "#fffffff2";
+export const statusColorMessageGlobalLabelHover = "#fffffff2";
+export const statusColorMessageGlobalCalloutBgDefault = "#122211"; // Global message bg
+export const statusColorMessageGlobalCalloutBgHover = "#223121"; // global message bg hover
+export const statusColorMessageGlobalCalloutIcon = "#fffffff2"; // Icon on tinted bgs
+export const statusColorMessageGlobalInfoBgDefault = "#111722"; // Global message bg
+export const statusColorMessageGlobalInfoBgHover = "#212631";
+export const statusColorMessageGlobalInfoIcon = "#007ED9"; // Icon on tinted bgs
+export const statusColorMessageGlobalWarningBgDefault = "#251206"; // Global message bg
+export const statusColorMessageGlobalWarningBgHover = "#34211a";
+export const statusColorMessageGlobalWarningIcon = "#E04500"; // Icon on tinted bgs
+export const statusColorMessageContextualBg = "#000000";
+export const statusColorMessageContextualIcon = "#000000"; // decorative icon on standard contextual messages
+export const statusColorMessageContextualText = "#FFFFFF"; // Message text.
+export const statusColorMessageContextualAiBgDefault = "#FFFFFF";
+export const statusColorMessageContextualAiBgAlt = "#171717";
+export const statusColorMessageContextualAiBorderDefault = "#FFFFFF";
+export const statusColorMessageContextualCalloutBgAlt = "#122211"; // Subtle message bg
+export const statusColorMessageContextualCalloutIcon = "#fffffff2";
+export const statusColorMessageContextualErrorBgDefault = "#E13E53";
+export const statusColorMessageContextualErrorBgAlt = "#241212"; // Subtle message bg
+export const statusColorMessageContextualErrorBorderDefault = "#E13E53";
+export const statusColorMessageContextualErrorIcon = "#E13E53"; // Icon on tinted bgs
+export const statusColorMessageContextualInfoBgDefault = "#007ED9";
+export const statusColorMessageContextualInfoBgAlt = "#111722"; // Subtle message bg
+export const statusColorMessageContextualInfoBorderDefault = "#007ED9";
+export const statusColorMessageContextualInfoIcon = "#007ED9"; // Icon on tinted bgs
+export const statusColorMessageContextualSuccessBgDefault = "#009023";
+export const statusColorMessageContextualSuccessBgAlt = "#0e1a0b"; // Subtle message bg
+export const statusColorMessageContextualSuccessBorderDefault = "#009023";
+export const statusColorMessageContextualSuccessIcon = "#009023"; // Icon on tinted bgs
+export const statusColorMessageContextualWarningBgDefault = "#E04500";
+export const statusColorMessageContextualWarningBgAlt = "#251206"; // Subtle message bg
+export const statusColorMessageContextualWarningBorderDefault = "#E04500";
+export const statusColorMessageContextualWarningIcon = "#E04500"; // Icon on tinted bgs
+export const statusColorPillLabelDefault = "#000000";
+export const statusColorPillLabelHover = "#000000";
+export const statusColorPillLabelAltDefault = "#fffffff2";
+export const statusColorPillLabelAltHover = "#fffffff2";
+export const statusColorPillErrorBgDefault = "#E13E53";
+export const statusColorPillErrorBgAltDefault = "#241212"; // outline pill bg
+export const statusColorPillErrorBgAltHover = "#332122";
+export const statusColorPillErrorBgHover = "#eb646c";
+export const statusColorPillErrorBorderDefault = "#E13E53";
+export const statusColorPillInfoBgDefault = "#007ED9";
+export const statusColorPillInfoBgAltDefault = "#111722"; // outline pill bg
+export const statusColorPillInfoBgAltHover = "#212631";
+export const statusColorPillInfoBgHover = "#5291e0";
+export const statusColorPillInfoBorderDefault = "#007ED9";
+export const statusColorPillNeutralBgDefault = "#7C7C7C";
+export const statusColorPillNeutralBgAltDefault = "#171717"; // outline pill bg
+export const statusColorPillNeutralBgAltHover = "#262626";
+export const statusColorPillNeutralBgHover = "#909090";
+export const statusColorPillNeutralBorderDefault = "#7C7C7C";
+export const statusColorPillSuccessBgDefault = "#009023";
+export const statusColorPillSuccessBgAltDefault = "#0e1a0b"; // outline pill bg
+export const statusColorPillSuccessBgAltHover = "#1e291d";
+export const statusColorPillSuccessBgHover = "#2e9936";
+export const statusColorPillSuccessBorderDefault = "#009023";
+export const statusColorPillWarningBgDefault = "#E04500";
+export const statusColorPillWarningBgAltDefault = "#251206"; // Global message bg
+export const statusColorPillWarningBgAltHover = "#34211a";
+export const statusColorPillWarningBgHover = "#eb6732";
+export const statusColorPillWarningBorderDefault = "#E04500";
+export const statusColorPillReadonlyBgDefault = "#4b4b4b"; // Pill (all types, readonly, when nested in disabled parent components)
+export const statusColorPillReadonlyBorderDefault = "#4b4b4b"; // Pill (all types, readonly, when nested in disabled parent components)
+export const statusColorPillReadonlyLabel = "#ffffffab"; // Pill (all types, readonly, when nested in disabled parent components)
 export const statusColorRatingBgDefault = "#00D639";
 export const statusColorRatingBgDefaultAlt =
   "linear-gradient(90deg, #00D639 0%, #00D639 50%, #282828 50%, #282828  100%)";
 export const statusColorRatingBgHover = "#18b032";
 export const statusColorRatingBorderDefault = "#00D639";
-export const statusColorSuccessBgDefault = "#009023";
-export const statusColorSuccessBgAlt = "#0e1a0b"; // Subtle message bg
-export const statusColorSuccessBgAltHover = "#1e291d";
-export const statusColorSuccessBgHover = "#2e9936";
-export const statusColorSuccessBorderDefault = "#009023";
-export const statusColorSuccessIcon = "#009023"; // Icon on tinted bgs
-export const statusColorWarningBgDefault = "#E04500";
-export const statusColorWarningBgAlt = "#251206"; // Subtle message bg
-export const statusColorWarningBgAltDefault = "#251206"; // Global message bg
-export const statusColorWarningBgAltHover = "#34211a";
-export const statusColorWarningBgHover = "#eb6732";
-export const statusColorWarningBorderDefault = "#E04500";
-export const statusColorWarningIcon = "#E04500"; // Icon on tinted bgs
 export const statusSizePillS = 20; // Min height
 export const statusSizePillM = 24; // Min height and removable button.
 export const statusSizePillL = 28; // Min height and removable button

package/js/es6/product/large/dark/mode.d.ts

@@ -12,12 +12,7 @@ export const modesColorBrandDefaultAlt: string;
 export const modesColorBrandWithDefaultAlt: string;
 export const modesColorBrandCopilotAiIdentifierDefault: string;
 export const modesColorBrandCopilotAiIdentifierWithDefault: string;
-export const modesColorBrandCopilotNoBgS: string;
-export const modesColorBrandCopilotNoBgStar: string;
-export const modesColorBrandCopilotNoBgMono: string;
-export const modesColorBrandCopilotWithBgS: string;
-export const modesColorBrandCopilotWithBgStar: string;
-export const modesColorBrandCopilotWithBgBg: string;
+export const modesColorBrandCopilotNoBgMonochrome: string;
 /** This is the color to replace in white label products. Dark mode recommended luminosity for SAGE is 75.1 (tested), but above 51.9 should be ok. See hsluv.org to be AAA text on 000000 bgs. */
 export const modesColorCustomDefault: string;
 /** Replace this color in white label products that use the FROZEN theme. Ensure luminousity of custom color = 46.8 (see hsluv.org). AAA against FFFFFF bg. */
@@ -163,12 +158,6 @@ export const modesColorInteractivePrimaryFrozenTableDefault: string;
 export const modesColorInteractiveProgressBg: string;
 export const modesColorInteractiveProgressBgAlt: string;
 export const modesColorInteractiveProgressFrozenBg: string;
-export const modesColorStatusAiDefault: string;
-/** bg for contextual message comp */
-export const modesColorStatusAiDefaultAlt: string;
-export const modesColorStatusAiDefaultHorizontal: string;
-export const modesColorStatusAiDefaultVertical: string;
-export const modesColorStatusGenericDefault: string;
 export const modesColorStatusCautionDefault: string;
 /** Subtle message bg */
 export const modesColorStatusCautionDefaultAlt: string;
@@ -178,7 +167,15 @@ export const modesColorStatusCautionHover: string;
 export const modesColorStatusCautionHoverAlt: string;
 export const modesColorStatusCautionText: string;
 /** Global message bg */
-export const modesColorStatusCautionFrozenDefault: string;
+export const modesColorStatusCautionFrozenglobalDefault: string;
+/** used on global message bg */
+export const modesColorStatusCautionFrozenglobalHover: string;
+export const modesColorStatusAiDefault: string;
+/** bg for contextual message comp */
+export const modesColorStatusAiDefaultAlt: string;
+export const modesColorStatusAiDefaultHorizontal: string;
+export const modesColorStatusAiDefaultVertical: string;
+export const modesColorStatusGenericDefault: string;
 export const modesColorStatusContentWithDefault: string;
 export const modesColorStatusContentWithDefaultAlt: string;
 export const modesColorStatusContentWithHover: string;
@@ -197,7 +194,9 @@ export const modesColorStatusInfoHover: string;
 /** used on pill hover states and message bg */
 export const modesColorStatusInfoHoverAlt: string;
 /** Global message bg */
-export const modesColorStatusInfoFrozenDefault: string;
+export const modesColorStatusInfoFrozenglobalDefault: string;
+/** used on global message bg */
+export const modesColorStatusInfoFrozenglobalHover: string;
 export const modesColorStatusNegativeDefault: string;
 /** Subtle message bg */
 export const modesColorStatusNegativeDefaultAlt: string;
@@ -206,7 +205,6 @@ export const modesColorStatusNegativeHover: string;
 /** used on pill hover states and message bg */
 export const modesColorStatusNegativeHoverAlt: string;
 export const modesColorStatusNegativeText: string;
-export const modesColorStatusNeutralAlt: string;
 export const modesColorStatusNeutralDefault: string;
 /** Subtle message bg */
 export const modesColorStatusNeutralDefaultAlt: string;
@@ -215,7 +213,11 @@ export const modesColorStatusNeutralHover: string;
 /** used on pill hover states and message bg */
 export const modesColorStatusNeutralHoverAlt: string;
 export const modesColorStatusNeutralFrozenDefault: string;
+/** Subtle message bg */
+export const modesColorStatusNeutralFrozenDefaultAlt: string;
 export const modesColorStatusNeutralFrozenHover: string;
+/** used on pill hover states and message bg */
+export const modesColorStatusNeutralFrozenHoverAlt: string;
 export const modesColorStatusPositiveDefault: string;
 /** Subtle message bg */
 export const modesColorStatusPositiveDefaultAlt: string;

package/js/es6/product/large/dark/mode.js

@@ -12,14 +12,7 @@ export const modesColorBrandDefaultAlt = "#FFFFFF";
 export const modesColorBrandWithDefaultAlt = "#000000";
 export const modesColorBrandCopilotAiIdentifierDefault = "#FFFFFF";
 export const modesColorBrandCopilotAiIdentifierWithDefault = "#00D639";
-export const modesColorBrandCopilotNoBgS =
-  "linear-gradient(191deg, #9D60FF 28.12%, #7C78F8 33.5%, #29B7E6 46.96%, #00D6DE 52.34%, #00D6DA 55.03%, #00D6D0 56.83%, #00D6C0 57.73%, #00D6A8 59.52%, #00D68A 60.42%, #00D665 62.21%, #00D639 63.11%)";
-export const modesColorBrandCopilotNoBgStar =
-  "radial-gradient(99.94% 104.1% at 8.01% 0.98%, #9D60FF 34%, #5A99F1 52%, #32B3E8 59%, #0DCCE0 68%, #00D6DE 72%, #00D6D7 74%, #00D6C6 77%, #00D6AA 81%, #00D682 84%, #00D650 88%, #00D639 90%)";
-export const modesColorBrandCopilotNoBgMono = "#FFFFFF";
-export const modesColorBrandCopilotWithBgS = "#000000";
-export const modesColorBrandCopilotWithBgStar = "#000000";
-export const modesColorBrandCopilotWithBgBg = "#FFFFFF";
+export const modesColorBrandCopilotNoBgMonochrome = "#FFFFFF";
 export const modesColorCustomDefault = "#00D639"; // This is the color to replace in white label products. Dark mode recommended luminosity for SAGE is 75.1 (tested), but above 51.9 should be ok. See hsluv.org to be AAA text on 000000 bgs.
 export const modesColorCustomFrozen = "#00D639"; // Replace this color in white label products that use the FROZEN theme. Ensure luminousity of custom color = 46.8 (see hsluv.org). AAA against FFFFFF bg.
 export const modesColorGenericBgNought = "#000000";
@@ -125,6 +118,13 @@ export const modesColorInteractivePrimaryFrozenTableDefault = "#18232a";
 export const modesColorInteractiveProgressBg = "#ffffff14";
 export const modesColorInteractiveProgressBgAlt = "#00000014";
 export const modesColorInteractiveProgressFrozenBg = "#ffffff14";
+export const modesColorStatusCautionDefault = "#E04500";
+export const modesColorStatusCautionDefaultAlt = "#251206"; // Subtle message bg
+export const modesColorStatusCautionHover = "#eb6732"; // used on pill hover states
+export const modesColorStatusCautionHoverAlt = "#34211a"; // used on pill hover states and message bg
+export const modesColorStatusCautionText = "#e75b23";
+export const modesColorStatusCautionFrozenglobalDefault = "#E04500"; // Global message bg
+export const modesColorStatusCautionFrozenglobalHover = "#eb6732"; // used on global message bg
 export const modesColorStatusAiDefault = "#000000";
 export const modesColorStatusAiDefaultAlt = "#FFFFFF"; // bg for contextual message comp
 export const modesColorStatusAiDefaultHorizontal =
@@ -132,12 +132,6 @@ export const modesColorStatusAiDefaultHorizontal =
 export const modesColorStatusAiDefaultVertical =
   "linear-gradient(180deg, #00D639 0%, #00D6DE 40%, #9D60FF 90%)";
 export const modesColorStatusGenericDefault = "#008a89";
-export const modesColorStatusCautionDefault = "#E04500";
-export const modesColorStatusCautionDefaultAlt = "#251206"; // Subtle message bg
-export const modesColorStatusCautionHover = "#eb6732"; // used on pill hover states
-export const modesColorStatusCautionHoverAlt = "#34211a"; // used on pill hover states and message bg
-export const modesColorStatusCautionText = "#e75b23";
-export const modesColorStatusCautionFrozenDefault = "#251206"; // Global message bg
 export const modesColorStatusContentWithDefault = "#000000";
 export const modesColorStatusContentWithDefaultAlt = "#fffffff2";
 export const modesColorStatusContentWithHover = "#000000";
@@ -150,19 +144,21 @@ export const modesColorStatusInfoDefault = "#007ED9";
 export const modesColorStatusInfoDefaultAlt = "#111722"; // Subtle message bg
 export const modesColorStatusInfoHover = "#5291e0"; // used on pill hover states
 export const modesColorStatusInfoHoverAlt = "#212631"; // used on pill hover states and message bg
-export const modesColorStatusInfoFrozenDefault = "#111722"; // Global message bg
+export const modesColorStatusInfoFrozenglobalDefault = "#007ED9"; // Global message bg
+export const modesColorStatusInfoFrozenglobalHover = "#5291e0"; // used on global message bg
 export const modesColorStatusNegativeDefault = "#E13E53";
 export const modesColorStatusNegativeDefaultAlt = "#241212"; // Subtle message bg
 export const modesColorStatusNegativeHover = "#eb646c"; // used on pill hover states
 export const modesColorStatusNegativeHoverAlt = "#332122"; // used on pill hover states and message bg
 export const modesColorStatusNegativeText = "#E13E53";
-export const modesColorStatusNeutralAlt = "#7C7C7C";
 export const modesColorStatusNeutralDefault = "#7C7C7C";
 export const modesColorStatusNeutralDefaultAlt = "#171717"; // Subtle message bg
 export const modesColorStatusNeutralHover = "#909090"; // used on pill hover states
 export const modesColorStatusNeutralHoverAlt = "#262626"; // used on pill hover states and message bg
 export const modesColorStatusNeutralFrozenDefault = "#9e9e9e";
+export const modesColorStatusNeutralFrozenDefaultAlt = "#171717"; // Subtle message bg
 export const modesColorStatusNeutralFrozenHover = "#909090";
+export const modesColorStatusNeutralFrozenHoverAlt = "#262626"; // used on pill hover states and message bg
 export const modesColorStatusPositiveDefault = "#009023";
 export const modesColorStatusPositiveDefaultAlt = "#0e1a0b"; // Subtle message bg
 export const modesColorStatusPositiveHover = "#2e9936"; // used on pill hover states

package/js/es6/product/large/light/components/logo.d.ts

@@ -12,12 +12,7 @@ export const logoColorSageBgAlt: string;
 /** filled */
 export const logoColorTrustBgDefault: string;
 export const logoColorTrustOutline: string;
-export const logoColorCopilotNoBgBgS: string;
-export const logoColorCopilotNoBgBgStar: string;
 export const logoColorCopilotNoBgFgDefault: string;
-export const logoColorCopilotWithBgBgS: string;
-export const logoColorCopilotWithBgBgStar: string;
-export const logoColorCopilotWithBgBgDefault: string;
 /** star bg color */
 export const logoColorAiIdentifierBgStar: string;
 export const logoColorAiIdentifierBgDot: string;

package/js/es6/product/large/light/components/logo.js

@@ -10,14 +10,7 @@ export const logoColorSageBgDefault = "#000000"; // sage logo
 export const logoColorSageBgAlt = "#000000";
 export const logoColorTrustBgDefault = "#008A21"; // filled
 export const logoColorTrustOutline = "#000000";
-export const logoColorCopilotNoBgBgS = "#000000";
-export const logoColorCopilotNoBgBgStar = "#000000";
 export const logoColorCopilotNoBgFgDefault = "#000000";
-export const logoColorCopilotWithBgBgS =
-  "linear-gradient(191deg, #9D60FF 28.12%, #7C78F8 33.5%, #29B7E6 46.96%, #00D6DE 52.34%, #00D6DA 55.03%, #00D6D0 56.83%, #00D6C0 57.73%, #00D6A8 59.52%, #00D68A 60.42%, #00D665 62.21%, #00D639 63.11%)";
-export const logoColorCopilotWithBgBgStar =
-  "radial-gradient(99.94% 104.1% at 8.01% 0.98%, #9D60FF 34%, #5A99F1 52%, #32B3E8 59%, #0DCCE0 68%, #00D6DE 72%, #00D6D7 74%, #00D6C6 77%, #00D6AA 81%, #00D682 84%, #00D650 88%, #00D639 90%)";
-export const logoColorCopilotWithBgBgDefault = "#000000";
 export const logoColorAiIdentifierBgStar = "#000000"; // star bg color
 export const logoColorAiIdentifierBgDot = "#00D639";
 export const logoColorAiIdentifierOutline = "#000000"; // star outline variant

package/js/es6/product/large/light/components/status.d.ts

@@ -8,79 +8,103 @@
 
 /** transparent override used for hiding colors when needed. */
 export const statusColorNone: string;
-export const statusColorBgDefault: string;
-/** Pill (all types, readonly, when nested in disabled parent components) */
-export const statusColorBgReadonly: string;
-/** Pill (all types, readonly, when nested in disabled parent components) */
-export const statusColorBorderReadonly: string;
-/** Decorative message icons */
-export const statusColorIconDefault: string;
-export const statusColorLabelDefault: string;
-/** Pill (all types, readonly, when nested in disabled parent components) */
-export const statusColorLabelReadonly: string;
-export const statusColorLabelHover: string;
-export const statusColorLabelAltDefault: string;
-/** Pill (all types, readonly, when nested in disabled parent components) */
-export const statusColorLabelAltReadonly: string;
-export const statusColorLabelAltHover: string;
+export const statusColorMessageGlobalLabelDefault: string;
+export const statusColorMessageGlobalLabelHover: string;
+/** Global message bg */
+export const statusColorMessageGlobalCalloutBgDefault: string;
+/** global message bg hover */
+export const statusColorMessageGlobalCalloutBgHover: string;
+/** Icon on tinted bgs */
+export const statusColorMessageGlobalCalloutIcon: string;
+/** Global message bg */
+export const statusColorMessageGlobalInfoBgDefault: string;
+export const statusColorMessageGlobalInfoBgHover: string;
+/** Icon on tinted bgs */
+export const statusColorMessageGlobalInfoIcon: string;
+/** Global message bg */
+export const statusColorMessageGlobalWarningBgDefault: string;
+export const statusColorMessageGlobalWarningBgHover: string;
+/** Icon on tinted bgs */
+export const statusColorMessageGlobalWarningIcon: string;
+export const statusColorMessageContextualBg: string;
+/** decorative icon on standard contextual messages */
+export const statusColorMessageContextualIcon: string;
 /** Message text. */
-export const statusColorText: string;
-export const statusColorAiBgDefault: string;
-export const statusColorAiBorderDefault: string;
+export const statusColorMessageContextualText: string;
+export const statusColorMessageContextualAiBgDefault: string;
+export const statusColorMessageContextualAiBgAlt: string;
+export const statusColorMessageContextualAiBorderDefault: string;
 /** Subtle message bg */
-export const statusColorCalloutBgAlt: string;
-/** Global message bg */
-export const statusColorCalloutBgAltDefault: string;
+export const statusColorMessageContextualCalloutBgAlt: string;
+export const statusColorMessageContextualCalloutIcon: string;
+export const statusColorMessageContextualErrorBgDefault: string;
 /** Subtle message bg */
-export const statusColorCalloutBgAltHover: string;
-export const statusColorErrorBgDefault: string;
+export const statusColorMessageContextualErrorBgAlt: string;
+export const statusColorMessageContextualErrorBorderDefault: string;
+/** Icon on tinted bgs */
+export const statusColorMessageContextualErrorIcon: string;
+export const statusColorMessageContextualInfoBgDefault: string;
 /** Subtle message bg */
-export const statusColorErrorBgAlt: string;
-export const statusColorErrorBgAltHover: string;
-export const statusColorErrorBgHover: string;
-export const statusColorErrorBorderDefault: string;
+export const statusColorMessageContextualInfoBgAlt: string;
+export const statusColorMessageContextualInfoBorderDefault: string;
 /** Icon on tinted bgs */
-export const statusColorErrorIcon: string;
-export const statusColorInfoBgDefault: string;
+export const statusColorMessageContextualInfoIcon: string;
+export const statusColorMessageContextualSuccessBgDefault: string;
 /** Subtle message bg */
-export const statusColorInfoBgAlt: string;
-/** Global message bg */
-export const statusColorInfoBgAltDefault: string;
-export const statusColorInfoBgAltHover: string;
-export const statusColorInfoBgHover: string;
-export const statusColorInfoBorderDefault: string;
+export const statusColorMessageContextualSuccessBgAlt: string;
+export const statusColorMessageContextualSuccessBorderDefault: string;
 /** Icon on tinted bgs */
-export const statusColorInfoIcon: string;
-export const statusColorNeutralBgDefault: string;
+export const statusColorMessageContextualSuccessIcon: string;
+export const statusColorMessageContextualWarningBgDefault: string;
 /** Subtle message bg */
-export const statusColorNeutralBgAlt: string;
-export const statusColorNeutralBgAltHover: string;
-export const statusColorNeutralBgHover: string;
-export const statusColorNeutralBorderDefault: string;
+export const statusColorMessageContextualWarningBgAlt: string;
+export const statusColorMessageContextualWarningBorderDefault: string;
 /** Icon on tinted bgs */
-export const statusColorNeutralIcon: string;
+export const statusColorMessageContextualWarningIcon: string;
+export const statusColorPillLabelDefault: string;
+export const statusColorPillLabelHover: string;
+export const statusColorPillLabelAltDefault: string;
+export const statusColorPillLabelAltHover: string;
+export const statusColorPillErrorBgDefault: string;
+/** outline pill bg */
+export const statusColorPillErrorBgAltDefault: string;
+export const statusColorPillErrorBgAltHover: string;
+export const statusColorPillErrorBgHover: string;
+export const statusColorPillErrorBorderDefault: string;
+export const statusColorPillInfoBgDefault: string;
+/** outline pill bg */
+export const statusColorPillInfoBgAltDefault: string;
+export const statusColorPillInfoBgAltHover: string;
+export const statusColorPillInfoBgHover: string;
+export const statusColorPillInfoBorderDefault: string;
+export const statusColorPillNeutralBgDefault: string;
+/** outline pill bg */
+export const statusColorPillNeutralBgAltDefault: string;
+export const statusColorPillNeutralBgAltHover: string;
+export const statusColorPillNeutralBgHover: string;
+export const statusColorPillNeutralBorderDefault: string;
+export const statusColorPillSuccessBgDefault: string;
+/** outline pill bg */
+export const statusColorPillSuccessBgAltDefault: string;
+export const statusColorPillSuccessBgAltHover: string;
+export const statusColorPillSuccessBgHover: string;
+export const statusColorPillSuccessBorderDefault: string;
+export const statusColorPillWarningBgDefault: string;
+/** Global message bg */
+export const statusColorPillWarningBgAltDefault: string;
+export const statusColorPillWarningBgAltHover: string;
+export const statusColorPillWarningBgHover: string;
+export const statusColorPillWarningBorderDefault: string;
+/** Pill (all types, readonly, when nested in disabled parent components) */
+export const statusColorPillReadonlyBgDefault: string;
+/** Pill (all types, readonly, when nested in disabled parent components) */
+export const statusColorPillReadonlyBorderDefault: string;
+/** Pill (all types, readonly, when nested in disabled parent components) */
+export const statusColorPillReadonlyLabel: string;
 export const statusColorRatingBgDefault: string;
 export const statusColorRatingBgDefaultAlt: string;
 export const statusColorRatingBgHover: string;
 export const statusColorRatingBorderDefault: string;
-export const statusColorSuccessBgDefault: string;
-/** Subtle message bg */
-export const statusColorSuccessBgAlt: string;
-export const statusColorSuccessBgAltHover: string;
-export const statusColorSuccessBgHover: string;
-export const statusColorSuccessBorderDefault: string;
-/** Icon on tinted bgs */
-export const statusColorSuccessIcon: string;
-export const statusColorWarningBgDefault: string;
-/** Subtle message bg */
-export const statusColorWarningBgAlt: string;
-/** Global message bg */
-export const statusColorWarningBgAltDefault: string;
-export const statusColorWarningBgAltHover: string;
-export const statusColorWarningBgHover: string;
-export const statusColorWarningBorderDefault: string;
-/** Icon on tinted bgs */
-export const statusColorWarningIcon: string;
 /** Min height */
 export const statusSizePillS: number;
 /** Min height and removable button. */