Replaces --data-[colorName]-color with `--data-[colorName]-color-em…

…phasis` (#968) * update naming to reduce nesting in Figma * add fallback * github-actions[bot] Regenerated snapshots --------- Co-authored-by: lukasoppermann <lukasoppermann@users.noreply.github.com> Co-authored-by: Katie Langerman <18661030+langermank@users.noreply.github.com>
primer · Jul 31, 2024 · d845fdf · d845fdf
1 parent 13f62d5
commit d845fdf
Show file tree

Hide file tree

Showing 85 changed files with 36 additions and 21 deletions.
diff --git a/.changeset/swift-apricots-cough.md b/.changeset/swift-apricots-cough.md
@@ -0,0 +1,5 @@
+---
+'@primer/primitives': major
+---
+
+Rename data-[colorName]-color to data-[colorName]-color-emphasis
diff --git a/...orybook-all-color-swatches-dark-colorblind-data-auburn-color-emphasis-linux.png b/...orybook-all-color-swatches-dark-colorblind-data-auburn-color-emphasis-linux.png
diff --git a/...storybook-all-color-swatches-dark-colorblind-data-blue-color-emphasis-linux.png b/...storybook-all-color-swatches-dark-colorblind-data-blue-color-emphasis-linux.png
diff --git a/...storybook-all-color-swatches-dark-colorblind-data-gray-color-emphasis-linux.png b/...storybook-all-color-swatches-dark-colorblind-data-gray-color-emphasis-linux.png
diff --git a/...torybook-all-color-swatches-dark-colorblind-data-green-color-emphasis-linux.png b/...torybook-all-color-swatches-dark-colorblind-data-green-color-emphasis-linux.png
diff --git a/...orybook-all-color-swatches-dark-colorblind-data-orange-color-emphasis-linux.png b/...orybook-all-color-swatches-dark-colorblind-data-orange-color-emphasis-linux.png
diff --git a/...storybook-all-color-swatches-dark-colorblind-data-pink-color-emphasis-linux.png b/...storybook-all-color-swatches-dark-colorblind-data-pink-color-emphasis-linux.png
diff --git a/...orybook-all-color-swatches-dark-colorblind-data-purple-color-emphasis-linux.png b/...orybook-all-color-swatches-dark-colorblind-data-purple-color-emphasis-linux.png
diff --git a/.../storybook-all-color-swatches-dark-colorblind-data-red-color-emphasis-linux.png b/.../storybook-all-color-swatches-dark-colorblind-data-red-color-emphasis-linux.png
diff --git a/...storybook-all-color-swatches-dark-colorblind-data-teal-color-emphasis-linux.png b/...storybook-all-color-swatches-dark-colorblind-data-teal-color-emphasis-linux.png
diff --git a/...orybook-all-color-swatches-dark-colorblind-data-yellow-color-emphasis-linux.png b/...orybook-all-color-swatches-dark-colorblind-data-yellow-color-emphasis-linux.png
diff --git a/...napshots/storybook-all-color-swatches-dark-data-auburn-color-emphasis-linux.png b/...napshots/storybook-all-color-swatches-dark-data-auburn-color-emphasis-linux.png
diff --git a/...-snapshots/storybook-all-color-swatches-dark-data-blue-color-emphasis-linux.png b/...-snapshots/storybook-all-color-swatches-dark-data-blue-color-emphasis-linux.png
diff --git a/...-snapshots/storybook-all-color-swatches-dark-data-gray-color-emphasis-linux.png b/...-snapshots/storybook-all-color-swatches-dark-data-gray-color-emphasis-linux.png
diff --git a/...snapshots/storybook-all-color-swatches-dark-data-green-color-emphasis-linux.png b/...snapshots/storybook-all-color-swatches-dark-data-green-color-emphasis-linux.png
diff --git a/...napshots/storybook-all-color-swatches-dark-data-orange-color-emphasis-linux.png b/...napshots/storybook-all-color-swatches-dark-data-orange-color-emphasis-linux.png
diff --git a/...-snapshots/storybook-all-color-swatches-dark-data-pink-color-emphasis-linux.png b/...-snapshots/storybook-all-color-swatches-dark-data-pink-color-emphasis-linux.png
diff --git a/...napshots/storybook-all-color-swatches-dark-data-purple-color-emphasis-linux.png b/...napshots/storybook-all-color-swatches-dark-data-purple-color-emphasis-linux.png
diff --git a/...s-snapshots/storybook-all-color-swatches-dark-data-red-color-emphasis-linux.png b/...s-snapshots/storybook-all-color-swatches-dark-data-red-color-emphasis-linux.png
diff --git a/...-snapshots/storybook-all-color-swatches-dark-data-teal-color-emphasis-linux.png b/...-snapshots/storybook-all-color-swatches-dark-data-teal-color-emphasis-linux.png
diff --git a/...napshots/storybook-all-color-swatches-dark-data-yellow-color-emphasis-linux.png b/...napshots/storybook-all-color-swatches-dark-data-yellow-color-emphasis-linux.png
diff --git a/...book-all-color-swatches-dark-high-contrast-data-auburn-color-emphasis-linux.png b/...book-all-color-swatches-dark-high-contrast-data-auburn-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-dark-high-contrast-data-blue-color-emphasis-linux.png b/...rybook-all-color-swatches-dark-high-contrast-data-blue-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-dark-high-contrast-data-gray-color-emphasis-linux.png b/...rybook-all-color-swatches-dark-high-contrast-data-gray-color-emphasis-linux.png
diff --git a/...ybook-all-color-swatches-dark-high-contrast-data-green-color-emphasis-linux.png b/...ybook-all-color-swatches-dark-high-contrast-data-green-color-emphasis-linux.png
diff --git a/...book-all-color-swatches-dark-high-contrast-data-orange-color-emphasis-linux.png b/...book-all-color-swatches-dark-high-contrast-data-orange-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-dark-high-contrast-data-pink-color-emphasis-linux.png b/...rybook-all-color-swatches-dark-high-contrast-data-pink-color-emphasis-linux.png
diff --git a/...book-all-color-swatches-dark-high-contrast-data-purple-color-emphasis-linux.png b/...book-all-color-swatches-dark-high-contrast-data-purple-color-emphasis-linux.png
diff --git a/...orybook-all-color-swatches-dark-high-contrast-data-red-color-emphasis-linux.png b/...orybook-all-color-swatches-dark-high-contrast-data-red-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-dark-high-contrast-data-teal-color-emphasis-linux.png b/...rybook-all-color-swatches-dark-high-contrast-data-teal-color-emphasis-linux.png
diff --git a/...book-all-color-swatches-dark-high-contrast-data-yellow-color-emphasis-linux.png b/...book-all-color-swatches-dark-high-contrast-data-yellow-color-emphasis-linux.png
diff --git a/...orybook-all-color-swatches-dark-tritanopia-data-auburn-color-emphasis-linux.png b/...orybook-all-color-swatches-dark-tritanopia-data-auburn-color-emphasis-linux.png
diff --git a/...storybook-all-color-swatches-dark-tritanopia-data-blue-color-emphasis-linux.png b/...storybook-all-color-swatches-dark-tritanopia-data-blue-color-emphasis-linux.png
diff --git a/...storybook-all-color-swatches-dark-tritanopia-data-gray-color-emphasis-linux.png b/...storybook-all-color-swatches-dark-tritanopia-data-gray-color-emphasis-linux.png
diff --git a/...torybook-all-color-swatches-dark-tritanopia-data-green-color-emphasis-linux.png b/...torybook-all-color-swatches-dark-tritanopia-data-green-color-emphasis-linux.png
diff --git a/...orybook-all-color-swatches-dark-tritanopia-data-orange-color-emphasis-linux.png b/...orybook-all-color-swatches-dark-tritanopia-data-orange-color-emphasis-linux.png
diff --git a/...storybook-all-color-swatches-dark-tritanopia-data-pink-color-emphasis-linux.png b/...storybook-all-color-swatches-dark-tritanopia-data-pink-color-emphasis-linux.png
diff --git a/...orybook-all-color-swatches-dark-tritanopia-data-purple-color-emphasis-linux.png b/...orybook-all-color-swatches-dark-tritanopia-data-purple-color-emphasis-linux.png
diff --git a/.../storybook-all-color-swatches-dark-tritanopia-data-red-color-emphasis-linux.png b/.../storybook-all-color-swatches-dark-tritanopia-data-red-color-emphasis-linux.png
diff --git a/...storybook-all-color-swatches-dark-tritanopia-data-teal-color-emphasis-linux.png b/...storybook-all-color-swatches-dark-tritanopia-data-teal-color-emphasis-linux.png
diff --git a/...orybook-all-color-swatches-dark-tritanopia-data-yellow-color-emphasis-linux.png b/...orybook-all-color-swatches-dark-tritanopia-data-yellow-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-light-colorblind-data-auburn-color-emphasis-linux.png b/...rybook-all-color-swatches-light-colorblind-data-auburn-color-emphasis-linux.png
diff --git a/...torybook-all-color-swatches-light-colorblind-data-blue-color-emphasis-linux.png b/...torybook-all-color-swatches-light-colorblind-data-blue-color-emphasis-linux.png
diff --git a/...torybook-all-color-swatches-light-colorblind-data-gray-color-emphasis-linux.png b/...torybook-all-color-swatches-light-colorblind-data-gray-color-emphasis-linux.png
diff --git a/...orybook-all-color-swatches-light-colorblind-data-green-color-emphasis-linux.png b/...orybook-all-color-swatches-light-colorblind-data-green-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-light-colorblind-data-orange-color-emphasis-linux.png b/...rybook-all-color-swatches-light-colorblind-data-orange-color-emphasis-linux.png
diff --git a/...torybook-all-color-swatches-light-colorblind-data-pink-color-emphasis-linux.png b/...torybook-all-color-swatches-light-colorblind-data-pink-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-light-colorblind-data-purple-color-emphasis-linux.png b/...rybook-all-color-swatches-light-colorblind-data-purple-color-emphasis-linux.png
diff --git a/...storybook-all-color-swatches-light-colorblind-data-red-color-emphasis-linux.png b/...storybook-all-color-swatches-light-colorblind-data-red-color-emphasis-linux.png
diff --git a/...torybook-all-color-swatches-light-colorblind-data-teal-color-emphasis-linux.png b/...torybook-all-color-swatches-light-colorblind-data-teal-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-light-colorblind-data-yellow-color-emphasis-linux.png b/...rybook-all-color-swatches-light-colorblind-data-yellow-color-emphasis-linux.png
diff --git a/...apshots/storybook-all-color-swatches-light-data-auburn-color-emphasis-linux.png b/...apshots/storybook-all-color-swatches-light-data-auburn-color-emphasis-linux.png
diff --git a/...snapshots/storybook-all-color-swatches-light-data-blue-color-emphasis-linux.png b/...snapshots/storybook-all-color-swatches-light-data-blue-color-emphasis-linux.png
diff --git a/...snapshots/storybook-all-color-swatches-light-data-gray-color-emphasis-linux.png b/...snapshots/storybook-all-color-swatches-light-data-gray-color-emphasis-linux.png
diff --git a/...napshots/storybook-all-color-swatches-light-data-green-color-emphasis-linux.png b/...napshots/storybook-all-color-swatches-light-data-green-color-emphasis-linux.png
diff --git a/...apshots/storybook-all-color-swatches-light-data-orange-color-emphasis-linux.png b/...apshots/storybook-all-color-swatches-light-data-orange-color-emphasis-linux.png
diff --git a/...snapshots/storybook-all-color-swatches-light-data-pink-color-emphasis-linux.png b/...snapshots/storybook-all-color-swatches-light-data-pink-color-emphasis-linux.png
diff --git a/...apshots/storybook-all-color-swatches-light-data-purple-color-emphasis-linux.png b/...apshots/storybook-all-color-swatches-light-data-purple-color-emphasis-linux.png
diff --git a/...-snapshots/storybook-all-color-swatches-light-data-red-color-emphasis-linux.png b/...-snapshots/storybook-all-color-swatches-light-data-red-color-emphasis-linux.png
diff --git a/...snapshots/storybook-all-color-swatches-light-data-teal-color-emphasis-linux.png b/...snapshots/storybook-all-color-swatches-light-data-teal-color-emphasis-linux.png
diff --git a/...apshots/storybook-all-color-swatches-light-data-yellow-color-emphasis-linux.png b/...apshots/storybook-all-color-swatches-light-data-yellow-color-emphasis-linux.png
diff --git a/...ook-all-color-swatches-light-high-contrast-data-auburn-color-emphasis-linux.png b/...ook-all-color-swatches-light-high-contrast-data-auburn-color-emphasis-linux.png
diff --git a/...ybook-all-color-swatches-light-high-contrast-data-blue-color-emphasis-linux.png b/...ybook-all-color-swatches-light-high-contrast-data-blue-color-emphasis-linux.png
diff --git a/...ybook-all-color-swatches-light-high-contrast-data-gray-color-emphasis-linux.png b/...ybook-all-color-swatches-light-high-contrast-data-gray-color-emphasis-linux.png
diff --git a/...book-all-color-swatches-light-high-contrast-data-green-color-emphasis-linux.png b/...book-all-color-swatches-light-high-contrast-data-green-color-emphasis-linux.png
diff --git a/...ook-all-color-swatches-light-high-contrast-data-orange-color-emphasis-linux.png b/...ook-all-color-swatches-light-high-contrast-data-orange-color-emphasis-linux.png
diff --git a/...ybook-all-color-swatches-light-high-contrast-data-pink-color-emphasis-linux.png b/...ybook-all-color-swatches-light-high-contrast-data-pink-color-emphasis-linux.png
diff --git a/...ook-all-color-swatches-light-high-contrast-data-purple-color-emphasis-linux.png b/...ook-all-color-swatches-light-high-contrast-data-purple-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-light-high-contrast-data-red-color-emphasis-linux.png b/...rybook-all-color-swatches-light-high-contrast-data-red-color-emphasis-linux.png
diff --git a/...ybook-all-color-swatches-light-high-contrast-data-teal-color-emphasis-linux.png b/...ybook-all-color-swatches-light-high-contrast-data-teal-color-emphasis-linux.png
diff --git a/...ook-all-color-swatches-light-high-contrast-data-yellow-color-emphasis-linux.png b/...ook-all-color-swatches-light-high-contrast-data-yellow-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-light-tritanopia-data-auburn-color-emphasis-linux.png b/...rybook-all-color-swatches-light-tritanopia-data-auburn-color-emphasis-linux.png
diff --git a/...torybook-all-color-swatches-light-tritanopia-data-blue-color-emphasis-linux.png b/...torybook-all-color-swatches-light-tritanopia-data-blue-color-emphasis-linux.png
diff --git a/...torybook-all-color-swatches-light-tritanopia-data-gray-color-emphasis-linux.png b/...torybook-all-color-swatches-light-tritanopia-data-gray-color-emphasis-linux.png
diff --git a/...orybook-all-color-swatches-light-tritanopia-data-green-color-emphasis-linux.png b/...orybook-all-color-swatches-light-tritanopia-data-green-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-light-tritanopia-data-orange-color-emphasis-linux.png b/...rybook-all-color-swatches-light-tritanopia-data-orange-color-emphasis-linux.png
diff --git a/...torybook-all-color-swatches-light-tritanopia-data-pink-color-emphasis-linux.png b/...torybook-all-color-swatches-light-tritanopia-data-pink-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-light-tritanopia-data-purple-color-emphasis-linux.png b/...rybook-all-color-swatches-light-tritanopia-data-purple-color-emphasis-linux.png
diff --git a/...storybook-all-color-swatches-light-tritanopia-data-red-color-emphasis-linux.png b/...storybook-all-color-swatches-light-tritanopia-data-red-color-emphasis-linux.png
diff --git a/...torybook-all-color-swatches-light-tritanopia-data-teal-color-emphasis-linux.png b/...torybook-all-color-swatches-light-tritanopia-data-teal-color-emphasis-linux.png
diff --git a/...rybook-all-color-swatches-light-tritanopia-data-yellow-color-emphasis-linux.png b/...rybook-all-color-swatches-light-tritanopia-data-yellow-color-emphasis-linux.png
diff --git a/blob-report/report.zip b/blob-report/report.zip
diff --git a/src/tokens/fallback/color-fallbacks.json b/src/tokens/fallback/color-fallbacks.json
@@ -256,5 +256,15 @@
   "--shadow-floating-xlarge": "var(--color-shadow-extra-large)",
   "--shadow-inset": "var(--color-primer-shadow-inset)",
   "--borderColor-transparent": "transparent",
-  "--bgColor-transparent": "transparent"
+  "--bgColor-transparent": "transparent",
+  "--data-blue-color": "var(--data-blue-color-emphasis)",
+  "--data-auburn-color": "var(--data-auburn-color-emphasis)",
+  "--data-orange-color": "var(--data-orange-color-emphasis)",
+  "--data-yellow-color": "var(--data-yellow-color-emphasis)",
+  "--data-green-color": "var(--data-green-color-emphasis)",
+  "--data-teal-color": "var(--data-teal-color-emphasis)",
+  "--data-purple-color": "var(--data-purple-color-emphasis)",
+  "--data-pink-color": "var(--data-pink-color-emphasis)",
+  "--data-red-color": "var(--data-red-color-emphasis)",
+  "--data-gray-color": "var(--data-gray-color-emphasis)"
 }
diff --git a/src/tokens/functional/color/dark/data-vis-dark.json5 b/src/tokens/functional/color/dark/data-vis-dark.json5
@@ -2,7 +2,7 @@
   data: {
     blue: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.blue.5}',
           $type: 'color',
           $extensions: {
@@ -30,7 +30,7 @@
     },
     auburn: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.auburn.5}',
           $type: 'color',
           $extensions: {
@@ -58,7 +58,7 @@
     },
     orange: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.orange.4}',
           $type: 'color',
           $extensions: {
@@ -86,7 +86,7 @@
     },
     yellow: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.yellow.4}',
           $type: 'color',
           $extensions: {
@@ -114,7 +114,7 @@
     },
     green: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.green.4}',
           $type: 'color',
           $extensions: {
@@ -142,7 +142,7 @@
     },
     teal: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.teal.4}',
           $type: 'color',
           $extensions: {
@@ -170,7 +170,7 @@
     },
     purple: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.purple.5}',
           $type: 'color',
           $extensions: {
@@ -198,7 +198,7 @@
     },
     pink: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.pink.5}',
           $type: 'color',
           $extensions: {
@@ -226,7 +226,7 @@
     },
     red: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.red.5}',
           $type: 'color',
           $extensions: {
@@ -254,7 +254,7 @@
     },
     gray: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.gray.4}',
           $type: 'color',
           $extensions: {

diff --git a/src/tokens/functional/color/light/data-vis-light.json5 b/src/tokens/functional/color/light/data-vis-light.json5
@@ -2,7 +2,7 @@
   data: {
     blue: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.blue.5}',
           $type: 'color',
           $extensions: {
@@ -30,7 +30,7 @@
     },
     auburn: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.auburn.5}',
           $type: 'color',
           $extensions: {
@@ -58,7 +58,7 @@
     },
     orange: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.orange.4}',
           $type: 'color',
           $extensions: {
@@ -86,7 +86,7 @@
     },
     yellow: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.yellow.4}',
           $type: 'color',
           $extensions: {
@@ -114,7 +114,7 @@
     },
     green: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.green.4}',
           $type: 'color',
           $extensions: {
@@ -142,7 +142,7 @@
     },
     teal: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.teal.4}',
           $type: 'color',
           $extensions: {
@@ -170,7 +170,7 @@
     },
     purple: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.purple.5}',
           $type: 'color',
           $extensions: {
@@ -198,7 +198,7 @@
     },
     pink: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.pink.5}',
           $type: 'color',
           $extensions: {
@@ -226,7 +226,7 @@
     },
     red: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.red.5}',
           $type: 'color',
           $extensions: {
@@ -254,7 +254,7 @@
     },
     gray: {
       color: {
-        '@': {
+        'emphasis': {
           $value: '{base.display.color.gray.4}',
           $type: 'color',
           $extensions: {