@sage/design-tokens 5.3.0 → 7.0.0

package/js/es6/product/small/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. */

package/js/es6/product/small/light/components/status.js

@@ -7,59 +7,78 @@
  */
 
 export const statusColorNone = "#fff0"; // transparent override used for hiding colors when needed.
-export const statusColorBgDefault = "#FFFFFF";
-export const statusColorBgReadonly = "#a6a6a6"; // Pill (all types, readonly, when nested in disabled parent components)
-export const statusColorBorderReadonly = "#a6a6a6"; // Pill (all types, readonly, when nested in disabled parent components)
-export const statusColorIconDefault = "#FFFFFF"; // Decorative message icons
-export const statusColorLabelDefault = "#FFFFFF";
-export const statusColorLabelReadonly = "#FFFFFF"; // Pill (all types, readonly, when nested in disabled parent components)
-export const statusColorLabelHover = "#FFFFFF";
-export const statusColorLabelAltDefault = "#000000f2";
-export const statusColorLabelAltReadonly = "#000000ab"; // Pill (all types, readonly, when nested in disabled parent components)
-export const statusColorLabelAltHover = "#000000";
-export const statusColorText = "#000000"; // Message text.
-export const statusColorAiBgDefault = "#000000";
-export const statusColorAiBorderDefault = "#000000";
-export const statusColorCalloutBgAlt = "#e5fae2"; // Subtle message bg
-export const statusColorCalloutBgAltDefault = "#e5fae2"; // Global message bg
-export const statusColorCalloutBgAltHover = "#d8ecd5"; // Subtle message bg
-export const statusColorErrorBgDefault = "#CD384B";
-export const statusColorErrorBgAlt = "#fdeceb"; // Subtle message bg
-export const statusColorErrorBgAltHover = "#efdfde";
-export const statusColorErrorBgHover = "#aa323f";
-export const statusColorErrorBorderDefault = "#CD384B";
-export const statusColorErrorIcon = "#CD384B"; // Icon on tinted bgs
-export const statusColorInfoBgDefault = "#0060A7";
-export const statusColorInfoBgAlt = "#eaeef6"; // Subtle message bg
-export const statusColorInfoBgAltDefault = "#eaeef6"; // Global message bg
-export const statusColorInfoBgAltHover = "#dde1e8";
-export const statusColorInfoBgHover = "#10508a";
-export const statusColorInfoBorderDefault = "#0060A7";
-export const statusColorInfoIcon = "#0060A7"; // Icon on tinted bgs
-export const statusColorNeutralBgDefault = "#656565";
-export const statusColorNeutralBgAlt = "#efefef"; // Subtle message bg
-export const statusColorNeutralBgAltHover = "#e2e2e2";
-export const statusColorNeutralBgHover = "#555";
-export const statusColorNeutralBorderDefault = "#656565";
-export const statusColorNeutralIcon = "#656565"; // Icon on tinted bgs
+export const statusColorMessageGlobalLabelDefault = "#000000f2";
+export const statusColorMessageGlobalLabelHover = "#000000";
+export const statusColorMessageGlobalCalloutBgDefault = "#e5fae2"; // Global message bg
+export const statusColorMessageGlobalCalloutBgHover = "#d8ecd5"; // global message bg hover
+export const statusColorMessageGlobalCalloutIcon = "#000000f2"; // Icon on tinted bgs
+export const statusColorMessageGlobalInfoBgDefault = "#eaeef6"; // Global message bg
+export const statusColorMessageGlobalInfoBgHover = "#dde1e8";
+export const statusColorMessageGlobalInfoIcon = "#0060A7"; // Icon on tinted bgs
+export const statusColorMessageGlobalWarningBgDefault = "#ffede5"; // Global message bg
+export const statusColorMessageGlobalWarningBgHover = "#f1e0d8";
+export const statusColorMessageGlobalWarningIcon = "#D64309"; // Icon on tinted bgs
+export const statusColorMessageContextualBg = "#FFFFFF";
+export const statusColorMessageContextualIcon = "#FFFFFF"; // decorative icon on standard contextual messages
+export const statusColorMessageContextualText = "#000000"; // Message text.
+export const statusColorMessageContextualAiBgDefault = "#000000";
+export const statusColorMessageContextualAiBgAlt = "#efefef";
+export const statusColorMessageContextualAiBorderDefault = "#000000";
+export const statusColorMessageContextualCalloutBgAlt = "#e5fae2"; // Subtle message bg
+export const statusColorMessageContextualCalloutIcon = "#000000f2";
+export const statusColorMessageContextualErrorBgDefault = "#CD384B";
+export const statusColorMessageContextualErrorBgAlt = "#fdeceb"; // Subtle message bg
+export const statusColorMessageContextualErrorBorderDefault = "#CD384B";
+export const statusColorMessageContextualErrorIcon = "#CD384B"; // Icon on tinted bgs
+export const statusColorMessageContextualInfoBgDefault = "#0060A7";
+export const statusColorMessageContextualInfoBgAlt = "#eaeef6"; // Subtle message bg
+export const statusColorMessageContextualInfoBorderDefault = "#0060A7";
+export const statusColorMessageContextualInfoIcon = "#0060A7"; // Icon on tinted bgs
+export const statusColorMessageContextualSuccessBgDefault = "#008A21";
+export const statusColorMessageContextualSuccessBgAlt = "#eaf3e8"; // Subtle message bg
+export const statusColorMessageContextualSuccessBorderDefault = "#008A21";
+export const statusColorMessageContextualSuccessIcon = "#008A21"; // Icon on tinted bgs
+export const statusColorMessageContextualWarningBgDefault = "#D64309";
+export const statusColorMessageContextualWarningBgAlt = "#ffede5"; // Subtle message bg
+export const statusColorMessageContextualWarningBorderDefault = "#D64309";
+export const statusColorMessageContextualWarningIcon = "#D64309"; // Icon on tinted bgs
+export const statusColorPillLabelDefault = "#FFFFFF";
+export const statusColorPillLabelHover = "#FFFFFF";
+export const statusColorPillLabelAltDefault = "#000000f2";
+export const statusColorPillLabelAltHover = "#000000f2";
+export const statusColorPillErrorBgDefault = "#CD384B";
+export const statusColorPillErrorBgAltDefault = "#fdeceb"; // outline pill bg
+export const statusColorPillErrorBgAltHover = "#efdfde";
+export const statusColorPillErrorBgHover = "#aa323f";
+export const statusColorPillErrorBorderDefault = "#CD384B";
+export const statusColorPillInfoBgDefault = "#0060A7";
+export const statusColorPillInfoBgAltDefault = "#eaeef6"; // outline pill bg
+export const statusColorPillInfoBgAltHover = "#dde1e8";
+export const statusColorPillInfoBgHover = "#10508a";
+export const statusColorPillInfoBorderDefault = "#0060A7";
+export const statusColorPillNeutralBgDefault = "#656565";
+export const statusColorPillNeutralBgAltDefault = "#efefef"; // outline pill bg
+export const statusColorPillNeutralBgAltHover = "#e2e2e2";
+export const statusColorPillNeutralBgHover = "#555";
+export const statusColorPillNeutralBorderDefault = "#656565";
+export const statusColorPillSuccessBgDefault = "#008A21";
+export const statusColorPillSuccessBgAltDefault = "#eaf3e8"; // outline pill bg
+export const statusColorPillSuccessBgAltHover = "#dde5db";
+export const statusColorPillSuccessBgHover = "#0f731e";
+export const statusColorPillSuccessBorderDefault = "#008A21";
+export const statusColorPillWarningBgDefault = "#D64309";
+export const statusColorPillWarningBgAltDefault = "#ffede5"; // Global message bg
+export const statusColorPillWarningBgAltHover = "#f1e0d8";
+export const statusColorPillWarningBgHover = "#b13a0d";
+export const statusColorPillWarningBorderDefault = "#D64309";
+export const statusColorPillReadonlyBgDefault = "#a6a6a6"; // Pill (all types, readonly, when nested in disabled parent components)
+export const statusColorPillReadonlyBorderDefault = "#a6a6a6"; // Pill (all types, readonly, when nested in disabled parent components)
+export const statusColorPillReadonlyLabel = "#000000ab"; // Pill (all types, readonly, when nested in disabled parent components)
 export const statusColorRatingBgDefault = "#00811F";
 export const statusColorRatingBgDefaultAlt =
   "linear-gradient(90deg, #00811F 0%, #00811F 50%, #d1d1d1 50%, #d1d1d1 100%)";
 export const statusColorRatingBgHover = "#0e6b1d";
 export const statusColorRatingBorderDefault = "#00811F";
-export const statusColorSuccessBgDefault = "#008A21";
-export const statusColorSuccessBgAlt = "#eaf3e8"; // Subtle message bg
-export const statusColorSuccessBgAltHover = "#dde5db";
-export const statusColorSuccessBgHover = "#0f731e";
-export const statusColorSuccessBorderDefault = "#008A21";
-export const statusColorSuccessIcon = "#008A21"; // Icon on tinted bgs
-export const statusColorWarningBgDefault = "#D64309";
-export const statusColorWarningBgAlt = "#ffede5"; // Subtle message bg
-export const statusColorWarningBgAltDefault = "#ffede5"; // Global message bg
-export const statusColorWarningBgAltHover = "#f1e0d8";
-export const statusColorWarningBgHover = "#b13a0d";
-export const statusColorWarningBorderDefault = "#D64309";
-export const statusColorWarningIcon = "#D64309"; // 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/small/light/components/table.d.ts

@@ -75,10 +75,6 @@ export const tableSpaceRowXgM: number;
 export const tableSpaceRowXgL: number;
 /** internal spacing between text, checkboxes, icons etc */
 export const tableSpaceRowXgXl: number;
-/** top and bottom adding inside pagination */
-export const tableSpaceRowYM: number;
-/** gap between table and pagination */
-export const tableSpaceRowYgM: number;
 /** Left padding inside XS child row cells */
 export const tableSpaceRowchildXXs: number;
 /** Left padding inside S child row cells */

package/js/es6/product/small/light/components/table.js

@@ -65,8 +65,6 @@ export const tableSpaceRowXgS = 8; // internal spacing between text, checkboxes,
 export const tableSpaceRowXgM = 8; // internal spacing between text, checkboxes, icons etc
 export const tableSpaceRowXgL = 8; // internal spacing between text, checkboxes, icons etc
 export const tableSpaceRowXgXl = 8; // internal spacing between text, checkboxes, icons etc
-export const tableSpaceRowYM = 8; // top and bottom adding inside pagination
-export const tableSpaceRowYgM = 8; // gap between table and pagination
 export const tableSpaceRowchildXXs = 29.6; // Left padding inside XS child row cells
 export const tableSpaceRowchildXS = 36; // Left padding inside S child row cells
 export const tableSpaceRowchildXM = 36; // Left padding inside M child row cells

package/js/es6/product/small/light/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. Ensure luminousity of custom color = 46.8 (see hsluv.org).  AAA against FFFFFF bg.  */
 export const modesColorCustomDefault: string;
 /** This is a derivative of Jade, and is the color to replace in white label products that use the FROZEN theme. Ensure luminousity of custom color = 46.8 (see hsluv.org). AAA against FFFFFF bg. */
@@ -185,9 +180,9 @@ export const modesColorStatusCautionHover: string;
 export const modesColorStatusCautionHoverAlt: string;
 export const modesColorStatusCautionText: string;
 /** used on global message bg */
-export const modesColorStatusCautionFrozenDefault: string;
-/** used on global message icon */
-export const modesColorStatusCautionFrozenIcon: string;
+export const modesColorStatusCautionFrozenglobalDefault: string;
+/** used on global message bg */
+export const modesColorStatusCautionFrozenglobalHover: string;
 export const modesColorStatusContentWithDefault: string;
 export const modesColorStatusContentWithDefaultAlt: string;
 /** for pill hover X */
@@ -209,7 +204,9 @@ export const modesColorStatusInfoHover: string;
 /** used on pill hover states and message bg */
 export const modesColorStatusInfoHoverAlt: string;
 /** used on global message bg */
-export const modesColorStatusInfoFrozenDefault: string;
+export const modesColorStatusInfoFrozenglobalDefault: string;
+/** used on global message bg */
+export const modesColorStatusInfoFrozenglobalHover: string;
 /** For pills and messages. Not accessible with white TEXT. */
 export const modesColorStatusNegativeDefault: string;
 /** Subtle message bg */
@@ -219,7 +216,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;
@@ -228,7 +224,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;
 /** For pills and messages. Not accessible with white TEXT. */
 export const modesColorStatusPositiveDefault: string;
 /** Subtle message bg */

package/js/es6/product/small/light/mode.js

@@ -12,14 +12,7 @@ export const modesColorBrandDefaultAlt = "#000000";
 export const modesColorBrandWithDefaultAlt = "#FFFFFF";
 export const modesColorBrandCopilotAiIdentifierDefault = "#000000";
 export const modesColorBrandCopilotAiIdentifierWithDefault = "#00D639";
-export const modesColorBrandCopilotNoBgS = "#000000";
-export const modesColorBrandCopilotNoBgStar = "#000000";
-export const modesColorBrandCopilotNoBgMono = "#000000";
-export const modesColorBrandCopilotWithBgS =
-  "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 modesColorBrandCopilotWithBgStar =
-  "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 modesColorBrandCopilotWithBgBg = "#000000";
+export const modesColorBrandCopilotNoBgMonochrome = "#000000";
 export const modesColorCustomDefault = "#00811F"; // This is the color to replace in white label products. Ensure luminousity of custom color = 46.8 (see hsluv.org).  AAA against FFFFFF bg.
 export const modesColorCustomFrozen = "#008046"; // This is a derivative of Jade, and is the color to replace 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 = "#FFFFFF";
@@ -137,8 +130,8 @@ export const modesColorStatusCautionDefaultAlt = "#ffede5"; // Subtle message bg
 export const modesColorStatusCautionHover = "#b13a0d"; // used on pill hover states
 export const modesColorStatusCautionHoverAlt = "#f1e0d8"; // used on pill hover states and message bg
 export const modesColorStatusCautionText = "#bf3e0c";
-export const modesColorStatusCautionFrozenDefault = "#FF8629"; // used on global message bg
-export const modesColorStatusCautionFrozenIcon = "#000000"; // used on global message icon
+export const modesColorStatusCautionFrozenglobalDefault = "#ff8629"; // used on global message bg
+export const modesColorStatusCautionFrozenglobalHover = "#ff9a4e"; // used on global message bg
 export const modesColorStatusContentWithDefault = "#FFFFFF";
 export const modesColorStatusContentWithDefaultAlt = "#000000f2";
 export const modesColorStatusContentWithHover = "#FFFFFF"; // for pill hover X
@@ -151,19 +144,21 @@ export const modesColorStatusInfoDefault = "#0060A7"; // For pills and messages.
 export const modesColorStatusInfoDefaultAlt = "#eaeef6"; // Subtle message bg
 export const modesColorStatusInfoHover = "#10508a"; // used on pill hover states
 export const modesColorStatusInfoHoverAlt = "#dde1e8"; // used on pill hover states and message bg
-export const modesColorStatusInfoFrozenDefault = "#65a9ff"; // used on global message bg
+export const modesColorStatusInfoFrozenglobalDefault = "#65a9ff"; // used on global message bg
+export const modesColorStatusInfoFrozenglobalHover = "#84b6ff"; // used on global message bg
 export const modesColorStatusNegativeDefault = "#CD384B"; // For pills and messages. Not accessible with white TEXT.
 export const modesColorStatusNegativeDefaultAlt = "#fdeceb"; // Subtle message bg
 export const modesColorStatusNegativeHover = "#aa323f"; // used on pill hover states
 export const modesColorStatusNegativeHoverAlt = "#efdfde"; // used on pill hover states and message bg
 export const modesColorStatusNegativeText = "#CD384B";
-export const modesColorStatusNeutralAlt = "#656565";
 export const modesColorStatusNeutralDefault = "#656565";
 export const modesColorStatusNeutralDefaultAlt = "#efefef"; // Subtle message bg
 export const modesColorStatusNeutralHover = "#555"; // used on pill hover states
 export const modesColorStatusNeutralHoverAlt = "#e2e2e2"; // used on pill hover states and message bg
 export const modesColorStatusNeutralFrozenDefault = "#335B70";
+export const modesColorStatusNeutralFrozenDefaultAlt = "#eaedf0"; // Subtle message bg
 export const modesColorStatusNeutralFrozenHover = "#20313b";
+export const modesColorStatusNeutralFrozenHoverAlt = "#dde0e2"; // used on pill hover states and message bg
 export const modesColorStatusPositiveDefault = "#008A21"; // For pills and messages. Not accessible with white TEXT.
 export const modesColorStatusPositiveDefaultAlt = "#eaf3e8"; // Subtle message bg
 export const modesColorStatusPositiveHover = "#0f731e"; // used on pill hover states

package/js/umd/frozenproduct/large/dark/components/container.js

@@ -5801,7 +5801,7 @@
               filePath: "data/tokens/components/container.json",
               isSource: true,
               original: {
-                value: "{global.space.micro.L}",
+                value: "{global.space.macro.XXXS}",
                 type: "spacing",
                 description: "gap between elements in pagination",
               },
@@ -5813,7 +5813,7 @@
                 filePath: "data/tokens/components/container.json",
                 isSource: true,
                 original: {
-                  value: "{global.space.micro.L}",
+                  value: "{global.space.macro.XXXS}",
                   type: "spacing",
                   description: "gap between elements in pagination",
                 },
@@ -5859,25 +5859,25 @@
           },
           y: {
             M: {
-              value: 8,
+              value: 12,
               type: "spacing",
               description: "top and bottom padding inside pagination",
               filePath: "data/tokens/components/container.json",
               isSource: true,
               original: {
-                value: "{global.space.micro.L}",
+                value: "{global.space.macro.XXS}",
                 type: "spacing",
                 description: "top and bottom padding inside pagination",
               },
               name: "containerSpacePaginationYM",
               attributes: {
-                value: 8,
+                value: 12,
                 type: "spacing",
                 description: "top and bottom padding inside pagination",
                 filePath: "data/tokens/components/container.json",
                 isSource: true,
                 original: {
-                  value: "{global.space.micro.L}",
+                  value: "{global.space.macro.XXS}",
                   type: "spacing",
                   description: "top and bottom padding inside pagination",
                 },
@@ -5889,6 +5889,81 @@
               path: ["container", "space", "pagination", "y", "M"],
               comment: "top and bottom padding inside pagination",
             },
+            L: {
+              value: 16,
+              type: "spacing",
+              description:
+                "external margin on top of floating pagination variant",
+              filePath: "data/tokens/components/container.json",
+              isSource: true,
+              original: {
+                value: "{global.space.macro.XS}",
+                type: "spacing",
+                description:
+                  "external margin on top of floating pagination variant",
+              },
+              name: "containerSpacePaginationYL",
+              attributes: {
+                value: 16,
+                type: "spacing",
+                description:
+                  "external margin on top of floating pagination variant",
+                filePath: "data/tokens/components/container.json",
+                isSource: true,
+                original: {
+                  value: "{global.space.macro.XS}",
+                  type: "spacing",
+                  description:
+                    "external margin on top of floating pagination variant",
+                },
+                name: "L",
+                attributes: {},
+                path: ["container", "space", "pagination", "y", "L"],
+                comment:
+                  "external margin on top of floating pagination variant",
+              },
+              path: ["container", "space", "pagination", "y", "L"],
+              comment: "external margin on top of floating pagination variant",
+            },
+          },
+          yg: {
+            M: {
+              value: 8,
+              type: "spacing",
+              description:
+                "gap between left and right pagination elements when stacked vertically on small screens",
+              filePath: "data/tokens/components/container.json",
+              isSource: true,
+              original: {
+                value: "{global.space.macro.XXXS}",
+                type: "spacing",
+                description:
+                  "gap between left and right pagination elements when stacked vertically on small screens",
+              },
+              name: "containerSpacePaginationYgM",
+              attributes: {
+                value: 8,
+                type: "spacing",
+                description:
+                  "gap between left and right pagination elements when stacked vertically on small screens",
+                filePath: "data/tokens/components/container.json",
+                isSource: true,
+                original: {
+                  value: "{global.space.macro.XXXS}",
+                  type: "spacing",
+                  description:
+                    "gap between left and right pagination elements when stacked vertically on small screens",
+                },
+                name: "M",
+                attributes: {},
+                path: ["container", "space", "pagination", "yg", "M"],
+                comment:
+                  "gap between left and right pagination elements when stacked vertically on small screens",
+              },
+              path: ["container", "space", "pagination", "yg", "M"],
+              comment:
+                "gap between left and right pagination elements when stacked vertically on small screens",
+            },
           },
           x: {
             M: {