WIP

pinterest · Dec 16, 2024 · 16a97df · 16a97df
1 parent 5345569
commit 16a97df
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 4 deletions.
diff --git a/packages/gestalt-design-tokens/tests/__snapshots__/android.test.js.snap b/packages/gestalt-design-tokens/tests/__snapshots__/android.test.js.snap
@@ -772,6 +772,8 @@ Object {
   "dist/android/vr-theme/component/spinner.xml": "<?xml version=\\"1.0\\" encoding=\\"UTF-8\\"?>
 
 <resources>
+  <dimen name=\\"comp_spinner_grayscale_background\\">@dimen/base_color_grayscale_350</dimen>
+  <dimen name=\\"comp_spinner_white_background\\">@dimen/sema_color_background_light</dimen>
   <dimen name=\\"comp_spinner_color_background_1\\">#c85bd2</dimen>
   <dimen name=\\"comp_spinner_color_background_2\\">#e57534</dimen>
   <dimen name=\\"comp_spinner_color_background_3\\">#22a596</dimen>

diff --git a/packages/gestalt-design-tokens/tests/__snapshots__/ios.test.js.snap b/packages/gestalt-design-tokens/tests/__snapshots__/ios.test.js.snap
@@ -1337,6 +1337,8 @@ public enum GestaltTokensSpinner {
     public static let compMotionExitDuration = baseDuration150
     public static let compMotionEnterEasing = baseEasingEnter
     public static let compMotionEnterDuration = baseDuration300
+    public static let compGrayscaleBackground = baseGrayscale350
+    public static let compWhiteBackground = semaBackgroundLight
 }
 ",
 }

diff --git a/packages/gestalt-design-tokens/tests/__snapshots__/web.test.js.snap b/packages/gestalt-design-tokens/tests/__snapshots__/web.test.js.snap
diff --git a/packages/gestalt/src/contexts/__snapshots__/ColorSchemeProvider.jsdom.test.tsx.snap b/packages/gestalt/src/contexts/__snapshots__/ColorSchemeProvider.jsdom.test.tsx.snap
@@ -3136,6 +3136,8 @@ exports[`visual refresh tokens uses visual refresh dark mode theme when specifie
   --comp-radiogroupbutton-motion-border-scale-duration: 150ms;
   --comp-radiogroupbutton-motion-border-fade-easing: cubic-bezier(0.3, 0, 0.8, 0.15);
   --comp-radiogroupbutton-motion-border-fade-duration: 150ms;
+  --comp-spinner-grayscale-background: #4c4c4a;
+  --comp-spinner-white-background: #ffffff;
   --comp-spinner-color-background-1: #c85bd2;
   --comp-spinner-color-background-2: #e57534;
   --comp-spinner-color-background-3: #22a596;
@@ -4146,6 +4148,8 @@ exports[`visual refresh tokens uses visual refresh light mode theme when specifi
   --comp-radiogroupbutton-motion-border-scale-duration: 150ms;
   --comp-radiogroupbutton-motion-border-fade-easing: cubic-bezier(0.3, 0, 0.8, 0.15);
   --comp-radiogroupbutton-motion-border-fade-duration: 150ms;
+  --comp-spinner-grayscale-background: #4c4c4a;
+  --comp-spinner-white-background: #ffffff;
   --comp-spinner-color-background-1: #c85bd2;
   --comp-spinner-color-background-2: #e57534;
   --comp-spinner-color-background-3: #22a596;
@@ -5156,6 +5160,8 @@ exports[`visual refresh tokens uses visual refresh with ck line height 1`] = `
   --comp-radiogroupbutton-motion-border-scale-duration: 150ms;
   --comp-radiogroupbutton-motion-border-fade-easing: cubic-bezier(0.3, 0, 0.8, 0.15);
   --comp-radiogroupbutton-motion-border-fade-duration: 150ms;
+  --comp-spinner-grayscale-background: #4c4c4a;
+  --comp-spinner-white-background: #ffffff;
   --comp-spinner-color-background-1: #c85bd2;
   --comp-spinner-color-background-2: #e57534;
   --comp-spinner-color-background-3: #22a596;
@@ -6166,6 +6172,8 @@ exports[`visual refresh tokens uses visual refresh with ja line height 1`] = `
   --comp-radiogroupbutton-motion-border-scale-duration: 150ms;
   --comp-radiogroupbutton-motion-border-fade-easing: cubic-bezier(0.3, 0, 0.8, 0.15);
   --comp-radiogroupbutton-motion-border-fade-duration: 150ms;
+  --comp-spinner-grayscale-background: #4c4c4a;
+  --comp-spinner-white-background: #ffffff;
   --comp-spinner-color-background-1: #c85bd2;
   --comp-spinner-color-background-2: #e57534;
   --comp-spinner-color-background-3: #22a596;
@@ -7176,6 +7184,8 @@ exports[`visual refresh tokens uses visual refresh with tall line height 1`] = `
   --comp-radiogroupbutton-motion-border-scale-duration: 150ms;
   --comp-radiogroupbutton-motion-border-fade-easing: cubic-bezier(0.3, 0, 0.8, 0.15);
   --comp-radiogroupbutton-motion-border-fade-duration: 150ms;
+  --comp-spinner-grayscale-background: #4c4c4a;
+  --comp-spinner-white-background: #ffffff;
   --comp-spinner-color-background-1: #c85bd2;
   --comp-spinner-color-background-2: #e57534;
   --comp-spinner-color-background-3: #22a596;
@@ -8186,6 +8196,8 @@ exports[`visual refresh tokens uses visual refresh with th line height 1`] = `
   --comp-radiogroupbutton-motion-border-scale-duration: 150ms;
   --comp-radiogroupbutton-motion-border-fade-easing: cubic-bezier(0.3, 0, 0.8, 0.15);
   --comp-radiogroupbutton-motion-border-fade-duration: 150ms;
+  --comp-spinner-grayscale-background: #4c4c4a;
+  --comp-spinner-white-background: #ffffff;
   --comp-spinner-color-background-1: #c85bd2;
   --comp-spinner-color-background-2: #e57534;
   --comp-spinner-color-background-3: #22a596;
@@ -9196,6 +9208,8 @@ exports[`visual refresh tokens uses visual refresh with vi line height 1`] = `
   --comp-radiogroupbutton-motion-border-scale-duration: 150ms;
   --comp-radiogroupbutton-motion-border-fade-easing: cubic-bezier(0.3, 0, 0.8, 0.15);
   --comp-radiogroupbutton-motion-border-fade-duration: 150ms;
+  --comp-spinner-grayscale-background: #4c4c4a;
+  --comp-spinner-white-background: #ffffff;
   --comp-spinner-color-background-1: #c85bd2;
   --comp-spinner-color-background-2: #e57534;
   --comp-spinner-color-background-3: #22a596;