@primer/primitives 10.3.4 → 10.4.0-rc.26f84a31

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 (65) hide show
  1. package/dist/css/functional/themes/dark-colorblind.css +36 -0
  2. package/dist/css/functional/themes/dark-dimmed.css +36 -0
  3. package/dist/css/functional/themes/dark-high-contrast.css +36 -0
  4. package/dist/css/functional/themes/dark-tritanopia.css +36 -0
  5. package/dist/css/functional/themes/dark.css +36 -0
  6. package/dist/css/functional/themes/light-colorblind.css +36 -0
  7. package/dist/css/functional/themes/light-high-contrast.css +36 -0
  8. package/dist/css/functional/themes/light-tritanopia.css +36 -0
  9. package/dist/css/functional/themes/light.css +36 -0
  10. package/dist/docs/functional/themes/dark-colorblind.json +1305 -131
  11. package/dist/docs/functional/themes/dark-dimmed.json +1414 -134
  12. package/dist/docs/functional/themes/dark-high-contrast.json +1305 -105
  13. package/dist/docs/functional/themes/dark-tritanopia.json +1284 -124
  14. package/dist/docs/functional/themes/dark.json +1270 -124
  15. package/dist/docs/functional/themes/light-colorblind.json +1292 -118
  16. package/dist/docs/functional/themes/light-high-contrast.json +1274 -116
  17. package/dist/docs/functional/themes/light-tritanopia.json +1283 -123
  18. package/dist/docs/functional/themes/light.json +1267 -121
  19. package/dist/figma/themes/dark-colorblind.json +1677 -1352
  20. package/dist/figma/themes/dark-dimmed.json +1653 -1271
  21. package/dist/figma/themes/dark-high-contrast.json +1656 -1299
  22. package/dist/figma/themes/dark-tritanopia.json +1668 -1359
  23. package/dist/figma/themes/dark.json +1606 -1313
  24. package/dist/figma/themes/light-colorblind.json +1626 -1301
  25. package/dist/figma/themes/light-high-contrast.json +1577 -1269
  26. package/dist/figma/themes/light-tritanopia.json +1620 -1311
  27. package/dist/figma/themes/light.json +1619 -1326
  28. package/dist/internalCss/dark-colorblind.css +36 -0
  29. package/dist/internalCss/dark-dimmed.css +36 -0
  30. package/dist/internalCss/dark-high-contrast.css +36 -0
  31. package/dist/internalCss/dark-tritanopia.css +36 -0
  32. package/dist/internalCss/dark.css +36 -0
  33. package/dist/internalCss/light-colorblind.css +36 -0
  34. package/dist/internalCss/light-high-contrast.css +36 -0
  35. package/dist/internalCss/light-tritanopia.css +36 -0
  36. package/dist/internalCss/light.css +36 -0
  37. package/dist/styleLint/functional/themes/dark-colorblind.json +1304 -130
  38. package/dist/styleLint/functional/themes/dark-dimmed.json +1413 -133
  39. package/dist/styleLint/functional/themes/dark-high-contrast.json +1306 -106
  40. package/dist/styleLint/functional/themes/dark-tritanopia.json +1283 -123
  41. package/dist/styleLint/functional/themes/dark.json +1269 -123
  42. package/dist/styleLint/functional/themes/light-colorblind.json +1292 -118
  43. package/dist/styleLint/functional/themes/light-high-contrast.json +1274 -116
  44. package/dist/styleLint/functional/themes/light-tritanopia.json +1286 -126
  45. package/dist/styleLint/functional/themes/light.json +1266 -120
  46. package/package.json +1 -1
  47. package/src/tokens/component/card.json5 +18 -0
  48. package/src/tokens/{functional/color/light/app-light.json5 → component/codeMirror.json5} +67 -0
  49. package/src/tokens/component/contribution.json5 +344 -0
  50. package/src/tokens/component/counter.json5 +43 -0
  51. package/src/tokens/component/tooltip.json5 +32 -0
  52. package/src/tokens/functional/color/bgColor.json5 +24 -20
  53. package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +0 -24
  54. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +0 -40
  55. package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +0 -14
  56. package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +0 -10
  57. package/src/tokens/functional/color/dark/patterns-dark.json5 +0 -87
  58. package/src/tokens/functional/color/{dark/data-vis-dark.json5 → data-vis.json5} +61 -21
  59. package/src/tokens/functional/color/focus.json5 +15 -0
  60. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +0 -20
  61. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +0 -14
  62. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +0 -10
  63. package/src/tokens/functional/color/light/patterns-light.json5 +0 -88
  64. package/src/tokens/functional/color/dark/app-dark.json5 +0 -254
  65. package/src/tokens/functional/color/light/data-vis-light.json5 +0 -284
package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 CHANGED
@@ -4,20 +4,6 @@
4
4
  * @description All overwrites for functional color tokens for light protanopia and deuteranopia color mode are in this file
5
5
  */
6
6
  {
7
- codeMirror: {
8
- syntax: {
9
- fgColor: {
10
- keyword: {
11
- $value: '{base.color.orange.5}',
12
- $type: 'color',
13
- },
14
- storage: {
15
- $value: '{base.color.orange.5}',
16
- $type: 'color',
17
- },
18
- },
19
- },
20
- },
21
7
  button: {
22
8
  primary: {
23
9
  bgColor: {
package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 CHANGED
@@ -4,16 +4,6 @@
4
4
  * @description All overwrites for functional color tokens for this theme are in this file
5
5
  */
6
6
  {
7
- codeMirror: {
8
- syntax: {
9
- fgColor: {
10
- variable: {
11
- $value: '{base.color.red.6}',
12
- $type: 'color',
13
- },
14
- },
15
- },
16
- },
17
7
  button: {
18
8
  primary: {
19
9
  bgColor: {
package/src/tokens/functional/color/light/patterns-light.json5 CHANGED
@@ -619,43 +619,6 @@
619
619
  },
620
620
  },
621
621
  },
622
- counter: {
623
- borderColor: {
624
- $value: '{base.color.transparent}',
625
- $type: 'color',
626
- $extensions: {
627
- 'org.primer.figma': {
628
- collection: 'mode',
629
- group: 'component (internal)',
630
- scopes: ['borderColor'],
631
- },
632
- },
633
- },
634
- bgColor: {
635
- muted: {
636
- $value: '{bgColor.neutral.muted}',
637
- $type: 'color',
638
- $extensions: {
639
- 'org.primer.figma': {
640
- collection: 'mode',
641
- group: 'component',
642
- scopes: ['bgColor'],
643
- },
644
- },
645
- },
646
- emphasis: {
647
- $value: '{bgColor.neutral.emphasis}',
648
- $type: 'color',
649
- $extensions: {
650
- 'org.primer.figma': {
651
- collection: 'mode',
652
- group: 'component',
653
- scopes: ['bgColor'],
654
- },
655
- },
656
- },
657
- },
658
- },
659
622
  button: {
660
623
  default: {
661
624
  fgColor: {
@@ -1577,20 +1540,6 @@
1577
1540
  },
1578
1541
  },
1579
1542
  },
1580
-
1581
- focus: {
1582
- outlineColor: {
1583
- $value: '{borderColor.accent.emphasis}',
1584
- $type: 'color',
1585
- $extensions: {
1586
- 'org.primer.figma': {
1587
- collection: 'mode',
1588
- group: 'component (internal)',
1589
- scopes: ['borderColor', 'effectColor'],
1590
- },
1591
- },
1592
- },
1593
- },
1594
1543
  menu: {
1595
1544
  bgColor: {
1596
1545
  active: {
@@ -1717,19 +1666,6 @@
1717
1666
  alpha: 0.2,
1718
1667
  },
1719
1668
  },
1720
- card: {
1721
- bgColor: {
1722
- $value: '{bgColor.default}',
1723
- $type: 'color',
1724
- $extensions: {
1725
- 'org.primer.figma': {
1726
- collection: 'mode',
1727
- group: 'component',
1728
- scopes: ['bgColor'],
1729
- },
1730
- },
1731
- },
1732
- },
1733
1669
  label: {
1734
1670
  green: {
1735
1671
  bgColor: {
@@ -2644,28 +2580,4 @@
2644
2580
  },
2645
2581
  },
2646
2582
  },
2647
- tooltip: {
2648
- bgColor: {
2649
- $value: '{bgColor.emphasis}',
2650
- $type: 'color',
2651
- $extensions: {
2652
- 'org.primer.figma': {
2653
- collection: 'mode',
2654
- group: 'component',
2655
- scopes: ['bgColor'],
2656
- },
2657
- },
2658
- },
2659
- fgColor: {
2660
- $value: '{fgColor.onEmphasis}',
2661
- $type: 'color',
2662
- $extensions: {
2663
- 'org.primer.figma': {
2664
- collection: 'mode',
2665
- group: 'component',
2666
- scopes: ['fgColor'],
2667
- },
2668
- },
2669
- },
2670
- },
2671
2583
  }
package/src/tokens/functional/color/dark/app-dark.json5 DELETED
@@ -1,254 +0,0 @@
1
- {
2
- codeMirror: {
3
- fgColor: {
4
- $value: '{fgColor.default}',
5
- $type: 'color',
6
- $extensions: {
7
- 'org.primer.figma': {
8
- collection: 'mode',
9
-
10
- group: 'component',
11
- scopes: ['fgColor'],
12
- },
13
- },
14
- },
15
- bgColor: {
16
- $value: '{bgColor.default}',
17
- $type: 'color',
18
- $extensions: {
19
- 'org.primer.figma': {
20
- collection: 'mode',
21
-
22
- group: 'component',
23
- scopes: ['bgColor'],
24
- },
25
- },
26
- },
27
- gutters: {
28
- bgColor: {
29
- $value: '{bgColor.default}',
30
- $type: 'color',
31
- $extensions: {
32
- 'org.primer.figma': {
33
- collection: 'mode',
34
-
35
- group: 'component',
36
- scopes: ['bgColor'],
37
- },
38
- },
39
- },
40
- },
41
- gutterMarker: {
42
- fgColor: {
43
- default: {
44
- $value: '{bgColor.default}',
45
- $type: 'color',
46
- $extensions: {
47
- 'org.primer.figma': {
48
- collection: 'mode',
49
-
50
- group: 'component',
51
- scopes: ['fgColor'],
52
- },
53
- },
54
- },
55
- muted: {
56
- $value: '{fgColor.muted}',
57
- $type: 'color',
58
- $extensions: {
59
- 'org.primer.figma': {
60
- collection: 'mode',
61
-
62
- group: 'component',
63
- scopes: ['fgColor'],
64
- },
65
- },
66
- },
67
- },
68
- },
69
- lineNumber: {
70
- fgColor: {
71
- $value: '{fgColor.muted}',
72
- $type: 'color',
73
- $extensions: {
74
- 'org.primer.figma': {
75
- collection: 'mode',
76
-
77
- group: 'component',
78
- scopes: ['fgColor'],
79
- },
80
- },
81
- },
82
- },
83
- cursor: {
84
- fgColor: {
85
- $value: '{fgColor.default}',
86
- $type: 'color',
87
- $extensions: {
88
- 'org.primer.figma': {
89
- collection: 'mode',
90
-
91
- group: 'component',
92
- scopes: ['fgColor'],
93
- },
94
- },
95
- },
96
- },
97
- selection: {
98
- bgColor: {
99
- $value: '{borderColor.accent.muted}',
100
- $type: 'color',
101
- $extensions: {
102
- 'org.primer.figma': {
103
- collection: 'mode',
104
-
105
- group: 'component',
106
- scopes: ['bgColor'],
107
- },
108
- },
109
- },
110
- },
111
- activeline: {
112
- bgColor: {
113
- $value: '{bgColor.neutral.muted}',
114
- $type: 'color',
115
- $extensions: {
116
- 'org.primer.figma': {
117
- collection: 'mode',
118
-
119
- group: 'component',
120
- scopes: ['bgColor'],
121
- },
122
- },
123
- },
124
- },
125
- matchingBracket: {
126
- fgColor: {
127
- $value: '{fgColor.default}',
128
- $type: 'color',
129
- $extensions: {
130
- 'org.primer.figma': {
131
- collection: 'mode',
132
-
133
- group: 'component',
134
- scopes: ['fgColor'],
135
- },
136
- },
137
- },
138
- },
139
- lines: {
140
- bgColor: {
141
- $value: '{bgColor.default}',
142
- $type: 'color',
143
- $extensions: {
144
- 'org.primer.figma': {
145
- collection: 'mode',
146
-
147
- group: 'component',
148
- scopes: ['bgColor'],
149
- },
150
- },
151
- },
152
- },
153
- syntax: {
154
- fgColor: {
155
- comment: {
156
- $value: '{base.color.neutral.8}',
157
- $type: 'color',
158
- $extensions: {
159
- 'org.primer.figma': {
160
- collection: 'mode',
161
-
162
- group: 'component',
163
- scopes: ['fgColor'],
164
- },
165
- },
166
- },
167
- constant: {
168
- $value: '{base.color.blue.2}',
169
- $type: 'color',
170
- $extensions: {
171
- 'org.primer.figma': {
172
- collection: 'mode',
173
-
174
- group: 'component',
175
- scopes: ['fgColor'],
176
- },
177
- },
178
- },
179
- entity: {
180
- $value: '{base.color.purple.2}',
181
- $type: 'color',
182
- $extensions: {
183
- 'org.primer.figma': {
184
- collection: 'mode',
185
-
186
- group: 'component',
187
- scopes: ['fgColor'],
188
- },
189
- },
190
- },
191
- keyword: {
192
- $value: '{base.color.red.3}',
193
- $type: 'color',
194
- $extensions: {
195
- 'org.primer.figma': {
196
- collection: 'mode',
197
-
198
- group: 'component',
199
- scopes: ['fgColor'],
200
- },
201
- },
202
- },
203
- storage: {
204
- $value: '{base.color.red.3}',
205
- $type: 'color',
206
- $extensions: {
207
- 'org.primer.figma': {
208
- collection: 'mode',
209
-
210
- group: 'component',
211
- scopes: ['fgColor'],
212
- },
213
- },
214
- },
215
- string: {
216
- $value: '{base.color.blue.1}',
217
- $type: 'color',
218
- $extensions: {
219
- 'org.primer.figma': {
220
- collection: 'mode',
221
-
222
- group: 'component',
223
- scopes: ['fgColor'],
224
- },
225
- },
226
- },
227
- support: {
228
- $value: '{base.color.blue.2}',
229
- $type: 'color',
230
- $extensions: {
231
- 'org.primer.figma': {
232
- collection: 'mode',
233
-
234
- group: 'component',
235
- scopes: ['fgColor'],
236
- },
237
- },
238
- },
239
- variable: {
240
- $value: '{base.color.orange.2}',
241
- $type: 'color',
242
- $extensions: {
243
- 'org.primer.figma': {
244
- collection: 'mode',
245
-
246
- group: 'component',
247
- scopes: ['fgColor'],
248
- },
249
- },
250
- },
251
- },
252
- },
253
- },
254
- }
package/src/tokens/functional/color/light/data-vis-light.json5 DELETED
@@ -1,284 +0,0 @@
1
- {
2
- data: {
3
- blue: {
4
- color: {
5
- emphasis: {
6
- $value: '{base.display.color.blue.5}',
7
- $type: 'color',
8
- $extensions: {
9
- 'org.primer.figma': {
10
- collection: 'mode',
11
-
12
- group: 'component',
13
- scopes: ['bgColor', 'borderColor'],
14
- },
15
- },
16
- },
17
- muted: {
18
- $value: '{base.display.color.blue.0}',
19
- $type: 'color',
20
- $extensions: {
21
- 'org.primer.figma': {
22
- collection: 'mode',
23
-
24
- group: 'component',
25
- scopes: ['bgColor'],
26
- },
27
- },
28
- },
29
- },
30
- },
31
- auburn: {
32
- color: {
33
- emphasis: {
34
- $value: '{base.display.color.auburn.5}',
35
- $type: 'color',
36
- $extensions: {
37
- 'org.primer.figma': {
38
- collection: 'mode',
39
-
40
- group: 'component',
41
- scopes: ['bgColor', 'borderColor'],
42
- },
43
- },
44
- },
45
- muted: {
46
- $value: '{base.display.color.auburn.0}',
47
- $type: 'color',
48
- $extensions: {
49
- 'org.primer.figma': {
50
- collection: 'mode',
51
-
52
- group: 'component',
53
- scopes: ['bgColor'],
54
- },
55
- },
56
- },
57
- },
58
- },
59
- orange: {
60
- color: {
61
- emphasis: {
62
- $value: '{base.display.color.orange.4}',
63
- $type: 'color',
64
- $extensions: {
65
- 'org.primer.figma': {
66
- collection: 'mode',
67
-
68
- group: 'component',
69
- scopes: ['bgColor', 'borderColor'],
70
- },
71
- },
72
- },
73
- muted: {
74
- $value: '{base.display.color.orange.0}',
75
- $type: 'color',
76
- $extensions: {
77
- 'org.primer.figma': {
78
- collection: 'mode',
79
-
80
- group: 'component',
81
- scopes: ['bgColor'],
82
- },
83
- },
84
- },
85
- },
86
- },
87
- yellow: {
88
- color: {
89
- emphasis: {
90
- $value: '{base.display.color.yellow.4}',
91
- $type: 'color',
92
- $extensions: {
93
- 'org.primer.figma': {
94
- collection: 'mode',
95
-
96
- group: 'component',
97
- scopes: ['bgColor', 'borderColor'],
98
- },
99
- },
100
- },
101
- muted: {
102
- $value: '{base.display.color.yellow.0}',
103
- $type: 'color',
104
- $extensions: {
105
- 'org.primer.figma': {
106
- collection: 'mode',
107
-
108
- group: 'component',
109
- scopes: ['bgColor'],
110
- },
111
- },
112
- },
113
- },
114
- },
115
- green: {
116
- color: {
117
- emphasis: {
118
- $value: '{base.display.color.green.4}',
119
- $type: 'color',
120
- $extensions: {
121
- 'org.primer.figma': {
122
- collection: 'mode',
123
-
124
- group: 'component',
125
- scopes: ['bgColor', 'borderColor'],
126
- },
127
- },
128
- },
129
- muted: {
130
- $value: '{base.display.color.green.0}',
131
- $type: 'color',
132
- $extensions: {
133
- 'org.primer.figma': {
134
- collection: 'mode',
135
-
136
- group: 'component',
137
- scopes: ['bgColor'],
138
- },
139
- },
140
- },
141
- },
142
- },
143
- teal: {
144
- color: {
145
- emphasis: {
146
- $value: '{base.display.color.teal.4}',
147
- $type: 'color',
148
- $extensions: {
149
- 'org.primer.figma': {
150
- collection: 'mode',
151
-
152
- group: 'component',
153
- scopes: ['bgColor', 'borderColor'],
154
- },
155
- },
156
- },
157
- muted: {
158
- $value: '{base.display.color.teal.0}',
159
- $type: 'color',
160
- $extensions: {
161
- 'org.primer.figma': {
162
- collection: 'mode',
163
-
164
- group: 'component',
165
- scopes: ['bgColor'],
166
- },
167
- },
168
- },
169
- },
170
- },
171
- purple: {
172
- color: {
173
- emphasis: {
174
- $value: '{base.display.color.purple.5}',
175
- $type: 'color',
176
- $extensions: {
177
- 'org.primer.figma': {
178
- collection: 'mode',
179
-
180
- group: 'component',
181
- scopes: ['bgColor', 'borderColor'],
182
- },
183
- },
184
- },
185
- muted: {
186
- $value: '{base.display.color.purple.0}',
187
- $type: 'color',
188
- $extensions: {
189
- 'org.primer.figma': {
190
- collection: 'mode',
191
-
192
- group: 'component',
193
- scopes: ['bgColor'],
194
- },
195
- },
196
- },
197
- },
198
- },
199
- pink: {
200
- color: {
201
- emphasis: {
202
- $value: '{base.display.color.pink.5}',
203
- $type: 'color',
204
- $extensions: {
205
- 'org.primer.figma': {
206
- collection: 'mode',
207
-
208
- group: 'component',
209
- scopes: ['bgColor', 'borderColor'],
210
- },
211
- },
212
- },
213
- muted: {
214
- $value: '{base.display.color.pink.0}',
215
- $type: 'color',
216
- $extensions: {
217
- 'org.primer.figma': {
218
- collection: 'mode',
219
-
220
- group: 'component',
221
- scopes: ['bgColor'],
222
- },
223
- },
224
- },
225
- },
226
- },
227
- red: {
228
- color: {
229
- emphasis: {
230
- $value: '{base.display.color.red.5}',
231
- $type: 'color',
232
- $extensions: {
233
- 'org.primer.figma': {
234
- collection: 'mode',
235
-
236
- group: 'component',
237
- scopes: ['bgColor', 'borderColor'],
238
- },
239
- },
240
- },
241
- muted: {
242
- $value: '{base.display.color.red.0}',
243
- $type: 'color',
244
- $extensions: {
245
- 'org.primer.figma': {
246
- collection: 'mode',
247
-
248
- group: 'component',
249
- scopes: ['bgColor'],
250
- },
251
- },
252
- },
253
- },
254
- },
255
- gray: {
256
- color: {
257
- emphasis: {
258
- $value: '{base.display.color.gray.4}',
259
- $type: 'color',
260
- $extensions: {
261
- 'org.primer.figma': {
262
- collection: 'mode',
263
-
264
- group: 'component',
265
- scopes: ['bgColor', 'borderColor'],
266
- },
267
- },
268
- },
269
- muted: {
270
- $value: '{base.display.color.gray.0}',
271
- $type: 'color',
272
- $extensions: {
273
- 'org.primer.figma': {
274
- collection: 'mode',
275
-
276
- group: 'component',
277
- scopes: ['bgColor'],
278
- },
279
- },
280
- },
281
- },
282
- },
283
- },
284
- }