@ds-mo/tokens 2.15.0 → 3.0.1

package/dist/agent.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": "1.0.0",
   "package": "@ds-mo/tokens",
-  "packageVersion": "2.15.0",
+  "packageVersion": "3.0.1",
   "kind": "tokens",
   "entries": [
     {

package/dist/agent.mjs

@@ -1,7 +1,7 @@
 const manifest = {
   "schemaVersion": "1.0.0",
   "package": "@ds-mo/tokens",
-  "packageVersion": "2.15.0",
+  "packageVersion": "3.0.1",
   "kind": "tokens",
   "entries": [
     {

package/dist/colors.css

@@ -201,6 +201,7 @@
   --color-always-dark-interaction-focus: var(--color-reference-white-15);
   --color-always-dark-interaction-hover: var(--color-reference-white-10);
   --color-always-dark-interaction-pressed: var(--color-reference-white-15);
+  --color-always-dark-shimmer: var(--color-reference-white-20);
   --color-background-bold-ai: var(--color-reference-light-purple-290-l52-c20-bold);
   --color-background-bold-brand: var(--color-reference-light-blue-250-l50-c18-bold);
   --color-background-bold-caution: var(--color-reference-light-yellow-85-l51-c12-bold);
@@ -240,7 +241,6 @@
   --color-background-strong-positive: var(--color-reference-light-green-145-l35-c13-strong);
   --color-background-strong-walkthrough: var(--color-reference-light-teal-180-l35-c09-strong);
   --color-background-strong-warning: var(--color-reference-light-orange-60-l35-c09-strong);
-  --color-background-translucent: var(--color-reference-white-50);
   --color-background-transparent: var(--color-reference-white-0);
   --color-border-bold-ai: var(--color-reference-light-purple-290-l52-c20-bold);
   --color-border-bold-brand: var(--color-reference-light-blue-250-l50-c18-bold);
@@ -278,9 +278,6 @@
   --color-border-on-strong-background-primary: var(--color-reference-white-20);
   --color-border-on-strong-background-secondary: var(--color-reference-white-15);
   --color-border-on-strong-background-tertiary: var(--color-reference-white-10);
-  --color-border-on-translucent-background-primary: var(--color-reference-black-25);
-  --color-border-on-translucent-background-secondary: var(--color-reference-black-20);
-  --color-border-on-translucent-background-tertiary: var(--color-reference-black-15);
   --color-border-primary: var(--color-reference-black-20);
   --color-border-secondary: var(--color-reference-black-15);
   --color-border-strong-ai: var(--color-reference-light-purple-290-l35-c13-strong);
@@ -449,11 +446,10 @@
   --color-color-intent-yellow-strong-background: var(--color-reference-light-yellow-85-l40-c09-strong);
   --color-color-intent-yellow-strong-border: var(--color-reference-light-yellow-85-l51-c12-bold);
   --color-color-intent-yellow-strong-foreground: var(--color-reference-light-yellow-85-l85-c20-medium);
+  --color-divider-divider-on-bold-background: var(--color-reference-white-15);
+  --color-divider-divider-on-medium-background: var(--color-reference-black-15);
+  --color-divider-divider-on-strong-background: var(--color-reference-white-10);
   --color-divider-divider: var(--color-reference-black-10);
-  --color-divider-on-bold-background: var(--color-reference-white-15);
-  --color-divider-on-medium-background: var(--color-reference-black-15);
-  --color-divider-on-strong-background: var(--color-reference-white-10);
-  --color-divider-on-translucent-background: var(--color-reference-black-15);
   --color-driver-status-background-driving: var(--color-reference-light-green-145-l50-c19-bold);
   --color-driver-status-background-off-duty: var(--color-reference-grey-l75-light-medium);
   --color-driver-status-background-on-duty: var(--color-reference-light-blue-250-l50-c18-bold);
@@ -518,10 +514,6 @@
   --color-foreground-on-strong-background-quaternary: var(--color-reference-white-20);
   --color-foreground-on-strong-background-secondary: var(--color-reference-white-65);
   --color-foreground-on-strong-background-tertiary: var(--color-reference-white-45);
-  --color-foreground-on-translucent-background-primary: var(--color-reference-black-100);
-  --color-foreground-on-translucent-background-quaternary: var(--color-reference-black-25);
-  --color-foreground-on-translucent-background-secondary: var(--color-reference-black-70);
-  --color-foreground-on-translucent-background-tertiary: var(--color-reference-black-50);
   --color-foreground-primary: var(--color-reference-black-100);
   --color-foreground-quaternary: var(--color-reference-black-20);
   --color-foreground-secondary: var(--color-reference-black-60);
@@ -538,22 +530,18 @@
   --color-interaction-active: var(--color-reference-light-blue-250-l92-c04-faint);
   --color-interaction-focus: var(--color-reference-black-15);
   --color-interaction-hover: var(--color-reference-black-10);
-  --color-interaction-on-bold-background-active: var(--color-reference-light-blue-250-l70-c18-medium);
+  --color-interaction-on-bold-background-active: var(--color-reference-white-15);
   --color-interaction-on-bold-background-focus: var(--color-reference-white-20);
   --color-interaction-on-bold-background-hover: var(--color-reference-white-15);
   --color-interaction-on-bold-background-pressed: var(--color-reference-white-20);
-  --color-interaction-on-medium-background-active: var(--color-reference-light-blue-250-l50-c18-bold);
+  --color-interaction-on-medium-background-active: var(--color-reference-black-15);
   --color-interaction-on-medium-background-focus: var(--color-reference-black-20);
   --color-interaction-on-medium-background-hover: var(--color-reference-black-15);
   --color-interaction-on-medium-background-pressed: var(--color-reference-black-20);
-  --color-interaction-on-strong-background-active: var(--color-reference-light-blue-250-l50-c18-bold);
+  --color-interaction-on-strong-background-active: var(--color-reference-white-10);
   --color-interaction-on-strong-background-focus: var(--color-reference-white-15);
   --color-interaction-on-strong-background-hover: var(--color-reference-white-10);
   --color-interaction-on-strong-background-pressed: var(--color-reference-white-15);
-  --color-interaction-on-translucent-background-active: var(--color-reference-light-blue-250-l92-c04-faint);
-  --color-interaction-on-translucent-background-focus: var(--color-reference-black-20);
-  --color-interaction-on-translucent-background-hover: var(--color-reference-black-15);
-  --color-interaction-on-translucent-background-pressed: var(--color-reference-black-20);
   --color-interaction-pressed: var(--color-reference-black-15);
   --color-inverted-background: var(--color-reference-grey-l18);
   --color-inverted-border-bold-ai: var(--color-reference-dark-purple-290-l67-c20-bold);
@@ -613,6 +601,7 @@
   --color-inverted-interaction-focus: var(--color-reference-white-15);
   --color-inverted-interaction-hover: var(--color-reference-white-10);
   --color-inverted-interaction-pressed: var(--color-reference-white-15);
+  --color-inverted-shimmer: var(--color-reference-white-20);
   --color-location-marker-background-brand: var(--color-reference-light-blue-250-l50-c18-bold);
   --color-location-marker-background-caution: var(--color-reference-light-yellow-85-l85-c20-medium);
   --color-location-marker-background-negative: var(--color-reference-light-red-30-l53-c20-bold);
@@ -632,10 +621,11 @@
   --color-media-foreground-quaternary: var(--color-reference-white-20);
   --color-media-foreground-secondary: var(--color-reference-white-55);
   --color-media-foreground-tertiary: var(--color-reference-white-35);
-  --color-media-interaction-active: var(--color-reference-white-20);
+  --color-media-interaction-active: var(--color-reference-white-10);
   --color-media-interaction-focus: var(--color-reference-white-15);
   --color-media-interaction-hover: var(--color-reference-white-10);
   --color-media-interaction-pressed: var(--color-reference-white-15);
+  --color-media-shimmer: var(--color-reference-white-20);
   --color-navigation-background: var(--color-reference-grey-l18);
   --color-navigation-border-primary: var(--color-reference-white-20);
   --color-navigation-border-secondary: var(--color-reference-white-15);
@@ -650,6 +640,7 @@
   --color-navigation-interaction-focus: var(--color-reference-white-15);
   --color-navigation-interaction-hover: var(--color-reference-white-10);
   --color-navigation-interaction-pressed: var(--color-reference-white-15);
+  --color-navigation-shimmer: var(--color-reference-white-20);
   --color-safety-score-background-excellent: var(--color-reference-light-blue-250-l70-c18-medium);
   --color-safety-score-background-fair: var(--color-reference-light-orange-60-l75-c20-medium);
   --color-safety-score-background-good: var(--color-reference-light-blue-250-l92-c04-faint);
@@ -662,8 +653,24 @@
   --color-settings-profile-background: var(--color-reference-light-orange-60-l93-c05-faint);
   --color-settings-profile-border: var(--color-reference-light-orange-60-l75-c20-medium);
   --color-settings-profile-foreground: var(--color-reference-light-orange-60-l52-c13-bold);
-  --color-shimmer-fade: var(--color-reference-black-15);
-  --color-shimmer-highlight: var(--color-reference-white-10);
+  --color-shimmer-shimmer-on-bold-background: var(--color-reference-white-15);
+  --color-shimmer-shimmer-on-medium-background: var(--color-reference-white-15);
+  --color-shimmer-shimmer-on-strong-background: var(--color-reference-white-10);
+  --color-shimmer-shimmer: var(--color-reference-white-30);
+  --color-translucent-border-primary: var(--color-reference-black-25);
+  --color-translucent-border-secondary: var(--color-reference-black-20);
+  --color-translucent-border-tertiary: var(--color-reference-black-15);
+  --color-translucent-divider: var(--color-reference-black-15);
+  --color-translucent-foreground-primary: var(--color-reference-black-100);
+  --color-translucent-foreground-quaternary: var(--color-reference-black-25);
+  --color-translucent-foreground-secondary: var(--color-reference-black-70);
+  --color-translucent-foreground-tertiary: var(--color-reference-black-50);
+  --color-translucent-interaction-active: var(--color-reference-light-blue-250-l92-c04-faint);
+  --color-translucent-interaction-focus: var(--color-reference-black-20);
+  --color-translucent-interaction-hover: var(--color-reference-black-15);
+  --color-translucent-interaction-pressed: var(--color-reference-black-20);
+  --color-translucent-shimmer: var(--color-reference-white-30);
+  --color-translucent-translucent: var(--color-reference-white-50);
   --color-data-category-10: var(--color-reference-light-pink-0-l70-c22-medium);
   --color-data-category-11: var(--color-reference-light-teal-180-l75-c17-medium);
   --color-data-category-12: var(--color-reference-light-orange-60-l52-c13-bold);
@@ -789,6 +796,7 @@
   --color-always-dark-interaction-focus: var(--color-reference-white-15);
   --color-always-dark-interaction-hover: var(--color-reference-white-10);
   --color-always-dark-interaction-pressed: var(--color-reference-white-15);
+  --color-always-dark-shimmer: var(--color-reference-white-10);
   --color-background-bold-ai: var(--color-reference-dark-purple-290-l67-c20-bold);
   --color-background-bold-brand: var(--color-reference-dark-blue-250-l65-c20-bold);
   --color-background-bold-caution: var(--color-reference-dark-yellow-85-l80-c18-bold);
@@ -828,7 +836,6 @@
   --color-background-strong-positive: var(--color-reference-dark-green-145-l93-c06-strong);
   --color-background-strong-walkthrough: var(--color-reference-dark-teal-180-l93-c08-strong);
   --color-background-strong-warning: var(--color-reference-dark-orange-60-l92-c06-strong);
-  --color-background-translucent: var(--color-reference-black-50);
   --color-background-transparent: var(--color-reference-black-0);
   --color-border-bold-ai: var(--color-reference-dark-purple-290-l67-c20-bold);
   --color-border-bold-brand: var(--color-reference-dark-blue-250-l65-c20-bold);
@@ -866,9 +873,6 @@
   --color-border-on-strong-background-primary: var(--color-reference-black-20);
   --color-border-on-strong-background-secondary: var(--color-reference-black-15);
   --color-border-on-strong-background-tertiary: var(--color-reference-black-10);
-  --color-border-on-translucent-background-primary: var(--color-reference-white-25);
-  --color-border-on-translucent-background-secondary: var(--color-reference-white-20);
-  --color-border-on-translucent-background-tertiary: var(--color-reference-white-15);
   --color-border-primary: var(--color-reference-white-20);
   --color-border-secondary: var(--color-reference-white-15);
   --color-border-strong-ai: var(--color-reference-dark-purple-290-l92-c05-strong);
@@ -1037,11 +1041,10 @@
   --color-color-intent-yellow-strong-background: var(--color-reference-dark-yellow-85-l93-c05-strong);
   --color-color-intent-yellow-strong-border: var(--color-reference-dark-yellow-85-l80-c18-bold);
   --color-color-intent-yellow-strong-foreground: var(--color-reference-dark-yellow-85-l51-c12-medium);
+  --color-divider-divider-on-bold-background: var(--color-reference-black-15);
+  --color-divider-divider-on-medium-background: var(--color-reference-white-15);
+  --color-divider-divider-on-strong-background: var(--color-reference-black-10);
   --color-divider-divider: var(--color-reference-white-10);
-  --color-divider-on-bold-background: var(--color-reference-black-15);
-  --color-divider-on-medium-background: var(--color-reference-white-15);
-  --color-divider-on-strong-background: var(--color-reference-black-10);
-  --color-divider-on-translucent-background: var(--color-reference-white-15);
   --color-driver-status-background-driving: var(--color-reference-dark-green-145-l70-c19-bold);
   --color-driver-status-background-off-duty: var(--color-reference-grey-l50-dark-medium);
   --color-driver-status-background-on-duty: var(--color-reference-dark-blue-250-l65-c20-bold);
@@ -1106,10 +1109,6 @@
   --color-foreground-on-strong-background-quaternary: var(--color-reference-black-20);
   --color-foreground-on-strong-background-secondary: var(--color-reference-black-60);
   --color-foreground-on-strong-background-tertiary: var(--color-reference-black-45);
-  --color-foreground-on-translucent-background-primary: var(--color-reference-white-100);
-  --color-foreground-on-translucent-background-quaternary: var(--color-reference-white-25);
-  --color-foreground-on-translucent-background-secondary: var(--color-reference-white-85);
-  --color-foreground-on-translucent-background-tertiary: var(--color-reference-white-60);
   --color-foreground-primary: var(--color-reference-white-100);
   --color-foreground-quaternary: var(--color-reference-white-20);
   --color-foreground-secondary: var(--color-reference-white-55);
@@ -1126,22 +1125,18 @@
   --color-interaction-active: var(--color-reference-dark-blue-250-l27-c05-faint);
   --color-interaction-focus: var(--color-reference-white-15);
   --color-interaction-hover: var(--color-reference-white-10);
-  --color-interaction-on-bold-background-active: var(--color-reference-dark-blue-250-l50-c17-medium);
+  --color-interaction-on-bold-background-active: var(--color-reference-black-15);
   --color-interaction-on-bold-background-focus: var(--color-reference-black-20);
   --color-interaction-on-bold-background-hover: var(--color-reference-black-15);
   --color-interaction-on-bold-background-pressed: var(--color-reference-black-20);
-  --color-interaction-on-medium-background-active: var(--color-reference-dark-blue-250-l65-c20-bold);
+  --color-interaction-on-medium-background-active: var(--color-reference-white-15);
   --color-interaction-on-medium-background-focus: var(--color-reference-white-20);
   --color-interaction-on-medium-background-hover: var(--color-reference-white-15);
   --color-interaction-on-medium-background-pressed: var(--color-reference-white-20);
-  --color-interaction-on-strong-background-active: var(--color-reference-dark-blue-250-l65-c20-bold);
+  --color-interaction-on-strong-background-active: var(--color-reference-black-10);
   --color-interaction-on-strong-background-focus: var(--color-reference-black-15);
   --color-interaction-on-strong-background-hover: var(--color-reference-black-10);
   --color-interaction-on-strong-background-pressed: var(--color-reference-black-15);
-  --color-interaction-on-translucent-background-active: var(--color-reference-dark-blue-250-l27-c05-faint);
-  --color-interaction-on-translucent-background-focus: var(--color-reference-white-20);
-  --color-interaction-on-translucent-background-hover: var(--color-reference-white-15);
-  --color-interaction-on-translucent-background-pressed: var(--color-reference-white-20);
   --color-interaction-pressed: var(--color-reference-white-15);
   --color-inverted-background: var(--color-reference-white-100);
   --color-inverted-border-bold-ai: var(--color-reference-light-purple-290-l52-c20-bold);
@@ -1201,6 +1196,7 @@
   --color-inverted-interaction-focus: var(--color-reference-black-15);
   --color-inverted-interaction-hover: var(--color-reference-black-10);
   --color-inverted-interaction-pressed: var(--color-reference-black-15);
+  --color-inverted-shimmer: var(--color-reference-white-30);
   --color-location-marker-background-brand: var(--color-reference-dark-blue-250-l65-c20-bold);
   --color-location-marker-background-caution: var(--color-reference-dark-yellow-85-l80-c18-bold);
   --color-location-marker-background-negative: var(--color-reference-dark-red-30-l70-c20-bold);
@@ -1220,10 +1216,11 @@
   --color-media-foreground-quaternary: var(--color-reference-white-20);
   --color-media-foreground-secondary: var(--color-reference-white-55);
   --color-media-foreground-tertiary: var(--color-reference-white-35);
-  --color-media-interaction-active: var(--color-reference-white-20);
+  --color-media-interaction-active: var(--color-reference-white-10);
   --color-media-interaction-focus: var(--color-reference-white-15);
   --color-media-interaction-hover: var(--color-reference-white-10);
   --color-media-interaction-pressed: var(--color-reference-white-15);
+  --color-media-shimmer: var(--color-reference-white-10);
   --color-navigation-background: var(--color-reference-grey-l27-dark-faint);
   --color-navigation-border-primary: var(--color-reference-white-15);
   --color-navigation-border-secondary: var(--color-reference-white-10);
@@ -1238,6 +1235,7 @@
   --color-navigation-interaction-focus: var(--color-reference-white-10);
   --color-navigation-interaction-hover: var(--color-reference-white-5);
   --color-navigation-interaction-pressed: var(--color-reference-white-10);
+  --color-navigation-shimmer: var(--color-reference-white-10);
   --color-safety-score-background-excellent: var(--color-reference-dark-blue-250-l50-c17-medium);
   --color-safety-score-background-fair: var(--color-reference-dark-orange-60-l75-c20-bold);
   --color-safety-score-background-good: var(--color-reference-dark-blue-250-l27-c05-faint);
@@ -1250,8 +1248,24 @@
   --color-settings-profile-background: var(--color-reference-dark-orange-60-l28-c05-faint);
   --color-settings-profile-border: var(--color-reference-dark-orange-60-l51-c13-medium);
   --color-settings-profile-foreground: var(--color-reference-dark-orange-60-l75-c20-bold);
-  --color-shimmer-fade: var(--color-reference-black-10);
-  --color-shimmer-highlight: var(--color-reference-white-15);
+  --color-shimmer-shimmer-on-bold-background: var(--color-reference-white-10);
+  --color-shimmer-shimmer-on-medium-background: var(--color-reference-white-10);
+  --color-shimmer-shimmer-on-strong-background: var(--color-reference-white-15);
+  --color-shimmer-shimmer: var(--color-reference-white-10);
+  --color-translucent-border-primary: var(--color-reference-white-25);
+  --color-translucent-border-secondary: var(--color-reference-white-20);
+  --color-translucent-border-tertiary: var(--color-reference-white-15);
+  --color-translucent-divider: var(--color-reference-white-15);
+  --color-translucent-foreground-primary: var(--color-reference-white-100);
+  --color-translucent-foreground-quaternary: var(--color-reference-white-25);
+  --color-translucent-foreground-secondary: var(--color-reference-white-85);
+  --color-translucent-foreground-tertiary: var(--color-reference-white-60);
+  --color-translucent-interaction-active: var(--color-reference-dark-blue-250-l27-c05-faint);
+  --color-translucent-interaction-focus: var(--color-reference-white-20);
+  --color-translucent-interaction-hover: var(--color-reference-white-15);
+  --color-translucent-interaction-pressed: var(--color-reference-white-20);
+  --color-translucent-shimmer: var(--color-reference-white-10);
+  --color-translucent-translucent: var(--color-reference-black-50);
   --color-data-category-10: var(--color-reference-dark-pink-0-l68-c20-bold);
   --color-data-category-11: var(--color-reference-dark-teal-180-l70-c15-bold);
   --color-data-category-12: var(--color-reference-dark-orange-60-l51-c13-medium);

package/dist/effects.css

@@ -167,9 +167,8 @@
     var(--effect-highlight-elevated-floating);
 
   /* ── depressed-sm ──────────────────────────────────────────────────────── */
-  /* Note: outset contains both shadow (top) and highlight (bottom rim) for depressed */
+  /* Note: outset contains the bottom highlight rim for depressed elevations */
   --effect-shadow-depressed-sm:
-    0px -4px 2px -4px var(--color-elevation-shadow),
     0px  4px 2px -4px var(--color-elevation-highlight),
     0px  0px 0px  0.5px var(--color-elevation-highlight);
   --effect-highlight-depressed-sm:
@@ -181,7 +180,6 @@
 
   /* ── depressed-md ──────────────────────────────────────────────────────── */
   --effect-shadow-depressed-md:
-    0px -4px 2px -4px var(--color-elevation-shadow),
     0px  4px 2px -4px var(--color-elevation-highlight),
     0px  0px 0px  0.5px var(--color-elevation-highlight);
   --effect-highlight-depressed-md:

package/dist/index.cjs

@@ -56,6 +56,7 @@ exports.colorAlwaysDarkInteractionActive = '--color-always-dark-interaction-acti
 exports.colorAlwaysDarkInteractionFocus = '--color-always-dark-interaction-focus';
 exports.colorAlwaysDarkInteractionHover = '--color-always-dark-interaction-hover';
 exports.colorAlwaysDarkInteractionPressed = '--color-always-dark-interaction-pressed';
+exports.colorAlwaysDarkShimmer = '--color-always-dark-shimmer';
 exports.colorBackgroundBoldAi = '--color-background-bold-ai';
 exports.colorBackgroundBoldBrand = '--color-background-bold-brand';
 exports.colorBackgroundBoldCaution = '--color-background-bold-caution';
@@ -95,7 +96,6 @@ exports.colorBackgroundStrongNeutral = '--color-background-strong-neutral';
 exports.colorBackgroundStrongPositive = '--color-background-strong-positive';
 exports.colorBackgroundStrongWalkthrough = '--color-background-strong-walkthrough';
 exports.colorBackgroundStrongWarning = '--color-background-strong-warning';
-exports.colorBackgroundTranslucent = '--color-background-translucent';
 exports.colorBackgroundTransparent = '--color-background-transparent';
 exports.colorBorderBoldAi = '--color-border-bold-ai';
 exports.colorBorderBoldBrand = '--color-border-bold-brand';
@@ -133,9 +133,6 @@ exports.colorBorderOnMediumBackgroundTertiary = '--color-border-on-medium-backgr
 exports.colorBorderOnStrongBackgroundPrimary = '--color-border-on-strong-background-primary';
 exports.colorBorderOnStrongBackgroundSecondary = '--color-border-on-strong-background-secondary';
 exports.colorBorderOnStrongBackgroundTertiary = '--color-border-on-strong-background-tertiary';
-exports.colorBorderOnTranslucentBackgroundPrimary = '--color-border-on-translucent-background-primary';
-exports.colorBorderOnTranslucentBackgroundSecondary = '--color-border-on-translucent-background-secondary';
-exports.colorBorderOnTranslucentBackgroundTertiary = '--color-border-on-translucent-background-tertiary';
 exports.colorBorderPrimary = '--color-border-primary';
 exports.colorBorderSecondary = '--color-border-secondary';
 exports.colorBorderStrongAi = '--color-border-strong-ai';
@@ -369,10 +366,9 @@ exports.colorDataWinLossLoss = '--color-data-win-loss-loss';
 exports.colorDataWinLossWin = '--color-data-win-loss-win';
 exports.colorDataWinLossWinAlt = '--color-data-win-loss-win-alt';
 exports.colorDividerDivider = '--color-divider-divider';
-exports.colorDividerOnBoldBackground = '--color-divider-on-bold-background';
-exports.colorDividerOnMediumBackground = '--color-divider-on-medium-background';
-exports.colorDividerOnStrongBackground = '--color-divider-on-strong-background';
-exports.colorDividerOnTranslucentBackground = '--color-divider-on-translucent-background';
+exports.colorDividerDividerOnBoldBackground = '--color-divider-divider-on-bold-background';
+exports.colorDividerDividerOnMediumBackground = '--color-divider-divider-on-medium-background';
+exports.colorDividerDividerOnStrongBackground = '--color-divider-divider-on-strong-background';
 exports.colorDriverStatusBackgroundDriving = '--color-driver-status-background-driving';
 exports.colorDriverStatusBackgroundOffDuty = '--color-driver-status-background-off-duty';
 exports.colorDriverStatusBackgroundOnDuty = '--color-driver-status-background-on-duty';
@@ -437,10 +433,6 @@ exports.colorForegroundOnStrongBackgroundPrimary = '--color-foreground-on-strong
 exports.colorForegroundOnStrongBackgroundQuaternary = '--color-foreground-on-strong-background-quaternary';
 exports.colorForegroundOnStrongBackgroundSecondary = '--color-foreground-on-strong-background-secondary';
 exports.colorForegroundOnStrongBackgroundTertiary = '--color-foreground-on-strong-background-tertiary';
-exports.colorForegroundOnTranslucentBackgroundPrimary = '--color-foreground-on-translucent-background-primary';
-exports.colorForegroundOnTranslucentBackgroundQuaternary = '--color-foreground-on-translucent-background-quaternary';
-exports.colorForegroundOnTranslucentBackgroundSecondary = '--color-foreground-on-translucent-background-secondary';
-exports.colorForegroundOnTranslucentBackgroundTertiary = '--color-foreground-on-translucent-background-tertiary';
 exports.colorForegroundPrimary = '--color-foreground-primary';
 exports.colorForegroundQuaternary = '--color-foreground-quaternary';
 exports.colorForegroundSecondary = '--color-foreground-secondary';
@@ -469,10 +461,6 @@ exports.colorInteractionOnStrongBackgroundActive = '--color-interaction-on-stron
 exports.colorInteractionOnStrongBackgroundFocus = '--color-interaction-on-strong-background-focus';
 exports.colorInteractionOnStrongBackgroundHover = '--color-interaction-on-strong-background-hover';
 exports.colorInteractionOnStrongBackgroundPressed = '--color-interaction-on-strong-background-pressed';
-exports.colorInteractionOnTranslucentBackgroundActive = '--color-interaction-on-translucent-background-active';
-exports.colorInteractionOnTranslucentBackgroundFocus = '--color-interaction-on-translucent-background-focus';
-exports.colorInteractionOnTranslucentBackgroundHover = '--color-interaction-on-translucent-background-hover';
-exports.colorInteractionOnTranslucentBackgroundPressed = '--color-interaction-on-translucent-background-pressed';
 exports.colorInteractionPressed = '--color-interaction-pressed';
 exports.colorInvertedBackground = '--color-inverted-background';
 exports.colorInvertedBorderBoldAi = '--color-inverted-border-bold-ai';
@@ -532,6 +520,7 @@ exports.colorInvertedInteractionActive = '--color-inverted-interaction-active';
 exports.colorInvertedInteractionFocus = '--color-inverted-interaction-focus';
 exports.colorInvertedInteractionHover = '--color-inverted-interaction-hover';
 exports.colorInvertedInteractionPressed = '--color-inverted-interaction-pressed';
+exports.colorInvertedShimmer = '--color-inverted-shimmer';
 exports.colorLocationMarkerBackgroundBrand = '--color-location-marker-background-brand';
 exports.colorLocationMarkerBackgroundCaution = '--color-location-marker-background-caution';
 exports.colorLocationMarkerBackgroundNegative = '--color-location-marker-background-negative';
@@ -555,6 +544,7 @@ exports.colorMediaInteractionActive = '--color-media-interaction-active';
 exports.colorMediaInteractionFocus = '--color-media-interaction-focus';
 exports.colorMediaInteractionHover = '--color-media-interaction-hover';
 exports.colorMediaInteractionPressed = '--color-media-interaction-pressed';
+exports.colorMediaShimmer = '--color-media-shimmer';
 exports.colorNavigationBackground = '--color-navigation-background';
 exports.colorNavigationBorderPrimary = '--color-navigation-border-primary';
 exports.colorNavigationBorderSecondary = '--color-navigation-border-secondary';
@@ -569,6 +559,7 @@ exports.colorNavigationInteractionActive = '--color-navigation-interaction-activ
 exports.colorNavigationInteractionFocus = '--color-navigation-interaction-focus';
 exports.colorNavigationInteractionHover = '--color-navigation-interaction-hover';
 exports.colorNavigationInteractionPressed = '--color-navigation-interaction-pressed';
+exports.colorNavigationShimmer = '--color-navigation-shimmer';
 exports.colorReferenceBlack0 = '--color-reference-black-0';
 exports.colorReferenceBlack10 = '--color-reference-black-10';
 exports.colorReferenceBlack100 = '--color-reference-black-100';
@@ -722,8 +713,24 @@ exports.colorSafetyScoreInteractionPressed = '--color-safety-score-interaction-p
 exports.colorSettingsProfileBackground = '--color-settings-profile-background';
 exports.colorSettingsProfileBorder = '--color-settings-profile-border';
 exports.colorSettingsProfileForeground = '--color-settings-profile-foreground';
-exports.colorShimmerFade = '--color-shimmer-fade';
-exports.colorShimmerHighlight = '--color-shimmer-highlight';
+exports.colorShimmerShimmer = '--color-shimmer-shimmer';
+exports.colorShimmerShimmerOnBoldBackground = '--color-shimmer-shimmer-on-bold-background';
+exports.colorShimmerShimmerOnMediumBackground = '--color-shimmer-shimmer-on-medium-background';
+exports.colorShimmerShimmerOnStrongBackground = '--color-shimmer-shimmer-on-strong-background';
+exports.colorTranslucentBorderPrimary = '--color-translucent-border-primary';
+exports.colorTranslucentBorderSecondary = '--color-translucent-border-secondary';
+exports.colorTranslucentBorderTertiary = '--color-translucent-border-tertiary';
+exports.colorTranslucentDivider = '--color-translucent-divider';
+exports.colorTranslucentForegroundPrimary = '--color-translucent-foreground-primary';
+exports.colorTranslucentForegroundQuaternary = '--color-translucent-foreground-quaternary';
+exports.colorTranslucentForegroundSecondary = '--color-translucent-foreground-secondary';
+exports.colorTranslucentForegroundTertiary = '--color-translucent-foreground-tertiary';
+exports.colorTranslucentInteractionActive = '--color-translucent-interaction-active';
+exports.colorTranslucentInteractionFocus = '--color-translucent-interaction-focus';
+exports.colorTranslucentInteractionHover = '--color-translucent-interaction-hover';
+exports.colorTranslucentInteractionPressed = '--color-translucent-interaction-pressed';
+exports.colorTranslucentShimmer = '--color-translucent-shimmer';
+exports.colorTranslucentTranslucent = '--color-translucent-translucent';
 exports.dimensionBase = '--dimension-base';
 exports.dimensionCardHeightLg = '--dimension-card-height-lg';
 exports.dimensionCardHeightMd = '--dimension-card-height-md';

package/dist/index.d.ts

@@ -56,6 +56,7 @@ export declare const colorAlwaysDarkInteractionActive: '--color-always-dark-inte
 export declare const colorAlwaysDarkInteractionFocus: '--color-always-dark-interaction-focus';
 export declare const colorAlwaysDarkInteractionHover: '--color-always-dark-interaction-hover';
 export declare const colorAlwaysDarkInteractionPressed: '--color-always-dark-interaction-pressed';
+export declare const colorAlwaysDarkShimmer: '--color-always-dark-shimmer';
 export declare const colorBackgroundBoldAi: '--color-background-bold-ai';
 export declare const colorBackgroundBoldBrand: '--color-background-bold-brand';
 export declare const colorBackgroundBoldCaution: '--color-background-bold-caution';
@@ -95,7 +96,6 @@ export declare const colorBackgroundStrongNeutral: '--color-background-strong-ne
 export declare const colorBackgroundStrongPositive: '--color-background-strong-positive';
 export declare const colorBackgroundStrongWalkthrough: '--color-background-strong-walkthrough';
 export declare const colorBackgroundStrongWarning: '--color-background-strong-warning';
-export declare const colorBackgroundTranslucent: '--color-background-translucent';
 export declare const colorBackgroundTransparent: '--color-background-transparent';
 export declare const colorBorderBoldAi: '--color-border-bold-ai';
 export declare const colorBorderBoldBrand: '--color-border-bold-brand';
@@ -133,9 +133,6 @@ export declare const colorBorderOnMediumBackgroundTertiary: '--color-border-on-m
 export declare const colorBorderOnStrongBackgroundPrimary: '--color-border-on-strong-background-primary';
 export declare const colorBorderOnStrongBackgroundSecondary: '--color-border-on-strong-background-secondary';
 export declare const colorBorderOnStrongBackgroundTertiary: '--color-border-on-strong-background-tertiary';
-export declare const colorBorderOnTranslucentBackgroundPrimary: '--color-border-on-translucent-background-primary';
-export declare const colorBorderOnTranslucentBackgroundSecondary: '--color-border-on-translucent-background-secondary';
-export declare const colorBorderOnTranslucentBackgroundTertiary: '--color-border-on-translucent-background-tertiary';
 export declare const colorBorderPrimary: '--color-border-primary';
 export declare const colorBorderSecondary: '--color-border-secondary';
 export declare const colorBorderStrongAi: '--color-border-strong-ai';
@@ -369,10 +366,9 @@ export declare const colorDataWinLossLoss: '--color-data-win-loss-loss';
 export declare const colorDataWinLossWin: '--color-data-win-loss-win';
 export declare const colorDataWinLossWinAlt: '--color-data-win-loss-win-alt';
 export declare const colorDividerDivider: '--color-divider-divider';
-export declare const colorDividerOnBoldBackground: '--color-divider-on-bold-background';
-export declare const colorDividerOnMediumBackground: '--color-divider-on-medium-background';
-export declare const colorDividerOnStrongBackground: '--color-divider-on-strong-background';
-export declare const colorDividerOnTranslucentBackground: '--color-divider-on-translucent-background';
+export declare const colorDividerDividerOnBoldBackground: '--color-divider-divider-on-bold-background';
+export declare const colorDividerDividerOnMediumBackground: '--color-divider-divider-on-medium-background';
+export declare const colorDividerDividerOnStrongBackground: '--color-divider-divider-on-strong-background';
 export declare const colorDriverStatusBackgroundDriving: '--color-driver-status-background-driving';
 export declare const colorDriverStatusBackgroundOffDuty: '--color-driver-status-background-off-duty';
 export declare const colorDriverStatusBackgroundOnDuty: '--color-driver-status-background-on-duty';
@@ -437,10 +433,6 @@ export declare const colorForegroundOnStrongBackgroundPrimary: '--color-foregrou
 export declare const colorForegroundOnStrongBackgroundQuaternary: '--color-foreground-on-strong-background-quaternary';
 export declare const colorForegroundOnStrongBackgroundSecondary: '--color-foreground-on-strong-background-secondary';
 export declare const colorForegroundOnStrongBackgroundTertiary: '--color-foreground-on-strong-background-tertiary';
-export declare const colorForegroundOnTranslucentBackgroundPrimary: '--color-foreground-on-translucent-background-primary';
-export declare const colorForegroundOnTranslucentBackgroundQuaternary: '--color-foreground-on-translucent-background-quaternary';
-export declare const colorForegroundOnTranslucentBackgroundSecondary: '--color-foreground-on-translucent-background-secondary';
-export declare const colorForegroundOnTranslucentBackgroundTertiary: '--color-foreground-on-translucent-background-tertiary';
 export declare const colorForegroundPrimary: '--color-foreground-primary';
 export declare const colorForegroundQuaternary: '--color-foreground-quaternary';
 export declare const colorForegroundSecondary: '--color-foreground-secondary';
@@ -469,10 +461,6 @@ export declare const colorInteractionOnStrongBackgroundActive: '--color-interact
 export declare const colorInteractionOnStrongBackgroundFocus: '--color-interaction-on-strong-background-focus';
 export declare const colorInteractionOnStrongBackgroundHover: '--color-interaction-on-strong-background-hover';
 export declare const colorInteractionOnStrongBackgroundPressed: '--color-interaction-on-strong-background-pressed';
-export declare const colorInteractionOnTranslucentBackgroundActive: '--color-interaction-on-translucent-background-active';
-export declare const colorInteractionOnTranslucentBackgroundFocus: '--color-interaction-on-translucent-background-focus';
-export declare const colorInteractionOnTranslucentBackgroundHover: '--color-interaction-on-translucent-background-hover';
-export declare const colorInteractionOnTranslucentBackgroundPressed: '--color-interaction-on-translucent-background-pressed';
 export declare const colorInteractionPressed: '--color-interaction-pressed';
 export declare const colorInvertedBackground: '--color-inverted-background';
 export declare const colorInvertedBorderBoldAi: '--color-inverted-border-bold-ai';
@@ -532,6 +520,7 @@ export declare const colorInvertedInteractionActive: '--color-inverted-interacti
 export declare const colorInvertedInteractionFocus: '--color-inverted-interaction-focus';
 export declare const colorInvertedInteractionHover: '--color-inverted-interaction-hover';
 export declare const colorInvertedInteractionPressed: '--color-inverted-interaction-pressed';
+export declare const colorInvertedShimmer: '--color-inverted-shimmer';
 export declare const colorLocationMarkerBackgroundBrand: '--color-location-marker-background-brand';
 export declare const colorLocationMarkerBackgroundCaution: '--color-location-marker-background-caution';
 export declare const colorLocationMarkerBackgroundNegative: '--color-location-marker-background-negative';
@@ -555,6 +544,7 @@ export declare const colorMediaInteractionActive: '--color-media-interaction-act
 export declare const colorMediaInteractionFocus: '--color-media-interaction-focus';
 export declare const colorMediaInteractionHover: '--color-media-interaction-hover';
 export declare const colorMediaInteractionPressed: '--color-media-interaction-pressed';
+export declare const colorMediaShimmer: '--color-media-shimmer';
 export declare const colorNavigationBackground: '--color-navigation-background';
 export declare const colorNavigationBorderPrimary: '--color-navigation-border-primary';
 export declare const colorNavigationBorderSecondary: '--color-navigation-border-secondary';
@@ -569,6 +559,7 @@ export declare const colorNavigationInteractionActive: '--color-navigation-inter
 export declare const colorNavigationInteractionFocus: '--color-navigation-interaction-focus';
 export declare const colorNavigationInteractionHover: '--color-navigation-interaction-hover';
 export declare const colorNavigationInteractionPressed: '--color-navigation-interaction-pressed';
+export declare const colorNavigationShimmer: '--color-navigation-shimmer';
 export declare const colorReferenceBlack0: '--color-reference-black-0';
 export declare const colorReferenceBlack10: '--color-reference-black-10';
 export declare const colorReferenceBlack100: '--color-reference-black-100';
@@ -722,8 +713,24 @@ export declare const colorSafetyScoreInteractionPressed: '--color-safety-score-i
 export declare const colorSettingsProfileBackground: '--color-settings-profile-background';
 export declare const colorSettingsProfileBorder: '--color-settings-profile-border';
 export declare const colorSettingsProfileForeground: '--color-settings-profile-foreground';
-export declare const colorShimmerFade: '--color-shimmer-fade';
-export declare const colorShimmerHighlight: '--color-shimmer-highlight';
+export declare const colorShimmerShimmer: '--color-shimmer-shimmer';
+export declare const colorShimmerShimmerOnBoldBackground: '--color-shimmer-shimmer-on-bold-background';
+export declare const colorShimmerShimmerOnMediumBackground: '--color-shimmer-shimmer-on-medium-background';
+export declare const colorShimmerShimmerOnStrongBackground: '--color-shimmer-shimmer-on-strong-background';
+export declare const colorTranslucentBorderPrimary: '--color-translucent-border-primary';
+export declare const colorTranslucentBorderSecondary: '--color-translucent-border-secondary';
+export declare const colorTranslucentBorderTertiary: '--color-translucent-border-tertiary';
+export declare const colorTranslucentDivider: '--color-translucent-divider';
+export declare const colorTranslucentForegroundPrimary: '--color-translucent-foreground-primary';
+export declare const colorTranslucentForegroundQuaternary: '--color-translucent-foreground-quaternary';
+export declare const colorTranslucentForegroundSecondary: '--color-translucent-foreground-secondary';
+export declare const colorTranslucentForegroundTertiary: '--color-translucent-foreground-tertiary';
+export declare const colorTranslucentInteractionActive: '--color-translucent-interaction-active';
+export declare const colorTranslucentInteractionFocus: '--color-translucent-interaction-focus';
+export declare const colorTranslucentInteractionHover: '--color-translucent-interaction-hover';
+export declare const colorTranslucentInteractionPressed: '--color-translucent-interaction-pressed';
+export declare const colorTranslucentShimmer: '--color-translucent-shimmer';
+export declare const colorTranslucentTranslucent: '--color-translucent-translucent';
 export declare const dimensionBase: '--dimension-base';
 export declare const dimensionCardHeightLg: '--dimension-card-height-lg';
 export declare const dimensionCardHeightMd: '--dimension-card-height-md';