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