@primer/primitives 9.1.0-rc.e0e1c4b6 → 9.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 (53) hide show
  1. package/dist/build/PrimerStyleDictionary.js +1 -0
  2. package/dist/build/formats/cssAdvanced.js +9 -10
  3. package/dist/build/transformers/index.d.ts +1 -0
  4. package/dist/build/transformers/index.js +3 -1
  5. package/dist/css/functional/motion/motion.css +3 -3
  6. package/dist/css/functional/size/border.css +2 -2
  7. package/dist/css/functional/typography/typography.css +11 -11
  8. package/dist/css/primitives.css +16 -16
  9. package/package.json +5 -3
  10. package/src/tokens/base/color/dark/dark.dimmed.json5 +1164 -0
  11. package/src/tokens/base/color/dark/dark.high-contrast.json5 +764 -0
  12. package/src/tokens/base/color/dark/dark.json5 +911 -0
  13. package/src/tokens/base/color/dark/display-dark.json5 +1774 -0
  14. package/src/tokens/base/color/light/display-light.json5 +1774 -0
  15. package/src/tokens/base/color/light/light.high-contrast.json5 +755 -0
  16. package/src/tokens/base/color/light/light.json5 +911 -0
  17. package/src/tokens/base/size/size.json +196 -0
  18. package/src/tokens/base/typography/typography.json +48 -0
  19. package/src/tokens/fallback/color-fallbacks.json +270 -0
  20. package/src/tokens/functional/border/dark.json5 +12 -0
  21. package/src/tokens/functional/border/light.json5 +12 -0
  22. package/src/tokens/functional/color/dark/app-dark.json5 +554 -0
  23. package/src/tokens/functional/color/dark/data-vis-dark.json5 +284 -0
  24. package/src/tokens/functional/color/dark/display-dark.json5 +1258 -0
  25. package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +194 -0
  26. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +935 -0
  27. package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +310 -0
  28. package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +224 -0
  29. package/src/tokens/functional/color/dark/patterns-dark.json5 +3097 -0
  30. package/src/tokens/functional/color/dark/primitives-dark.json5 +1200 -0
  31. package/src/tokens/functional/color/dark/syntax-dark.json5 +559 -0
  32. package/src/tokens/functional/color/light/app-light.json5 +551 -0
  33. package/src/tokens/functional/color/light/data-vis-light.json5 +284 -0
  34. package/src/tokens/functional/color/light/display-light.json5 +1258 -0
  35. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +819 -0
  36. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +327 -0
  37. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +237 -0
  38. package/src/tokens/functional/color/light/patterns-light.json5 +3091 -0
  39. package/src/tokens/functional/color/light/primitives-light.json5 +1193 -0
  40. package/src/tokens/functional/color/light/syntax-light.json5 +559 -0
  41. package/src/tokens/functional/motion/loading.json5 +17 -0
  42. package/src/tokens/functional/motion/patterns.json5 +28 -0
  43. package/src/tokens/functional/shadow/dark.json5 +383 -0
  44. package/src/tokens/functional/shadow/light.json5 +376 -0
  45. package/src/tokens/functional/size/border.json +111 -0
  46. package/src/tokens/functional/size/breakpoints.json +64 -0
  47. package/src/tokens/functional/size/size-coarse.json +28 -0
  48. package/src/tokens/functional/size/size-fine.json +28 -0
  49. package/src/tokens/functional/size/size.json +740 -0
  50. package/src/tokens/functional/size/viewport.json +28 -0
  51. package/src/tokens/functional/typography/typography.json +527 -0
  52. package/src/tokens/removed/color.json +421 -0
  53. package/src/tokens/removed/testing.json5 +4 -0
package/src/tokens/functional/color/light/app-light.json5 ADDED
@@ -0,0 +1,551 @@
1
+ {
2
+ topicTag: {
3
+ borderColor: {
4
+ $value: '{base.color.transparent}',
5
+ $type: 'color',
6
+ $extensions: {
7
+ 'org.primer.figma': {
8
+ collection: 'mode',
9
+ mode: 'light',
10
+ group: 'component',
11
+ scopes: ['borderColor'],
12
+ },
13
+ },
14
+ },
15
+ },
16
+ highlight: {
17
+ neutral: {
18
+ bgColor: {
19
+ $value: '{base.color.yellow.0}',
20
+ $type: 'color',
21
+ $extensions: {
22
+ 'org.primer.figma': {
23
+ collection: 'mode',
24
+ mode: 'light',
25
+ group: 'component',
26
+ scopes: ['bgColor'],
27
+ },
28
+ },
29
+ },
30
+ },
31
+ },
32
+ page: {
33
+ header: {
34
+ bgColor: {
35
+ $value: '{bgColor.muted}',
36
+ $type: 'color',
37
+ $extensions: {
38
+ 'org.primer.figma': {
39
+ collection: 'mode',
40
+ mode: 'light',
41
+ group: 'component',
42
+ scopes: ['bgColor'],
43
+ },
44
+ },
45
+ },
46
+ },
47
+ },
48
+ diffBlob: {
49
+ addition: {
50
+ fgColor: {
51
+ text: {
52
+ $value: '{fgColor.default}',
53
+ $type: 'color',
54
+ $extensions: {
55
+ 'org.primer.figma': {
56
+ collection: 'mode',
57
+ mode: 'light',
58
+ group: 'component',
59
+ scopes: ['fgColor'],
60
+ },
61
+ },
62
+ },
63
+ num: {
64
+ $value: '{fgColor.default}',
65
+ $type: 'color',
66
+ $extensions: {
67
+ 'org.primer.figma': {
68
+ collection: 'mode',
69
+ mode: 'light',
70
+ group: 'component',
71
+ scopes: ['fgColor'],
72
+ },
73
+ },
74
+ },
75
+ },
76
+ bgColor: {
77
+ num: {
78
+ $value: '{base.color.green.1}',
79
+ $type: 'color',
80
+ $extensions: {
81
+ 'org.primer.figma': {
82
+ collection: 'mode',
83
+ mode: 'light',
84
+ group: 'component',
85
+ scopes: ['bgColor'],
86
+ },
87
+ },
88
+ mix: {
89
+ color: '{base.color.green.0}',
90
+ weight: 0.8,
91
+ },
92
+ },
93
+ line: {
94
+ $value: '{base.color.green.0}',
95
+ $type: 'color',
96
+ $extensions: {
97
+ 'org.primer.figma': {
98
+ collection: 'mode',
99
+ mode: 'light',
100
+ group: 'component',
101
+ scopes: ['bgColor'],
102
+ },
103
+ },
104
+ },
105
+ word: {
106
+ $value: '{base.color.green.1}',
107
+ $type: 'color',
108
+ $extensions: {
109
+ 'org.primer.figma': {
110
+ collection: 'mode',
111
+ mode: 'light',
112
+ group: 'component',
113
+ scopes: ['bgColor'],
114
+ },
115
+ },
116
+ },
117
+ },
118
+ },
119
+ deletion: {
120
+ fgColor: {
121
+ text: {
122
+ $value: '{fgColor.default}',
123
+ $type: 'color',
124
+ $extensions: {
125
+ 'org.primer.figma': {
126
+ collection: 'mode',
127
+ mode: 'light',
128
+ group: 'component',
129
+ scopes: ['fgColor'],
130
+ },
131
+ },
132
+ },
133
+ num: {
134
+ $value: '{fgColor.default}',
135
+ $type: 'color',
136
+ $extensions: {
137
+ 'org.primer.figma': {
138
+ collection: 'mode',
139
+ mode: 'light',
140
+ group: 'component',
141
+ scopes: ['fgColor'],
142
+ },
143
+ },
144
+ },
145
+ },
146
+ bgColor: {
147
+ num: {
148
+ $value: '{base.color.red.1}',
149
+ $type: 'color',
150
+ $extensions: {
151
+ 'org.primer.figma': {
152
+ collection: 'mode',
153
+ mode: 'light',
154
+ group: 'component',
155
+ scopes: ['bgColor'],
156
+ },
157
+ },
158
+ },
159
+ line: {
160
+ $value: '{base.color.red.0}',
161
+ $type: 'color',
162
+ $extensions: {
163
+ 'org.primer.figma': {
164
+ collection: 'mode',
165
+ mode: 'light',
166
+ group: 'component',
167
+ scopes: ['bgColor'],
168
+ },
169
+ },
170
+ },
171
+ word: {
172
+ $value: '{base.color.red.3}',
173
+ $type: 'color',
174
+ $extensions: {
175
+ 'org.primer.figma': {
176
+ collection: 'mode',
177
+ mode: 'light',
178
+ group: 'component',
179
+ scopes: ['bgColor'],
180
+ },
181
+ },
182
+ alpha: 0.4,
183
+ },
184
+ },
185
+ },
186
+ hunk: {
187
+ bgColor: {
188
+ num: {
189
+ $value: '{base.color.blue.3}',
190
+ $type: 'color',
191
+ $extensions: {
192
+ 'org.primer.figma': {
193
+ collection: 'mode',
194
+ mode: 'light',
195
+ group: 'component',
196
+ scopes: ['bgColor'],
197
+ },
198
+ },
199
+ alpha: 0.4,
200
+ },
201
+ },
202
+ },
203
+ expander: {
204
+ iconColor: {
205
+ $value: '{fgColor.muted}',
206
+ $type: 'color',
207
+ $extensions: {
208
+ 'org.primer.figma': {
209
+ collection: 'mode',
210
+ mode: 'light',
211
+ group: 'component',
212
+ scopes: ['fgColor'],
213
+ },
214
+ },
215
+ },
216
+ },
217
+ },
218
+ codeMirror: {
219
+ fgColor: {
220
+ $value: '{fgColor.default}',
221
+ $type: 'color',
222
+ $extensions: {
223
+ 'org.primer.figma': {
224
+ collection: 'mode',
225
+ mode: 'light',
226
+ group: 'component',
227
+ scopes: ['fgColor'],
228
+ },
229
+ },
230
+ },
231
+ bgColor: {
232
+ $value: '{bgColor.default}',
233
+ $type: 'color',
234
+ $extensions: {
235
+ 'org.primer.figma': {
236
+ collection: 'mode',
237
+ mode: 'light',
238
+ group: 'component',
239
+ scopes: ['bgColor'],
240
+ },
241
+ },
242
+ },
243
+ gutters: {
244
+ bgColor: {
245
+ $value: '{bgColor.default}',
246
+ $type: 'color',
247
+ $extensions: {
248
+ 'org.primer.figma': {
249
+ collection: 'mode',
250
+ mode: 'light',
251
+ group: 'component',
252
+ scopes: ['bgColor'],
253
+ },
254
+ },
255
+ },
256
+ },
257
+ gutterMarker: {
258
+ fgColor: {
259
+ default: {
260
+ $value: '{bgColor.default}',
261
+ $type: 'color',
262
+ $extensions: {
263
+ 'org.primer.figma': {
264
+ collection: 'mode',
265
+ mode: 'light',
266
+ group: 'component',
267
+ scopes: ['fgColor'],
268
+ },
269
+ },
270
+ },
271
+ muted: {
272
+ $value: '{fgColor.muted}',
273
+ $type: 'color',
274
+ $extensions: {
275
+ 'org.primer.figma': {
276
+ collection: 'mode',
277
+ mode: 'light',
278
+ group: 'component',
279
+ scopes: ['fgColor'],
280
+ },
281
+ },
282
+ },
283
+ },
284
+ },
285
+ lineNumber: {
286
+ fgColor: {
287
+ $value: '{fgColor.muted}',
288
+ $type: 'color',
289
+ $extensions: {
290
+ 'org.primer.figma': {
291
+ collection: 'mode',
292
+ mode: 'light',
293
+ group: 'component',
294
+ scopes: ['fgColor'],
295
+ },
296
+ },
297
+ },
298
+ },
299
+ cursor: {
300
+ fgColor: {
301
+ $value: '{fgColor.default}',
302
+ $type: 'color',
303
+ $extensions: {
304
+ 'org.primer.figma': {
305
+ collection: 'mode',
306
+ mode: 'light',
307
+ group: 'component',
308
+ scopes: ['fgColor'],
309
+ },
310
+ },
311
+ },
312
+ },
313
+ selection: {
314
+ bgColor: {
315
+ $value: '{borderColor.accent.muted}',
316
+ $type: 'color',
317
+ $extensions: {
318
+ 'org.primer.figma': {
319
+ collection: 'mode',
320
+ mode: 'light',
321
+ group: 'component',
322
+ scopes: ['bgColor'],
323
+ },
324
+ },
325
+ },
326
+ },
327
+ activeline: {
328
+ bgColor: {
329
+ $value: '{bgColor.neutral.muted}',
330
+ $type: 'color',
331
+ $extensions: {
332
+ 'org.primer.figma': {
333
+ collection: 'mode',
334
+ mode: 'light',
335
+ group: 'component',
336
+ scopes: ['bgColor'],
337
+ },
338
+ },
339
+ },
340
+ },
341
+ matchingBracket: {
342
+ fgColor: {
343
+ $value: '{fgColor.default}',
344
+ $type: 'color',
345
+ $extensions: {
346
+ 'org.primer.figma': {
347
+ collection: 'mode',
348
+ mode: 'light',
349
+ group: 'component',
350
+ scopes: ['fgColor'],
351
+ },
352
+ },
353
+ },
354
+ },
355
+ lines: {
356
+ bgColor: {
357
+ $value: '{bgColor.default}',
358
+ $type: 'color',
359
+ $extensions: {
360
+ 'org.primer.figma': {
361
+ collection: 'mode',
362
+ mode: 'light',
363
+ group: 'component',
364
+ scopes: ['bgColor'],
365
+ },
366
+ },
367
+ },
368
+ },
369
+ syntax: {
370
+ fgColor: {
371
+ comment: {
372
+ $value: '{base.color.neutral.13}',
373
+ $type: 'color',
374
+ $extensions: {
375
+ 'org.primer.figma': {
376
+ collection: 'mode',
377
+ mode: 'light',
378
+ group: 'component',
379
+ scopes: ['fgColor'],
380
+ },
381
+ },
382
+ },
383
+ constant: {
384
+ $value: '{base.color.blue.6}',
385
+ $type: 'color',
386
+ $extensions: {
387
+ 'org.primer.figma': {
388
+ collection: 'mode',
389
+ mode: 'light',
390
+ group: 'component',
391
+ scopes: ['fgColor'],
392
+ },
393
+ },
394
+ },
395
+ entity: {
396
+ $value: '{base.color.purple.5}',
397
+ $type: 'color',
398
+ $extensions: {
399
+ 'org.primer.figma': {
400
+ collection: 'mode',
401
+ mode: 'light',
402
+ group: 'component',
403
+ scopes: ['fgColor'],
404
+ },
405
+ },
406
+ },
407
+ keyword: {
408
+ $value: '{base.color.red.5}',
409
+ $type: 'color',
410
+ $extensions: {
411
+ 'org.primer.figma': {
412
+ collection: 'mode',
413
+ mode: 'light',
414
+ group: 'component',
415
+ scopes: ['fgColor'],
416
+ },
417
+ },
418
+ },
419
+ storage: {
420
+ $value: '{base.color.red.5}',
421
+ $type: 'color',
422
+ $extensions: {
423
+ 'org.primer.figma': {
424
+ collection: 'mode',
425
+ mode: 'light',
426
+ group: 'component',
427
+ scopes: ['fgColor'],
428
+ },
429
+ },
430
+ },
431
+ string: {
432
+ $value: '{base.color.blue.8}',
433
+ $type: 'color',
434
+ $extensions: {
435
+ 'org.primer.figma': {
436
+ collection: 'mode',
437
+ mode: 'light',
438
+ group: 'component',
439
+ scopes: ['fgColor'],
440
+ },
441
+ },
442
+ },
443
+ support: {
444
+ $value: '{base.color.blue.6}',
445
+ $type: 'color',
446
+ $extensions: {
447
+ 'org.primer.figma': {
448
+ collection: 'mode',
449
+ mode: 'light',
450
+ group: 'component',
451
+ scopes: ['fgColor'],
452
+ },
453
+ },
454
+ },
455
+ variable: {
456
+ $value: '{base.color.orange.6}',
457
+ $type: 'color',
458
+ $extensions: {
459
+ 'org.primer.figma': {
460
+ collection: 'mode',
461
+ mode: 'light',
462
+ group: 'component',
463
+ scopes: ['fgColor'],
464
+ },
465
+ },
466
+ },
467
+ },
468
+ },
469
+ },
470
+ header: {
471
+ fgColor: {
472
+ default: {
473
+ $value: '{fgColor.onEmphasis}',
474
+ $type: 'color',
475
+ $extensions: {
476
+ 'org.primer.figma': {
477
+ collection: 'mode',
478
+ mode: 'light',
479
+ group: 'component',
480
+ scopes: ['fgColor'],
481
+ },
482
+ },
483
+ alpha: 0.7,
484
+ },
485
+ logo: {
486
+ $value: '{fgColor.onEmphasis}',
487
+ $type: 'color',
488
+ $extensions: {
489
+ 'org.primer.figma': {
490
+ collection: 'mode',
491
+ mode: 'light',
492
+ group: 'component',
493
+ scopes: ['fgColor'],
494
+ },
495
+ },
496
+ },
497
+ },
498
+ bgColor: {
499
+ $value: '{base.color.neutral.13}',
500
+ $type: 'color',
501
+ $extensions: {
502
+ 'org.primer.figma': {
503
+ collection: 'mode',
504
+ mode: 'light',
505
+ group: 'component',
506
+ scopes: ['bgColor'],
507
+ },
508
+ },
509
+ },
510
+ borderColor: {
511
+ divider: {
512
+ $value: '{base.color.neutral.10}',
513
+ $type: 'color',
514
+ $extensions: {
515
+ 'org.primer.figma': {
516
+ collection: 'mode',
517
+ mode: 'light',
518
+ group: 'component',
519
+ scopes: ['borderColor'],
520
+ },
521
+ },
522
+ },
523
+ },
524
+ },
525
+ headerSearch: {
526
+ bgColor: {
527
+ $value: '{base.color.neutral.13}',
528
+ $type: 'color',
529
+ $extensions: {
530
+ 'org.primer.figma': {
531
+ collection: 'mode',
532
+ mode: 'light',
533
+ group: 'component',
534
+ scopes: ['bgColor'],
535
+ },
536
+ },
537
+ },
538
+ borderColor: {
539
+ $value: '{base.color.neutral.10}',
540
+ $type: 'color',
541
+ $extensions: {
542
+ 'org.primer.figma': {
543
+ collection: 'mode',
544
+ mode: 'light',
545
+ group: 'component',
546
+ scopes: ['borderColor'],
547
+ },
548
+ },
549
+ },
550
+ },
551
+ }