@primer/primitives 9.1.0-rc.e0e1c4b6 → 9.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/dist/build/PrimerStyleDictionary.js +1 -0
  2. package/dist/build/formats/cssAdvanced.js +9 -10
  3. package/dist/build/transformers/index.d.ts +1 -0
  4. package/dist/build/transformers/index.js +3 -1
  5. package/dist/css/functional/motion/motion.css +3 -3
  6. package/dist/css/functional/size/border.css +2 -2
  7. package/dist/css/functional/typography/typography.css +11 -11
  8. package/dist/css/primitives.css +16 -16
  9. package/package.json +5 -3
  10. package/src/tokens/base/color/dark/dark.dimmed.json5 +1164 -0
  11. package/src/tokens/base/color/dark/dark.high-contrast.json5 +764 -0
  12. package/src/tokens/base/color/dark/dark.json5 +911 -0
  13. package/src/tokens/base/color/dark/display-dark.json5 +1774 -0
  14. package/src/tokens/base/color/light/display-light.json5 +1774 -0
  15. package/src/tokens/base/color/light/light.high-contrast.json5 +755 -0
  16. package/src/tokens/base/color/light/light.json5 +911 -0
  17. package/src/tokens/base/size/size.json +196 -0
  18. package/src/tokens/base/typography/typography.json +48 -0
  19. package/src/tokens/fallback/color-fallbacks.json +270 -0
  20. package/src/tokens/functional/border/dark.json5 +12 -0
  21. package/src/tokens/functional/border/light.json5 +12 -0
  22. package/src/tokens/functional/color/dark/app-dark.json5 +554 -0
  23. package/src/tokens/functional/color/dark/data-vis-dark.json5 +284 -0
  24. package/src/tokens/functional/color/dark/display-dark.json5 +1258 -0
  25. package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +194 -0
  26. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +935 -0
  27. package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +310 -0
  28. package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +224 -0
  29. package/src/tokens/functional/color/dark/patterns-dark.json5 +3097 -0
  30. package/src/tokens/functional/color/dark/primitives-dark.json5 +1200 -0
  31. package/src/tokens/functional/color/dark/syntax-dark.json5 +559 -0
  32. package/src/tokens/functional/color/light/app-light.json5 +551 -0
  33. package/src/tokens/functional/color/light/data-vis-light.json5 +284 -0
  34. package/src/tokens/functional/color/light/display-light.json5 +1258 -0
  35. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +819 -0
  36. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +327 -0
  37. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +237 -0
  38. package/src/tokens/functional/color/light/patterns-light.json5 +3091 -0
  39. package/src/tokens/functional/color/light/primitives-light.json5 +1193 -0
  40. package/src/tokens/functional/color/light/syntax-light.json5 +559 -0
  41. package/src/tokens/functional/motion/loading.json5 +17 -0
  42. package/src/tokens/functional/motion/patterns.json5 +28 -0
  43. package/src/tokens/functional/shadow/dark.json5 +383 -0
  44. package/src/tokens/functional/shadow/light.json5 +376 -0
  45. package/src/tokens/functional/size/border.json +111 -0
  46. package/src/tokens/functional/size/breakpoints.json +64 -0
  47. package/src/tokens/functional/size/size-coarse.json +28 -0
  48. package/src/tokens/functional/size/size-fine.json +28 -0
  49. package/src/tokens/functional/size/size.json +740 -0
  50. package/src/tokens/functional/size/viewport.json +28 -0
  51. package/src/tokens/functional/typography/typography.json +527 -0
  52. package/src/tokens/removed/color.json +421 -0
  53. package/src/tokens/removed/testing.json5 +4 -0
package/src/tokens/functional/color/light/patterns-light.json5 ADDED
@@ -0,0 +1,3091 @@
1
+ {
2
+ avatar: {
3
+ bgColor: {
4
+ $value: '{base.color.neutral.0}',
5
+ $type: 'color',
6
+ $extensions: {
7
+ 'org.primer.figma': {
8
+ collection: 'mode',
9
+ mode: 'light',
10
+ group: 'component (internal)',
11
+ scopes: ['bgColor'],
12
+ },
13
+ },
14
+ },
15
+ borderColor: {
16
+ $value: '{borderColor.translucent}',
17
+ $type: 'color',
18
+ $extensions: {
19
+ 'org.primer.figma': {
20
+ collection: 'mode',
21
+ mode: 'light',
22
+ group: 'component (internal)',
23
+ scopes: ['borderColor'],
24
+ },
25
+ },
26
+ },
27
+ },
28
+ avatarStack: {
29
+ fade: {
30
+ bgColor: {
31
+ default: {
32
+ $value: '{base.color.neutral.7}',
33
+ $type: 'color',
34
+ $extensions: {
35
+ 'org.primer.figma': {
36
+ collection: 'mode',
37
+ mode: 'light',
38
+ group: 'component (internal)',
39
+ scopes: ['bgColor'],
40
+ },
41
+ },
42
+ },
43
+ muted: {
44
+ $value: '{base.color.neutral.5}',
45
+ $type: 'color',
46
+ $extensions: {
47
+ 'org.primer.figma': {
48
+ collection: 'mode',
49
+ mode: 'light',
50
+ group: 'component (internal)',
51
+ scopes: ['bgColor'],
52
+ },
53
+ },
54
+ },
55
+ },
56
+ },
57
+ },
58
+ control: {
59
+ bgColor: {
60
+ rest: {
61
+ $value: '{base.color.neutral.1}',
62
+ $type: 'color',
63
+ $extensions: {
64
+ 'org.primer.figma': {
65
+ collection: 'mode',
66
+ mode: 'light',
67
+ group: 'component',
68
+ scopes: ['bgColor'],
69
+ },
70
+ },
71
+ },
72
+ hover: {
73
+ $value: '{base.color.neutral.2}',
74
+ $type: 'color',
75
+ $extensions: {
76
+ 'org.primer.figma': {
77
+ collection: 'mode',
78
+ mode: 'light',
79
+ group: 'component',
80
+ scopes: ['bgColor'],
81
+ },
82
+ },
83
+ },
84
+ active: {
85
+ $value: '{base.color.neutral.3}',
86
+ $type: 'color',
87
+ $extensions: {
88
+ 'org.primer.figma': {
89
+ collection: 'mode',
90
+ mode: 'light',
91
+ group: 'component',
92
+ scopes: ['bgColor'],
93
+ },
94
+ },
95
+ },
96
+ disabled: {
97
+ $value: '{bgColor.disabled}',
98
+ $type: 'color',
99
+ $extensions: {
100
+ 'org.primer.figma': {
101
+ collection: 'mode',
102
+ mode: 'light',
103
+ group: 'component',
104
+ scopes: ['bgColor'],
105
+ },
106
+ },
107
+ },
108
+ selected: {
109
+ $value: '{control.bgColor.rest}',
110
+ $type: 'color',
111
+ $extensions: {
112
+ 'org.primer.figma': {
113
+ collection: 'mode',
114
+ mode: 'light',
115
+ group: 'component',
116
+ scopes: ['bgColor'],
117
+ },
118
+ },
119
+ },
120
+ },
121
+ fgColor: {
122
+ rest: {
123
+ $value: '{base.color.neutral.12}',
124
+ $type: 'color',
125
+ $extensions: {
126
+ 'org.primer.figma': {
127
+ collection: 'mode',
128
+ mode: 'light',
129
+ group: 'component',
130
+ scopes: ['fgColor'],
131
+ },
132
+ },
133
+ },
134
+ placeholder: {
135
+ $value: '{fgColor.muted}',
136
+ $type: 'color',
137
+ $extensions: {
138
+ 'org.primer.figma': {
139
+ collection: 'mode',
140
+ mode: 'light',
141
+ group: 'component',
142
+ scopes: ['fgColor'],
143
+ },
144
+ },
145
+ },
146
+ disabled: {
147
+ $value: '{fgColor.disabled}',
148
+ $type: 'color',
149
+ $extensions: {
150
+ 'org.primer.figma': {
151
+ collection: 'mode',
152
+ mode: 'light',
153
+ group: 'component',
154
+ scopes: ['fgColor'],
155
+ },
156
+ },
157
+ },
158
+ },
159
+ borderColor: {
160
+ rest: {
161
+ $value: '{borderColor.default}',
162
+ $type: 'color',
163
+ $extensions: {
164
+ 'org.primer.figma': {
165
+ collection: 'mode',
166
+ mode: 'light',
167
+ group: 'component',
168
+ scopes: ['borderColor'],
169
+ },
170
+ },
171
+ },
172
+ emphasis: {
173
+ $value: '{borderColor.emphasis}',
174
+ $type: 'color',
175
+ $extensions: {
176
+ 'org.primer.figma': {
177
+ collection: 'mode',
178
+ mode: 'light',
179
+ group: 'component',
180
+ scopes: ['borderColor'],
181
+ },
182
+ },
183
+ },
184
+ disabled: {
185
+ $value: '{borderColor.disabled}',
186
+ $type: 'color',
187
+ $extensions: {
188
+ 'org.primer.figma': {
189
+ collection: 'mode',
190
+ mode: 'light',
191
+ group: 'component',
192
+ scopes: ['borderColor'],
193
+ },
194
+ },
195
+ },
196
+ selected: {
197
+ $value: '{control.bgColor.selected}',
198
+ $type: 'color',
199
+ $extensions: {
200
+ 'org.primer.figma': {
201
+ collection: 'mode',
202
+ mode: 'light',
203
+ group: 'component',
204
+ scopes: ['borderColor'],
205
+ },
206
+ },
207
+ },
208
+ success: {
209
+ $value: '{borderColor.success.emphasis}',
210
+ $type: 'color',
211
+ $extensions: {
212
+ 'org.primer.figma': {
213
+ collection: 'mode',
214
+ mode: 'light',
215
+ group: 'component',
216
+ scopes: ['borderColor'],
217
+ },
218
+ },
219
+ },
220
+ danger: {
221
+ $value: '{borderColor.danger.emphasis}',
222
+ $type: 'color',
223
+ $extensions: {
224
+ 'org.primer.figma': {
225
+ collection: 'mode',
226
+ mode: 'light',
227
+ group: 'component',
228
+ scopes: ['borderColor'],
229
+ },
230
+ },
231
+ },
232
+ warning: {
233
+ $value: '{borderColor.attention.emphasis}',
234
+ $type: 'color',
235
+ $extensions: {
236
+ 'org.primer.figma': {
237
+ collection: 'mode',
238
+ mode: 'light',
239
+ group: 'component',
240
+ scopes: ['borderColor'],
241
+ },
242
+ },
243
+ },
244
+ },
245
+ iconColor: {
246
+ rest: {
247
+ $value: '{fgColor.muted}',
248
+ $type: 'color',
249
+ $extensions: {
250
+ 'org.primer.figma': {
251
+ collection: 'mode',
252
+ mode: 'light',
253
+ group: 'component',
254
+ scopes: ['fgColor'],
255
+ },
256
+ },
257
+ },
258
+ },
259
+ transparent: {
260
+ bgColor: {
261
+ rest: {
262
+ $value: '{base.color.transparent}',
263
+ $type: 'color',
264
+ $extensions: {
265
+ 'org.primer.figma': {
266
+ collection: 'mode',
267
+ mode: 'light',
268
+ group: 'component',
269
+ scopes: ['bgColor'],
270
+ },
271
+ },
272
+ },
273
+ hover: {
274
+ $value: '{base.color.neutral.8}',
275
+ $type: 'color',
276
+ $extensions: {
277
+ 'org.primer.figma': {
278
+ collection: 'mode',
279
+ mode: 'light',
280
+ group: 'component',
281
+ scopes: ['bgColor'],
282
+ },
283
+ },
284
+ alpha: 0.1,
285
+ },
286
+ active: {
287
+ $value: '{base.color.neutral.8}',
288
+ $type: 'color',
289
+ $extensions: {
290
+ 'org.primer.figma': {
291
+ collection: 'mode',
292
+ mode: 'light',
293
+ group: 'component',
294
+ scopes: ['bgColor'],
295
+ },
296
+ },
297
+ alpha: 0.15,
298
+ },
299
+ disabled: {
300
+ $value: '{bgColor.disabled}',
301
+ $type: 'color',
302
+ $extensions: {
303
+ 'org.primer.figma': {
304
+ collection: 'mode',
305
+ mode: 'light',
306
+ group: 'component',
307
+ scopes: ['bgColor'],
308
+ },
309
+ },
310
+ },
311
+ selected: {
312
+ $value: '{base.color.neutral.8}',
313
+ $type: 'color',
314
+ $extensions: {
315
+ 'org.primer.figma': {
316
+ collection: 'mode',
317
+ mode: 'light',
318
+ group: 'component',
319
+ scopes: ['bgColor'],
320
+ },
321
+ },
322
+ alpha: 0.15,
323
+ },
324
+ },
325
+ borderColor: {
326
+ rest: {
327
+ $value: '{base.color.transparent}',
328
+ $type: 'color',
329
+ $extensions: {
330
+ 'org.primer.figma': {
331
+ collection: 'mode',
332
+ mode: 'light',
333
+ group: 'component',
334
+ scopes: ['borderColor'],
335
+ },
336
+ },
337
+ },
338
+ hover: {
339
+ $value: '{base.color.transparent}',
340
+ $type: 'color',
341
+ $extensions: {
342
+ 'org.primer.figma': {
343
+ collection: 'mode',
344
+ mode: 'light',
345
+ group: 'component',
346
+ scopes: ['borderColor'],
347
+ },
348
+ },
349
+ },
350
+ active: {
351
+ $value: '{base.color.transparent}',
352
+ $type: 'color',
353
+ $extensions: {
354
+ 'org.primer.figma': {
355
+ collection: 'mode',
356
+ mode: 'light',
357
+ group: 'component',
358
+ scopes: ['borderColor'],
359
+ },
360
+ },
361
+ },
362
+ },
363
+ },
364
+ danger: {
365
+ fgColor: {
366
+ rest: {
367
+ $value: '{fgColor.danger}',
368
+ $type: 'color',
369
+ $extensions: {
370
+ 'org.primer.figma': {
371
+ collection: 'mode',
372
+ mode: 'light',
373
+ group: 'component',
374
+ scopes: ['fgColor'],
375
+ },
376
+ },
377
+ },
378
+ hover: {
379
+ $value: '{fgColor.danger}',
380
+ $type: 'color',
381
+ $extensions: {
382
+ 'org.primer.figma': {
383
+ collection: 'mode',
384
+ mode: 'light',
385
+ group: 'component',
386
+ scopes: ['fgColor'],
387
+ },
388
+ },
389
+ },
390
+ },
391
+ bgColor: {
392
+ hover: {
393
+ $value: '{bgColor.danger.muted}',
394
+ $type: 'color',
395
+ $extensions: {
396
+ 'org.primer.figma': {
397
+ collection: 'mode',
398
+ mode: 'light',
399
+ group: 'component',
400
+ scopes: ['bgColor'],
401
+ },
402
+ },
403
+ },
404
+ active: {
405
+ $value: '{bgColor.danger.muted}',
406
+ $type: 'color',
407
+ $extensions: {
408
+ 'org.primer.figma': {
409
+ collection: 'mode',
410
+ mode: 'light',
411
+ group: 'component',
412
+ scopes: ['bgColor'],
413
+ },
414
+ },
415
+ alpha: 0.4,
416
+ },
417
+ },
418
+ },
419
+ checked: {
420
+ bgColor: {
421
+ rest: {
422
+ $value: '{bgColor.accent.emphasis}',
423
+ $type: 'color',
424
+ $extensions: {
425
+ 'org.primer.figma': {
426
+ collection: 'mode',
427
+ mode: 'light',
428
+ group: 'component',
429
+ scopes: ['bgColor'],
430
+ },
431
+ },
432
+ },
433
+ hover: {
434
+ $value: '{bgColor.accent.emphasis}',
435
+ $type: 'color',
436
+ $extensions: {
437
+ 'org.primer.figma': {
438
+ collection: 'mode',
439
+ mode: 'light',
440
+ group: 'component',
441
+ scopes: ['bgColor'],
442
+ },
443
+ },
444
+ mix: {
445
+ color: '{base.color.blue.7}',
446
+ weight: 0.2,
447
+ },
448
+ },
449
+ active: {
450
+ $value: '{bgColor.accent.emphasis}',
451
+ $type: 'color',
452
+ $extensions: {
453
+ 'org.primer.figma': {
454
+ collection: 'mode',
455
+ mode: 'light',
456
+ group: 'component',
457
+ scopes: ['bgColor'],
458
+ },
459
+ },
460
+ mix: {
461
+ color: '{base.color.blue.7}',
462
+ weight: 0.4,
463
+ },
464
+ },
465
+ disabled: {
466
+ $value: '{fgColor.disabled}',
467
+ $type: 'color',
468
+ $extensions: {
469
+ 'org.primer.figma': {
470
+ collection: 'mode',
471
+ mode: 'light',
472
+ group: 'component',
473
+ scopes: ['bgColor'],
474
+ },
475
+ },
476
+ },
477
+ },
478
+ fgColor: {
479
+ rest: {
480
+ $value: '{fgColor.onEmphasis}',
481
+ $type: 'color',
482
+ $extensions: {
483
+ 'org.primer.figma': {
484
+ collection: 'mode',
485
+ mode: 'light',
486
+ group: 'component',
487
+ scopes: ['fgColor'],
488
+ },
489
+ },
490
+ },
491
+ disabled: {
492
+ $value: '{fgColor.onEmphasis}',
493
+ $type: 'color',
494
+ $extensions: {
495
+ 'org.primer.figma': {
496
+ collection: 'mode',
497
+ mode: 'light',
498
+ group: 'component',
499
+ scopes: ['fgColor'],
500
+ },
501
+ },
502
+ },
503
+ },
504
+ borderColor: {
505
+ rest: {
506
+ $value: '{control.checked.bgColor.rest}',
507
+ $type: 'color',
508
+ $extensions: {
509
+ 'org.primer.figma': {
510
+ collection: 'mode',
511
+ mode: 'light',
512
+ group: 'component',
513
+ scopes: ['borderColor'],
514
+ },
515
+ },
516
+ },
517
+ hover: {
518
+ $value: '{control.checked.bgColor.hover}',
519
+ $type: 'color',
520
+ $extensions: {
521
+ 'org.primer.figma': {
522
+ collection: 'mode',
523
+ mode: 'light',
524
+ group: 'component',
525
+ scopes: ['borderColor'],
526
+ },
527
+ },
528
+ },
529
+ active: {
530
+ $value: '{control.checked.bgColor.active}',
531
+ $type: 'color',
532
+ $extensions: {
533
+ 'org.primer.figma': {
534
+ collection: 'mode',
535
+ mode: 'light',
536
+ group: 'component',
537
+ scopes: ['borderColor'],
538
+ },
539
+ },
540
+ },
541
+ disabled: {
542
+ $value: '{control.checked.bgColor.disabled}',
543
+ $type: 'color',
544
+ $extensions: {
545
+ 'org.primer.figma': {
546
+ collection: 'mode',
547
+ mode: 'light',
548
+ group: 'component',
549
+ scopes: ['borderColor'],
550
+ },
551
+ },
552
+ },
553
+ },
554
+ },
555
+ },
556
+ controlTrack: {
557
+ bgColor: {
558
+ rest: {
559
+ $value: '{base.color.neutral.3}',
560
+ $type: 'color',
561
+ $extensions: {
562
+ 'org.primer.figma': {
563
+ collection: 'mode',
564
+ mode: 'light',
565
+ group: 'component (internal)',
566
+ scopes: ['bgColor'],
567
+ },
568
+ },
569
+ },
570
+ hover: {
571
+ $value: '{base.color.neutral.4}',
572
+ $type: 'color',
573
+ $extensions: {
574
+ 'org.primer.figma': {
575
+ collection: 'mode',
576
+ mode: 'light',
577
+ group: 'component (internal)',
578
+ scopes: ['bgColor'],
579
+ },
580
+ },
581
+ },
582
+ active: {
583
+ $value: '{base.color.neutral.5}',
584
+ $type: 'color',
585
+ $extensions: {
586
+ 'org.primer.figma': {
587
+ collection: 'mode',
588
+ mode: 'light',
589
+ group: 'component (internal)',
590
+ scopes: ['bgColor'],
591
+ },
592
+ },
593
+ },
594
+ disabled: {
595
+ $value: '{fgColor.disabled}',
596
+ $type: 'color',
597
+ $extensions: {
598
+ 'org.primer.figma': {
599
+ collection: 'mode',
600
+ mode: 'light',
601
+ group: 'component (internal)',
602
+ scopes: ['bgColor'],
603
+ },
604
+ },
605
+ },
606
+ },
607
+ fgColor: {
608
+ rest: {
609
+ $value: '{base.color.neutral.9}',
610
+ $type: 'color',
611
+ $extensions: {
612
+ 'org.primer.figma': {
613
+ collection: 'mode',
614
+ mode: 'light',
615
+ group: 'component (internal)',
616
+ scopes: ['fgColor'],
617
+ },
618
+ },
619
+ },
620
+ disabled: {
621
+ $value: '{fgColor.onEmphasis}',
622
+ $type: 'color',
623
+ $extensions: {
624
+ 'org.primer.figma': {
625
+ collection: 'mode',
626
+ mode: 'light',
627
+ group: 'component (internal)',
628
+ scopes: ['fgColor'],
629
+ },
630
+ },
631
+ },
632
+ },
633
+ borderColor: {
634
+ rest: {
635
+ $value: '{borderColor.default}',
636
+ $type: 'color',
637
+ $extensions: {
638
+ 'org.primer.figma': {
639
+ collection: 'mode',
640
+ mode: 'light',
641
+ group: 'component (internal)',
642
+ scopes: ['borderColor'],
643
+ },
644
+ },
645
+ },
646
+ disabled: {
647
+ $value: '{fgColor.disabled}',
648
+ $type: 'color',
649
+ $extensions: {
650
+ 'org.primer.figma': {
651
+ collection: 'mode',
652
+ mode: 'light',
653
+ group: 'component (internal)',
654
+ scopes: ['borderColor'],
655
+ },
656
+ },
657
+ },
658
+ },
659
+ },
660
+ controlKnob: {
661
+ bgColor: {
662
+ rest: {
663
+ $value: '{base.color.neutral.0}',
664
+ $type: 'color',
665
+ $extensions: {
666
+ 'org.primer.figma': {
667
+ collection: 'mode',
668
+ mode: 'light',
669
+ group: 'component (internal)',
670
+ scopes: ['bgColor'],
671
+ },
672
+ },
673
+ },
674
+ disabled: {
675
+ $value: '{control.bgColor.disabled}',
676
+ $type: 'color',
677
+ $extensions: {
678
+ 'org.primer.figma': {
679
+ collection: 'mode',
680
+ mode: 'light',
681
+ group: 'component (internal)',
682
+ scopes: ['bgColor'],
683
+ },
684
+ },
685
+ },
686
+ checked: {
687
+ $value: '{base.color.neutral.0}',
688
+ $type: 'color',
689
+ $extensions: {
690
+ 'org.primer.figma': {
691
+ collection: 'mode',
692
+ mode: 'light',
693
+ group: 'component (internal)',
694
+ scopes: ['bgColor'],
695
+ },
696
+ },
697
+ },
698
+ },
699
+ borderColor: {
700
+ rest: {
701
+ $value: '{control.borderColor.emphasis}',
702
+ $type: 'color',
703
+ $extensions: {
704
+ 'org.primer.figma': {
705
+ collection: 'mode',
706
+ mode: 'light',
707
+ group: 'component (internal)',
708
+ scopes: ['borderColor'],
709
+ },
710
+ },
711
+ },
712
+ disabled: {
713
+ $value: '{control.bgColor.disabled}',
714
+ $type: 'color',
715
+ $extensions: {
716
+ 'org.primer.figma': {
717
+ collection: 'mode',
718
+ mode: 'light',
719
+ group: 'component (internal)',
720
+ scopes: ['borderColor'],
721
+ },
722
+ },
723
+ },
724
+ checked: {
725
+ $value: '{control.checked.bgColor.rest}',
726
+ $type: 'color',
727
+ $extensions: {
728
+ 'org.primer.figma': {
729
+ collection: 'mode',
730
+ mode: 'light',
731
+ group: 'component (internal)',
732
+ scopes: ['borderColor'],
733
+ },
734
+ },
735
+ },
736
+ },
737
+ },
738
+ counter: {
739
+ borderColor: {
740
+ $value: '{base.color.transparent}',
741
+ $type: 'color',
742
+ $extensions: {
743
+ 'org.primer.figma': {
744
+ collection: 'mode',
745
+ mode: 'light',
746
+ group: 'component (internal)',
747
+ scopes: ['borderColor'],
748
+ },
749
+ },
750
+ },
751
+ bgColor: {
752
+ muted: {
753
+ $value: '{bgColor.neutral.muted}',
754
+ $type: 'color',
755
+ $extensions: {
756
+ 'org.primer.figma': {
757
+ collection: 'mode',
758
+ mode: 'light',
759
+ group: 'component',
760
+ scopes: ['bgColor'],
761
+ },
762
+ },
763
+ },
764
+ emphasis: {
765
+ $value: '{bgColor.neutral.emphasis}',
766
+ $type: 'color',
767
+ $extensions: {
768
+ 'org.primer.figma': {
769
+ collection: 'mode',
770
+ mode: 'light',
771
+ group: 'component',
772
+ scopes: ['bgColor'],
773
+ },
774
+ },
775
+ }
776
+ },
777
+ },
778
+ button: {
779
+ default: {
780
+ fgColor: {
781
+ rest: {
782
+ $value: '{control.fgColor.rest}',
783
+ $type: 'color',
784
+ $extensions: {
785
+ 'org.primer.figma': {
786
+ collection: 'mode',
787
+ mode: 'light',
788
+ group: 'component (internal)',
789
+ scopes: ['fgColor'],
790
+ },
791
+ },
792
+ },
793
+ },
794
+ bgColor: {
795
+ rest: {
796
+ $value: '{control.bgColor.rest}',
797
+ $type: 'color',
798
+ $extensions: {
799
+ 'org.primer.figma': {
800
+ collection: 'mode',
801
+ mode: 'light',
802
+ group: 'component (internal)',
803
+ scopes: ['bgColor'],
804
+ },
805
+ },
806
+ },
807
+ hover: {
808
+ $value: '{control.bgColor.hover}',
809
+ $type: 'color',
810
+ $extensions: {
811
+ 'org.primer.figma': {
812
+ collection: 'mode',
813
+ mode: 'light',
814
+ group: 'component (internal)',
815
+ scopes: ['bgColor'],
816
+ },
817
+ },
818
+ },
819
+ active: {
820
+ $value: '{control.bgColor.active}',
821
+ $type: 'color',
822
+ $extensions: {
823
+ 'org.primer.figma': {
824
+ collection: 'mode',
825
+ mode: 'light',
826
+ group: 'component (internal)',
827
+ scopes: ['bgColor'],
828
+ },
829
+ },
830
+ },
831
+ selected: {
832
+ $value: '{control.bgColor.active}',
833
+ $type: 'color',
834
+ $extensions: {
835
+ 'org.primer.figma': {
836
+ collection: 'mode',
837
+ mode: 'light',
838
+ group: 'component (internal)',
839
+ scopes: ['bgColor'],
840
+ },
841
+ },
842
+ },
843
+ disabled: {
844
+ $value: '{control.bgColor.disabled}',
845
+ $type: 'color',
846
+ },
847
+ },
848
+ borderColor: {
849
+ rest: {
850
+ $value: '{control.borderColor.rest}',
851
+ $type: 'color',
852
+ $extensions: {
853
+ 'org.primer.figma': {
854
+ collection: 'mode',
855
+ mode: 'light',
856
+ group: 'component (internal)',
857
+ scopes: ['borderColor'],
858
+ },
859
+ },
860
+ },
861
+ hover: {
862
+ $value: '{control.borderColor.rest}',
863
+ $type: 'color',
864
+ $extensions: {
865
+ 'org.primer.figma': {
866
+ collection: 'mode',
867
+ mode: 'light',
868
+ group: 'component (internal)',
869
+ scopes: ['borderColor'],
870
+ },
871
+ },
872
+ },
873
+ active: {
874
+ $value: '{control.borderColor.rest}',
875
+ $type: 'color',
876
+ $extensions: {
877
+ 'org.primer.figma': {
878
+ collection: 'mode',
879
+ mode: 'light',
880
+ group: 'component (internal)',
881
+ scopes: ['borderColor'],
882
+ },
883
+ },
884
+ },
885
+ disabled: {
886
+ $value: '{control.borderColor.disabled}',
887
+ $type: 'color',
888
+ $extensions: {
889
+ 'org.primer.figma': {
890
+ collection: 'mode',
891
+ mode: 'light',
892
+ group: 'component (internal)',
893
+ scopes: ['borderColor'],
894
+ },
895
+ },
896
+ },
897
+ },
898
+ },
899
+ primary: {
900
+ fgColor: {
901
+ rest: {
902
+ $value: '{fgColor.white}',
903
+ $type: 'color',
904
+ $extensions: {
905
+ 'org.primer.figma': {
906
+ collection: 'mode',
907
+ mode: 'light',
908
+ group: 'component (internal)',
909
+ scopes: ['fgColor'],
910
+ },
911
+ },
912
+ },
913
+ disabled: {
914
+ $value: '{base.color.neutral.0}',
915
+ $type: 'color',
916
+ $extensions: {
917
+ 'org.primer.figma': {
918
+ collection: 'mode',
919
+ mode: 'light',
920
+ group: 'component (internal)',
921
+ scopes: ['fgColor'],
922
+ },
923
+ },
924
+ alpha: 0.8,
925
+ },
926
+ },
927
+ iconColor: {
928
+ rest: {
929
+ $value: '{fgColor.white}',
930
+ $type: 'color',
931
+ $extensions: {
932
+ 'org.primer.figma': {
933
+ collection: 'mode',
934
+ mode: 'light',
935
+ group: 'component (internal)',
936
+ scopes: ['fgColor'],
937
+ },
938
+ },
939
+ alpha: 0.8,
940
+ },
941
+ },
942
+ bgColor: {
943
+ rest: {
944
+ $value: '{bgColor.success.emphasis}',
945
+ $type: 'color',
946
+ $extensions: {
947
+ 'org.primer.figma': {
948
+ collection: 'mode',
949
+ mode: 'light',
950
+ group: 'component (internal)',
951
+ scopes: ['bgColor'],
952
+ },
953
+ },
954
+ },
955
+ hover: {
956
+ $value: '{bgColor.success.emphasis}',
957
+ $type: 'color',
958
+ $extensions: {
959
+ 'org.primer.figma': {
960
+ collection: 'mode',
961
+ mode: 'light',
962
+ group: 'component (internal)',
963
+ scopes: ['bgColor'],
964
+ },
965
+ },
966
+ mix: {
967
+ color: '{base.color.green.6}',
968
+ weight: 0.2,
969
+ },
970
+ },
971
+ active: {
972
+ $value: '{bgColor.success.emphasis}',
973
+ $type: 'color',
974
+ $extensions: {
975
+ 'org.primer.figma': {
976
+ collection: 'mode',
977
+ mode: 'light',
978
+ group: 'component (internal)',
979
+ scopes: ['bgColor'],
980
+ },
981
+ },
982
+ mix: {
983
+ color: '{base.color.green.6}',
984
+ weight: 0.4,
985
+ },
986
+ },
987
+ disabled: {
988
+ $value: '{base.color.green.4}',
989
+ $type: 'color',
990
+ $extensions: {
991
+ 'org.primer.figma': {
992
+ collection: 'mode',
993
+ mode: 'light',
994
+ group: 'component (internal)',
995
+ scopes: ['bgColor'],
996
+ },
997
+ },
998
+ mix: {
999
+ color: '{base.color.green.0}',
1000
+ weight: 0.6,
1001
+ },
1002
+ },
1003
+ },
1004
+ borderColor: {
1005
+ rest: {
1006
+ $value: '{base.color.neutral.13}',
1007
+ $type: 'color',
1008
+ $extensions: {
1009
+ 'org.primer.figma': {
1010
+ collection: 'mode',
1011
+ mode: 'light',
1012
+ group: 'component (internal)',
1013
+ scopes: ['borderColor'],
1014
+ },
1015
+ },
1016
+ alpha: 0.15,
1017
+ },
1018
+ hover: {
1019
+ $value: '{button.primary.borderColor.rest}',
1020
+ $type: 'color',
1021
+ $extensions: {
1022
+ 'org.primer.figma': {
1023
+ collection: 'mode',
1024
+ mode: 'light',
1025
+ group: 'component (internal)',
1026
+ scopes: ['borderColor'],
1027
+ },
1028
+ },
1029
+ },
1030
+ active: {
1031
+ $value: '{button.primary.borderColor.rest}',
1032
+ $type: 'color',
1033
+ $extensions: {
1034
+ 'org.primer.figma': {
1035
+ collection: 'mode',
1036
+ mode: 'light',
1037
+ group: 'component (internal)',
1038
+ scopes: ['borderColor'],
1039
+ },
1040
+ },
1041
+ },
1042
+ disabled: {
1043
+ $value: '{button.primary.bgColor.disabled}',
1044
+ $type: 'color',
1045
+ $extensions: {
1046
+ 'org.primer.figma': {
1047
+ collection: 'mode',
1048
+ mode: 'light',
1049
+ group: 'component (internal)',
1050
+ scopes: ['borderColor'],
1051
+ },
1052
+ },
1053
+ },
1054
+ },
1055
+ },
1056
+ invisible: {
1057
+ fgColor: {
1058
+ rest: {
1059
+ $value: '{control.fgColor.rest}',
1060
+ $type: 'color',
1061
+ $extensions: {
1062
+ 'org.primer.figma': {
1063
+ collection: 'mode',
1064
+ mode: 'light',
1065
+ group: 'component (internal)',
1066
+ scopes: ['fgColor'],
1067
+ },
1068
+ },
1069
+ },
1070
+ hover: {
1071
+ $value: '{control.fgColor.rest}',
1072
+ $type: 'color',
1073
+ $extensions: {
1074
+ 'org.primer.figma': {
1075
+ collection: 'mode',
1076
+ mode: 'light',
1077
+ group: 'component (internal)',
1078
+ scopes: ['fgColor'],
1079
+ },
1080
+ },
1081
+ },
1082
+ disabled: {
1083
+ $value: '{control.fgColor.disabled}',
1084
+ $type: 'color',
1085
+ $extensions: {
1086
+ 'org.primer.figma': {
1087
+ collection: 'mode',
1088
+ mode: 'light',
1089
+ group: 'component (internal)',
1090
+ scopes: ['fgColor'],
1091
+ },
1092
+ },
1093
+ },
1094
+ },
1095
+ iconColor: {
1096
+ rest: {
1097
+ $value: '{fgColor.muted}',
1098
+ $type: 'color',
1099
+ $extensions: {
1100
+ 'org.primer.figma': {
1101
+ collection: 'mode',
1102
+ mode: 'light',
1103
+ group: 'component (internal)',
1104
+ scopes: ['fgColor'],
1105
+ },
1106
+ },
1107
+ },
1108
+ hover: {
1109
+ $value: '{fgColor.muted}',
1110
+ $type: 'color',
1111
+ $extensions: {
1112
+ 'org.primer.figma': {
1113
+ collection: 'mode',
1114
+ mode: 'light',
1115
+ group: 'component (internal)',
1116
+ scopes: ['fgColor'],
1117
+ },
1118
+ },
1119
+ },
1120
+ disabled: {
1121
+ $value: '{control.fgColor.disabled}',
1122
+ $type: 'color',
1123
+ $extensions: {
1124
+ 'org.primer.figma': {
1125
+ collection: 'mode',
1126
+ mode: 'light',
1127
+ group: 'component (internal)',
1128
+ scopes: ['fgColor'],
1129
+ },
1130
+ },
1131
+ },
1132
+ },
1133
+ bgColor: {
1134
+ rest: {
1135
+ $value: '{control.transparent.bgColor.rest}',
1136
+ $type: 'color',
1137
+ $extensions: {
1138
+ 'org.primer.figma': {
1139
+ collection: 'mode',
1140
+ mode: 'light',
1141
+ group: 'component (internal)',
1142
+ scopes: ['bgColor'],
1143
+ },
1144
+ },
1145
+ },
1146
+ hover: {
1147
+ $value: '{control.transparent.bgColor.hover}',
1148
+ $type: 'color',
1149
+ $extensions: {
1150
+ 'org.primer.figma': {
1151
+ collection: 'mode',
1152
+ mode: 'light',
1153
+ group: 'component (internal)',
1154
+ scopes: ['bgColor'],
1155
+ },
1156
+ },
1157
+ },
1158
+ active: {
1159
+ $value: '{control.transparent.bgColor.active}',
1160
+ $type: 'color',
1161
+ $extensions: {
1162
+ 'org.primer.figma': {
1163
+ collection: 'mode',
1164
+ mode: 'light',
1165
+ group: 'component (internal)',
1166
+ scopes: ['bgColor'],
1167
+ },
1168
+ },
1169
+ },
1170
+ disabled: {
1171
+ $value: '{control.transparent.bgColor.disabled}',
1172
+ $type: 'color',
1173
+ $extensions: {
1174
+ 'org.primer.figma': {
1175
+ collection: 'mode',
1176
+ mode: 'light',
1177
+ group: 'component (internal)',
1178
+ scopes: ['bgColor'],
1179
+ },
1180
+ },
1181
+ },
1182
+ },
1183
+ borderColor: {
1184
+ rest: {
1185
+ $value: '{control.transparent.borderColor.rest}',
1186
+ $type: 'color',
1187
+ $extensions: {
1188
+ 'org.primer.figma': {
1189
+ collection: 'mode',
1190
+ mode: 'light',
1191
+ group: 'component (internal)',
1192
+ scopes: ['borderColor'],
1193
+ },
1194
+ },
1195
+ },
1196
+ hover: {
1197
+ $value: '{control.transparent.borderColor.hover}',
1198
+ $type: 'color',
1199
+ $extensions: {
1200
+ 'org.primer.figma': {
1201
+ collection: 'mode',
1202
+ mode: 'light',
1203
+ group: 'component (internal)',
1204
+ scopes: ['borderColor'],
1205
+ },
1206
+ },
1207
+ },
1208
+ disabled: {
1209
+ $value: '{control.borderColor.disabled}',
1210
+ $type: 'color',
1211
+ $extensions: {
1212
+ 'org.primer.figma': {
1213
+ collection: 'mode',
1214
+ mode: 'light',
1215
+ group: 'component (internal)',
1216
+ scopes: ['borderColor'],
1217
+ },
1218
+ },
1219
+ },
1220
+ },
1221
+ },
1222
+ outline: {
1223
+ fgColor: {
1224
+ rest: {
1225
+ $value: '{fgColor.accent}',
1226
+ $type: 'color',
1227
+ $extensions: {
1228
+ 'org.primer.figma': {
1229
+ collection: 'mode',
1230
+ mode: 'light',
1231
+ group: 'component (internal)',
1232
+ scopes: ['fgColor'],
1233
+ },
1234
+ },
1235
+ },
1236
+ hover: {
1237
+ $value: '{base.color.neutral.0}',
1238
+ $type: 'color',
1239
+ $extensions: {
1240
+ 'org.primer.figma': {
1241
+ collection: 'mode',
1242
+ mode: 'light',
1243
+ group: 'component (internal)',
1244
+ scopes: ['fgColor'],
1245
+ },
1246
+ },
1247
+ },
1248
+ active: {
1249
+ $value: '{base.color.neutral.0}',
1250
+ $type: 'color',
1251
+ $extensions: {
1252
+ 'org.primer.figma': {
1253
+ collection: 'mode',
1254
+ mode: 'light',
1255
+ group: 'component (internal)',
1256
+ scopes: ['fgColor'],
1257
+ },
1258
+ },
1259
+ },
1260
+ disabled: {
1261
+ $value: '{fgColor.accent}',
1262
+ $type: 'color',
1263
+ $extensions: {
1264
+ 'org.primer.figma': {
1265
+ collection: 'mode',
1266
+ mode: 'light',
1267
+ group: 'component (internal)',
1268
+ scopes: ['fgColor'],
1269
+ },
1270
+ },
1271
+ alpha: 0.5,
1272
+ },
1273
+ },
1274
+ bgColor: {
1275
+ rest: {
1276
+ $value: '{control.bgColor.rest}',
1277
+ $type: 'color',
1278
+ $extensions: {
1279
+ 'org.primer.figma': {
1280
+ collection: 'mode',
1281
+ mode: 'light',
1282
+ group: 'component (internal)',
1283
+ scopes: ['bgColor'],
1284
+ },
1285
+ },
1286
+ },
1287
+ hover: {
1288
+ $value: '{bgColor.accent.emphasis}',
1289
+ $type: 'color',
1290
+ $extensions: {
1291
+ 'org.primer.figma': {
1292
+ collection: 'mode',
1293
+ mode: 'light',
1294
+ group: 'component (internal)',
1295
+ scopes: ['bgColor'],
1296
+ },
1297
+ },
1298
+ },
1299
+ active: {
1300
+ $value: '{bgColor.accent.emphasis}',
1301
+ $type: 'color',
1302
+ $extensions: {
1303
+ 'org.primer.figma': {
1304
+ collection: 'mode',
1305
+ mode: 'light',
1306
+ group: 'component (internal)',
1307
+ scopes: ['bgColor'],
1308
+ },
1309
+ },
1310
+ mix: {
1311
+ color: '{base.color.blue.7}',
1312
+ weight: 0.4,
1313
+ },
1314
+ },
1315
+ disabled: {
1316
+ $value: '{control.bgColor.disabled}',
1317
+ $type: 'color',
1318
+ $extensions: {
1319
+ 'org.primer.figma': {
1320
+ collection: 'mode',
1321
+ mode: 'light',
1322
+ group: 'component (internal)',
1323
+ scopes: ['bgColor'],
1324
+ },
1325
+ },
1326
+ },
1327
+ },
1328
+ borderColor: {
1329
+ hover: {
1330
+ $value: '{button.primary.borderColor.hover}',
1331
+ $type: 'color',
1332
+ $extensions: {
1333
+ 'org.primer.figma': {
1334
+ collection: 'mode',
1335
+ mode: 'light',
1336
+ group: 'component (internal)',
1337
+ scopes: ['borderColor'],
1338
+ },
1339
+ },
1340
+ },
1341
+ active: {
1342
+ $value: '{button.outline.borderColor.hover}',
1343
+ $type: 'color',
1344
+ $extensions: {
1345
+ 'org.primer.figma': {
1346
+ collection: 'mode',
1347
+ mode: 'light',
1348
+ group: 'component (internal)',
1349
+ scopes: ['borderColor'],
1350
+ },
1351
+ },
1352
+ },
1353
+ },
1354
+ },
1355
+ danger: {
1356
+ fgColor: {
1357
+ rest: {
1358
+ $value: '{fgColor.danger}',
1359
+ $type: 'color',
1360
+ $extensions: {
1361
+ 'org.primer.figma': {
1362
+ collection: 'mode',
1363
+ mode: 'light',
1364
+ group: 'component (internal)',
1365
+ scopes: ['fgColor'],
1366
+ },
1367
+ },
1368
+ },
1369
+ hover: {
1370
+ $value: '{base.color.neutral.0}',
1371
+ $type: 'color',
1372
+ $extensions: {
1373
+ 'org.primer.figma': {
1374
+ collection: 'mode',
1375
+ mode: 'light',
1376
+ group: 'component (internal)',
1377
+ scopes: ['fgColor'],
1378
+ },
1379
+ },
1380
+ },
1381
+ active: {
1382
+ $value: '{base.color.neutral.0}',
1383
+ $type: 'color',
1384
+ $extensions: {
1385
+ 'org.primer.figma': {
1386
+ collection: 'mode',
1387
+ mode: 'light',
1388
+ group: 'component (internal)',
1389
+ scopes: ['fgColor'],
1390
+ },
1391
+ },
1392
+ },
1393
+ disabled: {
1394
+ $value: '{fgColor.danger}',
1395
+ $type: 'color',
1396
+ $extensions: {
1397
+ 'org.primer.figma': {
1398
+ collection: 'mode',
1399
+ mode: 'light',
1400
+ group: 'component (internal)',
1401
+ scopes: ['fgColor'],
1402
+ },
1403
+ },
1404
+ alpha: 0.5,
1405
+ },
1406
+ },
1407
+ iconColor: {
1408
+ rest: {
1409
+ $value: '{fgColor.danger}',
1410
+ $type: 'color',
1411
+ $extensions: {
1412
+ 'org.primer.figma': {
1413
+ collection: 'mode',
1414
+ mode: 'light',
1415
+ group: 'component (internal)',
1416
+ scopes: ['fgColor'],
1417
+ },
1418
+ },
1419
+ },
1420
+ hover: {
1421
+ $value: '{base.color.neutral.0}',
1422
+ $type: 'color',
1423
+ $extensions: {
1424
+ 'org.primer.figma': {
1425
+ collection: 'mode',
1426
+ mode: 'light',
1427
+ group: 'component (internal)',
1428
+ scopes: ['fgColor'],
1429
+ },
1430
+ },
1431
+ },
1432
+ },
1433
+ bgColor: {
1434
+ rest: {
1435
+ $value: '{control.bgColor.rest}',
1436
+ $type: 'color',
1437
+ $extensions: {
1438
+ 'org.primer.figma': {
1439
+ collection: 'mode',
1440
+ mode: 'light',
1441
+ group: 'component (internal)',
1442
+ scopes: ['bgColor'],
1443
+ },
1444
+ },
1445
+ },
1446
+ hover: {
1447
+ $value: '{base.color.red.6}',
1448
+ $type: 'color',
1449
+ $extensions: {
1450
+ 'org.primer.figma': {
1451
+ collection: 'mode',
1452
+ mode: 'light',
1453
+ group: 'component (internal)',
1454
+ scopes: ['bgColor'],
1455
+ },
1456
+ },
1457
+ },
1458
+ active: {
1459
+ $value: '{base.color.red.6}',
1460
+ $type: 'color',
1461
+ $extensions: {
1462
+ 'org.primer.figma': {
1463
+ collection: 'mode',
1464
+ mode: 'light',
1465
+ group: 'component (internal)',
1466
+ scopes: ['bgColor'],
1467
+ },
1468
+ },
1469
+ mix: {
1470
+ color: '{base.color.red.8}',
1471
+ weight: 0.4,
1472
+ },
1473
+ },
1474
+ disabled: {
1475
+ $value: '{control.bgColor.disabled}',
1476
+ $type: 'color',
1477
+ $extensions: {
1478
+ 'org.primer.figma': {
1479
+ collection: 'mode',
1480
+ mode: 'light',
1481
+ group: 'component (internal)',
1482
+ scopes: ['bgColor'],
1483
+ },
1484
+ },
1485
+ },
1486
+ },
1487
+ borderColor: {
1488
+ rest: {
1489
+ $value: '{control.borderColor.rest}',
1490
+ $type: 'color',
1491
+ $extensions: {
1492
+ 'org.primer.figma': {
1493
+ collection: 'mode',
1494
+ mode: 'light',
1495
+ group: 'component (internal)',
1496
+ scopes: ['borderColor'],
1497
+ },
1498
+ },
1499
+ },
1500
+ hover: {
1501
+ $value: '{button.primary.borderColor.rest}',
1502
+ $type: 'color',
1503
+ $extensions: {
1504
+ 'org.primer.figma': {
1505
+ collection: 'mode',
1506
+ mode: 'light',
1507
+ group: 'component (internal)',
1508
+ scopes: ['borderColor'],
1509
+ },
1510
+ },
1511
+ },
1512
+ active: {
1513
+ $value: '{button.danger.borderColor.hover}',
1514
+ $type: 'color',
1515
+ $extensions: {
1516
+ 'org.primer.figma': {
1517
+ collection: 'mode',
1518
+ mode: 'light',
1519
+ group: 'component (internal)',
1520
+ scopes: ['borderColor'],
1521
+ },
1522
+ },
1523
+ },
1524
+ },
1525
+ },
1526
+ inactive: {
1527
+ fgColor: {
1528
+ $value: '{base.color.neutral.9}',
1529
+ $type: 'color',
1530
+ $extensions: {
1531
+ 'org.primer.figma': {
1532
+ collection: 'mode',
1533
+ mode: 'light',
1534
+ group: 'component (internal)',
1535
+ scopes: ['fgColor'],
1536
+ },
1537
+ },
1538
+ },
1539
+ bgColor: {
1540
+ $value: '{base.color.neutral.3}',
1541
+ $type: 'color',
1542
+ $extensions: {
1543
+ 'org.primer.figma': {
1544
+ collection: 'mode',
1545
+ mode: 'light',
1546
+ group: 'component (internal)',
1547
+ scopes: ['bgColor'],
1548
+ },
1549
+ },
1550
+ },
1551
+ },
1552
+ star: {
1553
+ iconColor: {
1554
+ $value: '{base.color.yellow.2}',
1555
+ $type: 'color',
1556
+ $extensions: {
1557
+ 'org.primer.figma': {
1558
+ collection: 'mode',
1559
+ mode: 'light',
1560
+ group: 'component (internal)',
1561
+ scopes: ['bgColor'],
1562
+ },
1563
+ },
1564
+ },
1565
+ },
1566
+ },
1567
+ buttonCounter: {
1568
+ default: {
1569
+ bgColor: {
1570
+ rest: {
1571
+ $value: '{bgColor.neutral.muted}',
1572
+ $type: 'color',
1573
+ $extensions: {
1574
+ 'org.primer.figma': {
1575
+ collection: 'mode',
1576
+ mode: 'light',
1577
+ group: 'component (internal)',
1578
+ scopes: ['bgColor'],
1579
+ },
1580
+ },
1581
+ },
1582
+ },
1583
+ },
1584
+ invisible: {
1585
+ bgColor: {
1586
+ rest: {
1587
+ $value: '{bgColor.neutral.muted}',
1588
+ $type: 'color',
1589
+ $extensions: {
1590
+ 'org.primer.figma': {
1591
+ collection: 'mode',
1592
+ mode: 'light',
1593
+ group: 'component (internal)',
1594
+ scopes: ['bgColor'],
1595
+ },
1596
+ },
1597
+ },
1598
+ },
1599
+ },
1600
+ primary: {
1601
+ bgColor: {
1602
+ rest: {
1603
+ $value: '{base.color.green.9}',
1604
+ $type: 'color',
1605
+ $extensions: {
1606
+ 'org.primer.figma': {
1607
+ collection: 'mode',
1608
+ mode: 'light',
1609
+ group: 'component (internal)',
1610
+ scopes: ['bgColor'],
1611
+ },
1612
+ },
1613
+ alpha: 0.2,
1614
+ },
1615
+ },
1616
+ },
1617
+ outline: {
1618
+ bgColor: {
1619
+ rest: {
1620
+ $value: '{bgColor.accent.emphasis}',
1621
+ $type: 'color',
1622
+ $extensions: {
1623
+ 'org.primer.figma': {
1624
+ collection: 'mode',
1625
+ mode: 'light',
1626
+ group: 'component (internal)',
1627
+ scopes: ['bgColor'],
1628
+ },
1629
+ },
1630
+ alpha: 0.1,
1631
+ },
1632
+ hover: {
1633
+ $value: '{base.color.neutral.0}',
1634
+ $type: 'color',
1635
+ $extensions: {
1636
+ 'org.primer.figma': {
1637
+ collection: 'mode',
1638
+ mode: 'light',
1639
+ group: 'component (internal)',
1640
+ scopes: ['bgColor'],
1641
+ },
1642
+ },
1643
+ alpha: 0.2,
1644
+ },
1645
+ disabled: {
1646
+ $value: '{bgColor.accent.emphasis}',
1647
+ $type: 'color',
1648
+ $extensions: {
1649
+ 'org.primer.figma': {
1650
+ collection: 'mode',
1651
+ mode: 'light',
1652
+ group: 'component (internal)',
1653
+ scopes: ['bgColor'],
1654
+ },
1655
+ },
1656
+ alpha: 0.05,
1657
+ },
1658
+ },
1659
+ fgColor: {
1660
+ rest: {
1661
+ $value: '{base.color.blue.6}',
1662
+ $type: 'color',
1663
+ $extensions: {
1664
+ 'org.primer.figma': {
1665
+ collection: 'mode',
1666
+ mode: 'light',
1667
+ group: 'component (internal)',
1668
+ scopes: ['fgColor'],
1669
+ },
1670
+ },
1671
+ },
1672
+ hover: {
1673
+ $value: '{base.color.neutral.0}',
1674
+ $type: 'color',
1675
+ $extensions: {
1676
+ 'org.primer.figma': {
1677
+ collection: 'mode',
1678
+ mode: 'light',
1679
+ group: 'component (internal)',
1680
+ scopes: ['fgColor'],
1681
+ },
1682
+ },
1683
+ },
1684
+ disabled: {
1685
+ $value: '{fgColor.accent}',
1686
+ $type: 'color',
1687
+ $extensions: {
1688
+ 'org.primer.figma': {
1689
+ collection: 'mode',
1690
+ mode: 'light',
1691
+ group: 'component (internal)',
1692
+ scopes: ['fgColor'],
1693
+ },
1694
+ },
1695
+ alpha: 0.5,
1696
+ },
1697
+ },
1698
+ },
1699
+ danger: {
1700
+ bgColor: {
1701
+ hover: {
1702
+ $value: '{base.color.neutral.0}',
1703
+ $type: 'color',
1704
+ $extensions: {
1705
+ 'org.primer.figma': {
1706
+ collection: 'mode',
1707
+ mode: 'light',
1708
+ group: 'component (internal)',
1709
+ scopes: ['bgColor'],
1710
+ },
1711
+ },
1712
+ alpha: 0.2,
1713
+ },
1714
+ disabled: {
1715
+ $value: '{bgColor.danger.emphasis}',
1716
+ $type: 'color',
1717
+ $extensions: {
1718
+ 'org.primer.figma': {
1719
+ collection: 'mode',
1720
+ mode: 'light',
1721
+ group: 'component (internal)',
1722
+ scopes: ['bgColor'],
1723
+ },
1724
+ },
1725
+ alpha: 0.05,
1726
+ },
1727
+ rest: {
1728
+ $value: '{bgColor.danger.emphasis}',
1729
+ $type: 'color',
1730
+ $extensions: {
1731
+ 'org.primer.figma': {
1732
+ collection: 'mode',
1733
+ mode: 'light',
1734
+ group: 'component (internal)',
1735
+ scopes: ['bgColor'],
1736
+ },
1737
+ },
1738
+ alpha: 0.1,
1739
+ },
1740
+ },
1741
+ fgColor: {
1742
+ rest: {
1743
+ $value: '{base.color.red.5}',
1744
+ $type: 'color',
1745
+ $extensions: {
1746
+ 'org.primer.figma': {
1747
+ collection: 'mode',
1748
+ mode: 'light',
1749
+ group: 'component (internal)',
1750
+ scopes: ['fgColor'],
1751
+ },
1752
+ },
1753
+ mix: {
1754
+ color: '{base.color.red.6}',
1755
+ weight: 0.3,
1756
+ },
1757
+ },
1758
+ hover: {
1759
+ $value: '{base.color.neutral.0}',
1760
+ $type: 'color',
1761
+ $extensions: {
1762
+ 'org.primer.figma': {
1763
+ collection: 'mode',
1764
+ mode: 'light',
1765
+ group: 'component (internal)',
1766
+ scopes: ['fgColor'],
1767
+ },
1768
+ },
1769
+ },
1770
+ disabled: {
1771
+ $value: '{fgColor.danger}',
1772
+ $type: 'color',
1773
+ $extensions: {
1774
+ 'org.primer.figma': {
1775
+ collection: 'mode',
1776
+ mode: 'light',
1777
+ group: 'component (internal)',
1778
+ scopes: ['fgColor'],
1779
+ },
1780
+ },
1781
+ alpha: 0.5,
1782
+ },
1783
+ },
1784
+ },
1785
+ },
1786
+ reactionButton: {
1787
+ selected: {
1788
+ bgColor: {
1789
+ rest: {
1790
+ $value: '{base.color.blue.0}',
1791
+ $type: 'color',
1792
+ $extensions: {
1793
+ 'org.primer.figma': {
1794
+ collection: 'mode',
1795
+ mode: 'light',
1796
+ group: 'component (internal)',
1797
+ scopes: ['bgColor'],
1798
+ },
1799
+ },
1800
+ },
1801
+ hover: {
1802
+ $value: '{reactionButton.selected.bgColor.rest}',
1803
+ $type: 'color',
1804
+ $extensions: {
1805
+ 'org.primer.figma': {
1806
+ collection: 'mode',
1807
+ mode: 'light',
1808
+ group: 'component (internal)',
1809
+ scopes: ['bgColor'],
1810
+ },
1811
+ },
1812
+ mix: {
1813
+ color: '{base.color.blue.2}',
1814
+ weight: 0.2,
1815
+ },
1816
+ },
1817
+ },
1818
+ fgColor: {
1819
+ rest: {
1820
+ $value: '{fgColor.link}',
1821
+ $type: 'color',
1822
+ $extensions: {
1823
+ 'org.primer.figma': {
1824
+ collection: 'mode',
1825
+ mode: 'light',
1826
+ group: 'component (internal)',
1827
+ scopes: ['fgColor'],
1828
+ },
1829
+ },
1830
+ },
1831
+ hover: {
1832
+ $value: '{base.color.blue.6}',
1833
+ $type: 'color',
1834
+ $extensions: {
1835
+ 'org.primer.figma': {
1836
+ collection: 'mode',
1837
+ mode: 'light',
1838
+ group: 'component (internal)',
1839
+ scopes: ['fgColor'],
1840
+ },
1841
+ },
1842
+ },
1843
+ },
1844
+ },
1845
+ },
1846
+ focus: {
1847
+ outlineColor: {
1848
+ $value: '{borderColor.accent.emphasis}',
1849
+ $type: 'color',
1850
+ $extensions: {
1851
+ 'org.primer.figma': {
1852
+ collection: 'mode',
1853
+ mode: 'light',
1854
+ group: 'component (internal)',
1855
+ scopes: ['borderColor', 'effectColor'],
1856
+ },
1857
+ },
1858
+ },
1859
+ },
1860
+ header: {
1861
+ bgColor: {
1862
+ $value: '{base.color.neutral.12}',
1863
+ $type: 'color',
1864
+ $extensions: {
1865
+ 'org.primer.figma': {
1866
+ collection: 'mode',
1867
+ mode: 'light',
1868
+ group: 'component (internal)',
1869
+ scopes: ['bgColor'],
1870
+ },
1871
+ },
1872
+ },
1873
+ fgColor: {
1874
+ default: {
1875
+ $value: '{base.color.neutral.0}',
1876
+ $type: 'color',
1877
+ $extensions: {
1878
+ 'org.primer.figma': {
1879
+ collection: 'mode',
1880
+ mode: 'light',
1881
+ group: 'component (internal)',
1882
+ scopes: ['fgColor'],
1883
+ },
1884
+ },
1885
+ alpha: 0.7,
1886
+ },
1887
+ logo: {
1888
+ $value: '{base.color.neutral.0}',
1889
+ $type: 'color',
1890
+ $extensions: {
1891
+ 'org.primer.figma': {
1892
+ collection: 'mode',
1893
+ mode: 'light',
1894
+ group: 'component (internal)',
1895
+ scopes: ['fgColor'],
1896
+ },
1897
+ },
1898
+ },
1899
+ },
1900
+ borderColor: {
1901
+ divider: {
1902
+ $value: '{base.color.neutral.8}',
1903
+ $type: 'color',
1904
+ $extensions: {
1905
+ 'org.primer.figma': {
1906
+ collection: 'mode',
1907
+ mode: 'light',
1908
+ group: 'component (internal)',
1909
+ scopes: ['borderColor'],
1910
+ },
1911
+ },
1912
+ },
1913
+ },
1914
+ },
1915
+ headerSearch: {
1916
+ bgColor: {
1917
+ $value: '{base.color.neutral.12}',
1918
+ $type: 'color',
1919
+ $extensions: {
1920
+ 'org.primer.figma': {
1921
+ collection: 'mode',
1922
+ mode: 'light',
1923
+ group: 'component (internal)',
1924
+ scopes: ['bgColor'],
1925
+ },
1926
+ },
1927
+ },
1928
+ borderColor: {
1929
+ $value: '{base.color.neutral.8}',
1930
+ $type: 'color',
1931
+ $extensions: {
1932
+ 'org.primer.figma': {
1933
+ collection: 'mode',
1934
+ mode: 'light',
1935
+ group: 'component (internal)',
1936
+ scopes: ['borderColor'],
1937
+ },
1938
+ },
1939
+ },
1940
+ },
1941
+ menu: {
1942
+ bgColor: {
1943
+ active: {
1944
+ $value: '{base.color.transparent}',
1945
+ $type: 'color',
1946
+ $extensions: {
1947
+ 'org.primer.figma': {
1948
+ collection: 'mode',
1949
+ mode: 'light',
1950
+ group: 'component (internal)',
1951
+ scopes: ['bgColor'],
1952
+ },
1953
+ },
1954
+ },
1955
+ },
1956
+ },
1957
+ overlay: {
1958
+ bgColor: {
1959
+ $value: '{base.color.neutral.0}',
1960
+ $type: 'color',
1961
+ $extensions: {
1962
+ 'org.primer.figma': {
1963
+ collection: 'mode',
1964
+ mode: 'light',
1965
+ group: 'component (internal)',
1966
+ scopes: ['bgColor'],
1967
+ },
1968
+ },
1969
+ },
1970
+ borderColor: {
1971
+ $value: '{borderColor.muted}',
1972
+ $type: 'color',
1973
+ $extensions: {
1974
+ 'org.primer.figma': {
1975
+ collection: 'mode',
1976
+ mode: 'light',
1977
+ group: 'component (internal)',
1978
+ },
1979
+ },
1980
+ alpha: 0.5,
1981
+ },
1982
+ backdrop: {
1983
+ bgColor: {
1984
+ $value: '{base.color.neutral.7}',
1985
+ $type: 'color',
1986
+ $extensions: {
1987
+ 'org.primer.figma': {
1988
+ collection: 'mode',
1989
+ mode: 'light',
1990
+ group: 'component (internal)',
1991
+ scopes: ['bgColor'],
1992
+ },
1993
+ },
1994
+ alpha: 0.4,
1995
+ },
1996
+ },
1997
+ },
1998
+ selectMenu: {
1999
+ borderColor: {
2000
+ $value: '{base.color.transparent}',
2001
+ $type: 'color',
2002
+ $extensions: {
2003
+ 'org.primer.figma': {
2004
+ collection: 'mode',
2005
+ mode: 'light',
2006
+ group: 'component (internal)',
2007
+ scopes: ['borderColor'],
2008
+ },
2009
+ },
2010
+ },
2011
+ bgColor: {
2012
+ active: {
2013
+ $value: '{base.color.blue.1}',
2014
+ $type: 'color',
2015
+ $extensions: {
2016
+ 'org.primer.figma': {
2017
+ collection: 'mode',
2018
+ mode: 'light',
2019
+ group: 'component (internal)',
2020
+ scopes: ['bgColor'],
2021
+ },
2022
+ },
2023
+ },
2024
+ },
2025
+ },
2026
+ sideNav: {
2027
+ bgColor: {
2028
+ selected: {
2029
+ $value: '{base.color.neutral.0}',
2030
+ $type: 'color',
2031
+ $extensions: {
2032
+ 'org.primer.figma': {
2033
+ collection: 'mode',
2034
+ mode: 'light',
2035
+ group: 'component (internal)',
2036
+ scopes: ['bgColor'],
2037
+ },
2038
+ },
2039
+ },
2040
+ },
2041
+ },
2042
+ skeletonLoader: {
2043
+ bgColor: {
2044
+ $value: '{bgColor.muted}',
2045
+ $type: 'color',
2046
+ },
2047
+ },
2048
+ timelineBadge: {
2049
+ bgColor: {
2050
+ $value: '{bgColor.muted}',
2051
+ $type: 'color',
2052
+ $extensions: {
2053
+ 'org.primer.figma': {
2054
+ collection: 'mode',
2055
+ mode: 'light',
2056
+ group: 'component (internal)',
2057
+ scopes: ['bgColor'],
2058
+ },
2059
+ },
2060
+ },
2061
+ },
2062
+ treeViewItem: {
2063
+ leadingVisual: {
2064
+ iconColor: {
2065
+ rest: {
2066
+ $value: '{base.color.blue.3}',
2067
+ $type: 'color',
2068
+ $extensions: {
2069
+ 'org.primer.figma': {
2070
+ collection: 'mode',
2071
+ mode: 'light',
2072
+ group: 'component (internal)',
2073
+ scopes: ['bgColor'],
2074
+ },
2075
+ },
2076
+ },
2077
+ },
2078
+ },
2079
+ },
2080
+ underlineNav: {
2081
+ borderColor: {
2082
+ active: {
2083
+ $value: '{base.color.coral.3}',
2084
+ $type: 'color',
2085
+ $extensions: {
2086
+ 'org.primer.figma': {
2087
+ collection: 'mode',
2088
+ mode: 'light',
2089
+ group: 'component (internal)',
2090
+ scopes: ['borderColor'],
2091
+ },
2092
+ },
2093
+ },
2094
+ hover: {
2095
+ $value: '{borderColor.muted}',
2096
+ $type: 'color',
2097
+ $extensions: {
2098
+ 'org.primer.figma': {
2099
+ collection: 'mode',
2100
+ mode: 'light',
2101
+ group: 'component (internal)',
2102
+ scopes: ['borderColor'],
2103
+ },
2104
+ },
2105
+ },
2106
+ },
2107
+ iconColor: {
2108
+ rest: {
2109
+ $value: '{fgColor.muted}',
2110
+ $type: 'color',
2111
+ $extensions: {
2112
+ 'org.primer.figma': {
2113
+ collection: 'mode',
2114
+ mode: 'light',
2115
+ group: 'component (internal)',
2116
+ scopes: ['fgColor'],
2117
+ },
2118
+ },
2119
+ },
2120
+ },
2121
+ },
2122
+ selection: {
2123
+ bgColor: {
2124
+ $value: '{bgColor.accent.emphasis}',
2125
+ $type: 'color',
2126
+ $extensions: {
2127
+ 'org.primer.figma': {
2128
+ collection: 'mode',
2129
+ mode: 'light',
2130
+ group: 'component',
2131
+ scopes: ['bgColor'],
2132
+ },
2133
+ },
2134
+ alpha: 0.2,
2135
+ },
2136
+ },
2137
+ card: {
2138
+ bgColor: {
2139
+ $value: '{bgColor.default}',
2140
+ $type: 'color',
2141
+ $extensions: {
2142
+ 'org.primer.figma': {
2143
+ collection: 'mode',
2144
+ mode: 'light',
2145
+ group: 'component',
2146
+ scopes: ['bgColor'],
2147
+ },
2148
+ },
2149
+ },
2150
+ },
2151
+ label: {
2152
+ green: {
2153
+ bgColor: {
2154
+ rest: {
2155
+ $value: '{base.display.color.green.0}',
2156
+ $type: 'color',
2157
+ $extensions: {
2158
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2159
+ },
2160
+ },
2161
+ hover: {
2162
+ $value: '{base.display.color.green.1}',
2163
+ $type: 'color',
2164
+ $extensions: {
2165
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2166
+ },
2167
+ },
2168
+ active: {
2169
+ $value: '{base.display.color.green.2}',
2170
+ $type: 'color',
2171
+ $extensions: {
2172
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2173
+ },
2174
+ },
2175
+ },
2176
+ fgColor: {
2177
+ rest: {
2178
+ $value: '{base.display.color.green.6}',
2179
+ $type: 'color',
2180
+ $extensions: {
2181
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2182
+ },
2183
+ },
2184
+ hover: {
2185
+ $value: '{base.display.color.green.7}',
2186
+ $type: 'color',
2187
+ $extensions: {
2188
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2189
+ },
2190
+ },
2191
+ active: {
2192
+ $value: '{base.display.color.green.8}',
2193
+ $type: 'color',
2194
+ $extensions: {
2195
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2196
+ },
2197
+ },
2198
+ },
2199
+ },
2200
+ orange: {
2201
+ bgColor: {
2202
+ rest: {
2203
+ $value: '{base.display.color.orange.0}',
2204
+ $type: 'color',
2205
+ $extensions: {
2206
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2207
+ },
2208
+ },
2209
+ hover: {
2210
+ $value: '{base.display.color.orange.1}',
2211
+ $type: 'color',
2212
+ $extensions: {
2213
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2214
+ },
2215
+ },
2216
+ active: {
2217
+ $value: '{base.display.color.orange.2}',
2218
+ $type: 'color',
2219
+ $extensions: {
2220
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2221
+ },
2222
+ },
2223
+ },
2224
+ fgColor: {
2225
+ rest: {
2226
+ $value: '{base.display.color.orange.6}',
2227
+ $type: 'color',
2228
+ $extensions: {
2229
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2230
+ },
2231
+ },
2232
+ hover: {
2233
+ $value: '{base.display.color.orange.7}',
2234
+ $type: 'color',
2235
+ $extensions: {
2236
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2237
+ },
2238
+ },
2239
+ active: {
2240
+ $value: '{base.display.color.orange.8}',
2241
+ $type: 'color',
2242
+ $extensions: {
2243
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2244
+ },
2245
+ },
2246
+ },
2247
+ },
2248
+ purple: {
2249
+ bgColor: {
2250
+ rest: {
2251
+ $value: '{base.display.color.purple.0}',
2252
+ $type: 'color',
2253
+ $extensions: {
2254
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2255
+ },
2256
+ },
2257
+ hover: {
2258
+ $value: '{base.display.color.purple.1}',
2259
+ $type: 'color',
2260
+ $extensions: {
2261
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2262
+ },
2263
+ },
2264
+ active: {
2265
+ $value: '{base.display.color.purple.2}',
2266
+ $type: 'color',
2267
+ $extensions: {
2268
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2269
+ },
2270
+ },
2271
+ },
2272
+ fgColor: {
2273
+ rest: {
2274
+ $value: '{base.display.color.purple.6}',
2275
+ $type: 'color',
2276
+ $extensions: {
2277
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2278
+ },
2279
+ },
2280
+ hover: {
2281
+ $value: '{base.display.color.purple.7}',
2282
+ $type: 'color',
2283
+ $extensions: {
2284
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2285
+ },
2286
+ },
2287
+ active: {
2288
+ $value: '{base.display.color.purple.8}',
2289
+ $type: 'color',
2290
+ $extensions: {
2291
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2292
+ },
2293
+ },
2294
+ },
2295
+ },
2296
+ red: {
2297
+ bgColor: {
2298
+ rest: {
2299
+ $value: '{base.display.color.red.0}',
2300
+ $type: 'color',
2301
+ $extensions: {
2302
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2303
+ },
2304
+ },
2305
+ hover: {
2306
+ $value: '{base.display.color.red.1}',
2307
+ $type: 'color',
2308
+ $extensions: {
2309
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2310
+ },
2311
+ },
2312
+ active: {
2313
+ $value: '{base.display.color.red.2}',
2314
+ $type: 'color',
2315
+ $extensions: {
2316
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2317
+ },
2318
+ },
2319
+ },
2320
+ fgColor: {
2321
+ rest: {
2322
+ $value: '{base.display.color.red.6}',
2323
+ $type: 'color',
2324
+ $extensions: {
2325
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2326
+ },
2327
+ },
2328
+ hover: {
2329
+ $value: '{base.display.color.red.7}',
2330
+ $type: 'color',
2331
+ $extensions: {
2332
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2333
+ },
2334
+ },
2335
+ active: {
2336
+ $value: '{base.display.color.red.8}',
2337
+ $type: 'color',
2338
+ $extensions: {
2339
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2340
+ },
2341
+ },
2342
+ },
2343
+ },
2344
+ yellow: {
2345
+ bgColor: {
2346
+ rest: {
2347
+ $value: '{base.display.color.yellow.0}',
2348
+ $type: 'color',
2349
+ $extensions: {
2350
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2351
+ },
2352
+ },
2353
+ hover: {
2354
+ $value: '{base.display.color.yellow.1}',
2355
+ $type: 'color',
2356
+ $extensions: {
2357
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2358
+ },
2359
+ },
2360
+ active: {
2361
+ $value: '{base.display.color.yellow.2}',
2362
+ $type: 'color',
2363
+ $extensions: {
2364
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2365
+ },
2366
+ },
2367
+ },
2368
+ fgColor: {
2369
+ rest: {
2370
+ $value: '{base.display.color.yellow.6}',
2371
+ $type: 'color',
2372
+ $extensions: {
2373
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2374
+ },
2375
+ },
2376
+ hover: {
2377
+ $value: '{base.display.color.yellow.7}',
2378
+ $type: 'color',
2379
+ $extensions: {
2380
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2381
+ },
2382
+ },
2383
+ active: {
2384
+ $value: '{base.display.color.yellow.8}',
2385
+ $type: 'color',
2386
+ $extensions: {
2387
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2388
+ },
2389
+ },
2390
+ },
2391
+ },
2392
+ gray: {
2393
+ bgColor: {
2394
+ rest: {
2395
+ $value: '{base.display.color.gray.0}',
2396
+ $type: 'color',
2397
+ $extensions: {
2398
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2399
+ },
2400
+ },
2401
+ hover: {
2402
+ $value: '{base.display.color.gray.1}',
2403
+ $type: 'color',
2404
+ $extensions: {
2405
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2406
+ },
2407
+ },
2408
+ active: {
2409
+ $value: '{base.display.color.gray.2}',
2410
+ $type: 'color',
2411
+ $extensions: {
2412
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2413
+ },
2414
+ },
2415
+ },
2416
+ fgColor: {
2417
+ rest: {
2418
+ $value: '{base.display.color.gray.6}',
2419
+ $type: 'color',
2420
+ $extensions: {
2421
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2422
+ },
2423
+ },
2424
+ hover: {
2425
+ $value: '{base.display.color.gray.7}',
2426
+ $type: 'color',
2427
+ $extensions: {
2428
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2429
+ },
2430
+ },
2431
+ active: {
2432
+ $value: '{base.display.color.gray.8}',
2433
+ $type: 'color',
2434
+ $extensions: {
2435
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2436
+ },
2437
+ },
2438
+ },
2439
+ },
2440
+ auburn: {
2441
+ bgColor: {
2442
+ rest: {
2443
+ $value: '{base.display.color.auburn.0}',
2444
+ $type: 'color',
2445
+ $extensions: {
2446
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2447
+ },
2448
+ },
2449
+ hover: {
2450
+ $value: '{base.display.color.auburn.1}',
2451
+ $type: 'color',
2452
+ $extensions: {
2453
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2454
+ },
2455
+ },
2456
+ active: {
2457
+ $value: '{base.display.color.auburn.2}',
2458
+ $type: 'color',
2459
+ $extensions: {
2460
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2461
+ },
2462
+ },
2463
+ },
2464
+ fgColor: {
2465
+ rest: {
2466
+ $value: '{base.display.color.auburn.6}',
2467
+ $type: 'color',
2468
+ $extensions: {
2469
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2470
+ },
2471
+ },
2472
+ hover: {
2473
+ $value: '{base.display.color.auburn.7}',
2474
+ $type: 'color',
2475
+ $extensions: {
2476
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2477
+ },
2478
+ },
2479
+ active: {
2480
+ $value: '{base.display.color.auburn.8}',
2481
+ $type: 'color',
2482
+ $extensions: {
2483
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2484
+ },
2485
+ },
2486
+ },
2487
+ },
2488
+ brown: {
2489
+ bgColor: {
2490
+ rest: {
2491
+ $value: '{base.display.color.brown.0}',
2492
+ $type: 'color',
2493
+ $extensions: {
2494
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2495
+ },
2496
+ },
2497
+ hover: {
2498
+ $value: '{base.display.color.brown.1}',
2499
+ $type: 'color',
2500
+ $extensions: {
2501
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2502
+ },
2503
+ },
2504
+ active: {
2505
+ $value: '{base.display.color.brown.2}',
2506
+ $type: 'color',
2507
+ $extensions: {
2508
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2509
+ },
2510
+ },
2511
+ },
2512
+ fgColor: {
2513
+ rest: {
2514
+ $value: '{base.display.color.brown.6}',
2515
+ $type: 'color',
2516
+ $extensions: {
2517
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2518
+ },
2519
+ },
2520
+ hover: {
2521
+ $value: '{base.display.color.brown.7}',
2522
+ $type: 'color',
2523
+ $extensions: {
2524
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2525
+ },
2526
+ },
2527
+ active: {
2528
+ $value: '{base.display.color.brown.8}',
2529
+ $type: 'color',
2530
+ $extensions: {
2531
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2532
+ },
2533
+ },
2534
+ },
2535
+ },
2536
+ lemon: {
2537
+ bgColor: {
2538
+ rest: {
2539
+ $value: '{base.display.color.lemon.0}',
2540
+ $type: 'color',
2541
+ $extensions: {
2542
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2543
+ },
2544
+ },
2545
+ hover: {
2546
+ $value: '{base.display.color.lemon.1}',
2547
+ $type: 'color',
2548
+ $extensions: {
2549
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2550
+ },
2551
+ },
2552
+ active: {
2553
+ $value: '{base.display.color.lemon.2}',
2554
+ $type: 'color',
2555
+ $extensions: {
2556
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2557
+ },
2558
+ },
2559
+ },
2560
+ fgColor: {
2561
+ rest: {
2562
+ $value: '{base.display.color.lemon.6}',
2563
+ $type: 'color',
2564
+ $extensions: {
2565
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2566
+ },
2567
+ },
2568
+ hover: {
2569
+ $value: '{base.display.color.lemon.7}',
2570
+ $type: 'color',
2571
+ $extensions: {
2572
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2573
+ },
2574
+ },
2575
+ active: {
2576
+ $value: '{base.display.color.lemon.8}',
2577
+ $type: 'color',
2578
+ $extensions: {
2579
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2580
+ },
2581
+ },
2582
+ },
2583
+ },
2584
+ olive: {
2585
+ bgColor: {
2586
+ rest: {
2587
+ $value: '{base.display.color.olive.0}',
2588
+ $type: 'color',
2589
+ $extensions: {
2590
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2591
+ },
2592
+ },
2593
+ hover: {
2594
+ $value: '{base.display.color.olive.1}',
2595
+ $type: 'color',
2596
+ $extensions: {
2597
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2598
+ },
2599
+ },
2600
+ active: {
2601
+ $value: '{base.display.color.olive.2}',
2602
+ $type: 'color',
2603
+ $extensions: {
2604
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2605
+ },
2606
+ },
2607
+ },
2608
+ fgColor: {
2609
+ rest: {
2610
+ $value: '{base.display.color.olive.6}',
2611
+ $type: 'color',
2612
+ $extensions: {
2613
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2614
+ },
2615
+ },
2616
+ hover: {
2617
+ $value: '{base.display.color.olive.7}',
2618
+ $type: 'color',
2619
+ $extensions: {
2620
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2621
+ },
2622
+ },
2623
+ active: {
2624
+ $value: '{base.display.color.olive.8}',
2625
+ $type: 'color',
2626
+ $extensions: {
2627
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2628
+ },
2629
+ },
2630
+ },
2631
+ },
2632
+ lime: {
2633
+ bgColor: {
2634
+ rest: {
2635
+ $value: '{base.display.color.lime.0}',
2636
+ $type: 'color',
2637
+ $extensions: {
2638
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2639
+ },
2640
+ },
2641
+ hover: {
2642
+ $value: '{base.display.color.lime.1}',
2643
+ $type: 'color',
2644
+ $extensions: {
2645
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2646
+ },
2647
+ },
2648
+ active: {
2649
+ $value: '{base.display.color.lime.2}',
2650
+ $type: 'color',
2651
+ $extensions: {
2652
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2653
+ },
2654
+ },
2655
+ },
2656
+ fgColor: {
2657
+ rest: {
2658
+ $value: '{base.display.color.lime.6}',
2659
+ $type: 'color',
2660
+ $extensions: {
2661
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2662
+ },
2663
+ },
2664
+ hover: {
2665
+ $value: '{base.display.color.lime.7}',
2666
+ $type: 'color',
2667
+ $extensions: {
2668
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2669
+ },
2670
+ },
2671
+ active: {
2672
+ $value: '{base.display.color.lime.8}',
2673
+ $type: 'color',
2674
+ $extensions: {
2675
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2676
+ },
2677
+ },
2678
+ },
2679
+ },
2680
+ pine: {
2681
+ bgColor: {
2682
+ rest: {
2683
+ $value: '{base.display.color.pine.0}',
2684
+ $type: 'color',
2685
+ $extensions: {
2686
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2687
+ },
2688
+ },
2689
+ hover: {
2690
+ $value: '{base.display.color.pine.1}',
2691
+ $type: 'color',
2692
+ $extensions: {
2693
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2694
+ },
2695
+ },
2696
+ active: {
2697
+ $value: '{base.display.color.pine.2}',
2698
+ $type: 'color',
2699
+ $extensions: {
2700
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2701
+ },
2702
+ },
2703
+ },
2704
+ fgColor: {
2705
+ rest: {
2706
+ $value: '{base.display.color.pine.6}',
2707
+ $type: 'color',
2708
+ $extensions: {
2709
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2710
+ },
2711
+ },
2712
+ hover: {
2713
+ $value: '{base.display.color.pine.7}',
2714
+ $type: 'color',
2715
+ $extensions: {
2716
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2717
+ },
2718
+ },
2719
+ active: {
2720
+ $value: '{base.display.color.pine.8}',
2721
+ $type: 'color',
2722
+ $extensions: {
2723
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2724
+ },
2725
+ },
2726
+ },
2727
+ },
2728
+ teal: {
2729
+ bgColor: {
2730
+ rest: {
2731
+ $value: '{base.display.color.teal.0}',
2732
+ $type: 'color',
2733
+ $extensions: {
2734
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2735
+ },
2736
+ },
2737
+ hover: {
2738
+ $value: '{base.display.color.teal.1}',
2739
+ $type: 'color',
2740
+ $extensions: {
2741
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2742
+ },
2743
+ },
2744
+ active: {
2745
+ $value: '{base.display.color.teal.2}',
2746
+ $type: 'color',
2747
+ $extensions: {
2748
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2749
+ },
2750
+ },
2751
+ },
2752
+ fgColor: {
2753
+ rest: {
2754
+ $value: '{base.display.color.teal.6}',
2755
+ $type: 'color',
2756
+ $extensions: {
2757
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2758
+ },
2759
+ },
2760
+ hover: {
2761
+ $value: '{base.display.color.teal.7}',
2762
+ $type: 'color',
2763
+ $extensions: {
2764
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2765
+ },
2766
+ },
2767
+ active: {
2768
+ $value: '{base.display.color.teal.8}',
2769
+ $type: 'color',
2770
+ $extensions: {
2771
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2772
+ },
2773
+ },
2774
+ },
2775
+ },
2776
+ cyan: {
2777
+ bgColor: {
2778
+ rest: {
2779
+ $value: '{base.display.color.cyan.0}',
2780
+ $type: 'color',
2781
+ $extensions: {
2782
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2783
+ },
2784
+ },
2785
+ hover: {
2786
+ $value: '{base.display.color.cyan.1}',
2787
+ $type: 'color',
2788
+ $extensions: {
2789
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2790
+ },
2791
+ },
2792
+ active: {
2793
+ $value: '{base.display.color.cyan.2}',
2794
+ $type: 'color',
2795
+ $extensions: {
2796
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2797
+ },
2798
+ },
2799
+ },
2800
+ fgColor: {
2801
+ rest: {
2802
+ $value: '{base.display.color.cyan.6}',
2803
+ $type: 'color',
2804
+ $extensions: {
2805
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2806
+ },
2807
+ },
2808
+ hover: {
2809
+ $value: '{base.display.color.cyan.7}',
2810
+ $type: 'color',
2811
+ $extensions: {
2812
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2813
+ },
2814
+ },
2815
+ active: {
2816
+ $value: '{base.display.color.cyan.8}',
2817
+ $type: 'color',
2818
+ $extensions: {
2819
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2820
+ },
2821
+ },
2822
+ },
2823
+ },
2824
+ indigo: {
2825
+ bgColor: {
2826
+ rest: {
2827
+ $value: '{base.display.color.indigo.0}',
2828
+ $type: 'color',
2829
+ $extensions: {
2830
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2831
+ },
2832
+ },
2833
+ hover: {
2834
+ $value: '{base.display.color.indigo.1}',
2835
+ $type: 'color',
2836
+ $extensions: {
2837
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2838
+ },
2839
+ },
2840
+ active: {
2841
+ $value: '{base.display.color.indigo.2}',
2842
+ $type: 'color',
2843
+ $extensions: {
2844
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2845
+ },
2846
+ },
2847
+ },
2848
+ fgColor: {
2849
+ rest: {
2850
+ $value: '{base.display.color.indigo.6}',
2851
+ $type: 'color',
2852
+ $extensions: {
2853
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2854
+ },
2855
+ },
2856
+ hover: {
2857
+ $value: '{base.display.color.indigo.7}',
2858
+ $type: 'color',
2859
+ $extensions: {
2860
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2861
+ },
2862
+ },
2863
+ active: {
2864
+ $value: '{base.display.color.indigo.8}',
2865
+ $type: 'color',
2866
+ $extensions: {
2867
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2868
+ },
2869
+ },
2870
+ },
2871
+ },
2872
+ blue: {
2873
+ bgColor: {
2874
+ rest: {
2875
+ $value: '{base.display.color.blue.0}',
2876
+ $type: 'color',
2877
+ $extensions: {
2878
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2879
+ },
2880
+ },
2881
+ hover: {
2882
+ $value: '{base.display.color.blue.1}',
2883
+ $type: 'color',
2884
+ $extensions: {
2885
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2886
+ },
2887
+ },
2888
+ active: {
2889
+ $value: '{base.display.color.blue.2}',
2890
+ $type: 'color',
2891
+ $extensions: {
2892
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2893
+ },
2894
+ },
2895
+ },
2896
+ fgColor: {
2897
+ rest: {
2898
+ $value: '{base.display.color.blue.6}',
2899
+ $type: 'color',
2900
+ $extensions: {
2901
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2902
+ },
2903
+ },
2904
+ hover: {
2905
+ $value: '{base.display.color.blue.7}',
2906
+ $type: 'color',
2907
+ $extensions: {
2908
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2909
+ },
2910
+ },
2911
+ active: {
2912
+ $value: '{base.display.color.blue.8}',
2913
+ $type: 'color',
2914
+ $extensions: {
2915
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2916
+ },
2917
+ },
2918
+ },
2919
+ },
2920
+ plum: {
2921
+ bgColor: {
2922
+ rest: {
2923
+ $value: '{base.display.color.plum.0}',
2924
+ $type: 'color',
2925
+ $extensions: {
2926
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2927
+ },
2928
+ },
2929
+ hover: {
2930
+ $value: '{base.display.color.plum.1}',
2931
+ $type: 'color',
2932
+ $extensions: {
2933
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2934
+ },
2935
+ },
2936
+ active: {
2937
+ $value: '{base.display.color.plum.2}',
2938
+ $type: 'color',
2939
+ $extensions: {
2940
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2941
+ },
2942
+ },
2943
+ },
2944
+ fgColor: {
2945
+ rest: {
2946
+ $value: '{base.display.color.plum.6}',
2947
+ $type: 'color',
2948
+ $extensions: {
2949
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2950
+ },
2951
+ },
2952
+ hover: {
2953
+ $value: '{base.display.color.plum.7}',
2954
+ $type: 'color',
2955
+ $extensions: {
2956
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2957
+ },
2958
+ },
2959
+ active: {
2960
+ $value: '{base.display.color.plum.8}',
2961
+ $type: 'color',
2962
+ $extensions: {
2963
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2964
+ },
2965
+ },
2966
+ },
2967
+ },
2968
+ pink: {
2969
+ bgColor: {
2970
+ rest: {
2971
+ $value: '{base.display.color.pink.0}',
2972
+ $type: 'color',
2973
+ $extensions: {
2974
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2975
+ },
2976
+ },
2977
+ hover: {
2978
+ $value: '{base.display.color.pink.1}',
2979
+ $type: 'color',
2980
+ $extensions: {
2981
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2982
+ },
2983
+ },
2984
+ active: {
2985
+ $value: '{base.display.color.pink.2}',
2986
+ $type: 'color',
2987
+ $extensions: {
2988
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
2989
+ },
2990
+ },
2991
+ },
2992
+ fgColor: {
2993
+ rest: {
2994
+ $value: '{base.display.color.pink.6}',
2995
+ $type: 'color',
2996
+ $extensions: {
2997
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
2998
+ },
2999
+ },
3000
+ hover: {
3001
+ $value: '{base.display.color.pink.7}',
3002
+ $type: 'color',
3003
+ $extensions: {
3004
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
3005
+ },
3006
+ },
3007
+ active: {
3008
+ $value: '{base.display.color.pink.8}',
3009
+ $type: 'color',
3010
+ $extensions: {
3011
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
3012
+ },
3013
+ },
3014
+ },
3015
+ },
3016
+ coral: {
3017
+ bgColor: {
3018
+ rest: {
3019
+ $value: '{base.display.color.coral.0}',
3020
+ $type: 'color',
3021
+ $extensions: {
3022
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
3023
+ },
3024
+ },
3025
+ hover: {
3026
+ $value: '{base.display.color.coral.1}',
3027
+ $type: 'color',
3028
+ $extensions: {
3029
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
3030
+ },
3031
+ },
3032
+ active: {
3033
+ $value: '{base.display.color.coral.2}',
3034
+ $type: 'color',
3035
+ $extensions: {
3036
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['bgColor']},
3037
+ },
3038
+ },
3039
+ },
3040
+ fgColor: {
3041
+ rest: {
3042
+ $value: '{base.display.color.coral.6}',
3043
+ $type: 'color',
3044
+ $extensions: {
3045
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
3046
+ },
3047
+ },
3048
+ hover: {
3049
+ $value: '{base.display.color.coral.7}',
3050
+ $type: 'color',
3051
+ $extensions: {
3052
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
3053
+ },
3054
+ },
3055
+ active: {
3056
+ $value: '{base.display.color.coral.8}',
3057
+ $type: 'color',
3058
+ $extensions: {
3059
+ 'org.primer.figma': {collection: 'mode', mode: 'light', group: 'component', scopes: ['fgColor']},
3060
+ },
3061
+ },
3062
+ },
3063
+ },
3064
+ },
3065
+ tooltip: {
3066
+ bgColor: {
3067
+ $value: '{bgColor.emphasis}',
3068
+ $type: 'color',
3069
+ $extensions: {
3070
+ 'org.primer.figma': {
3071
+ collection: 'mode',
3072
+ mode: 'light',
3073
+ group: 'component',
3074
+ scopes: ['bgColor'],
3075
+ },
3076
+ },
3077
+ },
3078
+ fgColor: {
3079
+ $value: '{fgColor.onEmphasis}',
3080
+ $type: 'color',
3081
+ $extensions: {
3082
+ 'org.primer.figma': {
3083
+ collection: 'mode',
3084
+ mode: 'light',
3085
+ group: 'component',
3086
+ scopes: ['fgColor'],
3087
+ },
3088
+ },
3089
+ },
3090
+ },
3091
+ }