@primer/primitives 8.0.0 → 8.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (62) hide show
  1. package/dist/css/functional/size/size-coarse.css +0 -7
  2. package/dist/css/functional/size/size-fine.css +0 -7
  3. package/dist/css/functional/themes/dark-colorblind.css +10 -0
  4. package/dist/css/functional/themes/dark-dimmed.css +10 -0
  5. package/dist/css/functional/themes/dark-high-contrast.css +10 -0
  6. package/dist/css/functional/themes/dark-tritanopia.css +10 -0
  7. package/dist/css/functional/themes/dark.css +10 -0
  8. package/dist/css/functional/themes/light-colorblind.css +10 -0
  9. package/dist/css/functional/themes/light-high-contrast.css +10 -0
  10. package/dist/css/functional/themes/light-tritanopia.css +10 -0
  11. package/dist/css/functional/themes/light.css +10 -0
  12. package/dist/css/functional/typography/typography.css +12 -12
  13. package/dist/docs/functional/themes/dark-colorblind.json +145 -0
  14. package/dist/docs/functional/themes/dark-dimmed.json +145 -0
  15. package/dist/docs/functional/themes/dark-high-contrast.json +145 -0
  16. package/dist/docs/functional/themes/dark-tritanopia.json +145 -0
  17. package/dist/docs/functional/themes/dark.json +145 -0
  18. package/dist/docs/functional/themes/light-colorblind.json +145 -0
  19. package/dist/docs/functional/themes/light-high-contrast.json +145 -0
  20. package/dist/docs/functional/themes/light-tritanopia.json +145 -0
  21. package/dist/docs/functional/themes/light.json +145 -0
  22. package/dist/figma/themes/dark-colorblind.json +80 -0
  23. package/dist/figma/themes/dark-dimmed.json +80 -0
  24. package/dist/figma/themes/dark-high-contrast.json +80 -0
  25. package/dist/figma/themes/dark-tritanopia.json +80 -0
  26. package/dist/figma/themes/dark.json +80 -0
  27. package/dist/figma/themes/light-colorblind.json +80 -0
  28. package/dist/figma/themes/light-high-contrast.json +80 -0
  29. package/dist/figma/themes/light-tritanopia.json +80 -0
  30. package/dist/figma/themes/light.json +80 -0
  31. package/dist/figma/typography/typography.json +10 -10
  32. package/dist/internalCss/dark-colorblind.css +10 -0
  33. package/dist/internalCss/dark-dimmed.css +10 -0
  34. package/dist/internalCss/dark-high-contrast.css +10 -0
  35. package/dist/internalCss/dark-tritanopia.css +10 -0
  36. package/dist/internalCss/dark.css +10 -0
  37. package/dist/internalCss/light-colorblind.css +10 -0
  38. package/dist/internalCss/light-high-contrast.css +10 -0
  39. package/dist/internalCss/light-tritanopia.css +10 -0
  40. package/dist/internalCss/light.css +10 -0
  41. package/dist/styleLint/functional/themes/dark-colorblind.json +145 -0
  42. package/dist/styleLint/functional/themes/dark-dimmed.json +145 -0
  43. package/dist/styleLint/functional/themes/dark-high-contrast.json +145 -0
  44. package/dist/styleLint/functional/themes/dark-tritanopia.json +145 -0
  45. package/dist/styleLint/functional/themes/dark.json +145 -0
  46. package/dist/styleLint/functional/themes/light-colorblind.json +145 -0
  47. package/dist/styleLint/functional/themes/light-high-contrast.json +145 -0
  48. package/dist/styleLint/functional/themes/light-tritanopia.json +145 -0
  49. package/dist/styleLint/functional/themes/light.json +145 -0
  50. package/package.json +5 -7
  51. package/src/PrimerStyleDictionary.ts +9 -15
  52. package/src/formats/cssAdvanced.ts +99 -0
  53. package/src/formats/index.ts +1 -3
  54. package/src/platforms/css.ts +25 -17
  55. package/src/platforms/figma.ts +1 -1
  56. package/src/tokens/functional/color/dark/display-dark.json5 +66 -0
  57. package/src/tokens/functional/color/light/display-light.json5 +66 -0
  58. package/src/transformers/floatToPixel.ts +9 -2
  59. package/src/transformers/index.ts +1 -0
  60. package/src/formats/cssThemed.ts +0 -35
  61. package/src/formats/cssVariables.ts +0 -25
  62. package/src/formats/cssWrapMediaQuery.ts +0 -29
package/dist/css/functional/size/size-coarse.css CHANGED
@@ -1,7 +0,0 @@
1
- @media (pointer: coarse) {
2
- :root {
3
- --control-minTarget-auto: 2.75rem;
4
- --controlStack-small-gap-auto: 1rem;
5
- --controlStack-medium-gap-auto: 0.75rem;
6
- }
7
- }
package/dist/css/functional/size/size-fine.css CHANGED
@@ -1,7 +0,0 @@
1
- @media (pointer: fine) {
2
- :root {
3
- --control-minTarget-auto: 1rem;
4
- --controlStack-small-gap-auto: 0.5rem;
5
- --controlStack-medium-gap-auto: 0.5rem;
6
- }
7
- }
package/dist/css/functional/themes/dark-colorblind.css CHANGED
@@ -77,6 +77,11 @@
77
77
  --display-red-fgColor: #f27d83;
78
78
  --display-red-borderColor-muted: #58091a;
79
79
  --display-red-borderColor-emphasis: #eb3342;
80
+ --display-coral-bgColor-muted: #3c0614;
81
+ --display-coral-bgColor-emphasis: #eb3342;
82
+ --display-coral-fgColor: #f27d83;
83
+ --display-coral-borderColor-muted: #58091a;
84
+ --display-coral-borderColor-emphasis: #eb3342;
80
85
  --display-yellow-bgColor-muted: #2e1a00;
81
86
  --display-yellow-bgColor-emphasis: #aa7109;
82
87
  --display-yellow-fgColor: #d3910d;
@@ -620,6 +625,11 @@
620
625
  --display-red-fgColor: #f27d83;
621
626
  --display-red-borderColor-muted: #58091a;
622
627
  --display-red-borderColor-emphasis: #eb3342;
628
+ --display-coral-bgColor-muted: #3c0614;
629
+ --display-coral-bgColor-emphasis: #eb3342;
630
+ --display-coral-fgColor: #f27d83;
631
+ --display-coral-borderColor-muted: #58091a;
632
+ --display-coral-borderColor-emphasis: #eb3342;
623
633
  --display-yellow-bgColor-muted: #2e1a00;
624
634
  --display-yellow-bgColor-emphasis: #aa7109;
625
635
  --display-yellow-fgColor: #d3910d;
package/dist/css/functional/themes/dark-dimmed.css CHANGED
@@ -77,6 +77,11 @@
77
77
  --display-red-fgColor: #f27d83;
78
78
  --display-red-borderColor-muted: #58091a;
79
79
  --display-red-borderColor-emphasis: #eb3342;
80
+ --display-coral-bgColor-muted: #3c0614;
81
+ --display-coral-bgColor-emphasis: #eb3342;
82
+ --display-coral-fgColor: #f27d83;
83
+ --display-coral-borderColor-muted: #58091a;
84
+ --display-coral-borderColor-emphasis: #eb3342;
80
85
  --display-yellow-bgColor-muted: #2e1a00;
81
86
  --display-yellow-bgColor-emphasis: #aa7109;
82
87
  --display-yellow-fgColor: #d3910d;
@@ -620,6 +625,11 @@
620
625
  --display-red-fgColor: #f27d83;
621
626
  --display-red-borderColor-muted: #58091a;
622
627
  --display-red-borderColor-emphasis: #eb3342;
628
+ --display-coral-bgColor-muted: #3c0614;
629
+ --display-coral-bgColor-emphasis: #eb3342;
630
+ --display-coral-fgColor: #f27d83;
631
+ --display-coral-borderColor-muted: #58091a;
632
+ --display-coral-borderColor-emphasis: #eb3342;
623
633
  --display-yellow-bgColor-muted: #2e1a00;
624
634
  --display-yellow-bgColor-emphasis: #aa7109;
625
635
  --display-yellow-fgColor: #d3910d;
package/dist/css/functional/themes/dark-high-contrast.css CHANGED
@@ -77,6 +77,11 @@
77
77
  --display-red-fgColor: #f27d83;
78
78
  --display-red-borderColor-muted: #58091a;
79
79
  --display-red-borderColor-emphasis: #eb3342;
80
+ --display-coral-bgColor-muted: #3c0614;
81
+ --display-coral-bgColor-emphasis: #eb3342;
82
+ --display-coral-fgColor: #f27d83;
83
+ --display-coral-borderColor-muted: #58091a;
84
+ --display-coral-borderColor-emphasis: #eb3342;
80
85
  --display-yellow-bgColor-muted: #2e1a00;
81
86
  --display-yellow-bgColor-emphasis: #aa7109;
82
87
  --display-yellow-fgColor: #d3910d;
@@ -620,6 +625,11 @@
620
625
  --display-red-fgColor: #f27d83;
621
626
  --display-red-borderColor-muted: #58091a;
622
627
  --display-red-borderColor-emphasis: #eb3342;
628
+ --display-coral-bgColor-muted: #3c0614;
629
+ --display-coral-bgColor-emphasis: #eb3342;
630
+ --display-coral-fgColor: #f27d83;
631
+ --display-coral-borderColor-muted: #58091a;
632
+ --display-coral-borderColor-emphasis: #eb3342;
623
633
  --display-yellow-bgColor-muted: #2e1a00;
624
634
  --display-yellow-bgColor-emphasis: #aa7109;
625
635
  --display-yellow-fgColor: #d3910d;
package/dist/css/functional/themes/dark-tritanopia.css CHANGED
@@ -77,6 +77,11 @@
77
77
  --display-red-fgColor: #f27d83;
78
78
  --display-red-borderColor-muted: #58091a;
79
79
  --display-red-borderColor-emphasis: #eb3342;
80
+ --display-coral-bgColor-muted: #3c0614;
81
+ --display-coral-bgColor-emphasis: #eb3342;
82
+ --display-coral-fgColor: #f27d83;
83
+ --display-coral-borderColor-muted: #58091a;
84
+ --display-coral-borderColor-emphasis: #eb3342;
80
85
  --display-yellow-bgColor-muted: #2e1a00;
81
86
  --display-yellow-bgColor-emphasis: #aa7109;
82
87
  --display-yellow-fgColor: #d3910d;
@@ -620,6 +625,11 @@
620
625
  --display-red-fgColor: #f27d83;
621
626
  --display-red-borderColor-muted: #58091a;
622
627
  --display-red-borderColor-emphasis: #eb3342;
628
+ --display-coral-bgColor-muted: #3c0614;
629
+ --display-coral-bgColor-emphasis: #eb3342;
630
+ --display-coral-fgColor: #f27d83;
631
+ --display-coral-borderColor-muted: #58091a;
632
+ --display-coral-borderColor-emphasis: #eb3342;
623
633
  --display-yellow-bgColor-muted: #2e1a00;
624
634
  --display-yellow-bgColor-emphasis: #aa7109;
625
635
  --display-yellow-fgColor: #d3910d;
package/dist/css/functional/themes/dark.css CHANGED
@@ -77,6 +77,11 @@
77
77
  --display-red-fgColor: #f27d83;
78
78
  --display-red-borderColor-muted: #58091a;
79
79
  --display-red-borderColor-emphasis: #eb3342;
80
+ --display-coral-bgColor-muted: #3c0614;
81
+ --display-coral-bgColor-emphasis: #eb3342;
82
+ --display-coral-fgColor: #f27d83;
83
+ --display-coral-borderColor-muted: #58091a;
84
+ --display-coral-borderColor-emphasis: #eb3342;
80
85
  --display-yellow-bgColor-muted: #2e1a00;
81
86
  --display-yellow-bgColor-emphasis: #aa7109;
82
87
  --display-yellow-fgColor: #d3910d;
@@ -620,6 +625,11 @@
620
625
  --display-red-fgColor: #f27d83;
621
626
  --display-red-borderColor-muted: #58091a;
622
627
  --display-red-borderColor-emphasis: #eb3342;
628
+ --display-coral-bgColor-muted: #3c0614;
629
+ --display-coral-bgColor-emphasis: #eb3342;
630
+ --display-coral-fgColor: #f27d83;
631
+ --display-coral-borderColor-muted: #58091a;
632
+ --display-coral-borderColor-emphasis: #eb3342;
623
633
  --display-yellow-bgColor-muted: #2e1a00;
624
634
  --display-yellow-bgColor-emphasis: #aa7109;
625
635
  --display-yellow-fgColor: #d3910d;
package/dist/css/functional/themes/light-colorblind.css CHANGED
@@ -77,6 +77,11 @@
77
77
  --display-red-fgColor: #c50d28;
78
78
  --display-red-borderColor-muted: #fecdcd;
79
79
  --display-red-borderColor-emphasis: #df0c24;
80
+ --display-coral-bgColor-muted: #ffe5db;
81
+ --display-coral-bgColor-emphasis: #d43511;
82
+ --display-coral-fgColor: #ba2e12;
83
+ --display-coral-borderColor-muted: #fecebe;
84
+ --display-coral-borderColor-emphasis: #d43511;
80
85
  --display-yellow-bgColor-muted: #ffec9e;
81
86
  --display-yellow-bgColor-emphasis: #946a00;
82
87
  --display-yellow-fgColor: #805900;
@@ -620,6 +625,11 @@
620
625
  --display-red-fgColor: #c50d28;
621
626
  --display-red-borderColor-muted: #fecdcd;
622
627
  --display-red-borderColor-emphasis: #df0c24;
628
+ --display-coral-bgColor-muted: #ffe5db;
629
+ --display-coral-bgColor-emphasis: #d43511;
630
+ --display-coral-fgColor: #ba2e12;
631
+ --display-coral-borderColor-muted: #fecebe;
632
+ --display-coral-borderColor-emphasis: #d43511;
623
633
  --display-yellow-bgColor-muted: #ffec9e;
624
634
  --display-yellow-bgColor-emphasis: #946a00;
625
635
  --display-yellow-fgColor: #805900;
package/dist/css/functional/themes/light-high-contrast.css CHANGED
@@ -77,6 +77,11 @@
77
77
  --display-red-fgColor: #c50d28;
78
78
  --display-red-borderColor-muted: #fecdcd;
79
79
  --display-red-borderColor-emphasis: #df0c24;
80
+ --display-coral-bgColor-muted: #ffe5db;
81
+ --display-coral-bgColor-emphasis: #d43511;
82
+ --display-coral-fgColor: #ba2e12;
83
+ --display-coral-borderColor-muted: #fecebe;
84
+ --display-coral-borderColor-emphasis: #d43511;
80
85
  --display-yellow-bgColor-muted: #ffec9e;
81
86
  --display-yellow-bgColor-emphasis: #946a00;
82
87
  --display-yellow-fgColor: #805900;
@@ -620,6 +625,11 @@
620
625
  --display-red-fgColor: #c50d28;
621
626
  --display-red-borderColor-muted: #fecdcd;
622
627
  --display-red-borderColor-emphasis: #df0c24;
628
+ --display-coral-bgColor-muted: #ffe5db;
629
+ --display-coral-bgColor-emphasis: #d43511;
630
+ --display-coral-fgColor: #ba2e12;
631
+ --display-coral-borderColor-muted: #fecebe;
632
+ --display-coral-borderColor-emphasis: #d43511;
623
633
  --display-yellow-bgColor-muted: #ffec9e;
624
634
  --display-yellow-bgColor-emphasis: #946a00;
625
635
  --display-yellow-fgColor: #805900;
package/dist/css/functional/themes/light-tritanopia.css CHANGED
@@ -77,6 +77,11 @@
77
77
  --display-red-fgColor: #c50d28;
78
78
  --display-red-borderColor-muted: #fecdcd;
79
79
  --display-red-borderColor-emphasis: #df0c24;
80
+ --display-coral-bgColor-muted: #ffe5db;
81
+ --display-coral-bgColor-emphasis: #d43511;
82
+ --display-coral-fgColor: #ba2e12;
83
+ --display-coral-borderColor-muted: #fecebe;
84
+ --display-coral-borderColor-emphasis: #d43511;
80
85
  --display-yellow-bgColor-muted: #ffec9e;
81
86
  --display-yellow-bgColor-emphasis: #946a00;
82
87
  --display-yellow-fgColor: #805900;
@@ -620,6 +625,11 @@
620
625
  --display-red-fgColor: #c50d28;
621
626
  --display-red-borderColor-muted: #fecdcd;
622
627
  --display-red-borderColor-emphasis: #df0c24;
628
+ --display-coral-bgColor-muted: #ffe5db;
629
+ --display-coral-bgColor-emphasis: #d43511;
630
+ --display-coral-fgColor: #ba2e12;
631
+ --display-coral-borderColor-muted: #fecebe;
632
+ --display-coral-borderColor-emphasis: #d43511;
623
633
  --display-yellow-bgColor-muted: #ffec9e;
624
634
  --display-yellow-bgColor-emphasis: #946a00;
625
635
  --display-yellow-fgColor: #805900;
package/dist/css/functional/themes/light.css CHANGED
@@ -77,6 +77,11 @@
77
77
  --display-red-fgColor: #c50d28;
78
78
  --display-red-borderColor-muted: #fecdcd;
79
79
  --display-red-borderColor-emphasis: #df0c24;
80
+ --display-coral-bgColor-muted: #ffe5db;
81
+ --display-coral-bgColor-emphasis: #d43511;
82
+ --display-coral-fgColor: #ba2e12;
83
+ --display-coral-borderColor-muted: #fecebe;
84
+ --display-coral-borderColor-emphasis: #d43511;
80
85
  --display-yellow-bgColor-muted: #ffec9e;
81
86
  --display-yellow-bgColor-emphasis: #946a00;
82
87
  --display-yellow-fgColor: #805900;
@@ -620,6 +625,11 @@
620
625
  --display-red-fgColor: #c50d28;
621
626
  --display-red-borderColor-muted: #fecdcd;
622
627
  --display-red-borderColor-emphasis: #df0c24;
628
+ --display-coral-bgColor-muted: #ffe5db;
629
+ --display-coral-bgColor-emphasis: #d43511;
630
+ --display-coral-fgColor: #ba2e12;
631
+ --display-coral-borderColor-muted: #fecebe;
632
+ --display-coral-borderColor-emphasis: #d43511;
623
633
  --display-yellow-bgColor-muted: #ffec9e;
624
634
  --display-yellow-bgColor-emphasis: #946a00;
625
635
  --display-yellow-fgColor: #805900;
package/dist/css/functional/typography/typography.css CHANGED
@@ -22,8 +22,8 @@
22
22
  --text-display-size: 2.5rem;
23
23
  --text-display-lineBoxHeight: 1.4;
24
24
  --fontStack-monospace: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
25
- --fontStack-sansSerif: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
26
- --fontStack-system: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
25
+ --fontStack-sansSerif: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
26
+ --fontStack-system: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
27
27
  --text-codeInline-weight: var(--base-text-weight-normal);
28
28
  --text-codeBlock-weight: var(--base-text-weight-normal);
29
29
  --text-caption-weight: var(--base-text-weight-normal);
@@ -34,14 +34,14 @@
34
34
  --text-title-weight-large: var(--base-text-weight-semibold);
35
35
  --text-display-weight: var(--base-text-weight-medium);
36
36
  --text-codeInline-shorthand: var(--text-codeInline-weight) var(--text-codeInline-size) var(--fontStack-monospace);
37
- --text-codeBlock-shorthand: var(--text-codeBlock-weight) var(--text-codeBlock-size)/var(--text-codeBlock-lineHeight) var(--fontStack-monospace);
38
- --text-caption-shorthand: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-lineHeight) var(--fontStack-sansSerif);
39
- --text-body-shorthand-small: var(--text-body-weight) var(--text-body-size-small)/var(--text-body-lineHeight-small) var(--fontStack-sansSerif);
40
- --text-body-shorthand-medium: var(--text-body-weight) var(--text-body-size-medium)/var(--text-body-lineHeight-medium) var(--fontStack-sansSerif);
41
- --text-body-shorthand-large: var(--text-body-weight) var(--text-body-size-large)/var(--text-body-lineHeight-large) var(--fontStack-sansSerif);
42
- --text-subtitle-shorthand: var(--text-subtitle-weight) var(--text-subtitle-size)/var(--text-subtitle-lineHeight) var(--fontStack-sansSerif);
43
- --text-title-shorthand-small: var(--text-title-weight-small) var(--text-title-size-small)/var(--text-title-lineHeight-small) var(--fontStack-sansSerif);
44
- --text-title-shorthand-medium: var(--text-title-weight-medium) var(--text-title-size-medium)/var(--text-title-lineHeight-medium) var(--fontStack-sansSerif);
45
- --text-title-shorthand-large: var(--text-title-weight-large) var(--text-title-size-large)/var(--text-title-lineHeight-large) var(--fontStack-sansSerif);
46
- --text-display-shorthand: var(--text-display-weight) var(--text-display-size)/var(--text-display-lineHeight) var(--fontStack-sansSerif);
37
+ --text-codeBlock-shorthand: var(--text-codeBlock-weight) var(--text-codeBlock-size) / var(--text-codeBlock-lineHeight) var(--fontStack-monospace);
38
+ --text-caption-shorthand: var(--text-caption-weight) var(--text-caption-size) / var(--text-caption-lineHeight) var(--fontStack-sansSerif);
39
+ --text-body-shorthand-small: var(--text-body-weight) var(--text-body-size-small) / var(--text-body-lineHeight-small) var(--fontStack-sansSerif);
40
+ --text-body-shorthand-medium: var(--text-body-weight) var(--text-body-size-medium) / var(--text-body-lineHeight-medium) var(--fontStack-sansSerif);
41
+ --text-body-shorthand-large: var(--text-body-weight) var(--text-body-size-large) / var(--text-body-lineHeight-large) var(--fontStack-sansSerif);
42
+ --text-subtitle-shorthand: var(--text-subtitle-weight) var(--text-subtitle-size) / var(--text-subtitle-lineHeight) var(--fontStack-sansSerif);
43
+ --text-title-shorthand-small: var(--text-title-weight-small) var(--text-title-size-small) / var(--text-title-lineHeight-small) var(--fontStack-sansSerif);
44
+ --text-title-shorthand-medium: var(--text-title-weight-medium) var(--text-title-size-medium) / var(--text-title-lineHeight-medium) var(--fontStack-sansSerif);
45
+ --text-title-shorthand-large: var(--text-title-weight-large) var(--text-title-size-large) / var(--text-title-lineHeight-large) var(--fontStack-sansSerif);
46
+ --text-display-shorthand: var(--text-display-weight) var(--text-display-size) / var(--text-display-lineHeight) var(--fontStack-sansSerif);
47
47
  }
package/dist/docs/functional/themes/dark-colorblind.json CHANGED
@@ -2196,6 +2196,151 @@
2196
2196
  "attributes": {},
2197
2197
  "path": ["display", "red", "borderColor", "emphasis"]
2198
2198
  },
2199
+ "display-coral-bgColor-muted": {
2200
+ "value": "#3c0614",
2201
+ "$type": "color",
2202
+ "$extensions": {
2203
+ "org.primer.figma": {
2204
+ "collection": "mode",
2205
+ "mode": "light",
2206
+ "group": "component (internal)",
2207
+ "scopes": ["bgColor"]
2208
+ }
2209
+ },
2210
+ "filePath": "src/tokens/functional/color/dark/display-dark.json5",
2211
+ "isSource": true,
2212
+ "original": {
2213
+ "value": "{base.display.color.red.0}",
2214
+ "$type": "color",
2215
+ "$extensions": {
2216
+ "org.primer.figma": {
2217
+ "collection": "mode",
2218
+ "mode": "light",
2219
+ "group": "component (internal)",
2220
+ "scopes": ["bgColor"]
2221
+ }
2222
+ }
2223
+ },
2224
+ "name": "display-coral-bgColor-muted",
2225
+ "attributes": {},
2226
+ "path": ["display", "coral", "bgColor", "muted"]
2227
+ },
2228
+ "display-coral-bgColor-emphasis": {
2229
+ "value": "#eb3342",
2230
+ "$type": "color",
2231
+ "$extensions": {
2232
+ "org.primer.figma": {
2233
+ "collection": "mode",
2234
+ "mode": "light",
2235
+ "group": "component (internal)",
2236
+ "scopes": ["bgColor"]
2237
+ }
2238
+ },
2239
+ "filePath": "src/tokens/functional/color/dark/display-dark.json5",
2240
+ "isSource": true,
2241
+ "original": {
2242
+ "value": "{base.display.color.red.5}",
2243
+ "$type": "color",
2244
+ "$extensions": {
2245
+ "org.primer.figma": {
2246
+ "collection": "mode",
2247
+ "mode": "light",
2248
+ "group": "component (internal)",
2249
+ "scopes": ["bgColor"]
2250
+ }
2251
+ }
2252
+ },
2253
+ "name": "display-coral-bgColor-emphasis",
2254
+ "attributes": {},
2255
+ "path": ["display", "coral", "bgColor", "emphasis"]
2256
+ },
2257
+ "display-coral-fgColor": {
2258
+ "value": "#f27d83",
2259
+ "$type": "color",
2260
+ "$extensions": {
2261
+ "org.primer.figma": {
2262
+ "collection": "mode",
2263
+ "mode": "light",
2264
+ "group": "component (internal)",
2265
+ "scopes": ["fgColor"]
2266
+ }
2267
+ },
2268
+ "filePath": "src/tokens/functional/color/dark/display-dark.json5",
2269
+ "isSource": true,
2270
+ "original": {
2271
+ "value": "{base.display.color.red.6}",
2272
+ "$type": "color",
2273
+ "$extensions": {
2274
+ "org.primer.figma": {
2275
+ "collection": "mode",
2276
+ "mode": "light",
2277
+ "group": "component (internal)",
2278
+ "scopes": ["fgColor"]
2279
+ }
2280
+ }
2281
+ },
2282
+ "name": "display-coral-fgColor",
2283
+ "attributes": {},
2284
+ "path": ["display", "coral", "fgColor"]
2285
+ },
2286
+ "display-coral-borderColor-muted": {
2287
+ "value": "#58091a",
2288
+ "$type": "color",
2289
+ "$extensions": {
2290
+ "org.primer.figma": {
2291
+ "collection": "mode",
2292
+ "mode": "light",
2293
+ "group": "component (internal)",
2294
+ "scopes": ["borderColor"]
2295
+ }
2296
+ },
2297
+ "filePath": "src/tokens/functional/color/dark/display-dark.json5",
2298
+ "isSource": true,
2299
+ "original": {
2300
+ "value": "{base.display.color.red.1}",
2301
+ "$type": "color",
2302
+ "$extensions": {
2303
+ "org.primer.figma": {
2304
+ "collection": "mode",
2305
+ "mode": "light",
2306
+ "group": "component (internal)",
2307
+ "scopes": ["borderColor"]
2308
+ }
2309
+ }
2310
+ },
2311
+ "name": "display-coral-borderColor-muted",
2312
+ "attributes": {},
2313
+ "path": ["display", "coral", "borderColor", "muted"]
2314
+ },
2315
+ "display-coral-borderColor-emphasis": {
2316
+ "value": "#eb3342",
2317
+ "$type": "color",
2318
+ "$extensions": {
2319
+ "org.primer.figma": {
2320
+ "collection": "mode",
2321
+ "mode": "light",
2322
+ "group": "component (internal)",
2323
+ "scopes": ["borderColor"]
2324
+ }
2325
+ },
2326
+ "filePath": "src/tokens/functional/color/dark/display-dark.json5",
2327
+ "isSource": true,
2328
+ "original": {
2329
+ "value": "{base.display.color.red.5}",
2330
+ "$type": "color",
2331
+ "$extensions": {
2332
+ "org.primer.figma": {
2333
+ "collection": "mode",
2334
+ "mode": "light",
2335
+ "group": "component (internal)",
2336
+ "scopes": ["borderColor"]
2337
+ }
2338
+ }
2339
+ },
2340
+ "name": "display-coral-borderColor-emphasis",
2341
+ "attributes": {},
2342
+ "path": ["display", "coral", "borderColor", "emphasis"]
2343
+ },
2199
2344
  "display-yellow-bgColor-muted": {
2200
2345
  "value": "#2e1a00",
2201
2346
  "$type": "color",
package/dist/docs/functional/themes/dark-dimmed.json CHANGED
@@ -2196,6 +2196,151 @@
2196
2196
  "attributes": {},
2197
2197
  "path": ["display", "red", "borderColor", "emphasis"]
2198
2198
  },
2199
+ "display-coral-bgColor-muted": {
2200
+ "value": "#3c0614",
2201
+ "$type": "color",
2202
+ "$extensions": {
2203
+ "org.primer.figma": {
2204
+ "collection": "mode",
2205
+ "mode": "light",
2206
+ "group": "component (internal)",
2207
+ "scopes": ["bgColor"]
2208
+ }
2209
+ },
2210
+ "filePath": "src/tokens/functional/color/dark/display-dark.json5",
2211
+ "isSource": true,
2212
+ "original": {
2213
+ "value": "{base.display.color.red.0}",
2214
+ "$type": "color",
2215
+ "$extensions": {
2216
+ "org.primer.figma": {
2217
+ "collection": "mode",
2218
+ "mode": "light",
2219
+ "group": "component (internal)",
2220
+ "scopes": ["bgColor"]
2221
+ }
2222
+ }
2223
+ },
2224
+ "name": "display-coral-bgColor-muted",
2225
+ "attributes": {},
2226
+ "path": ["display", "coral", "bgColor", "muted"]
2227
+ },
2228
+ "display-coral-bgColor-emphasis": {
2229
+ "value": "#eb3342",
2230
+ "$type": "color",
2231
+ "$extensions": {
2232
+ "org.primer.figma": {
2233
+ "collection": "mode",
2234
+ "mode": "light",
2235
+ "group": "component (internal)",
2236
+ "scopes": ["bgColor"]
2237
+ }
2238
+ },
2239
+ "filePath": "src/tokens/functional/color/dark/display-dark.json5",
2240
+ "isSource": true,
2241
+ "original": {
2242
+ "value": "{base.display.color.red.5}",
2243
+ "$type": "color",
2244
+ "$extensions": {
2245
+ "org.primer.figma": {
2246
+ "collection": "mode",
2247
+ "mode": "light",
2248
+ "group": "component (internal)",
2249
+ "scopes": ["bgColor"]
2250
+ }
2251
+ }
2252
+ },
2253
+ "name": "display-coral-bgColor-emphasis",
2254
+ "attributes": {},
2255
+ "path": ["display", "coral", "bgColor", "emphasis"]
2256
+ },
2257
+ "display-coral-fgColor": {
2258
+ "value": "#f27d83",
2259
+ "$type": "color",
2260
+ "$extensions": {
2261
+ "org.primer.figma": {
2262
+ "collection": "mode",
2263
+ "mode": "light",
2264
+ "group": "component (internal)",
2265
+ "scopes": ["fgColor"]
2266
+ }
2267
+ },
2268
+ "filePath": "src/tokens/functional/color/dark/display-dark.json5",
2269
+ "isSource": true,
2270
+ "original": {
2271
+ "value": "{base.display.color.red.6}",
2272
+ "$type": "color",
2273
+ "$extensions": {
2274
+ "org.primer.figma": {
2275
+ "collection": "mode",
2276
+ "mode": "light",
2277
+ "group": "component (internal)",
2278
+ "scopes": ["fgColor"]
2279
+ }
2280
+ }
2281
+ },
2282
+ "name": "display-coral-fgColor",
2283
+ "attributes": {},
2284
+ "path": ["display", "coral", "fgColor"]
2285
+ },
2286
+ "display-coral-borderColor-muted": {
2287
+ "value": "#58091a",
2288
+ "$type": "color",
2289
+ "$extensions": {
2290
+ "org.primer.figma": {
2291
+ "collection": "mode",
2292
+ "mode": "light",
2293
+ "group": "component (internal)",
2294
+ "scopes": ["borderColor"]
2295
+ }
2296
+ },
2297
+ "filePath": "src/tokens/functional/color/dark/display-dark.json5",
2298
+ "isSource": true,
2299
+ "original": {
2300
+ "value": "{base.display.color.red.1}",
2301
+ "$type": "color",
2302
+ "$extensions": {
2303
+ "org.primer.figma": {
2304
+ "collection": "mode",
2305
+ "mode": "light",
2306
+ "group": "component (internal)",
2307
+ "scopes": ["borderColor"]
2308
+ }
2309
+ }
2310
+ },
2311
+ "name": "display-coral-borderColor-muted",
2312
+ "attributes": {},
2313
+ "path": ["display", "coral", "borderColor", "muted"]
2314
+ },
2315
+ "display-coral-borderColor-emphasis": {
2316
+ "value": "#eb3342",
2317
+ "$type": "color",
2318
+ "$extensions": {
2319
+ "org.primer.figma": {
2320
+ "collection": "mode",
2321
+ "mode": "light",
2322
+ "group": "component (internal)",
2323
+ "scopes": ["borderColor"]
2324
+ }
2325
+ },
2326
+ "filePath": "src/tokens/functional/color/dark/display-dark.json5",
2327
+ "isSource": true,
2328
+ "original": {
2329
+ "value": "{base.display.color.red.5}",
2330
+ "$type": "color",
2331
+ "$extensions": {
2332
+ "org.primer.figma": {
2333
+ "collection": "mode",
2334
+ "mode": "light",
2335
+ "group": "component (internal)",
2336
+ "scopes": ["borderColor"]
2337
+ }
2338
+ }
2339
+ },
2340
+ "name": "display-coral-borderColor-emphasis",
2341
+ "attributes": {},
2342
+ "path": ["display", "coral", "borderColor", "emphasis"]
2343
+ },
2199
2344
  "display-yellow-bgColor-muted": {
2200
2345
  "value": "#2e1a00",
2201
2346
  "$type": "color",