@primer/primitives 10.3.4 → 10.4.0-rc.1cf1d876

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 (74) hide show
  1. package/dist/css/base/motion/motion.css +1 -0
  2. package/dist/css/functional/themes/dark-colorblind.css +36 -0
  3. package/dist/css/functional/themes/dark-dimmed.css +36 -0
  4. package/dist/css/functional/themes/dark-high-contrast.css +36 -0
  5. package/dist/css/functional/themes/dark-tritanopia.css +36 -0
  6. package/dist/css/functional/themes/dark.css +36 -0
  7. package/dist/css/functional/themes/light-colorblind.css +36 -0
  8. package/dist/css/functional/themes/light-high-contrast.css +36 -0
  9. package/dist/css/functional/themes/light-tritanopia.css +36 -0
  10. package/dist/css/functional/themes/light.css +36 -0
  11. package/dist/css/primitives.css +1 -0
  12. package/dist/docs/base/motion/motion.json +14 -0
  13. package/dist/docs/functional/themes/dark-colorblind.json +2600 -226
  14. package/dist/docs/functional/themes/dark-dimmed.json +2152 -166
  15. package/dist/docs/functional/themes/dark-high-contrast.json +2786 -260
  16. package/dist/docs/functional/themes/dark-tritanopia.json +2446 -160
  17. package/dist/docs/functional/themes/dark.json +2379 -215
  18. package/dist/docs/functional/themes/light-colorblind.json +2573 -225
  19. package/dist/docs/functional/themes/light-high-contrast.json +1990 -234
  20. package/dist/docs/functional/themes/light-tritanopia.json +2437 -163
  21. package/dist/docs/functional/themes/light.json +2380 -216
  22. package/dist/fallbacks/base/motion/motion.json +1 -0
  23. package/dist/figma/themes/dark-colorblind.json +4154 -3589
  24. package/dist/figma/themes/dark-dimmed.json +3945 -3563
  25. package/dist/figma/themes/dark-high-contrast.json +3361 -2651
  26. package/dist/figma/themes/dark-tritanopia.json +4128 -3675
  27. package/dist/figma/themes/dark.json +4039 -3746
  28. package/dist/figma/themes/light-colorblind.json +4084 -3551
  29. package/dist/figma/themes/light-high-contrast.json +3409 -3101
  30. package/dist/figma/themes/light-tritanopia.json +4086 -3649
  31. package/dist/figma/themes/light.json +3991 -3698
  32. package/dist/internalCss/dark-colorblind.css +36 -0
  33. package/dist/internalCss/dark-dimmed.css +36 -0
  34. package/dist/internalCss/dark-high-contrast.css +36 -0
  35. package/dist/internalCss/dark-tritanopia.css +36 -0
  36. package/dist/internalCss/dark.css +36 -0
  37. package/dist/internalCss/light-colorblind.css +36 -0
  38. package/dist/internalCss/light-high-contrast.css +36 -0
  39. package/dist/internalCss/light-tritanopia.css +36 -0
  40. package/dist/internalCss/light.css +36 -0
  41. package/dist/styleLint/base/motion/motion.json +14 -0
  42. package/dist/styleLint/functional/themes/dark-colorblind.json +2599 -225
  43. package/dist/styleLint/functional/themes/dark-dimmed.json +2151 -165
  44. package/dist/styleLint/functional/themes/dark-high-contrast.json +2785 -259
  45. package/dist/styleLint/functional/themes/dark-tritanopia.json +2446 -160
  46. package/dist/styleLint/functional/themes/dark.json +2379 -215
  47. package/dist/styleLint/functional/themes/light-colorblind.json +2575 -227
  48. package/dist/styleLint/functional/themes/light-high-contrast.json +1989 -233
  49. package/dist/styleLint/functional/themes/light-tritanopia.json +2436 -162
  50. package/dist/styleLint/functional/themes/light.json +2380 -216
  51. package/package.json +1 -1
  52. package/src/tokens/base/motion/timing.json5 +4 -0
  53. package/src/tokens/component/card.json5 +18 -0
  54. package/src/tokens/{functional/color/light/app-light.json5 → component/codeMirror.json5} +67 -0
  55. package/src/tokens/component/contribution.json5 +344 -0
  56. package/src/tokens/component/counter.json5 +43 -0
  57. package/src/tokens/component/tooltip.json5 +32 -0
  58. package/src/tokens/functional/color/bgColor.json5 +24 -20
  59. package/src/tokens/functional/color/control.json5 +968 -0
  60. package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +0 -24
  61. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +0 -164
  62. package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +0 -104
  63. package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +0 -60
  64. package/src/tokens/functional/color/dark/patterns-dark.json5 +725 -1432
  65. package/src/tokens/functional/color/{dark/data-vis-dark.json5 → data-vis.json5} +61 -21
  66. package/src/tokens/functional/color/focus.json5 +15 -0
  67. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +0 -20
  68. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +0 -90
  69. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +0 -56
  70. package/src/tokens/functional/color/light/patterns-light.json5 +720 -1428
  71. package/src/tokens/functional/color/{light/syntax-light.json5 → syntax.json5} +187 -0
  72. package/src/tokens/functional/color/dark/app-dark.json5 +0 -254
  73. package/src/tokens/functional/color/dark/syntax-dark.json5 +0 -559
  74. package/src/tokens/functional/color/light/data-vis-light.json5 +0 -284
package/src/tokens/functional/color/dark/patterns-dark.json5 CHANGED
@@ -1,1387 +1,730 @@
1
1
  {
2
- control: {
3
- bgColor: {
4
- rest: {
5
- $value: '{base.color.neutral.3}',
6
- $type: 'color',
7
- $extensions: {
8
- 'org.primer.figma': {
9
- collection: 'mode',
10
- group: 'component',
11
- scopes: ['bgColor'],
12
- },
13
- },
14
- },
15
- hover: {
16
- $value: '{base.color.neutral.4}',
17
- $type: 'color',
18
- $extensions: {
19
- 'org.primer.figma': {
20
- collection: 'mode',
21
- group: 'component',
22
- scopes: ['bgColor'],
23
- },
24
- },
25
- },
26
- active: {
27
- $value: '{base.color.neutral.5}',
28
- $type: 'color',
29
- $extensions: {
30
- 'org.primer.figma': {
31
- collection: 'mode',
32
- group: 'component',
33
- scopes: ['bgColor'],
34
- },
35
- },
36
- },
37
- disabled: {
38
- $value: '{bgColor.disabled}',
39
- $type: 'color',
40
- $extensions: {
41
- 'org.primer.figma': {
42
- collection: 'mode',
43
- group: 'component',
44
- scopes: ['bgColor'],
45
- },
46
- },
47
- },
48
- selected: {
49
- $value: '{control.bgColor.rest}',
50
- $type: 'color',
51
- $extensions: {
52
- 'org.primer.figma': {
53
- collection: 'mode',
54
- group: 'component',
55
- scopes: ['bgColor'],
56
- },
57
- },
58
- },
59
- },
60
- fgColor: {
61
- rest: {
62
- $value: '{fgColor.default}',
63
- $type: 'color',
64
- $extensions: {
65
- 'org.primer.figma': {
66
- collection: 'mode',
67
- group: 'component',
68
- scopes: ['fgColor'],
69
- },
70
- },
71
- },
72
- placeholder: {
73
- $value: '{fgColor.muted}',
74
- $type: 'color',
75
- $extensions: {
76
- 'org.primer.figma': {
77
- collection: 'mode',
78
- group: 'component',
79
- scopes: ['fgColor'],
80
- },
81
- },
82
- },
83
- disabled: {
84
- $value: '{fgColor.disabled}',
85
- $type: 'color',
86
- $extensions: {
87
- 'org.primer.figma': {
88
- collection: 'mode',
89
- group: 'component',
90
- scopes: ['fgColor'],
91
- },
92
- },
93
- },
94
- },
95
- borderColor: {
96
- rest: {
97
- $value: '{borderColor.default}',
98
- $type: 'color',
99
- $extensions: {
100
- 'org.primer.figma': {
101
- collection: 'mode',
102
- group: 'component',
103
- scopes: ['borderColor'],
104
- },
105
- },
106
- },
107
- emphasis: {
108
- $value: '{borderColor.emphasis}',
109
- $type: 'color',
110
- $extensions: {
111
- 'org.primer.figma': {
112
- collection: 'mode',
113
- group: 'component',
114
- scopes: ['borderColor'],
115
- },
116
- },
117
- },
118
- disabled: {
119
- $value: '{borderColor.disabled}',
120
- $type: 'color',
121
- $extensions: {
122
- 'org.primer.figma': {
123
- collection: 'mode',
124
- group: 'component',
125
- scopes: ['borderColor'],
126
- },
127
- },
128
- },
129
- selected: {
130
- $value: '{base.color.neutral.12}',
131
- $type: 'color',
132
- $extensions: {
133
- 'org.primer.figma': {
134
- collection: 'mode',
135
- group: 'component',
136
- scopes: ['borderColor'],
137
- },
138
- },
139
- },
140
- success: {
141
- $value: '{borderColor.success.emphasis}',
142
- $type: 'color',
143
- $extensions: {
144
- 'org.primer.figma': {
145
- collection: 'mode',
146
- group: 'component',
147
- scopes: ['borderColor'],
148
- },
149
- },
150
- },
151
- danger: {
152
- $value: '{borderColor.danger.emphasis}',
153
- $type: 'color',
154
- $extensions: {
155
- 'org.primer.figma': {
156
- collection: 'mode',
157
- group: 'component',
158
- scopes: ['borderColor'],
159
- },
160
- },
161
- },
162
- warning: {
163
- $value: '{borderColor.attention.emphasis}',
164
- $type: 'color',
165
- $extensions: {
166
- 'org.primer.figma': {
167
- collection: 'mode',
168
- group: 'component',
169
- scopes: ['borderColor'],
170
- },
171
- },
172
- },
173
- },
174
- iconColor: {
175
- rest: {
176
- $value: '{fgColor.muted}',
177
- $type: 'color',
178
- $extensions: {
179
- 'org.primer.figma': {
180
- collection: 'mode',
181
- group: 'component',
182
- scopes: ['fgColor'],
183
- },
184
- },
185
- },
186
- },
187
- transparent: {
188
- bgColor: {
189
- rest: {
190
- $value: '{base.color.transparent}',
191
- $type: 'color',
192
- $extensions: {
193
- 'org.primer.figma': {
194
- collection: 'mode',
195
- group: 'component',
196
- scopes: ['bgColor'],
197
- },
198
- },
199
- },
200
- hover: {
201
- $value: '{base.color.neutral.8}',
202
- $type: 'color',
203
- $extensions: {
204
- 'org.primer.figma': {
205
- collection: 'mode',
206
- group: 'component',
207
- scopes: ['bgColor'],
208
- },
209
- },
210
- alpha: 0.2,
211
- },
212
- active: {
213
- $value: '{base.color.neutral.8}',
214
- $type: 'color',
215
- $extensions: {
216
- 'org.primer.figma': {
217
- collection: 'mode',
218
- group: 'component',
219
- scopes: ['bgColor'],
220
- },
221
- },
222
- alpha: 0.25,
223
- },
224
- disabled: {
225
- $value: '{bgColor.disabled}',
226
- $type: 'color',
227
- $extensions: {
228
- 'org.primer.figma': {
229
- collection: 'mode',
230
- group: 'component',
231
- scopes: ['bgColor'],
232
- },
233
- },
234
- },
235
- selected: {
236
- $value: '{base.color.neutral.8}',
237
- $type: 'color',
238
- $extensions: {
239
- 'org.primer.figma': {
240
- collection: 'mode',
241
- group: 'component',
242
- scopes: ['bgColor'],
243
- },
244
- },
245
- alpha: 0.1,
246
- },
247
- },
248
- borderColor: {
249
- rest: {
250
- $value: '{base.color.transparent}',
251
- $type: 'color',
252
- $extensions: {
253
- 'org.primer.figma': {
254
- collection: 'mode',
255
- group: 'component',
256
- scopes: ['borderColor'],
257
- },
258
- },
259
- },
260
- hover: {
261
- $value: '{base.color.transparent}',
262
- $type: 'color',
263
- $extensions: {
264
- 'org.primer.figma': {
265
- collection: 'mode',
266
- group: 'component',
267
- scopes: ['borderColor'],
268
- },
269
- },
270
- },
271
- active: {
272
- $value: '{base.color.transparent}',
273
- $type: 'color',
274
- $extensions: {
275
- 'org.primer.figma': {
276
- collection: 'mode',
277
- group: 'component',
278
- scopes: ['borderColor'],
279
- },
280
- },
281
- },
282
- },
283
- },
284
- danger: {
285
- fgColor: {
286
- rest: {
287
- $value: '{fgColor.danger}',
288
- $type: 'color',
289
- $extensions: {
290
- 'org.primer.figma': {
291
- collection: 'mode',
292
- group: 'component',
293
- scopes: ['fgColor'],
294
- },
295
- },
296
- },
297
- hover: {
298
- $value: '{base.color.red.3}',
299
- $type: 'color',
300
- $extensions: {
301
- 'org.primer.figma': {
302
- collection: 'mode',
303
- group: 'component',
304
- scopes: ['fgColor'],
305
- },
306
- },
307
- },
308
- },
309
- bgColor: {
310
- hover: {
311
- $value: '{bgColor.danger.muted}',
312
- $type: 'color',
313
- $extensions: {
314
- 'org.primer.figma': {
315
- collection: 'mode',
316
- group: 'component',
317
- scopes: ['bgColor'],
318
- },
319
- },
320
- },
321
- active: {
322
- $value: '{bgColor.danger.muted}',
323
- $type: 'color',
324
- $extensions: {
325
- 'org.primer.figma': {
326
- collection: 'mode',
327
- group: 'component',
328
- scopes: ['bgColor'],
329
- },
330
- },
331
- alpha: 0.4,
332
- },
333
- },
334
- },
335
- checked: {
336
- bgColor: {
337
- rest: {
338
- $value: '{bgColor.accent.emphasis}',
339
- $type: 'color',
340
- $extensions: {
341
- 'org.primer.figma': {
342
- collection: 'mode',
343
- group: 'component',
344
- scopes: ['bgColor'],
345
- },
346
- },
347
- },
348
- hover: {
349
- $value: '#2A7AEF',
350
- $type: 'color',
351
- $extensions: {
352
- 'org.primer.figma': {
353
- collection: 'mode',
354
- group: 'component',
355
- scopes: ['bgColor'],
356
- },
357
- },
358
- },
359
- active: {
360
- $value: '#3685F3',
361
- $type: 'color',
362
- $extensions: {
363
- 'org.primer.figma': {
364
- collection: 'mode',
365
- group: 'component',
366
- scopes: ['bgColor'],
367
- },
368
- },
369
- },
370
- disabled: {
371
- $value: '{fgColor.disabled}',
372
- $type: 'color',
373
- $extensions: {
374
- 'org.primer.figma': {
375
- collection: 'mode',
376
- group: 'component',
377
- scopes: ['bgColor'],
378
- },
379
- },
380
- },
381
- },
382
- fgColor: {
383
- rest: {
384
- $value: '{fgColor.onEmphasis}',
385
- $type: 'color',
386
- $extensions: {
387
- 'org.primer.figma': {
388
- collection: 'mode',
389
- group: 'component',
390
- scopes: ['fgColor'],
391
- },
392
- },
393
- },
394
- disabled: {
395
- $value: '{base.color.inset}',
396
- $type: 'color',
397
- $extensions: {
398
- 'org.primer.figma': {
399
- collection: 'mode',
400
- group: 'component',
401
- scopes: ['fgColor'],
402
- },
403
- },
404
- },
405
- },
406
- borderColor: {
407
- rest: {
408
- $value: '{control.checked.bgColor.rest}',
409
- $type: 'color',
410
- $extensions: {
411
- 'org.primer.figma': {
412
- collection: 'mode',
413
- group: 'component',
414
- scopes: ['borderColor'],
415
- },
416
- },
417
- },
418
- hover: {
419
- $value: '{control.checked.bgColor.hover}',
420
- $type: 'color',
421
- $extensions: {
422
- 'org.primer.figma': {
423
- collection: 'mode',
424
- group: 'component',
425
- scopes: ['borderColor'],
426
- },
427
- },
428
- },
429
- active: {
430
- $value: '{control.checked.bgColor.active}',
431
- $type: 'color',
432
- $extensions: {
433
- 'org.primer.figma': {
434
- collection: 'mode',
435
- group: 'component',
436
- scopes: ['borderColor'],
437
- },
438
- },
439
- },
440
- disabled: {
441
- $value: '{control.checked.bgColor.disabled}',
442
- $type: 'color',
443
- $extensions: {
444
- 'org.primer.figma': {
445
- collection: 'mode',
446
- group: 'component',
447
- scopes: ['borderColor'],
448
- },
449
- },
450
- },
451
- },
452
- },
453
- },
454
- controlTrack: {
455
- bgColor: {
456
- rest: {
457
- $value: '{base.color.neutral.4}',
458
- $type: 'color',
459
- $extensions: {
460
- 'org.primer.figma': {
461
- collection: 'mode',
462
- group: 'component (internal)',
463
- scopes: ['bgColor'],
464
- },
465
- },
466
- },
467
- hover: {
468
- $value: '{base.color.neutral.5}',
469
- $type: 'color',
470
- $extensions: {
471
- 'org.primer.figma': {
472
- collection: 'mode',
473
- group: 'component (internal)',
474
- scopes: ['bgColor'],
475
- },
476
- },
477
- },
478
- active: {
479
- $value: '{base.color.neutral.6}',
480
- $type: 'color',
481
- $extensions: {
482
- 'org.primer.figma': {
483
- collection: 'mode',
484
- group: 'component (internal)',
485
- scopes: ['bgColor'],
486
- },
487
- },
488
- },
489
- disabled: {
490
- $value: '{fgColor.disabled}',
491
- $type: 'color',
492
- $extensions: {
493
- 'org.primer.figma': {
494
- collection: 'mode',
495
- group: 'component (internal)',
496
- scopes: ['bgColor'],
497
- },
498
- },
499
- },
500
- },
501
- fgColor: {
502
- rest: {
503
- $value: '{fgColor.muted}',
504
- $type: 'color',
505
- $extensions: {
506
- 'org.primer.figma': {
507
- collection: 'mode',
508
- group: 'component (internal)',
509
- scopes: ['fgColor'],
510
- },
511
- },
512
- },
513
- disabled: {
514
- $value: '{fgColor.onEmphasis}',
515
- $type: 'color',
516
- $extensions: {
517
- 'org.primer.figma': {
518
- collection: 'mode',
519
- group: 'component (internal)',
520
- scopes: ['fgColor'],
521
- },
522
- },
523
- },
524
- },
525
- borderColor: {
526
- rest: {
527
- $value: '{borderColor.default}',
528
- $type: 'color',
529
- $extensions: {
530
- 'org.primer.figma': {
531
- collection: 'mode',
532
- group: 'component (internal)',
533
- scopes: ['borderColor'],
534
- },
535
- },
536
- },
537
- disabled: {
538
- $value: '{fgColor.disabled}',
539
- $type: 'color',
540
- $extensions: {
541
- 'org.primer.figma': {
542
- collection: 'mode',
543
- group: 'component (internal)',
544
- scopes: ['borderColor'],
545
- },
546
- },
547
- },
548
- },
549
- },
550
- controlKnob: {
551
- bgColor: {
552
- rest: {
553
- $value: '{bgColor.inset}',
554
- $type: 'color',
555
- $extensions: {
556
- 'org.primer.figma': {
557
- collection: 'mode',
558
- group: 'component (internal)',
559
- scopes: ['bgColor'],
560
- },
561
- },
562
- },
563
- disabled: {
564
- $value: '{control.bgColor.disabled}',
565
- $type: 'color',
566
- $extensions: {
567
- 'org.primer.figma': {
568
- collection: 'mode',
569
- group: 'component (internal)',
570
- scopes: ['bgColor'],
571
- },
572
- },
573
- },
574
- checked: {
575
- $value: '{base.color.neutral.13}',
576
- $type: 'color',
577
- $extensions: {
578
- 'org.primer.figma': {
579
- collection: 'mode',
580
- group: 'component (internal)',
581
- scopes: ['bgColor'],
582
- },
583
- },
584
- },
585
- },
586
- borderColor: {
587
- rest: {
588
- $value: '{control.borderColor.emphasis}',
589
- $type: 'color',
590
- $extensions: {
591
- 'org.primer.figma': {
592
- collection: 'mode',
593
- group: 'component (internal)',
594
- scopes: ['borderColor'],
595
- },
596
- },
597
- },
598
- disabled: {
599
- $value: '{control.bgColor.disabled}',
600
- $type: 'color',
601
- $extensions: {
602
- 'org.primer.figma': {
603
- collection: 'mode',
604
- group: 'component (internal)',
605
- scopes: ['borderColor'],
606
- },
607
- },
608
- },
609
- checked: {
610
- $value: '{control.checked.bgColor.rest}',
611
- $type: 'color',
612
- $extensions: {
613
- 'org.primer.figma': {
614
- collection: 'mode',
615
- group: 'component (internal)',
616
- scopes: ['borderColor'],
617
- },
618
- },
619
- },
620
- },
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
- button: {
660
- default: {
661
- fgColor: {
662
- rest: {
663
- $value: '{control.fgColor.rest}',
664
- $type: 'color',
665
- $extensions: {
666
- 'org.primer.figma': {
667
- collection: 'mode',
668
- group: 'component (internal)',
669
- scopes: ['fgColor'],
670
- },
671
- },
672
- },
673
- },
674
- bgColor: {
675
- rest: {
676
- $value: '{control.bgColor.rest}',
677
- $type: 'color',
678
- $extensions: {
679
- 'org.primer.figma': {
680
- collection: 'mode',
681
- group: 'component (internal)',
682
- scopes: ['bgColor'],
683
- },
684
- },
685
- },
686
- hover: {
687
- $value: '{control.bgColor.hover}',
688
- $type: 'color',
689
- $extensions: {
690
- 'org.primer.figma': {
691
- collection: 'mode',
692
- group: 'component (internal)',
693
- scopes: ['bgColor'],
694
- },
695
- },
696
- },
697
- active: {
698
- $value: '{control.bgColor.active}',
699
- $type: 'color',
700
- $extensions: {
701
- 'org.primer.figma': {
702
- collection: 'mode',
703
- group: 'component (internal)',
704
- scopes: ['bgColor'],
705
- },
706
- },
707
- },
708
- selected: {
709
- $value: '{control.bgColor.active}',
710
- $type: 'color',
711
- $extensions: {
712
- 'org.primer.figma': {
713
- collection: 'mode',
714
- group: 'component (internal)',
715
- scopes: ['bgColor'],
716
- },
717
- },
718
- },
719
- disabled: {
720
- $value: '{control.bgColor.disabled}',
721
- $type: 'color',
722
- $extensions: {
723
- 'org.primer.figma': {
724
- collection: 'mode',
725
- group: 'component (internal)',
726
- scopes: ['bgColor'],
727
- },
728
- },
729
- },
730
- },
731
- borderColor: {
732
- rest: {
733
- $value: '{control.borderColor.rest}',
734
- $type: 'color',
735
- $extensions: {
736
- 'org.primer.figma': {
737
- collection: 'mode',
738
- group: 'component (internal)',
739
- scopes: ['borderColor'],
740
- },
741
- },
742
- },
743
- hover: {
744
- $value: '{button.default.borderColor.rest}',
745
- $type: 'color',
746
- $extensions: {
747
- 'org.primer.figma': {
748
- collection: 'mode',
749
- group: 'component (internal)',
750
- scopes: ['borderColor'],
751
- },
752
- },
753
- },
754
- active: {
755
- $value: '{button.default.borderColor.rest}',
756
- $type: 'color',
757
- $extensions: {
758
- 'org.primer.figma': {
759
- collection: 'mode',
760
- group: 'component (internal)',
761
- scopes: ['borderColor'],
762
- },
763
- },
764
- },
765
- disabled: {
766
- $value: '{control.borderColor.disabled}',
767
- $type: 'color',
768
- $extensions: {
769
- 'org.primer.figma': {
770
- collection: 'mode',
771
- group: 'component (internal)',
772
- scopes: ['borderColor'],
773
- },
774
- },
775
- },
776
- },
777
- },
778
- primary: {
779
- fgColor: {
780
- rest: {
781
- $value: '{fgColor.white}',
782
- $type: 'color',
783
- $extensions: {
784
- 'org.primer.figma': {
785
- collection: 'mode',
786
- group: 'component (internal)',
787
- scopes: ['fgColor'],
788
- },
789
- },
790
- },
791
- disabled: {
792
- $value: '{base.color.neutral.13}',
793
- $type: 'color',
794
- $extensions: {
795
- 'org.primer.figma': {
796
- collection: 'mode',
797
- group: 'component (internal)',
798
- scopes: ['fgColor'],
799
- },
800
- },
801
- alpha: 0.4,
802
- },
803
- },
804
- iconColor: {
805
- rest: {
806
- $value: '{fgColor.white}',
807
- $type: 'color',
808
- $extensions: {
809
- 'org.primer.figma': {
810
- collection: 'mode',
811
- group: 'component (internal)',
812
- scopes: ['fgColor'],
813
- },
814
- },
815
- },
816
- },
817
- bgColor: {
818
- rest: {
819
- $value: '{bgColor.success.emphasis}',
820
- $type: 'color',
821
- $extensions: {
822
- 'org.primer.figma': {
823
- collection: 'mode',
824
- group: 'component (internal)',
825
- scopes: ['bgColor'],
826
- },
827
- },
828
- },
829
- hover: {
830
- $value: '#29903B',
831
- $type: 'color',
832
- $extensions: {
833
- 'org.primer.figma': {
834
- collection: 'mode',
835
- group: 'component (internal)',
836
- scopes: ['bgColor'],
837
- },
838
- },
839
- },
840
- active: {
841
- $value: '#2E9A40',
842
- $type: 'color',
843
- $extensions: {
844
- 'org.primer.figma': {
845
- collection: 'mode',
846
- group: 'component (internal)',
847
- scopes: ['bgColor'],
848
- },
849
- },
850
- },
851
- disabled: {
852
- $value: '#105823',
853
- $type: 'color',
854
- $extensions: {
855
- 'org.primer.figma': {
856
- collection: 'mode',
857
- group: 'component (internal)',
858
- scopes: ['bgColor'],
859
- },
860
- },
861
- },
862
- },
863
- borderColor: {
864
- rest: {
865
- $value: '{base.color.neutral.13}',
866
- $type: 'color',
867
- $extensions: {
868
- 'org.primer.figma': {
869
- collection: 'mode',
870
- group: 'component (internal)',
871
- scopes: ['borderColor'],
872
- },
873
- },
874
- alpha: 0.1,
875
- },
876
- hover: {
877
- $value: '{button.primary.borderColor.rest}',
878
- $type: 'color',
879
- $extensions: {
880
- 'org.primer.figma': {
881
- collection: 'mode',
882
- group: 'component (internal)',
883
- scopes: ['borderColor'],
884
- },
885
- },
886
- },
887
- active: {
888
- $value: '{button.primary.borderColor.rest}',
889
- $type: 'color',
890
- $extensions: {
891
- 'org.primer.figma': {
892
- collection: 'mode',
893
- group: 'component (internal)',
894
- scopes: ['borderColor'],
895
- },
896
- },
897
- },
898
- disabled: {
899
- $value: '#105823',
900
- $type: 'color',
901
- $extensions: {
902
- 'org.primer.figma': {
903
- collection: 'mode',
904
- group: 'component (internal)',
905
- scopes: ['borderColor'],
906
- },
907
- },
908
- },
909
- },
910
- },
911
- invisible: {
912
- fgColor: {
913
- rest: {
914
- $value: '{control.fgColor.rest}',
915
- $type: 'color',
916
- $extensions: {
917
- 'org.primer.figma': {
918
- collection: 'mode',
919
- group: 'component (internal)',
920
- scopes: ['fgColor'],
921
- },
922
- },
923
- },
924
- hover: {
925
- $value: '{control.fgColor.rest}',
926
- $type: 'color',
927
- $extensions: {
928
- 'org.primer.figma': {
929
- collection: 'mode',
930
- group: 'component (internal)',
931
- scopes: ['fgColor'],
932
- },
933
- },
934
- },
935
- active: {
936
- $value: '{control.fgColor.rest}',
937
- $type: 'color',
938
- $extensions: {
939
- 'org.primer.figma': {
940
- collection: 'mode',
941
- group: 'component (internal)',
942
- scopes: ['fgColor'],
943
- },
944
- },
945
- },
946
- disabled: {
947
- $value: '{control.fgColor.disabled}',
948
- $type: 'color',
949
- $extensions: {
950
- 'org.primer.figma': {
951
- collection: 'mode',
952
- group: 'component (internal)',
953
- scopes: ['fgColor'],
954
- },
955
- },
956
- },
957
- },
958
- iconColor: {
959
- rest: {
960
- $value: '{fgColor.muted}',
961
- $type: 'color',
962
- $extensions: {
963
- 'org.primer.figma': {
964
- collection: 'mode',
965
- group: 'component (internal)',
966
- scopes: ['fgColor'],
967
- },
968
- },
969
- },
970
- hover: {
971
- $value: '{fgColor.muted}',
972
- $type: 'color',
973
- $extensions: {
974
- 'org.primer.figma': {
975
- collection: 'mode',
976
- group: 'component (internal)',
977
- scopes: ['fgColor'],
978
- },
979
- },
980
- },
981
- disabled: {
982
- $value: '{control.fgColor.disabled}',
983
- $type: 'color',
984
- $extensions: {
985
- 'org.primer.figma': {
986
- collection: 'mode',
987
- group: 'component (internal)',
988
- scopes: ['fgColor'],
989
- },
990
- },
991
- },
992
- },
993
- bgColor: {
994
- rest: {
995
- $value: '{control.transparent.bgColor.rest}',
996
- $type: 'color',
997
- $extensions: {
998
- 'org.primer.figma': {
999
- collection: 'mode',
1000
- group: 'component (internal)',
1001
- scopes: ['bgColor'],
1002
- },
1003
- },
1004
- },
1005
- hover: {
1006
- $value: '{control.transparent.bgColor.hover}',
1007
- $type: 'color',
1008
- $extensions: {
1009
- 'org.primer.figma': {
1010
- collection: 'mode',
1011
- group: 'component (internal)',
1012
- scopes: ['bgColor'],
1013
- },
1014
- },
1015
- },
1016
- active: {
1017
- $value: '{control.transparent.bgColor.active}',
1018
- $type: 'color',
1019
- $extensions: {
1020
- 'org.primer.figma': {
1021
- collection: 'mode',
1022
- group: 'component (internal)',
1023
- scopes: ['bgColor'],
1024
- },
1025
- },
1026
- },
1027
- disabled: {
1028
- $value: '{base.color.transparent}',
1029
- $type: 'color',
1030
- $extensions: {
1031
- 'org.primer.figma': {
1032
- collection: 'mode',
1033
- group: 'component (internal)',
1034
- scopes: ['bgColor'],
1035
- },
1036
- },
1037
- },
1038
- },
1039
- borderColor: {
1040
- rest: {
1041
- $value: '{control.transparent.borderColor.rest}',
1042
- $type: 'color',
1043
- $extensions: {
1044
- 'org.primer.figma': {
1045
- collection: 'mode',
1046
- group: 'component (internal)',
1047
- scopes: ['borderColor'],
1048
- },
1049
- },
1050
- },
1051
- hover: {
1052
- $value: '{control.transparent.borderColor.hover}',
1053
- $type: 'color',
1054
- $extensions: {
1055
- 'org.primer.figma': {
1056
- collection: 'mode',
1057
- group: 'component (internal)',
1058
- scopes: ['borderColor'],
1059
- },
1060
- },
1061
- },
1062
- disabled: {
1063
- $value: '{base.color.transparent}',
1064
- $type: 'color',
1065
- $extensions: {
1066
- 'org.primer.figma': {
1067
- collection: 'mode',
1068
- group: 'component (internal)',
1069
- scopes: ['borderColor'],
1070
- },
1071
- },
1072
- },
1073
- },
1074
- },
1075
- outline: {
1076
- fgColor: {
1077
- rest: {
1078
- $value: '{base.color.blue.4}',
1079
- $type: 'color',
1080
- $extensions: {
1081
- 'org.primer.figma': {
1082
- collection: 'mode',
1083
- group: 'component (internal)',
1084
- scopes: ['fgColor'],
1085
- },
1086
- },
1087
- },
1088
- hover: {
1089
- $value: '{base.color.blue.3}',
1090
- $type: 'color',
1091
- $extensions: {
1092
- 'org.primer.figma': {
1093
- collection: 'mode',
1094
- group: 'component (internal)',
1095
- scopes: ['fgColor'],
1096
- },
1097
- },
1098
- },
1099
- active: {
1100
- $value: '{base.color.neutral.13}',
1101
- $type: 'color',
1102
- $extensions: {
1103
- 'org.primer.figma': {
1104
- collection: 'mode',
1105
- group: 'component (internal)',
1106
- scopes: ['fgColor'],
1107
- },
1108
- },
1109
- },
1110
- disabled: {
1111
- $value: '{fgColor.accent}',
1112
- $type: 'color',
1113
- $extensions: {
1114
- 'org.primer.figma': {
1115
- collection: 'mode',
1116
- group: 'component (internal)',
1117
- scopes: ['fgColor'],
1118
- },
1119
- },
1120
- alpha: 0.5,
1121
- },
1122
- },
1123
- bgColor: {
1124
- rest: {
1125
- $value: '{base.color.neutral.12}',
1126
- $type: 'color',
1127
- $extensions: {
1128
- 'org.primer.figma': {
1129
- collection: 'mode',
1130
- group: 'component (internal)',
1131
- scopes: ['bgColor'],
1132
- },
1133
- },
1134
- },
1135
- hover: {
1136
- $value: '{control.bgColor.hover}',
1137
- $type: 'color',
1138
- $extensions: {
1139
- 'org.primer.figma': {
1140
- collection: 'mode',
1141
- group: 'component (internal)',
1142
- scopes: ['bgColor'],
1143
- },
1144
- },
1145
- },
1146
- active: {
1147
- $value: '{base.color.blue.7}',
1148
- $type: 'color',
1149
- $extensions: {
1150
- 'org.primer.figma': {
1151
- collection: 'mode',
1152
- group: 'component (internal)',
1153
- scopes: ['bgColor'],
1154
- },
1155
- },
1156
- },
1157
- disabled: {
1158
- $value: '{control.bgColor.disabled}',
1159
- $type: 'color',
1160
- $extensions: {
1161
- 'org.primer.figma': {
1162
- collection: 'mode',
1163
- group: 'component (internal)',
1164
- scopes: ['bgColor'],
1165
- },
1166
- },
1167
- },
1168
- },
1169
- borderColor: {
1170
- hover: {
1171
- $value: '{button.default.borderColor.hover}',
1172
- $type: 'color',
1173
- $extensions: {
1174
- 'org.primer.figma': {
1175
- collection: 'mode',
1176
- group: 'component (internal)',
1177
- scopes: ['borderColor'],
1178
- },
1179
- },
1180
- },
1181
- selected: {
1182
- $value: '{button.outline.borderColor.hover}',
1183
- $type: 'color',
1184
- $extensions: {
1185
- 'org.primer.figma': {
1186
- collection: 'mode',
1187
- group: 'component (internal)',
1188
- scopes: ['borderColor'],
1189
- },
1190
- },
1191
- },
1192
- },
1193
- },
1194
- danger: {
1195
- fgColor: {
1196
- rest: {
1197
- $value: '#FA5E55',
1198
- $type: 'color',
1199
- $extensions: {
1200
- 'org.primer.figma': {
1201
- collection: 'mode',
1202
- group: 'component (internal)',
1203
- scopes: ['fgColor'],
1204
- },
1205
- },
1206
- },
1207
- hover: {
1208
- $value: '{base.color.neutral.13}',
1209
- $type: 'color',
1210
- $extensions: {
1211
- 'org.primer.figma': {
1212
- collection: 'mode',
1213
- group: 'component (internal)',
1214
- scopes: ['fgColor'],
1215
- },
1216
- },
1217
- },
1218
- active: {
1219
- $value: '{base.color.neutral.13}',
1220
- $type: 'color',
1221
- $extensions: {
1222
- 'org.primer.figma': {
1223
- collection: 'mode',
1224
- group: 'component (internal)',
1225
- scopes: ['fgColor'],
1226
- },
1227
- },
1228
- },
1229
- disabled: {
1230
- $value: '{fgColor.danger}',
1231
- $type: 'color',
1232
- $extensions: {
1233
- 'org.primer.figma': {
1234
- collection: 'mode',
1235
- group: 'component (internal)',
1236
- scopes: ['fgColor'],
1237
- },
1238
- },
1239
- alpha: 0.5,
1240
- },
1241
- },
1242
- iconColor: {
1243
- rest: {
1244
- $value: '#FA5E55',
1245
- $type: 'color',
1246
- $extensions: {
1247
- 'org.primer.figma': {
1248
- collection: 'mode',
1249
- group: 'component (internal)',
1250
- scopes: ['fgColor'],
1251
- },
1252
- },
1253
- },
1254
- hover: {
1255
- $value: '{base.color.neutral.13}',
1256
- $type: 'color',
1257
- $extensions: {
1258
- 'org.primer.figma': {
1259
- collection: 'mode',
1260
- group: 'component (internal)',
1261
- scopes: ['fgColor'],
1262
- },
1263
- },
1264
- },
1265
- },
1266
- bgColor: {
1267
- rest: {
1268
- $value: '{control.bgColor.rest}',
1269
- $type: 'color',
1270
- $extensions: {
1271
- 'org.primer.figma': {
1272
- collection: 'mode',
1273
- group: 'component (internal)',
1274
- scopes: ['bgColor'],
1275
- },
1276
- },
1277
- },
1278
- hover: {
1279
- $value: '{base.color.red.6}',
1280
- $type: 'color',
1281
- $extensions: {
1282
- 'org.primer.figma': {
1283
- collection: 'mode',
1284
- group: 'component (internal)',
1285
- scopes: ['bgColor'],
1286
- },
1287
- },
1288
- },
1289
- active: {
1290
- $value: '#D03533',
1291
- $type: 'color',
1292
- $extensions: {
1293
- 'org.primer.figma': {
1294
- collection: 'mode',
1295
- group: 'component (internal)',
1296
- scopes: ['bgColor'],
1297
- },
1298
- },
1299
- },
1300
- disabled: {
1301
- $value: '{control.bgColor.disabled}',
1302
- $type: 'color',
1303
- $extensions: {
1304
- 'org.primer.figma': {
1305
- collection: 'mode',
1306
- group: 'component (internal)',
1307
- scopes: ['bgColor'],
1308
- },
1309
- },
1310
- },
1311
- },
1312
- borderColor: {
1313
- rest: {
1314
- $value: '{control.borderColor.rest}',
1315
- $type: 'color',
1316
- $extensions: {
1317
- 'org.primer.figma': {
1318
- collection: 'mode',
1319
- group: 'component (internal)',
1320
- scopes: ['borderColor'],
1321
- },
1322
- },
1323
- },
1324
- hover: {
1325
- $value: '{button.primary.borderColor.rest}',
1326
- $type: 'color',
1327
- $extensions: {
1328
- 'org.primer.figma': {
1329
- collection: 'mode',
1330
- group: 'component (internal)',
1331
- scopes: ['borderColor'],
1332
- },
1333
- },
1334
- },
1335
- active: {
1336
- $value: '{button.danger.borderColor.hover}',
1337
- $type: 'color',
1338
- $extensions: {
1339
- 'org.primer.figma': {
1340
- collection: 'mode',
1341
- group: 'component (internal)',
1342
- scopes: ['borderColor'],
1343
- },
1344
- },
1345
- },
1346
- },
1347
- },
1348
- inactive: {
1349
- fgColor: {
1350
- $value: '{base.color.neutral.9}',
1351
- $type: 'color',
1352
- $extensions: {
1353
- 'org.primer.figma': {
1354
- collection: 'mode',
1355
- group: 'component (internal)',
1356
- scopes: ['fgColor'],
1357
- },
1358
- },
1359
- },
1360
- bgColor: {
1361
- $value: '{base.color.neutral.4}',
1362
- $type: 'color',
1363
- $extensions: {
1364
- 'org.primer.figma': {
1365
- collection: 'mode',
1366
- group: 'component (internal)',
1367
- scopes: ['bgColor'],
1368
- },
1369
- },
1370
- },
1371
- },
1372
- star: {
1373
- iconColor: {
1374
- $value: '{base.color.yellow.2}',
1375
- $type: 'color',
1376
- $extensions: {
1377
- 'org.primer.figma': {
1378
- collection: 'mode',
1379
- group: 'component (internal)',
2
+ button: {
3
+ default: {
4
+ fgColor: {
5
+ rest: {
6
+ $value: '{control.fgColor.rest}',
7
+ $type: 'color',
8
+ $extensions: {
9
+ 'org.primer.figma': {
10
+ collection: 'mode',
11
+ group: 'component (internal)',
12
+ scopes: ['fgColor'],
13
+ },
14
+ },
15
+ },
16
+ },
17
+ bgColor: {
18
+ rest: {
19
+ $value: '{control.bgColor.rest}',
20
+ $type: 'color',
21
+ $extensions: {
22
+ 'org.primer.figma': {
23
+ collection: 'mode',
24
+ group: 'component (internal)',
25
+ scopes: ['bgColor'],
26
+ },
27
+ },
28
+ },
29
+ hover: {
30
+ $value: '{control.bgColor.hover}',
31
+ $type: 'color',
32
+ $extensions: {
33
+ 'org.primer.figma': {
34
+ collection: 'mode',
35
+ group: 'component (internal)',
36
+ scopes: ['bgColor'],
37
+ },
38
+ },
39
+ },
40
+ active: {
41
+ $value: '{control.bgColor.active}',
42
+ $type: 'color',
43
+ $extensions: {
44
+ 'org.primer.figma': {
45
+ collection: 'mode',
46
+ group: 'component (internal)',
47
+ scopes: ['bgColor'],
48
+ },
49
+ },
50
+ },
51
+ selected: {
52
+ $value: '{control.bgColor.active}',
53
+ $type: 'color',
54
+ $extensions: {
55
+ 'org.primer.figma': {
56
+ collection: 'mode',
57
+ group: 'component (internal)',
58
+ scopes: ['bgColor'],
59
+ },
60
+ },
61
+ },
62
+ disabled: {
63
+ $value: '{control.bgColor.disabled}',
64
+ $type: 'color',
65
+ $extensions: {
66
+ 'org.primer.figma': {
67
+ collection: 'mode',
68
+ group: 'component (internal)',
69
+ scopes: ['bgColor'],
70
+ },
71
+ },
72
+ },
73
+ },
74
+ borderColor: {
75
+ rest: {
76
+ $value: '{control.borderColor.rest}',
77
+ $type: 'color',
78
+ $extensions: {
79
+ 'org.primer.figma': {
80
+ collection: 'mode',
81
+ group: 'component (internal)',
82
+ scopes: ['borderColor'],
83
+ },
84
+ },
85
+ },
86
+ hover: {
87
+ $value: '{button.default.borderColor.rest}',
88
+ $type: 'color',
89
+ $extensions: {
90
+ 'org.primer.figma': {
91
+ collection: 'mode',
92
+ group: 'component (internal)',
93
+ scopes: ['borderColor'],
94
+ },
95
+ },
96
+ },
97
+ active: {
98
+ $value: '{button.default.borderColor.rest}',
99
+ $type: 'color',
100
+ $extensions: {
101
+ 'org.primer.figma': {
102
+ collection: 'mode',
103
+ group: 'component (internal)',
104
+ scopes: ['borderColor'],
105
+ },
106
+ },
107
+ },
108
+ disabled: {
109
+ $value: '{control.borderColor.disabled}',
110
+ $type: 'color',
111
+ $extensions: {
112
+ 'org.primer.figma': {
113
+ collection: 'mode',
114
+ group: 'component (internal)',
115
+ scopes: ['borderColor'],
116
+ },
117
+ },
118
+ },
119
+ },
120
+ },
121
+ primary: {
122
+ fgColor: {
123
+ rest: {
124
+ $value: '{fgColor.white}',
125
+ $type: 'color',
126
+ $extensions: {
127
+ 'org.primer.figma': {
128
+ collection: 'mode',
129
+ group: 'component (internal)',
130
+ scopes: ['fgColor'],
131
+ },
132
+ },
133
+ },
134
+ disabled: {
135
+ $value: '{base.color.neutral.13}',
136
+ $type: 'color',
137
+ $extensions: {
138
+ 'org.primer.figma': {
139
+ collection: 'mode',
140
+ group: 'component (internal)',
141
+ scopes: ['fgColor'],
142
+ },
143
+ },
144
+ alpha: 0.4,
145
+ },
146
+ },
147
+ iconColor: {
148
+ rest: {
149
+ $value: '{fgColor.white}',
150
+ $type: 'color',
151
+ $extensions: {
152
+ 'org.primer.figma': {
153
+ collection: 'mode',
154
+ group: 'component (internal)',
155
+ scopes: ['fgColor'],
156
+ },
157
+ },
158
+ },
159
+ },
160
+ bgColor: {
161
+ rest: {
162
+ $value: '{bgColor.success.emphasis}',
163
+ $type: 'color',
164
+ $extensions: {
165
+ 'org.primer.figma': {
166
+ collection: 'mode',
167
+ group: 'component (internal)',
168
+ scopes: ['bgColor'],
169
+ },
170
+ },
171
+ },
172
+ hover: {
173
+ $value: '#29903B',
174
+ $type: 'color',
175
+ $extensions: {
176
+ 'org.primer.figma': {
177
+ collection: 'mode',
178
+ group: 'component (internal)',
179
+ scopes: ['bgColor'],
180
+ },
181
+ },
182
+ },
183
+ active: {
184
+ $value: '#2E9A40',
185
+ $type: 'color',
186
+ $extensions: {
187
+ 'org.primer.figma': {
188
+ collection: 'mode',
189
+ group: 'component (internal)',
190
+ scopes: ['bgColor'],
191
+ },
192
+ },
193
+ },
194
+ disabled: {
195
+ $value: '#105823',
196
+ $type: 'color',
197
+ $extensions: {
198
+ 'org.primer.figma': {
199
+ collection: 'mode',
200
+ group: 'component (internal)',
201
+ scopes: ['bgColor'],
202
+ },
203
+ },
204
+ },
205
+ },
206
+ borderColor: {
207
+ rest: {
208
+ $value: '{base.color.neutral.13}',
209
+ $type: 'color',
210
+ $extensions: {
211
+ 'org.primer.figma': {
212
+ collection: 'mode',
213
+ group: 'component (internal)',
214
+ scopes: ['borderColor'],
215
+ },
216
+ },
217
+ alpha: 0.1,
218
+ },
219
+ hover: {
220
+ $value: '{button.primary.borderColor.rest}',
221
+ $type: 'color',
222
+ $extensions: {
223
+ 'org.primer.figma': {
224
+ collection: 'mode',
225
+ group: 'component (internal)',
226
+ scopes: ['borderColor'],
227
+ },
228
+ },
229
+ },
230
+ active: {
231
+ $value: '{button.primary.borderColor.rest}',
232
+ $type: 'color',
233
+ $extensions: {
234
+ 'org.primer.figma': {
235
+ collection: 'mode',
236
+ group: 'component (internal)',
237
+ scopes: ['borderColor'],
238
+ },
239
+ },
240
+ },
241
+ disabled: {
242
+ $value: '#105823',
243
+ $type: 'color',
244
+ $extensions: {
245
+ 'org.primer.figma': {
246
+ collection: 'mode',
247
+ group: 'component (internal)',
248
+ scopes: ['borderColor'],
249
+ },
250
+ },
251
+ },
252
+ },
253
+ },
254
+ invisible: {
255
+ fgColor: {
256
+ rest: {
257
+ $value: '{control.fgColor.rest}',
258
+ $type: 'color',
259
+ $extensions: {
260
+ 'org.primer.figma': {
261
+ collection: 'mode',
262
+ group: 'component (internal)',
263
+ scopes: ['fgColor'],
264
+ },
265
+ },
266
+ },
267
+ hover: {
268
+ $value: '{control.fgColor.rest}',
269
+ $type: 'color',
270
+ $extensions: {
271
+ 'org.primer.figma': {
272
+ collection: 'mode',
273
+ group: 'component (internal)',
274
+ scopes: ['fgColor'],
275
+ },
276
+ },
277
+ },
278
+ active: {
279
+ $value: '{control.fgColor.rest}',
280
+ $type: 'color',
281
+ $extensions: {
282
+ 'org.primer.figma': {
283
+ collection: 'mode',
284
+ group: 'component (internal)',
285
+ scopes: ['fgColor'],
286
+ },
287
+ },
288
+ },
289
+ disabled: {
290
+ $value: '{control.fgColor.disabled}',
291
+ $type: 'color',
292
+ $extensions: {
293
+ 'org.primer.figma': {
294
+ collection: 'mode',
295
+ group: 'component (internal)',
296
+ scopes: ['fgColor'],
297
+ },
298
+ },
299
+ },
300
+ },
301
+ iconColor: {
302
+ rest: {
303
+ $value: '{fgColor.muted}',
304
+ $type: 'color',
305
+ $extensions: {
306
+ 'org.primer.figma': {
307
+ collection: 'mode',
308
+ group: 'component (internal)',
309
+ scopes: ['fgColor'],
310
+ },
311
+ },
312
+ },
313
+ hover: {
314
+ $value: '{fgColor.muted}',
315
+ $type: 'color',
316
+ $extensions: {
317
+ 'org.primer.figma': {
318
+ collection: 'mode',
319
+ group: 'component (internal)',
320
+ scopes: ['fgColor'],
321
+ },
322
+ },
323
+ },
324
+ disabled: {
325
+ $value: '{control.fgColor.disabled}',
326
+ $type: 'color',
327
+ $extensions: {
328
+ 'org.primer.figma': {
329
+ collection: 'mode',
330
+ group: 'component (internal)',
331
+ scopes: ['fgColor'],
332
+ },
333
+ },
334
+ },
335
+ },
336
+ bgColor: {
337
+ rest: {
338
+ $value: '{control.transparent.bgColor.rest}',
339
+ $type: 'color',
340
+ $extensions: {
341
+ 'org.primer.figma': {
342
+ collection: 'mode',
343
+ group: 'component (internal)',
344
+ scopes: ['bgColor'],
345
+ },
346
+ },
347
+ },
348
+ hover: {
349
+ $value: '{control.transparent.bgColor.hover}',
350
+ $type: 'color',
351
+ $extensions: {
352
+ 'org.primer.figma': {
353
+ collection: 'mode',
354
+ group: 'component (internal)',
355
+ scopes: ['bgColor'],
356
+ },
357
+ },
358
+ },
359
+ active: {
360
+ $value: '{control.transparent.bgColor.active}',
361
+ $type: 'color',
362
+ $extensions: {
363
+ 'org.primer.figma': {
364
+ collection: 'mode',
365
+ group: 'component (internal)',
366
+ scopes: ['bgColor'],
367
+ },
368
+ },
369
+ },
370
+ disabled: {
371
+ $value: '{base.color.transparent}',
372
+ $type: 'color',
373
+ $extensions: {
374
+ 'org.primer.figma': {
375
+ collection: 'mode',
376
+ group: 'component (internal)',
377
+ scopes: ['bgColor'],
378
+ },
379
+ },
380
+ },
381
+ },
382
+ borderColor: {
383
+ rest: {
384
+ $value: '{control.transparent.borderColor.rest}',
385
+ $type: 'color',
386
+ $extensions: {
387
+ 'org.primer.figma': {
388
+ collection: 'mode',
389
+ group: 'component (internal)',
390
+ scopes: ['borderColor'],
391
+ },
392
+ },
393
+ },
394
+ hover: {
395
+ $value: '{control.transparent.borderColor.hover}',
396
+ $type: 'color',
397
+ $extensions: {
398
+ 'org.primer.figma': {
399
+ collection: 'mode',
400
+ group: 'component (internal)',
401
+ scopes: ['borderColor'],
402
+ },
403
+ },
404
+ },
405
+ disabled: {
406
+ $value: '{base.color.transparent}',
407
+ $type: 'color',
408
+ $extensions: {
409
+ 'org.primer.figma': {
410
+ collection: 'mode',
411
+ group: 'component (internal)',
412
+ scopes: ['borderColor'],
413
+ },
414
+ },
415
+ },
416
+ },
417
+ },
418
+ outline: {
419
+ fgColor: {
420
+ rest: {
421
+ $value: '{base.color.blue.4}',
422
+ $type: 'color',
423
+ $extensions: {
424
+ 'org.primer.figma': {
425
+ collection: 'mode',
426
+ group: 'component (internal)',
427
+ scopes: ['fgColor'],
428
+ },
429
+ },
430
+ },
431
+ hover: {
432
+ $value: '{base.color.blue.3}',
433
+ $type: 'color',
434
+ $extensions: {
435
+ 'org.primer.figma': {
436
+ collection: 'mode',
437
+ group: 'component (internal)',
438
+ scopes: ['fgColor'],
439
+ },
440
+ },
441
+ },
442
+ active: {
443
+ $value: '{base.color.neutral.13}',
444
+ $type: 'color',
445
+ $extensions: {
446
+ 'org.primer.figma': {
447
+ collection: 'mode',
448
+ group: 'component (internal)',
449
+ scopes: ['fgColor'],
450
+ },
451
+ },
452
+ },
453
+ disabled: {
454
+ $value: '{fgColor.accent}',
455
+ $type: 'color',
456
+ $extensions: {
457
+ 'org.primer.figma': {
458
+ collection: 'mode',
459
+ group: 'component (internal)',
460
+ scopes: ['fgColor'],
461
+ },
462
+ },
463
+ alpha: 0.5,
464
+ },
465
+ },
466
+ bgColor: {
467
+ rest: {
468
+ $value: '{base.color.neutral.12}',
469
+ $type: 'color',
470
+ $extensions: {
471
+ 'org.primer.figma': {
472
+ collection: 'mode',
473
+ group: 'component (internal)',
474
+ scopes: ['bgColor'],
475
+ },
476
+ },
477
+ },
478
+ hover: {
479
+ $value: '{control.bgColor.hover}',
480
+ $type: 'color',
481
+ $extensions: {
482
+ 'org.primer.figma': {
483
+ collection: 'mode',
484
+ group: 'component (internal)',
485
+ scopes: ['bgColor'],
486
+ },
487
+ },
488
+ },
489
+ active: {
490
+ $value: '{base.color.blue.7}',
491
+ $type: 'color',
492
+ $extensions: {
493
+ 'org.primer.figma': {
494
+ collection: 'mode',
495
+ group: 'component (internal)',
496
+ scopes: ['bgColor'],
497
+ },
498
+ },
499
+ },
500
+ disabled: {
501
+ $value: '{control.bgColor.disabled}',
502
+ $type: 'color',
503
+ $extensions: {
504
+ 'org.primer.figma': {
505
+ collection: 'mode',
506
+ group: 'component (internal)',
507
+ scopes: ['bgColor'],
508
+ },
509
+ },
510
+ },
511
+ },
512
+ borderColor: {
513
+ hover: {
514
+ $value: '{button.default.borderColor.hover}',
515
+ $type: 'color',
516
+ $extensions: {
517
+ 'org.primer.figma': {
518
+ collection: 'mode',
519
+ group: 'component (internal)',
520
+ scopes: ['borderColor'],
521
+ },
522
+ },
523
+ },
524
+ selected: {
525
+ $value: '{button.outline.borderColor.hover}',
526
+ $type: 'color',
527
+ $extensions: {
528
+ 'org.primer.figma': {
529
+ collection: 'mode',
530
+ group: 'component (internal)',
531
+ scopes: ['borderColor'],
532
+ },
533
+ },
534
+ },
535
+ },
536
+ },
537
+ danger: {
538
+ fgColor: {
539
+ rest: {
540
+ $value: '#FA5E55',
541
+ $type: 'color',
542
+ $extensions: {
543
+ 'org.primer.figma': {
544
+ collection: 'mode',
545
+ group: 'component (internal)',
546
+ scopes: ['fgColor'],
547
+ },
548
+ },
549
+ },
550
+ hover: {
551
+ $value: '{base.color.neutral.13}',
552
+ $type: 'color',
553
+ $extensions: {
554
+ 'org.primer.figma': {
555
+ collection: 'mode',
556
+ group: 'component (internal)',
557
+ scopes: ['fgColor'],
558
+ },
559
+ },
560
+ },
561
+ active: {
562
+ $value: '{base.color.neutral.13}',
563
+ $type: 'color',
564
+ $extensions: {
565
+ 'org.primer.figma': {
566
+ collection: 'mode',
567
+ group: 'component (internal)',
568
+ scopes: ['fgColor'],
569
+ },
570
+ },
571
+ },
572
+ disabled: {
573
+ $value: '{fgColor.danger}',
574
+ $type: 'color',
575
+ $extensions: {
576
+ 'org.primer.figma': {
577
+ collection: 'mode',
578
+ group: 'component (internal)',
579
+ scopes: ['fgColor'],
580
+ },
581
+ },
582
+ alpha: 0.5,
583
+ },
584
+ },
585
+ iconColor: {
586
+ rest: {
587
+ $value: '#FA5E55',
588
+ $type: 'color',
589
+ $extensions: {
590
+ 'org.primer.figma': {
591
+ collection: 'mode',
592
+ group: 'component (internal)',
593
+ scopes: ['fgColor'],
594
+ },
595
+ },
596
+ },
597
+ hover: {
598
+ $value: '{base.color.neutral.13}',
599
+ $type: 'color',
600
+ $extensions: {
601
+ 'org.primer.figma': {
602
+ collection: 'mode',
603
+ group: 'component (internal)',
604
+ scopes: ['fgColor'],
605
+ },
606
+ },
607
+ },
608
+ },
609
+ bgColor: {
610
+ rest: {
611
+ $value: '{control.bgColor.rest}',
612
+ $type: 'color',
613
+ $extensions: {
614
+ 'org.primer.figma': {
615
+ collection: 'mode',
616
+ group: 'component (internal)',
617
+ scopes: ['bgColor'],
618
+ },
619
+ },
620
+ },
621
+ hover: {
622
+ $value: '{base.color.red.6}',
623
+ $type: 'color',
624
+ $extensions: {
625
+ 'org.primer.figma': {
626
+ collection: 'mode',
627
+ group: 'component (internal)',
628
+ scopes: ['bgColor'],
629
+ },
630
+ },
631
+ },
632
+ active: {
633
+ $value: '#D03533',
634
+ $type: 'color',
635
+ $extensions: {
636
+ 'org.primer.figma': {
637
+ collection: 'mode',
638
+ group: 'component (internal)',
639
+ scopes: ['bgColor'],
640
+ },
641
+ },
642
+ },
643
+ disabled: {
644
+ $value: '{control.bgColor.disabled}',
645
+ $type: 'color',
646
+ $extensions: {
647
+ 'org.primer.figma': {
648
+ collection: 'mode',
649
+ group: 'component (internal)',
650
+ scopes: ['bgColor'],
651
+ },
652
+ },
653
+ },
654
+ },
655
+ borderColor: {
656
+ rest: {
657
+ $value: '{control.borderColor.rest}',
658
+ $type: 'color',
659
+ $extensions: {
660
+ 'org.primer.figma': {
661
+ collection: 'mode',
662
+ group: 'component (internal)',
663
+ scopes: ['borderColor'],
664
+ },
665
+ },
666
+ },
667
+ hover: {
668
+ $value: '{button.primary.borderColor.rest}',
669
+ $type: 'color',
670
+ $extensions: {
671
+ 'org.primer.figma': {
672
+ collection: 'mode',
673
+ group: 'component (internal)',
674
+ scopes: ['borderColor'],
675
+ },
676
+ },
677
+ },
678
+ active: {
679
+ $value: '{button.danger.borderColor.hover}',
680
+ $type: 'color',
681
+ $extensions: {
682
+ 'org.primer.figma': {
683
+ collection: 'mode',
684
+ group: 'component (internal)',
685
+ scopes: ['borderColor'],
686
+ },
687
+ },
688
+ },
689
+ },
690
+ },
691
+ inactive: {
692
+ fgColor: {
693
+ $value: '{base.color.neutral.9}',
694
+ $type: 'color',
695
+ $extensions: {
696
+ 'org.primer.figma': {
697
+ collection: 'mode',
698
+ group: 'component (internal)',
699
+ scopes: ['fgColor'],
700
+ },
701
+ },
702
+ },
703
+ bgColor: {
704
+ $value: '{base.color.neutral.4}',
705
+ $type: 'color',
706
+ $extensions: {
707
+ 'org.primer.figma': {
708
+ collection: 'mode',
709
+ group: 'component (internal)',
710
+ scopes: ['bgColor'],
711
+ },
712
+ },
713
+ },
714
+ },
715
+ star: {
716
+ iconColor: {
717
+ $value: '{base.color.yellow.2}',
718
+ $type: 'color',
719
+ $extensions: {
720
+ 'org.primer.figma': {
721
+ collection: 'mode',
722
+ group: 'component (internal)',
1380
723
  scopes: ['bgColor'],
1381
- },
1382
- },
1383
- },
1384
- },
724
+ },
725
+ },
726
+ },
727
+ },
1385
728
  },
1386
729
  buttonCounter: {
1387
730
  default: {
@@ -1583,19 +926,6 @@
1583
926
  },
1584
927
  },
1585
928
  },
1586
- focus: {
1587
- outlineColor: {
1588
- $value: '{borderColor.accent.emphasis}',
1589
- $type: 'color',
1590
- $extensions: {
1591
- 'org.primer.figma': {
1592
- collection: 'mode',
1593
- group: 'component (internal)',
1594
- scopes: ['borderColor'],
1595
- },
1596
- },
1597
- },
1598
- },
1599
929
  menu: {
1600
930
  bgColor: {
1601
931
  active: {
@@ -1722,19 +1052,6 @@
1722
1052
  alpha: 0.7,
1723
1053
  },
1724
1054
  },
1725
- card: {
1726
- bgColor: {
1727
- $value: '{bgColor.muted}',
1728
- $type: 'color',
1729
- $extensions: {
1730
- 'org.primer.figma': {
1731
- collection: 'mode',
1732
- group: 'component',
1733
- scopes: ['bgColor'],
1734
- },
1735
- },
1736
- },
1737
- },
1738
1055
  label: {
1739
1056
  green: {
1740
1057
  bgColor: {
@@ -2649,28 +1966,4 @@
2649
1966
  },
2650
1967
  },
2651
1968
  },
2652
- tooltip: {
2653
- bgColor: {
2654
- $value: '{bgColor.emphasis}',
2655
- $type: 'color',
2656
- $extensions: {
2657
- 'org.primer.figma': {
2658
- collection: 'mode',
2659
- group: 'component',
2660
- scopes: ['bgColor'],
2661
- },
2662
- },
2663
- },
2664
- fgColor: {
2665
- $value: '{fgColor.onEmphasis}',
2666
- $type: 'color',
2667
- $extensions: {
2668
- 'org.primer.figma': {
2669
- collection: 'mode',
2670
- group: 'component',
2671
- scopes: ['fgColor'],
2672
- },
2673
- },
2674
- },
2675
- },
2676
1969
  }