@primer/primitives 10.0.0-rc.f7aad39e → 10.0.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 (59) hide show
  1. package/dist/build/filters/isDeprecated.js +1 -1
  2. package/dist/build/schemas/baseToken.d.ts +3 -3
  3. package/dist/build/schemas/baseToken.js +1 -1
  4. package/dist/build/schemas/borderToken.d.ts +3 -3
  5. package/dist/build/schemas/colorToken.d.ts +17 -10
  6. package/dist/build/schemas/colorToken.js +2 -1
  7. package/dist/build/schemas/cubicBezierToken.d.ts +3 -3
  8. package/dist/build/schemas/dimensionToken.d.ts +10 -3
  9. package/dist/build/schemas/dimensionToken.js +1 -0
  10. package/dist/build/schemas/durationToken.d.ts +3 -3
  11. package/dist/build/schemas/fontFamilyToken.d.ts +3 -3
  12. package/dist/build/schemas/fontWeightToken.d.ts +3 -3
  13. package/dist/build/schemas/numberToken.d.ts +3 -3
  14. package/dist/build/schemas/shadowToken.d.ts +18 -11
  15. package/dist/build/schemas/shadowToken.js +6 -3
  16. package/dist/build/schemas/stringToken.d.ts +3 -3
  17. package/dist/build/schemas/typographyToken.d.ts +3 -3
  18. package/dist/build/schemas/viewportRangeToken.d.ts +3 -3
  19. package/dist/build/transformers/figmaAttributes.js +2 -2
  20. package/dist/build/transformers/jsonDeprecated.js +1 -1
  21. package/dist/docs/functional/themes/dark-colorblind.json +0 -1046
  22. package/dist/docs/functional/themes/dark-dimmed.json +0 -1092
  23. package/dist/docs/functional/themes/dark-high-contrast.json +0 -850
  24. package/dist/docs/functional/themes/dark-tritanopia.json +0 -1072
  25. package/dist/docs/functional/themes/dark.json +0 -1148
  26. package/dist/docs/functional/themes/light-colorblind.json +0 -1054
  27. package/dist/docs/functional/themes/light-high-contrast.json +0 -884
  28. package/dist/docs/functional/themes/light-tritanopia.json +0 -1070
  29. package/dist/docs/functional/themes/light.json +0 -1144
  30. package/dist/styleLint/functional/themes/dark-colorblind.json +0 -1046
  31. package/dist/styleLint/functional/themes/dark-dimmed.json +0 -1092
  32. package/dist/styleLint/functional/themes/dark-high-contrast.json +0 -850
  33. package/dist/styleLint/functional/themes/dark-tritanopia.json +0 -1072
  34. package/dist/styleLint/functional/themes/dark.json +0 -1148
  35. package/dist/styleLint/functional/themes/light-colorblind.json +0 -1054
  36. package/dist/styleLint/functional/themes/light-high-contrast.json +0 -884
  37. package/dist/styleLint/functional/themes/light-tritanopia.json +0 -1070
  38. package/dist/styleLint/functional/themes/light.json +0 -1144
  39. package/package.json +3 -2
  40. package/src/tokens/functional/color/dark/app-dark.json5 +49 -49
  41. package/src/tokens/functional/color/dark/data-vis-dark.json5 +20 -20
  42. package/src/tokens/functional/color/dark/display-dark.json5 +95 -95
  43. package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +1 -1
  44. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +2 -2
  45. package/src/tokens/functional/color/dark/patterns-dark.json +3963 -0
  46. package/src/tokens/functional/color/dark/patterns-dark.json5 +114 -277
  47. package/src/tokens/functional/color/dark/primitives-dark.json5 +78 -78
  48. package/src/tokens/functional/color/dark/syntax-dark.json5 +47 -47
  49. package/src/tokens/functional/color/light/app-light.json5 +0 -49
  50. package/src/tokens/functional/color/light/data-vis-light.json5 +20 -20
  51. package/src/tokens/functional/color/light/display-light.json5 +0 -95
  52. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +0 -2
  53. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +0 -3
  54. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +0 -3
  55. package/src/tokens/functional/color/light/patterns-light.json5 +114 -276
  56. package/src/tokens/functional/color/light/primitives-light.json5 +0 -78
  57. package/src/tokens/functional/color/light/syntax-light.json5 +0 -47
  58. package/src/tokens/functional/shadow/dark.json5 +0 -14
  59. package/src/tokens/functional/shadow/light.json5 +0 -13
package/src/tokens/functional/color/dark/patterns-dark.json ADDED
@@ -0,0 +1,3963 @@
1
+ {
2
+ "avatar": {
3
+ "bgColor": {
4
+ "$value": "{base.color.neutral.13}",
5
+ "$type": "color",
6
+ "$extensions": {
7
+ "org.primer.figma": {
8
+ "collection": "mode",
9
+ "group": "component (internal)",
10
+ "scopes": [
11
+ "bgColor"
12
+ ]
13
+ }
14
+ },
15
+ "alpha": 0.1
16
+ },
17
+ "borderColor": {
18
+ "$value": "{borderColor.translucent}",
19
+ "$type": "color",
20
+ "$extensions": {
21
+ "org.primer.figma": {
22
+ "collection": "mode",
23
+ "group": "component (internal)",
24
+ "scopes": [
25
+ "borderColor"
26
+ ]
27
+ }
28
+ }
29
+ }
30
+ },
31
+ "avatarStack": {
32
+ "fade": {
33
+ "bgColor": {
34
+ "default": {
35
+ "$value": "{base.color.neutral.7}",
36
+ "$type": "color",
37
+ "$extensions": {
38
+ "org.primer.figma": {
39
+ "collection": "mode",
40
+ "group": "component (internal)",
41
+ "scopes": [
42
+ "bgColor"
43
+ ]
44
+ }
45
+ }
46
+ },
47
+ "muted": {
48
+ "$value": "{base.color.neutral.5}",
49
+ "$type": "color",
50
+ "$extensions": {
51
+ "org.primer.figma": {
52
+ "collection": "mode",
53
+ "group": "component (internal)",
54
+ "scopes": [
55
+ "bgColor"
56
+ ]
57
+ }
58
+ }
59
+ }
60
+ }
61
+ }
62
+ },
63
+ "control": {
64
+ "bgColor": {
65
+ "rest": {
66
+ "$value": "{base.color.neutral.3}",
67
+ "$type": "color",
68
+ "$extensions": {
69
+ "org.primer.figma": {
70
+ "collection": "mode",
71
+ "group": "component",
72
+ "scopes": [
73
+ "bgColor"
74
+ ]
75
+ }
76
+ }
77
+ },
78
+ "hover": {
79
+ "$value": "{base.color.neutral.4}",
80
+ "$type": "color",
81
+ "$extensions": {
82
+ "org.primer.figma": {
83
+ "collection": "mode",
84
+ "group": "component",
85
+ "scopes": [
86
+ "bgColor"
87
+ ]
88
+ }
89
+ }
90
+ },
91
+ "active": {
92
+ "$value": "{base.color.neutral.5}",
93
+ "$type": "color",
94
+ "$extensions": {
95
+ "org.primer.figma": {
96
+ "collection": "mode",
97
+ "group": "component",
98
+ "scopes": [
99
+ "bgColor"
100
+ ]
101
+ }
102
+ }
103
+ },
104
+ "disabled": {
105
+ "$value": "{bgColor.disabled}",
106
+ "$type": "color",
107
+ "$extensions": {
108
+ "org.primer.figma": {
109
+ "collection": "mode",
110
+ "group": "component",
111
+ "scopes": [
112
+ "bgColor"
113
+ ]
114
+ }
115
+ }
116
+ },
117
+ "selected": {
118
+ "$value": "{control.bgColor.rest}",
119
+ "$type": "color",
120
+ "$extensions": {
121
+ "org.primer.figma": {
122
+ "collection": "mode",
123
+ "group": "component",
124
+ "scopes": [
125
+ "bgColor"
126
+ ]
127
+ }
128
+ }
129
+ }
130
+ },
131
+ "fgColor": {
132
+ "rest": {
133
+ "$value": "{fgColor.default}",
134
+ "$type": "color",
135
+ "$extensions": {
136
+ "org.primer.figma": {
137
+ "collection": "mode",
138
+ "group": "component",
139
+ "scopes": [
140
+ "fgColor"
141
+ ]
142
+ }
143
+ }
144
+ },
145
+ "placeholder": {
146
+ "$value": "{fgColor.muted}",
147
+ "$type": "color",
148
+ "$extensions": {
149
+ "org.primer.figma": {
150
+ "collection": "mode",
151
+ "group": "component",
152
+ "scopes": [
153
+ "fgColor"
154
+ ]
155
+ }
156
+ }
157
+ },
158
+ "disabled": {
159
+ "$value": "{fgColor.disabled}",
160
+ "$type": "color",
161
+ "$extensions": {
162
+ "org.primer.figma": {
163
+ "collection": "mode",
164
+ "group": "component",
165
+ "scopes": [
166
+ "fgColor"
167
+ ]
168
+ }
169
+ }
170
+ }
171
+ },
172
+ "borderColor": {
173
+ "rest": {
174
+ "$value": "{borderColor.default}",
175
+ "$type": "color",
176
+ "$extensions": {
177
+ "org.primer.figma": {
178
+ "collection": "mode",
179
+ "group": "component",
180
+ "scopes": [
181
+ "borderColor"
182
+ ]
183
+ }
184
+ }
185
+ },
186
+ "emphasis": {
187
+ "$value": "{borderColor.emphasis}",
188
+ "$type": "color",
189
+ "$extensions": {
190
+ "org.primer.figma": {
191
+ "collection": "mode",
192
+ "group": "component",
193
+ "scopes": [
194
+ "borderColor"
195
+ ]
196
+ }
197
+ }
198
+ },
199
+ "disabled": {
200
+ "$value": "{borderColor.disabled}",
201
+ "$type": "color",
202
+ "$extensions": {
203
+ "org.primer.figma": {
204
+ "collection": "mode",
205
+ "group": "component",
206
+ "scopes": [
207
+ "borderColor"
208
+ ]
209
+ }
210
+ }
211
+ },
212
+ "selected": {
213
+ "$value": "{base.color.neutral.12}",
214
+ "$type": "color",
215
+ "$extensions": {
216
+ "org.primer.figma": {
217
+ "collection": "mode",
218
+ "group": "component",
219
+ "scopes": [
220
+ "borderColor"
221
+ ]
222
+ }
223
+ }
224
+ },
225
+ "success": {
226
+ "$value": "{borderColor.success.emphasis}",
227
+ "$type": "color",
228
+ "$extensions": {
229
+ "org.primer.figma": {
230
+ "collection": "mode",
231
+ "group": "component",
232
+ "scopes": [
233
+ "borderColor"
234
+ ]
235
+ }
236
+ }
237
+ },
238
+ "danger": {
239
+ "$value": "{borderColor.danger.emphasis}",
240
+ "$type": "color",
241
+ "$extensions": {
242
+ "org.primer.figma": {
243
+ "collection": "mode",
244
+ "group": "component",
245
+ "scopes": [
246
+ "borderColor"
247
+ ]
248
+ }
249
+ }
250
+ },
251
+ "warning": {
252
+ "$value": "{borderColor.attention.emphasis}",
253
+ "$type": "color",
254
+ "$extensions": {
255
+ "org.primer.figma": {
256
+ "collection": "mode",
257
+ "group": "component",
258
+ "scopes": [
259
+ "borderColor"
260
+ ]
261
+ }
262
+ }
263
+ }
264
+ },
265
+ "iconColor": {
266
+ "rest": {
267
+ "$value": "{fgColor.muted}",
268
+ "$type": "color",
269
+ "$extensions": {
270
+ "org.primer.figma": {
271
+ "collection": "mode",
272
+ "group": "component",
273
+ "scopes": [
274
+ "fgColor"
275
+ ]
276
+ }
277
+ }
278
+ }
279
+ },
280
+ "transparent": {
281
+ "bgColor": {
282
+ "rest": {
283
+ "$value": "{base.color.transparent}",
284
+ "$type": "color",
285
+ "$extensions": {
286
+ "org.primer.figma": {
287
+ "collection": "mode",
288
+ "group": "component",
289
+ "scopes": [
290
+ "bgColor"
291
+ ]
292
+ }
293
+ }
294
+ },
295
+ "hover": {
296
+ "$value": "{base.color.neutral.8}",
297
+ "$type": "color",
298
+ "$extensions": {
299
+ "org.primer.figma": {
300
+ "collection": "mode",
301
+ "group": "component",
302
+ "scopes": [
303
+ "bgColor"
304
+ ]
305
+ }
306
+ },
307
+ "alpha": 0.2
308
+ },
309
+ "active": {
310
+ "$value": "{base.color.neutral.8}",
311
+ "$type": "color",
312
+ "$extensions": {
313
+ "org.primer.figma": {
314
+ "collection": "mode",
315
+ "group": "component",
316
+ "scopes": [
317
+ "bgColor"
318
+ ]
319
+ }
320
+ },
321
+ "alpha": 0.25
322
+ },
323
+ "disabled": {
324
+ "$value": "{bgColor.disabled}",
325
+ "$type": "color",
326
+ "$extensions": {
327
+ "org.primer.figma": {
328
+ "collection": "mode",
329
+ "group": "component",
330
+ "scopes": [
331
+ "bgColor"
332
+ ]
333
+ }
334
+ }
335
+ },
336
+ "selected": {
337
+ "$value": "{base.color.neutral.8}",
338
+ "$type": "color",
339
+ "$extensions": {
340
+ "org.primer.figma": {
341
+ "collection": "mode",
342
+ "group": "component",
343
+ "scopes": [
344
+ "bgColor"
345
+ ]
346
+ }
347
+ },
348
+ "alpha": 0.1
349
+ }
350
+ },
351
+ "borderColor": {
352
+ "rest": {
353
+ "$value": "{base.color.transparent}",
354
+ "$type": "color",
355
+ "$extensions": {
356
+ "org.primer.figma": {
357
+ "collection": "mode",
358
+ "group": "component",
359
+ "scopes": [
360
+ "borderColor"
361
+ ]
362
+ }
363
+ }
364
+ },
365
+ "hover": {
366
+ "$value": "{base.color.transparent}",
367
+ "$type": "color",
368
+ "$extensions": {
369
+ "org.primer.figma": {
370
+ "collection": "mode",
371
+ "group": "component",
372
+ "scopes": [
373
+ "borderColor"
374
+ ]
375
+ }
376
+ }
377
+ },
378
+ "active": {
379
+ "$value": "{base.color.transparent}",
380
+ "$type": "color",
381
+ "$extensions": {
382
+ "org.primer.figma": {
383
+ "collection": "mode",
384
+ "group": "component",
385
+ "scopes": [
386
+ "borderColor"
387
+ ]
388
+ }
389
+ }
390
+ }
391
+ }
392
+ },
393
+ "danger": {
394
+ "fgColor": {
395
+ "rest": {
396
+ "$value": "{fgColor.danger}",
397
+ "$type": "color",
398
+ "$extensions": {
399
+ "org.primer.figma": {
400
+ "collection": "mode",
401
+ "group": "component",
402
+ "scopes": [
403
+ "fgColor"
404
+ ]
405
+ }
406
+ }
407
+ },
408
+ "hover": {
409
+ "$value": "{base.color.red.3}",
410
+ "$type": "color",
411
+ "$extensions": {
412
+ "org.primer.figma": {
413
+ "collection": "mode",
414
+ "group": "component",
415
+ "scopes": [
416
+ "fgColor"
417
+ ]
418
+ }
419
+ }
420
+ }
421
+ },
422
+ "bgColor": {
423
+ "hover": {
424
+ "$value": "{bgColor.danger.muted}",
425
+ "$type": "color",
426
+ "$extensions": {
427
+ "org.primer.figma": {
428
+ "collection": "mode",
429
+ "group": "component",
430
+ "scopes": [
431
+ "bgColor"
432
+ ]
433
+ }
434
+ }
435
+ },
436
+ "active": {
437
+ "$value": "{bgColor.danger.muted}",
438
+ "$type": "color",
439
+ "$extensions": {
440
+ "org.primer.figma": {
441
+ "collection": "mode",
442
+ "group": "component",
443
+ "scopes": [
444
+ "bgColor"
445
+ ]
446
+ }
447
+ },
448
+ "alpha": 0.4
449
+ }
450
+ }
451
+ },
452
+ "checked": {
453
+ "bgColor": {
454
+ "rest": {
455
+ "$value": "{bgColor.accent.emphasis}",
456
+ "$type": "color",
457
+ "$extensions": {
458
+ "org.primer.figma": {
459
+ "collection": "mode",
460
+ "group": "component",
461
+ "scopes": [
462
+ "bgColor"
463
+ ]
464
+ }
465
+ }
466
+ },
467
+ "hover": {
468
+ "$value": "{bgColor.accent.emphasis}",
469
+ "$type": "color",
470
+ "$extensions": {
471
+ "org.primer.figma": {
472
+ "collection": "mode",
473
+ "group": "component",
474
+ "scopes": [
475
+ "bgColor"
476
+ ]
477
+ }
478
+ },
479
+ "mix": {
480
+ "color": "{base.color.blue.3}",
481
+ "weight": 0.2
482
+ }
483
+ },
484
+ "active": {
485
+ "$value": "{bgColor.accent.emphasis}",
486
+ "$type": "color",
487
+ "$extensions": {
488
+ "org.primer.figma": {
489
+ "collection": "mode",
490
+ "group": "component",
491
+ "scopes": [
492
+ "bgColor"
493
+ ]
494
+ }
495
+ },
496
+ "mix": {
497
+ "color": "{base.color.blue.3}",
498
+ "weight": 0.4
499
+ }
500
+ },
501
+ "disabled": {
502
+ "$value": "{fgColor.disabled}",
503
+ "$type": "color",
504
+ "$extensions": {
505
+ "org.primer.figma": {
506
+ "collection": "mode",
507
+ "group": "component",
508
+ "scopes": [
509
+ "bgColor"
510
+ ]
511
+ }
512
+ }
513
+ }
514
+ },
515
+ "fgColor": {
516
+ "rest": {
517
+ "$value": "{fgColor.onEmphasis}",
518
+ "$type": "color",
519
+ "$extensions": {
520
+ "org.primer.figma": {
521
+ "collection": "mode",
522
+ "group": "component",
523
+ "scopes": [
524
+ "fgColor"
525
+ ]
526
+ }
527
+ }
528
+ },
529
+ "disabled": {
530
+ "$value": "{base.color.inset}",
531
+ "$type": "color",
532
+ "$extensions": {
533
+ "org.primer.figma": {
534
+ "collection": "mode",
535
+ "group": "component",
536
+ "scopes": [
537
+ "fgColor"
538
+ ]
539
+ }
540
+ }
541
+ }
542
+ },
543
+ "borderColor": {
544
+ "rest": {
545
+ "$value": "{control.checked.bgColor.rest}",
546
+ "$type": "color",
547
+ "$extensions": {
548
+ "org.primer.figma": {
549
+ "collection": "mode",
550
+ "group": "component",
551
+ "scopes": [
552
+ "borderColor"
553
+ ]
554
+ }
555
+ }
556
+ },
557
+ "hover": {
558
+ "$value": "{control.checked.bgColor.hover}",
559
+ "$type": "color",
560
+ "$extensions": {
561
+ "org.primer.figma": {
562
+ "collection": "mode",
563
+ "group": "component",
564
+ "scopes": [
565
+ "borderColor"
566
+ ]
567
+ }
568
+ }
569
+ },
570
+ "active": {
571
+ "$value": "{control.checked.bgColor.active}",
572
+ "$type": "color",
573
+ "$extensions": {
574
+ "org.primer.figma": {
575
+ "collection": "mode",
576
+ "group": "component",
577
+ "scopes": [
578
+ "borderColor"
579
+ ]
580
+ }
581
+ }
582
+ },
583
+ "disabled": {
584
+ "$value": "{control.checked.bgColor.disabled}",
585
+ "$type": "color",
586
+ "$extensions": {
587
+ "org.primer.figma": {
588
+ "collection": "mode",
589
+ "group": "component",
590
+ "scopes": [
591
+ "borderColor"
592
+ ]
593
+ }
594
+ }
595
+ }
596
+ }
597
+ }
598
+ },
599
+ "controlTrack": {
600
+ "bgColor": {
601
+ "rest": {
602
+ "$value": "{base.color.neutral.4}",
603
+ "$type": "color",
604
+ "$extensions": {
605
+ "org.primer.figma": {
606
+ "collection": "mode",
607
+ "group": "component (internal)",
608
+ "scopes": [
609
+ "bgColor"
610
+ ]
611
+ }
612
+ }
613
+ },
614
+ "hover": {
615
+ "$value": "{base.color.neutral.5}",
616
+ "$type": "color",
617
+ "$extensions": {
618
+ "org.primer.figma": {
619
+ "collection": "mode",
620
+ "group": "component (internal)",
621
+ "scopes": [
622
+ "bgColor"
623
+ ]
624
+ }
625
+ }
626
+ },
627
+ "active": {
628
+ "$value": "{base.color.neutral.6}",
629
+ "$type": "color",
630
+ "$extensions": {
631
+ "org.primer.figma": {
632
+ "collection": "mode",
633
+ "group": "component (internal)",
634
+ "scopes": [
635
+ "bgColor"
636
+ ]
637
+ }
638
+ }
639
+ },
640
+ "disabled": {
641
+ "$value": "{fgColor.disabled}",
642
+ "$type": "color",
643
+ "$extensions": {
644
+ "org.primer.figma": {
645
+ "collection": "mode",
646
+ "group": "component (internal)",
647
+ "scopes": [
648
+ "bgColor"
649
+ ]
650
+ }
651
+ }
652
+ }
653
+ },
654
+ "fgColor": {
655
+ "rest": {
656
+ "$value": "{fgColor.muted}",
657
+ "$type": "color",
658
+ "$extensions": {
659
+ "org.primer.figma": {
660
+ "collection": "mode",
661
+ "group": "component (internal)",
662
+ "scopes": [
663
+ "fgColor"
664
+ ]
665
+ }
666
+ }
667
+ },
668
+ "disabled": {
669
+ "$value": "{fgColor.onEmphasis}",
670
+ "$type": "color",
671
+ "$extensions": {
672
+ "org.primer.figma": {
673
+ "collection": "mode",
674
+ "group": "component (internal)",
675
+ "scopes": [
676
+ "fgColor"
677
+ ]
678
+ }
679
+ }
680
+ }
681
+ },
682
+ "borderColor": {
683
+ "rest": {
684
+ "$value": "{borderColor.default}",
685
+ "$type": "color",
686
+ "$extensions": {
687
+ "org.primer.figma": {
688
+ "collection": "mode",
689
+ "group": "component (internal)",
690
+ "scopes": [
691
+ "borderColor"
692
+ ]
693
+ }
694
+ }
695
+ },
696
+ "disabled": {
697
+ "$value": "{fgColor.disabled}",
698
+ "$type": "color",
699
+ "$extensions": {
700
+ "org.primer.figma": {
701
+ "collection": "mode",
702
+ "group": "component (internal)",
703
+ "scopes": [
704
+ "borderColor"
705
+ ]
706
+ }
707
+ }
708
+ }
709
+ }
710
+ },
711
+ "controlKnob": {
712
+ "bgColor": {
713
+ "rest": {
714
+ "$value": "{bgColor.inset}",
715
+ "$type": "color",
716
+ "$extensions": {
717
+ "org.primer.figma": {
718
+ "collection": "mode",
719
+ "group": "component (internal)",
720
+ "scopes": [
721
+ "bgColor"
722
+ ]
723
+ }
724
+ }
725
+ },
726
+ "disabled": {
727
+ "$value": "{control.bgColor.disabled}",
728
+ "$type": "color",
729
+ "$extensions": {
730
+ "org.primer.figma": {
731
+ "collection": "mode",
732
+ "group": "component (internal)",
733
+ "scopes": [
734
+ "bgColor"
735
+ ]
736
+ }
737
+ }
738
+ },
739
+ "checked": {
740
+ "$value": "{base.color.neutral.13}",
741
+ "$type": "color",
742
+ "$extensions": {
743
+ "org.primer.figma": {
744
+ "collection": "mode",
745
+ "group": "component (internal)",
746
+ "scopes": [
747
+ "bgColor"
748
+ ]
749
+ }
750
+ }
751
+ }
752
+ },
753
+ "borderColor": {
754
+ "rest": {
755
+ "$value": "{control.borderColor.emphasis}",
756
+ "$type": "color",
757
+ "$extensions": {
758
+ "org.primer.figma": {
759
+ "collection": "mode",
760
+ "group": "component (internal)",
761
+ "scopes": [
762
+ "borderColor"
763
+ ]
764
+ }
765
+ }
766
+ },
767
+ "disabled": {
768
+ "$value": "{control.bgColor.disabled}",
769
+ "$type": "color",
770
+ "$extensions": {
771
+ "org.primer.figma": {
772
+ "collection": "mode",
773
+ "group": "component (internal)",
774
+ "scopes": [
775
+ "borderColor"
776
+ ]
777
+ }
778
+ }
779
+ },
780
+ "checked": {
781
+ "$value": "{control.checked.bgColor.rest}",
782
+ "$type": "color",
783
+ "$extensions": {
784
+ "org.primer.figma": {
785
+ "collection": "mode",
786
+ "group": "component (internal)",
787
+ "scopes": [
788
+ "borderColor"
789
+ ]
790
+ }
791
+ }
792
+ }
793
+ }
794
+ },
795
+ "counter": {
796
+ "borderColor": {
797
+ "$value": "{base.color.transparent}",
798
+ "$type": "color",
799
+ "$extensions": {
800
+ "org.primer.figma": {
801
+ "collection": "mode",
802
+ "group": "component (internal)",
803
+ "scopes": [
804
+ "borderColor"
805
+ ]
806
+ }
807
+ }
808
+ },
809
+ "bgColor": {
810
+ "muted": {
811
+ "$value": "{bgColor.neutral.muted}",
812
+ "$type": "color",
813
+ "$extensions": {
814
+ "org.primer.figma": {
815
+ "collection": "mode",
816
+ "group": "component",
817
+ "scopes": [
818
+ "bgColor"
819
+ ]
820
+ }
821
+ }
822
+ },
823
+ "emphasis": {
824
+ "$value": "{bgColor.neutral.emphasis}",
825
+ "$type": "color",
826
+ "$extensions": {
827
+ "org.primer.figma": {
828
+ "collection": "mode",
829
+ "group": "component",
830
+ "scopes": [
831
+ "bgColor"
832
+ ]
833
+ }
834
+ }
835
+ }
836
+ }
837
+ },
838
+ "button": {
839
+ "default": {
840
+ "fgColor": {
841
+ "rest": {
842
+ "$value": "{control.fgColor.rest}",
843
+ "$type": "color",
844
+ "$extensions": {
845
+ "org.primer.figma": {
846
+ "collection": "mode",
847
+ "group": "component (internal)",
848
+ "scopes": [
849
+ "fgColor"
850
+ ]
851
+ }
852
+ }
853
+ }
854
+ },
855
+ "bgColor": {
856
+ "rest": {
857
+ "$value": "{control.bgColor.rest}",
858
+ "$type": "color",
859
+ "$extensions": {
860
+ "org.primer.figma": {
861
+ "collection": "mode",
862
+ "group": "component (internal)",
863
+ "scopes": [
864
+ "bgColor"
865
+ ]
866
+ }
867
+ }
868
+ },
869
+ "hover": {
870
+ "$value": "{control.bgColor.hover}",
871
+ "$type": "color",
872
+ "$extensions": {
873
+ "org.primer.figma": {
874
+ "collection": "mode",
875
+ "group": "component (internal)",
876
+ "scopes": [
877
+ "bgColor"
878
+ ]
879
+ }
880
+ }
881
+ },
882
+ "active": {
883
+ "$value": "{control.bgColor.active}",
884
+ "$type": "color",
885
+ "$extensions": {
886
+ "org.primer.figma": {
887
+ "collection": "mode",
888
+ "group": "component (internal)",
889
+ "scopes": [
890
+ "bgColor"
891
+ ]
892
+ }
893
+ }
894
+ },
895
+ "selected": {
896
+ "$value": "{control.bgColor.active}",
897
+ "$type": "color",
898
+ "$extensions": {
899
+ "org.primer.figma": {
900
+ "collection": "mode",
901
+ "group": "component (internal)",
902
+ "scopes": [
903
+ "bgColor"
904
+ ]
905
+ }
906
+ }
907
+ },
908
+ "disabled": {
909
+ "$value": "{control.bgColor.disabled}",
910
+ "$type": "color",
911
+ "$extensions": {
912
+ "org.primer.figma": {
913
+ "collection": "mode",
914
+ "group": "component (internal)",
915
+ "scopes": [
916
+ "bgColor"
917
+ ]
918
+ }
919
+ }
920
+ }
921
+ },
922
+ "borderColor": {
923
+ "rest": {
924
+ "$value": "{control.borderColor.rest}",
925
+ "$type": "color",
926
+ "$extensions": {
927
+ "org.primer.figma": {
928
+ "collection": "mode",
929
+ "group": "component (internal)",
930
+ "scopes": [
931
+ "borderColor"
932
+ ]
933
+ }
934
+ }
935
+ },
936
+ "hover": {
937
+ "$value": "{button.default.borderColor.rest}",
938
+ "$type": "color",
939
+ "$extensions": {
940
+ "org.primer.figma": {
941
+ "collection": "mode",
942
+ "group": "component (internal)",
943
+ "scopes": [
944
+ "borderColor"
945
+ ]
946
+ }
947
+ }
948
+ },
949
+ "active": {
950
+ "$value": "{button.default.borderColor.rest}",
951
+ "$type": "color",
952
+ "$extensions": {
953
+ "org.primer.figma": {
954
+ "collection": "mode",
955
+ "group": "component (internal)",
956
+ "scopes": [
957
+ "borderColor"
958
+ ]
959
+ }
960
+ }
961
+ },
962
+ "disabled": {
963
+ "$value": "{control.borderColor.disabled}",
964
+ "$type": "color",
965
+ "$extensions": {
966
+ "org.primer.figma": {
967
+ "collection": "mode",
968
+ "group": "component (internal)",
969
+ "scopes": [
970
+ "borderColor"
971
+ ]
972
+ }
973
+ }
974
+ }
975
+ }
976
+ },
977
+ "primary": {
978
+ "fgColor": {
979
+ "rest": {
980
+ "$value": "{fgColor.white}",
981
+ "$type": "color",
982
+ "$extensions": {
983
+ "org.primer.figma": {
984
+ "collection": "mode",
985
+ "group": "component (internal)",
986
+ "scopes": [
987
+ "fgColor"
988
+ ]
989
+ }
990
+ }
991
+ },
992
+ "disabled": {
993
+ "$value": "{base.color.neutral.13}",
994
+ "$type": "color",
995
+ "$extensions": {
996
+ "org.primer.figma": {
997
+ "collection": "mode",
998
+ "group": "component (internal)",
999
+ "scopes": [
1000
+ "fgColor"
1001
+ ]
1002
+ }
1003
+ },
1004
+ "alpha": 0.4
1005
+ }
1006
+ },
1007
+ "iconColor": {
1008
+ "rest": {
1009
+ "$value": "{fgColor.white}",
1010
+ "$type": "color",
1011
+ "$extensions": {
1012
+ "org.primer.figma": {
1013
+ "collection": "mode",
1014
+ "group": "component (internal)",
1015
+ "scopes": [
1016
+ "fgColor"
1017
+ ]
1018
+ }
1019
+ }
1020
+ }
1021
+ },
1022
+ "bgColor": {
1023
+ "rest": {
1024
+ "$value": "{bgColor.success.emphasis}",
1025
+ "$type": "color",
1026
+ "$extensions": {
1027
+ "org.primer.figma": {
1028
+ "collection": "mode",
1029
+ "group": "component (internal)",
1030
+ "scopes": [
1031
+ "bgColor"
1032
+ ]
1033
+ }
1034
+ }
1035
+ },
1036
+ "hover": {
1037
+ "$value": "{bgColor.success.emphasis}",
1038
+ "$type": "color",
1039
+ "$extensions": {
1040
+ "org.primer.figma": {
1041
+ "collection": "mode",
1042
+ "group": "component (internal)",
1043
+ "scopes": [
1044
+ "bgColor"
1045
+ ]
1046
+ }
1047
+ },
1048
+ "mix": {
1049
+ "color": "{base.color.green.3}",
1050
+ "weight": 0.2
1051
+ }
1052
+ },
1053
+ "active": {
1054
+ "$value": "{bgColor.success.emphasis}",
1055
+ "$type": "color",
1056
+ "$extensions": {
1057
+ "org.primer.figma": {
1058
+ "collection": "mode",
1059
+ "group": "component (internal)",
1060
+ "scopes": [
1061
+ "bgColor"
1062
+ ]
1063
+ }
1064
+ },
1065
+ "mix": {
1066
+ "color": "{base.color.green.3}",
1067
+ "weight": 0.4
1068
+ }
1069
+ },
1070
+ "disabled": {
1071
+ "$value": "{base.color.green.5}",
1072
+ "$type": "color",
1073
+ "$extensions": {
1074
+ "org.primer.figma": {
1075
+ "collection": "mode",
1076
+ "group": "component (internal)",
1077
+ "scopes": [
1078
+ "bgColor"
1079
+ ]
1080
+ }
1081
+ },
1082
+ "mix": {
1083
+ "color": "{base.color.green.8}",
1084
+ "weight": 0.6
1085
+ }
1086
+ }
1087
+ },
1088
+ "borderColor": {
1089
+ "rest": {
1090
+ "$value": "{base.color.neutral.13}",
1091
+ "$type": "color",
1092
+ "$extensions": {
1093
+ "org.primer.figma": {
1094
+ "collection": "mode",
1095
+ "group": "component (internal)",
1096
+ "scopes": [
1097
+ "borderColor"
1098
+ ]
1099
+ }
1100
+ },
1101
+ "alpha": 0.1
1102
+ },
1103
+ "hover": {
1104
+ "$value": "{button.primary.borderColor.rest}",
1105
+ "$type": "color",
1106
+ "$extensions": {
1107
+ "org.primer.figma": {
1108
+ "collection": "mode",
1109
+ "group": "component (internal)",
1110
+ "scopes": [
1111
+ "borderColor"
1112
+ ]
1113
+ }
1114
+ }
1115
+ },
1116
+ "active": {
1117
+ "$value": "{button.primary.borderColor.rest}",
1118
+ "$type": "color",
1119
+ "$extensions": {
1120
+ "org.primer.figma": {
1121
+ "collection": "mode",
1122
+ "group": "component (internal)",
1123
+ "scopes": [
1124
+ "borderColor"
1125
+ ]
1126
+ }
1127
+ }
1128
+ },
1129
+ "disabled": {
1130
+ "$value": "{button.primary.bgColor.disabled}",
1131
+ "$type": "color",
1132
+ "$extensions": {
1133
+ "org.primer.figma": {
1134
+ "collection": "mode",
1135
+ "group": "component (internal)",
1136
+ "scopes": [
1137
+ "borderColor"
1138
+ ]
1139
+ }
1140
+ }
1141
+ }
1142
+ }
1143
+ },
1144
+ "invisible": {
1145
+ "fgColor": {
1146
+ "rest": {
1147
+ "$value": "{control.fgColor.rest}",
1148
+ "$type": "color",
1149
+ "$extensions": {
1150
+ "org.primer.figma": {
1151
+ "collection": "mode",
1152
+ "group": "component (internal)",
1153
+ "scopes": [
1154
+ "fgColor"
1155
+ ]
1156
+ }
1157
+ }
1158
+ },
1159
+ "hover": {
1160
+ "$value": "{control.fgColor.rest}",
1161
+ "$type": "color",
1162
+ "$extensions": {
1163
+ "org.primer.figma": {
1164
+ "collection": "mode",
1165
+ "group": "component (internal)",
1166
+ "scopes": [
1167
+ "fgColor"
1168
+ ]
1169
+ }
1170
+ }
1171
+ },
1172
+ "active": {
1173
+ "$value": "{control.fgColor.rest}",
1174
+ "$type": "color",
1175
+ "$extensions": {
1176
+ "org.primer.figma": {
1177
+ "collection": "mode",
1178
+ "group": "component (internal)",
1179
+ "scopes": [
1180
+ "fgColor"
1181
+ ]
1182
+ }
1183
+ }
1184
+ },
1185
+ "disabled": {
1186
+ "$value": "{control.fgColor.disabled}",
1187
+ "$type": "color",
1188
+ "$extensions": {
1189
+ "org.primer.figma": {
1190
+ "collection": "mode",
1191
+ "group": "component (internal)",
1192
+ "scopes": [
1193
+ "fgColor"
1194
+ ]
1195
+ }
1196
+ }
1197
+ }
1198
+ },
1199
+ "iconColor": {
1200
+ "rest": {
1201
+ "$value": "{fgColor.muted}",
1202
+ "$type": "color",
1203
+ "$extensions": {
1204
+ "org.primer.figma": {
1205
+ "collection": "mode",
1206
+ "group": "component (internal)",
1207
+ "scopes": [
1208
+ "fgColor"
1209
+ ]
1210
+ }
1211
+ }
1212
+ },
1213
+ "hover": {
1214
+ "$value": "{fgColor.muted}",
1215
+ "$type": "color",
1216
+ "$extensions": {
1217
+ "org.primer.figma": {
1218
+ "collection": "mode",
1219
+ "group": "component (internal)",
1220
+ "scopes": [
1221
+ "fgColor"
1222
+ ]
1223
+ }
1224
+ }
1225
+ },
1226
+ "disabled": {
1227
+ "$value": "{control.fgColor.disabled}",
1228
+ "$type": "color",
1229
+ "$extensions": {
1230
+ "org.primer.figma": {
1231
+ "collection": "mode",
1232
+ "group": "component (internal)",
1233
+ "scopes": [
1234
+ "fgColor"
1235
+ ]
1236
+ }
1237
+ }
1238
+ }
1239
+ },
1240
+ "bgColor": {
1241
+ "rest": {
1242
+ "$value": "{control.transparent.bgColor.rest}",
1243
+ "$type": "color",
1244
+ "$extensions": {
1245
+ "org.primer.figma": {
1246
+ "collection": "mode",
1247
+ "group": "component (internal)",
1248
+ "scopes": [
1249
+ "bgColor"
1250
+ ]
1251
+ }
1252
+ }
1253
+ },
1254
+ "hover": {
1255
+ "$value": "{control.transparent.bgColor.hover}",
1256
+ "$type": "color",
1257
+ "$extensions": {
1258
+ "org.primer.figma": {
1259
+ "collection": "mode",
1260
+ "group": "component (internal)",
1261
+ "scopes": [
1262
+ "bgColor"
1263
+ ]
1264
+ }
1265
+ }
1266
+ },
1267
+ "active": {
1268
+ "$value": "{control.transparent.bgColor.active}",
1269
+ "$type": "color",
1270
+ "$extensions": {
1271
+ "org.primer.figma": {
1272
+ "collection": "mode",
1273
+ "group": "component (internal)",
1274
+ "scopes": [
1275
+ "bgColor"
1276
+ ]
1277
+ }
1278
+ }
1279
+ },
1280
+ "disabled": {
1281
+ "$value": "{control.transparent.bgColor.disabled}",
1282
+ "$type": "color",
1283
+ "$extensions": {
1284
+ "org.primer.figma": {
1285
+ "collection": "mode",
1286
+ "group": "component (internal)",
1287
+ "scopes": [
1288
+ "bgColor"
1289
+ ]
1290
+ }
1291
+ }
1292
+ }
1293
+ },
1294
+ "borderColor": {
1295
+ "rest": {
1296
+ "$value": "{control.transparent.borderColor.rest}",
1297
+ "$type": "color",
1298
+ "$extensions": {
1299
+ "org.primer.figma": {
1300
+ "collection": "mode",
1301
+ "group": "component (internal)",
1302
+ "scopes": [
1303
+ "borderColor"
1304
+ ]
1305
+ }
1306
+ }
1307
+ },
1308
+ "hover": {
1309
+ "$value": "{control.transparent.borderColor.hover}",
1310
+ "$type": "color",
1311
+ "$extensions": {
1312
+ "org.primer.figma": {
1313
+ "collection": "mode",
1314
+ "group": "component (internal)",
1315
+ "scopes": [
1316
+ "borderColor"
1317
+ ]
1318
+ }
1319
+ }
1320
+ },
1321
+ "disabled": {
1322
+ "$value": "{control.borderColor.disabled}",
1323
+ "$type": "color",
1324
+ "$extensions": {
1325
+ "org.primer.figma": {
1326
+ "collection": "mode",
1327
+ "group": "component (internal)",
1328
+ "scopes": [
1329
+ "borderColor"
1330
+ ]
1331
+ }
1332
+ }
1333
+ }
1334
+ }
1335
+ },
1336
+ "outline": {
1337
+ "fgColor": {
1338
+ "rest": {
1339
+ "$value": "{base.color.blue.4}",
1340
+ "$type": "color",
1341
+ "$extensions": {
1342
+ "org.primer.figma": {
1343
+ "collection": "mode",
1344
+ "group": "component (internal)",
1345
+ "scopes": [
1346
+ "fgColor"
1347
+ ]
1348
+ }
1349
+ }
1350
+ },
1351
+ "hover": {
1352
+ "$value": "{base.color.blue.3}",
1353
+ "$type": "color",
1354
+ "$extensions": {
1355
+ "org.primer.figma": {
1356
+ "collection": "mode",
1357
+ "group": "component (internal)",
1358
+ "scopes": [
1359
+ "fgColor"
1360
+ ]
1361
+ }
1362
+ }
1363
+ },
1364
+ "active": {
1365
+ "$value": "{base.color.neutral.13}",
1366
+ "$type": "color",
1367
+ "$extensions": {
1368
+ "org.primer.figma": {
1369
+ "collection": "mode",
1370
+ "group": "component (internal)",
1371
+ "scopes": [
1372
+ "fgColor"
1373
+ ]
1374
+ }
1375
+ }
1376
+ },
1377
+ "disabled": {
1378
+ "$value": "{fgColor.accent}",
1379
+ "$type": "color",
1380
+ "$extensions": {
1381
+ "org.primer.figma": {
1382
+ "collection": "mode",
1383
+ "group": "component (internal)",
1384
+ "scopes": [
1385
+ "fgColor"
1386
+ ]
1387
+ }
1388
+ },
1389
+ "alpha": 0.5
1390
+ }
1391
+ },
1392
+ "bgColor": {
1393
+ "rest": {
1394
+ "$value": "{base.color.neutral.12}",
1395
+ "$type": "color",
1396
+ "$extensions": {
1397
+ "org.primer.figma": {
1398
+ "collection": "mode",
1399
+ "group": "component (internal)",
1400
+ "scopes": [
1401
+ "bgColor"
1402
+ ]
1403
+ }
1404
+ }
1405
+ },
1406
+ "hover": {
1407
+ "$value": "{control.bgColor.hover}",
1408
+ "$type": "color",
1409
+ "$extensions": {
1410
+ "org.primer.figma": {
1411
+ "collection": "mode",
1412
+ "group": "component (internal)",
1413
+ "scopes": [
1414
+ "bgColor"
1415
+ ]
1416
+ }
1417
+ }
1418
+ },
1419
+ "active": {
1420
+ "$value": "{base.color.blue.7}",
1421
+ "$type": "color",
1422
+ "$extensions": {
1423
+ "org.primer.figma": {
1424
+ "collection": "mode",
1425
+ "group": "component (internal)",
1426
+ "scopes": [
1427
+ "bgColor"
1428
+ ]
1429
+ }
1430
+ }
1431
+ },
1432
+ "disabled": {
1433
+ "$value": "{control.bgColor.disabled}",
1434
+ "$type": "color",
1435
+ "$extensions": {
1436
+ "org.primer.figma": {
1437
+ "collection": "mode",
1438
+ "group": "component (internal)",
1439
+ "scopes": [
1440
+ "bgColor"
1441
+ ]
1442
+ }
1443
+ }
1444
+ }
1445
+ },
1446
+ "borderColor": {
1447
+ "hover": {
1448
+ "$value": "{button.default.borderColor.hover}",
1449
+ "$type": "color",
1450
+ "$extensions": {
1451
+ "org.primer.figma": {
1452
+ "collection": "mode",
1453
+ "group": "component (internal)",
1454
+ "scopes": [
1455
+ "borderColor"
1456
+ ]
1457
+ }
1458
+ }
1459
+ },
1460
+ "selected": {
1461
+ "$value": "{button.outline.borderColor.hover}",
1462
+ "$type": "color",
1463
+ "$extensions": {
1464
+ "org.primer.figma": {
1465
+ "collection": "mode",
1466
+ "group": "component (internal)",
1467
+ "scopes": [
1468
+ "borderColor"
1469
+ ]
1470
+ }
1471
+ }
1472
+ }
1473
+ }
1474
+ },
1475
+ "danger": {
1476
+ "fgColor": {
1477
+ "rest": {
1478
+ "$value": "{base.color.red.4}",
1479
+ "$type": "color",
1480
+ "$extensions": {
1481
+ "org.primer.figma": {
1482
+ "collection": "mode",
1483
+ "group": "component (internal)",
1484
+ "scopes": [
1485
+ "fgColor"
1486
+ ]
1487
+ }
1488
+ },
1489
+ "mix": {
1490
+ "color": "{base.color.red.3}",
1491
+ "weight": 0.3
1492
+ }
1493
+ },
1494
+ "hover": {
1495
+ "$value": "{base.color.neutral.13}",
1496
+ "$type": "color",
1497
+ "$extensions": {
1498
+ "org.primer.figma": {
1499
+ "collection": "mode",
1500
+ "group": "component (internal)",
1501
+ "scopes": [
1502
+ "fgColor"
1503
+ ]
1504
+ }
1505
+ }
1506
+ },
1507
+ "active": {
1508
+ "$value": "{base.color.neutral.13}",
1509
+ "$type": "color",
1510
+ "$extensions": {
1511
+ "org.primer.figma": {
1512
+ "collection": "mode",
1513
+ "group": "component (internal)",
1514
+ "scopes": [
1515
+ "fgColor"
1516
+ ]
1517
+ }
1518
+ }
1519
+ },
1520
+ "disabled": {
1521
+ "$value": "{fgColor.danger}",
1522
+ "$type": "color",
1523
+ "$extensions": {
1524
+ "org.primer.figma": {
1525
+ "collection": "mode",
1526
+ "group": "component (internal)",
1527
+ "scopes": [
1528
+ "fgColor"
1529
+ ]
1530
+ }
1531
+ },
1532
+ "alpha": 0.5
1533
+ }
1534
+ },
1535
+ "iconColor": {
1536
+ "rest": {
1537
+ "$value": "{button.danger.fgColor.rest}",
1538
+ "$type": "color",
1539
+ "$extensions": {
1540
+ "org.primer.figma": {
1541
+ "collection": "mode",
1542
+ "group": "component (internal)",
1543
+ "scopes": [
1544
+ "fgColor"
1545
+ ]
1546
+ }
1547
+ }
1548
+ },
1549
+ "hover": {
1550
+ "$value": "{base.color.neutral.13}",
1551
+ "$type": "color",
1552
+ "$extensions": {
1553
+ "org.primer.figma": {
1554
+ "collection": "mode",
1555
+ "group": "component (internal)",
1556
+ "scopes": [
1557
+ "fgColor"
1558
+ ]
1559
+ }
1560
+ }
1561
+ }
1562
+ },
1563
+ "bgColor": {
1564
+ "rest": {
1565
+ "$value": "{control.bgColor.rest}",
1566
+ "$type": "color",
1567
+ "$extensions": {
1568
+ "org.primer.figma": {
1569
+ "collection": "mode",
1570
+ "group": "component (internal)",
1571
+ "scopes": [
1572
+ "bgColor"
1573
+ ]
1574
+ }
1575
+ }
1576
+ },
1577
+ "hover": {
1578
+ "$value": "{base.color.red.6}",
1579
+ "$type": "color",
1580
+ "$extensions": {
1581
+ "org.primer.figma": {
1582
+ "collection": "mode",
1583
+ "group": "component (internal)",
1584
+ "scopes": [
1585
+ "bgColor"
1586
+ ]
1587
+ }
1588
+ }
1589
+ },
1590
+ "active": {
1591
+ "$value": "{base.color.red.6}",
1592
+ "$type": "color",
1593
+ "$extensions": {
1594
+ "org.primer.figma": {
1595
+ "collection": "mode",
1596
+ "group": "component (internal)",
1597
+ "scopes": [
1598
+ "bgColor"
1599
+ ]
1600
+ }
1601
+ },
1602
+ "mix": {
1603
+ "color": "{base.color.red.4}",
1604
+ "weight": 0.4
1605
+ }
1606
+ },
1607
+ "disabled": {
1608
+ "$value": "{control.bgColor.disabled}",
1609
+ "$type": "color",
1610
+ "$extensions": {
1611
+ "org.primer.figma": {
1612
+ "collection": "mode",
1613
+ "group": "component (internal)",
1614
+ "scopes": [
1615
+ "bgColor"
1616
+ ]
1617
+ }
1618
+ }
1619
+ }
1620
+ },
1621
+ "borderColor": {
1622
+ "rest": {
1623
+ "$value": "{control.borderColor.rest}",
1624
+ "$type": "color",
1625
+ "$extensions": {
1626
+ "org.primer.figma": {
1627
+ "collection": "mode",
1628
+ "group": "component (internal)",
1629
+ "scopes": [
1630
+ "borderColor"
1631
+ ]
1632
+ }
1633
+ }
1634
+ },
1635
+ "hover": {
1636
+ "$value": "{button.primary.borderColor.rest}",
1637
+ "$type": "color",
1638
+ "$extensions": {
1639
+ "org.primer.figma": {
1640
+ "collection": "mode",
1641
+ "group": "component (internal)",
1642
+ "scopes": [
1643
+ "borderColor"
1644
+ ]
1645
+ }
1646
+ }
1647
+ },
1648
+ "active": {
1649
+ "$value": "{button.danger.borderColor.hover}",
1650
+ "$type": "color",
1651
+ "$extensions": {
1652
+ "org.primer.figma": {
1653
+ "collection": "mode",
1654
+ "group": "component (internal)",
1655
+ "scopes": [
1656
+ "borderColor"
1657
+ ]
1658
+ }
1659
+ }
1660
+ }
1661
+ }
1662
+ },
1663
+ "inactive": {
1664
+ "fgColor": {
1665
+ "$value": "{base.color.neutral.9}",
1666
+ "$type": "color",
1667
+ "$extensions": {
1668
+ "org.primer.figma": {
1669
+ "collection": "mode",
1670
+ "group": "component (internal)",
1671
+ "scopes": [
1672
+ "fgColor"
1673
+ ]
1674
+ }
1675
+ }
1676
+ },
1677
+ "bgColor": {
1678
+ "$value": "{base.color.neutral.4}",
1679
+ "$type": "color",
1680
+ "$extensions": {
1681
+ "org.primer.figma": {
1682
+ "collection": "mode",
1683
+ "group": "component (internal)",
1684
+ "scopes": [
1685
+ "bgColor"
1686
+ ]
1687
+ }
1688
+ }
1689
+ }
1690
+ },
1691
+ "star": {
1692
+ "iconColor": {
1693
+ "$value": "{base.color.yellow.2}",
1694
+ "$type": "color",
1695
+ "$extensions": {
1696
+ "org.primer.figma": {
1697
+ "collection": "mode",
1698
+ "group": "component (internal)",
1699
+ "scopes": [
1700
+ "bgColor"
1701
+ ]
1702
+ }
1703
+ }
1704
+ }
1705
+ }
1706
+ },
1707
+ "buttonCounter": {
1708
+ "default": {
1709
+ "bgColor": {
1710
+ "rest": {
1711
+ "$value": "{base.color.neutral.6}",
1712
+ "$type": "color",
1713
+ "$extensions": {
1714
+ "org.primer.figma": {
1715
+ "collection": "mode",
1716
+ "group": "component (internal)",
1717
+ "scopes": [
1718
+ "bgColor"
1719
+ ]
1720
+ }
1721
+ }
1722
+ }
1723
+ }
1724
+ },
1725
+ "invisible": {
1726
+ "bgColor": {
1727
+ "rest": {
1728
+ "$value": "{bgColor.neutral.muted}",
1729
+ "$type": "color",
1730
+ "$extensions": {
1731
+ "org.primer.figma": {
1732
+ "collection": "mode",
1733
+ "group": "component (internal)",
1734
+ "scopes": [
1735
+ "bgColor"
1736
+ ]
1737
+ }
1738
+ }
1739
+ }
1740
+ }
1741
+ },
1742
+ "primary": {
1743
+ "bgColor": {
1744
+ "rest": {
1745
+ "$value": "{base.color.green.9}",
1746
+ "$type": "color",
1747
+ "$extensions": {
1748
+ "org.primer.figma": {
1749
+ "collection": "mode",
1750
+ "group": "component (internal)",
1751
+ "scopes": [
1752
+ "bgColor"
1753
+ ]
1754
+ }
1755
+ },
1756
+ "alpha": 0.2
1757
+ }
1758
+ }
1759
+ },
1760
+ "outline": {
1761
+ "bgColor": {
1762
+ "rest": {
1763
+ "$value": "{base.color.blue.9}",
1764
+ "$type": "color",
1765
+ "$extensions": {
1766
+ "org.primer.figma": {
1767
+ "collection": "mode",
1768
+ "group": "component (internal)",
1769
+ "scopes": [
1770
+ "bgColor"
1771
+ ]
1772
+ }
1773
+ },
1774
+ "alpha": 0.2
1775
+ },
1776
+ "hover": {
1777
+ "$value": "{base.color.blue.9}",
1778
+ "$type": "color",
1779
+ "$extensions": {
1780
+ "org.primer.figma": {
1781
+ "collection": "mode",
1782
+ "group": "component (internal)",
1783
+ "scopes": [
1784
+ "bgColor"
1785
+ ]
1786
+ }
1787
+ },
1788
+ "alpha": 0.2
1789
+ },
1790
+ "disabled": {
1791
+ "$value": "{bgColor.accent.emphasis}",
1792
+ "$type": "color",
1793
+ "$extensions": {
1794
+ "org.primer.figma": {
1795
+ "collection": "mode",
1796
+ "group": "component (internal)",
1797
+ "scopes": [
1798
+ "bgColor"
1799
+ ]
1800
+ }
1801
+ },
1802
+ "alpha": 0.05
1803
+ }
1804
+ },
1805
+ "fgColor": {
1806
+ "rest": {
1807
+ "$value": "{base.color.blue.4}",
1808
+ "$type": "color",
1809
+ "$extensions": {
1810
+ "org.primer.figma": {
1811
+ "collection": "mode",
1812
+ "group": "component (internal)",
1813
+ "scopes": [
1814
+ "fgColor"
1815
+ ]
1816
+ }
1817
+ }
1818
+ },
1819
+ "hover": {
1820
+ "$value": "{base.color.blue.3}",
1821
+ "$type": "color",
1822
+ "$extensions": {
1823
+ "org.primer.figma": {
1824
+ "collection": "mode",
1825
+ "group": "component (internal)",
1826
+ "scopes": [
1827
+ "fgColor"
1828
+ ]
1829
+ }
1830
+ }
1831
+ },
1832
+ "disabled": {
1833
+ "$value": "{fgColor.accent}",
1834
+ "$type": "color",
1835
+ "$extensions": {
1836
+ "org.primer.figma": {
1837
+ "collection": "mode",
1838
+ "group": "component (internal)",
1839
+ "scopes": [
1840
+ "fgColor"
1841
+ ]
1842
+ }
1843
+ },
1844
+ "alpha": 0.5
1845
+ }
1846
+ }
1847
+ },
1848
+ "danger": {
1849
+ "bgColor": {
1850
+ "hover": {
1851
+ "$value": "{base.color.neutral.13}",
1852
+ "$type": "color",
1853
+ "$extensions": {
1854
+ "org.primer.figma": {
1855
+ "collection": "mode",
1856
+ "group": "component (internal)",
1857
+ "scopes": [
1858
+ "bgColor"
1859
+ ]
1860
+ }
1861
+ },
1862
+ "alpha": 0.2
1863
+ },
1864
+ "disabled": {
1865
+ "$value": "{bgColor.danger.emphasis}",
1866
+ "$type": "color",
1867
+ "$extensions": {
1868
+ "org.primer.figma": {
1869
+ "collection": "mode",
1870
+ "group": "component (internal)",
1871
+ "scopes": [
1872
+ "bgColor"
1873
+ ]
1874
+ }
1875
+ },
1876
+ "alpha": 0.05
1877
+ },
1878
+ "rest": {
1879
+ "$value": "{base.color.red.9}",
1880
+ "$type": "color",
1881
+ "$extensions": {
1882
+ "org.primer.figma": {
1883
+ "collection": "mode",
1884
+ "group": "component (internal)",
1885
+ "scopes": [
1886
+ "bgColor"
1887
+ ]
1888
+ }
1889
+ },
1890
+ "alpha": 0.2
1891
+ }
1892
+ },
1893
+ "fgColor": {
1894
+ "rest": {
1895
+ "$value": "{fgColor.danger}",
1896
+ "$type": "color",
1897
+ "$extensions": {
1898
+ "org.primer.figma": {
1899
+ "collection": "mode",
1900
+ "group": "component (internal)",
1901
+ "scopes": [
1902
+ "fgColor"
1903
+ ]
1904
+ }
1905
+ }
1906
+ },
1907
+ "hover": {
1908
+ "$value": "{base.color.neutral.13}",
1909
+ "$type": "color",
1910
+ "$extensions": {
1911
+ "org.primer.figma": {
1912
+ "collection": "mode",
1913
+ "group": "component (internal)",
1914
+ "scopes": [
1915
+ "fgColor"
1916
+ ]
1917
+ }
1918
+ }
1919
+ },
1920
+ "disabled": {
1921
+ "$value": "{fgColor.danger}",
1922
+ "$type": "color",
1923
+ "$extensions": {
1924
+ "org.primer.figma": {
1925
+ "collection": "mode",
1926
+ "group": "component (internal)",
1927
+ "scopes": [
1928
+ "fgColor"
1929
+ ]
1930
+ }
1931
+ },
1932
+ "alpha": 0.5
1933
+ }
1934
+ }
1935
+ }
1936
+ },
1937
+ "reactionButton": {
1938
+ "selected": {
1939
+ "bgColor": {
1940
+ "rest": {
1941
+ "$value": "{base.color.blue.4}",
1942
+ "$type": "color",
1943
+ "$extensions": {
1944
+ "org.primer.figma": {
1945
+ "collection": "mode",
1946
+ "group": "component (internal)",
1947
+ "scopes": [
1948
+ "bgColor"
1949
+ ]
1950
+ }
1951
+ },
1952
+ "alpha": 0.2
1953
+ },
1954
+ "hover": {
1955
+ "$value": "{reactionButton.selected.bgColor.rest}",
1956
+ "$type": "color",
1957
+ "$extensions": {
1958
+ "org.primer.figma": {
1959
+ "collection": "mode",
1960
+ "group": "component (internal)",
1961
+ "scopes": [
1962
+ "bgColor"
1963
+ ]
1964
+ }
1965
+ },
1966
+ "mix": {
1967
+ "color": "{base.color.blue.2}",
1968
+ "weight": 0.2
1969
+ },
1970
+ "alpha": 0.2
1971
+ }
1972
+ },
1973
+ "fgColor": {
1974
+ "rest": {
1975
+ "$value": "{fgColor.link}",
1976
+ "$type": "color",
1977
+ "$extensions": {
1978
+ "org.primer.figma": {
1979
+ "collection": "mode",
1980
+ "group": "component (internal)",
1981
+ "scopes": [
1982
+ "fgColor"
1983
+ ]
1984
+ }
1985
+ }
1986
+ },
1987
+ "hover": {
1988
+ "$value": "{base.color.blue.2}",
1989
+ "$type": "color",
1990
+ "$extensions": {
1991
+ "org.primer.figma": {
1992
+ "collection": "mode",
1993
+ "group": "component (internal)",
1994
+ "scopes": [
1995
+ "fgColor"
1996
+ ]
1997
+ }
1998
+ }
1999
+ }
2000
+ }
2001
+ }
2002
+ },
2003
+ "focus": {
2004
+ "outlineColor": {
2005
+ "$value": "{borderColor.accent.emphasis}",
2006
+ "$type": "color",
2007
+ "$extensions": {
2008
+ "org.primer.figma": {
2009
+ "collection": "mode",
2010
+ "group": "component (internal)",
2011
+ "scopes": [
2012
+ "borderColor"
2013
+ ]
2014
+ }
2015
+ }
2016
+ }
2017
+ },
2018
+ "header": {
2019
+ "bgColor": {
2020
+ "$value": "{base.color.neutral.2}",
2021
+ "$type": "color",
2022
+ "$extensions": {
2023
+ "org.primer.figma": {
2024
+ "collection": "mode",
2025
+ "group": "component (internal)",
2026
+ "scopes": [
2027
+ "bgColor"
2028
+ ]
2029
+ }
2030
+ },
2031
+ "alpha": 0.95
2032
+ },
2033
+ "fgColor": {
2034
+ "default": {
2035
+ "$value": "{base.color.neutral.13}",
2036
+ "$type": "color",
2037
+ "$extensions": {
2038
+ "org.primer.figma": {
2039
+ "collection": "mode",
2040
+ "group": "component (internal)",
2041
+ "scopes": [
2042
+ "fgColor"
2043
+ ]
2044
+ }
2045
+ },
2046
+ "alpha": 0.7
2047
+ },
2048
+ "logo": {
2049
+ "$value": "{base.color.neutral.12}",
2050
+ "$type": "color",
2051
+ "$extensions": {
2052
+ "org.primer.figma": {
2053
+ "collection": "mode",
2054
+ "group": "component (internal)",
2055
+ "scopes": [
2056
+ "fgColor"
2057
+ ]
2058
+ }
2059
+ }
2060
+ }
2061
+ },
2062
+ "borderColor": {
2063
+ "divider": {
2064
+ "$value": "{base.color.neutral.8}",
2065
+ "$type": "color",
2066
+ "$extensions": {
2067
+ "org.primer.figma": {
2068
+ "collection": "mode",
2069
+ "group": "component (internal)",
2070
+ "scopes": [
2071
+ "borderColor"
2072
+ ]
2073
+ }
2074
+ }
2075
+ }
2076
+ }
2077
+ },
2078
+ "headerSearch": {
2079
+ "bgColor": {
2080
+ "$value": "{base.color.neutral.1}",
2081
+ "$type": "color",
2082
+ "$extensions": {
2083
+ "org.primer.figma": {
2084
+ "collection": "mode",
2085
+ "group": "component (internal)",
2086
+ "scopes": [
2087
+ "bgColor"
2088
+ ]
2089
+ }
2090
+ }
2091
+ },
2092
+ "borderColor": {
2093
+ "$value": "{base.color.neutral.5}",
2094
+ "$type": "color",
2095
+ "$extensions": {
2096
+ "org.primer.figma": {
2097
+ "collection": "mode",
2098
+ "group": "component (internal)",
2099
+ "scopes": [
2100
+ "borderColor"
2101
+ ]
2102
+ }
2103
+ }
2104
+ }
2105
+ },
2106
+ "menu": {
2107
+ "bgColor": {
2108
+ "active": {
2109
+ "$value": "{base.color.neutral.2}",
2110
+ "$type": "color",
2111
+ "$extensions": {
2112
+ "org.primer.figma": {
2113
+ "collection": "mode",
2114
+ "group": "component (internal)",
2115
+ "scopes": [
2116
+ "bgColor"
2117
+ ]
2118
+ }
2119
+ }
2120
+ }
2121
+ }
2122
+ },
2123
+ "overlay": {
2124
+ "bgColor": {
2125
+ "$value": "{bgColor.muted}",
2126
+ "$type": "color",
2127
+ "$extensions": {
2128
+ "org.primer.figma": {
2129
+ "collection": "mode",
2130
+ "group": "component (internal)",
2131
+ "scopes": [
2132
+ "bgColor"
2133
+ ]
2134
+ }
2135
+ }
2136
+ },
2137
+ "borderColor": {
2138
+ "$value": "{borderColor.muted}",
2139
+ "$type": "color",
2140
+ "$extensions": {
2141
+ "org.primer.figma": {
2142
+ "collection": "mode",
2143
+ "group": "component (internal)"
2144
+ }
2145
+ }
2146
+ },
2147
+ "backdrop": {
2148
+ "bgColor": {
2149
+ "$value": "{base.color.neutral.3}",
2150
+ "$type": "color",
2151
+ "$extensions": {
2152
+ "org.primer.figma": {
2153
+ "collection": "mode",
2154
+ "group": "component (internal)",
2155
+ "scopes": [
2156
+ "bgColor"
2157
+ ]
2158
+ }
2159
+ },
2160
+ "alpha": 0.4
2161
+ }
2162
+ }
2163
+ },
2164
+ "selectMenu": {
2165
+ "borderColor": {
2166
+ "$value": "{borderColor.default}",
2167
+ "$type": "color",
2168
+ "$extensions": {
2169
+ "org.primer.figma": {
2170
+ "collection": "mode",
2171
+ "group": "component (internal)",
2172
+ "scopes": [
2173
+ "borderColor"
2174
+ ]
2175
+ }
2176
+ }
2177
+ },
2178
+ "bgColor": {
2179
+ "active": {
2180
+ "$value": "{base.color.blue.8}",
2181
+ "$type": "color",
2182
+ "$extensions": {
2183
+ "org.primer.figma": {
2184
+ "collection": "mode",
2185
+ "group": "component (internal)",
2186
+ "scopes": [
2187
+ "bgColor"
2188
+ ]
2189
+ }
2190
+ }
2191
+ }
2192
+ }
2193
+ },
2194
+ "sideNav": {
2195
+ "bgColor": {
2196
+ "selected": {
2197
+ "$value": "{base.color.neutral.3}",
2198
+ "$type": "color",
2199
+ "$extensions": {
2200
+ "org.primer.figma": {
2201
+ "collection": "mode",
2202
+ "group": "component (internal)",
2203
+ "scopes": [
2204
+ "bgColor"
2205
+ ]
2206
+ }
2207
+ }
2208
+ }
2209
+ }
2210
+ },
2211
+ "skeletonLoader": {
2212
+ "bgColor": {
2213
+ "$value": "{base.color.neutral.8}",
2214
+ "$type": "color",
2215
+ "$extensions": {
2216
+ "org.primer.figma": {
2217
+ "collection": "mode",
2218
+ "group": "component",
2219
+ "scopes": [
2220
+ "bgColor"
2221
+ ]
2222
+ }
2223
+ },
2224
+ "alpha": 0.2
2225
+ }
2226
+ },
2227
+ "timelineBadge": {
2228
+ "bgColor": {
2229
+ "$value": "{base.color.neutral.3}",
2230
+ "$type": "color",
2231
+ "$extensions": {
2232
+ "org.primer.figma": {
2233
+ "collection": "mode",
2234
+ "group": "component (internal)",
2235
+ "scopes": [
2236
+ "bgColor"
2237
+ ]
2238
+ }
2239
+ }
2240
+ }
2241
+ },
2242
+ "treeViewItem": {
2243
+ "leadingVisual": {
2244
+ "iconColor": {
2245
+ "rest": {
2246
+ "$value": "{fgColor.muted}",
2247
+ "$type": "color",
2248
+ "$extensions": {
2249
+ "org.primer.figma": {
2250
+ "collection": "mode",
2251
+ "group": "component (internal)",
2252
+ "scopes": [
2253
+ "bgColor"
2254
+ ]
2255
+ }
2256
+ }
2257
+ }
2258
+ }
2259
+ }
2260
+ },
2261
+ "underlineNav": {
2262
+ "borderColor": {
2263
+ "active": {
2264
+ "$value": "{base.color.coral.3}",
2265
+ "$type": "color",
2266
+ "$extensions": {
2267
+ "org.primer.figma": {
2268
+ "collection": "mode",
2269
+ "group": "component (internal)",
2270
+ "scopes": [
2271
+ "borderColor"
2272
+ ]
2273
+ }
2274
+ }
2275
+ },
2276
+ "hover": {
2277
+ "$value": "{borderColor.neutral.muted}",
2278
+ "$type": "color",
2279
+ "$extensions": {
2280
+ "org.primer.figma": {
2281
+ "collection": "mode",
2282
+ "group": "component (internal)",
2283
+ "scopes": [
2284
+ "borderColor"
2285
+ ]
2286
+ }
2287
+ }
2288
+ }
2289
+ },
2290
+ "iconColor": {
2291
+ "rest": {
2292
+ "$value": "{fgColor.muted}",
2293
+ "$type": "color",
2294
+ "$extensions": {
2295
+ "org.primer.figma": {
2296
+ "collection": "mode",
2297
+ "group": "component (internal)",
2298
+ "scopes": [
2299
+ "fgColor"
2300
+ ]
2301
+ }
2302
+ }
2303
+ }
2304
+ }
2305
+ },
2306
+ "selection": {
2307
+ "bgColor": {
2308
+ "$value": "{bgColor.accent.emphasis}",
2309
+ "$type": "color",
2310
+ "$extensions": {
2311
+ "org.primer.figma": {
2312
+ "collection": "mode",
2313
+ "group": "component",
2314
+ "scopes": [
2315
+ "bgColor"
2316
+ ]
2317
+ }
2318
+ },
2319
+ "alpha": 0.7
2320
+ }
2321
+ },
2322
+ "card": {
2323
+ "bgColor": {
2324
+ "$value": "{bgColor.muted}",
2325
+ "$type": "color",
2326
+ "$extensions": {
2327
+ "org.primer.figma": {
2328
+ "collection": "mode",
2329
+ "group": "component",
2330
+ "scopes": [
2331
+ "bgColor"
2332
+ ]
2333
+ }
2334
+ }
2335
+ }
2336
+ },
2337
+ "label": {
2338
+ "green": {
2339
+ "bgColor": {
2340
+ "rest": {
2341
+ "$value": "{base.display.color.green.0}",
2342
+ "$type": "color",
2343
+ "$extensions": {
2344
+ "org.primer.figma": {
2345
+ "collection": "mode",
2346
+ "group": "component",
2347
+ "scopes": [
2348
+ "bgColor"
2349
+ ]
2350
+ }
2351
+ }
2352
+ },
2353
+ "hover": {
2354
+ "$value": "{base.display.color.green.1}",
2355
+ "$type": "color",
2356
+ "$extensions": {
2357
+ "org.primer.figma": {
2358
+ "collection": "mode",
2359
+ "group": "component",
2360
+ "scopes": [
2361
+ "bgColor"
2362
+ ]
2363
+ }
2364
+ }
2365
+ },
2366
+ "active": {
2367
+ "$value": "{base.display.color.green.2}",
2368
+ "$type": "color",
2369
+ "$extensions": {
2370
+ "org.primer.figma": {
2371
+ "collection": "mode",
2372
+ "group": "component",
2373
+ "scopes": [
2374
+ "bgColor"
2375
+ ]
2376
+ }
2377
+ }
2378
+ }
2379
+ },
2380
+ "fgColor": {
2381
+ "rest": {
2382
+ "$value": "{base.display.color.green.6}",
2383
+ "$type": "color",
2384
+ "$extensions": {
2385
+ "org.primer.figma": {
2386
+ "collection": "mode",
2387
+ "group": "component",
2388
+ "scopes": [
2389
+ "fgColor"
2390
+ ]
2391
+ }
2392
+ }
2393
+ },
2394
+ "hover": {
2395
+ "$value": "{base.display.color.green.7}",
2396
+ "$type": "color",
2397
+ "$extensions": {
2398
+ "org.primer.figma": {
2399
+ "collection": "mode",
2400
+ "group": "component",
2401
+ "scopes": [
2402
+ "fgColor"
2403
+ ]
2404
+ }
2405
+ }
2406
+ },
2407
+ "active": {
2408
+ "$value": "{base.display.color.green.8}",
2409
+ "$type": "color",
2410
+ "$extensions": {
2411
+ "org.primer.figma": {
2412
+ "collection": "mode",
2413
+ "group": "component",
2414
+ "scopes": [
2415
+ "fgColor"
2416
+ ]
2417
+ }
2418
+ }
2419
+ }
2420
+ }
2421
+ },
2422
+ "orange": {
2423
+ "bgColor": {
2424
+ "rest": {
2425
+ "$value": "{base.display.color.orange.0}",
2426
+ "$type": "color",
2427
+ "$extensions": {
2428
+ "org.primer.figma": {
2429
+ "collection": "mode",
2430
+ "group": "component",
2431
+ "scopes": [
2432
+ "bgColor"
2433
+ ]
2434
+ }
2435
+ }
2436
+ },
2437
+ "hover": {
2438
+ "$value": "{base.display.color.orange.1}",
2439
+ "$type": "color",
2440
+ "$extensions": {
2441
+ "org.primer.figma": {
2442
+ "collection": "mode",
2443
+ "group": "component",
2444
+ "scopes": [
2445
+ "bgColor"
2446
+ ]
2447
+ }
2448
+ }
2449
+ },
2450
+ "active": {
2451
+ "$value": "{base.display.color.orange.2}",
2452
+ "$type": "color",
2453
+ "$extensions": {
2454
+ "org.primer.figma": {
2455
+ "collection": "mode",
2456
+ "group": "component",
2457
+ "scopes": [
2458
+ "bgColor"
2459
+ ]
2460
+ }
2461
+ }
2462
+ }
2463
+ },
2464
+ "fgColor": {
2465
+ "rest": {
2466
+ "$value": "{base.display.color.orange.6}",
2467
+ "$type": "color",
2468
+ "$extensions": {
2469
+ "org.primer.figma": {
2470
+ "collection": "mode",
2471
+ "group": "component",
2472
+ "scopes": [
2473
+ "fgColor"
2474
+ ]
2475
+ }
2476
+ }
2477
+ },
2478
+ "hover": {
2479
+ "$value": "{base.display.color.orange.7}",
2480
+ "$type": "color",
2481
+ "$extensions": {
2482
+ "org.primer.figma": {
2483
+ "collection": "mode",
2484
+ "group": "component",
2485
+ "scopes": [
2486
+ "fgColor"
2487
+ ]
2488
+ }
2489
+ }
2490
+ },
2491
+ "active": {
2492
+ "$value": "{base.display.color.orange.8}",
2493
+ "$type": "color",
2494
+ "$extensions": {
2495
+ "org.primer.figma": {
2496
+ "collection": "mode",
2497
+ "group": "component",
2498
+ "scopes": [
2499
+ "fgColor"
2500
+ ]
2501
+ }
2502
+ }
2503
+ }
2504
+ }
2505
+ },
2506
+ "purple": {
2507
+ "bgColor": {
2508
+ "rest": {
2509
+ "$value": "{base.display.color.purple.0}",
2510
+ "$type": "color",
2511
+ "$extensions": {
2512
+ "org.primer.figma": {
2513
+ "collection": "mode",
2514
+ "group": "component",
2515
+ "scopes": [
2516
+ "bgColor"
2517
+ ]
2518
+ }
2519
+ }
2520
+ },
2521
+ "hover": {
2522
+ "$value": "{base.display.color.purple.1}",
2523
+ "$type": "color",
2524
+ "$extensions": {
2525
+ "org.primer.figma": {
2526
+ "collection": "mode",
2527
+ "group": "component",
2528
+ "scopes": [
2529
+ "bgColor"
2530
+ ]
2531
+ }
2532
+ }
2533
+ },
2534
+ "active": {
2535
+ "$value": "{base.display.color.purple.2}",
2536
+ "$type": "color",
2537
+ "$extensions": {
2538
+ "org.primer.figma": {
2539
+ "collection": "mode",
2540
+ "group": "component",
2541
+ "scopes": [
2542
+ "bgColor"
2543
+ ]
2544
+ }
2545
+ }
2546
+ }
2547
+ },
2548
+ "fgColor": {
2549
+ "rest": {
2550
+ "$value": "{base.display.color.purple.6}",
2551
+ "$type": "color",
2552
+ "$extensions": {
2553
+ "org.primer.figma": {
2554
+ "collection": "mode",
2555
+ "group": "component",
2556
+ "scopes": [
2557
+ "fgColor"
2558
+ ]
2559
+ }
2560
+ }
2561
+ },
2562
+ "hover": {
2563
+ "$value": "{base.display.color.purple.7}",
2564
+ "$type": "color",
2565
+ "$extensions": {
2566
+ "org.primer.figma": {
2567
+ "collection": "mode",
2568
+ "group": "component",
2569
+ "scopes": [
2570
+ "fgColor"
2571
+ ]
2572
+ }
2573
+ }
2574
+ },
2575
+ "active": {
2576
+ "$value": "{base.display.color.purple.8}",
2577
+ "$type": "color",
2578
+ "$extensions": {
2579
+ "org.primer.figma": {
2580
+ "collection": "mode",
2581
+ "group": "component",
2582
+ "scopes": [
2583
+ "fgColor"
2584
+ ]
2585
+ }
2586
+ }
2587
+ }
2588
+ }
2589
+ },
2590
+ "red": {
2591
+ "bgColor": {
2592
+ "rest": {
2593
+ "$value": "{base.display.color.red.0}",
2594
+ "$type": "color",
2595
+ "$extensions": {
2596
+ "org.primer.figma": {
2597
+ "collection": "mode",
2598
+ "group": "component",
2599
+ "scopes": [
2600
+ "bgColor"
2601
+ ]
2602
+ }
2603
+ }
2604
+ },
2605
+ "hover": {
2606
+ "$value": "{base.display.color.red.1}",
2607
+ "$type": "color",
2608
+ "$extensions": {
2609
+ "org.primer.figma": {
2610
+ "collection": "mode",
2611
+ "group": "component",
2612
+ "scopes": [
2613
+ "bgColor"
2614
+ ]
2615
+ }
2616
+ }
2617
+ },
2618
+ "active": {
2619
+ "$value": "{base.display.color.red.2}",
2620
+ "$type": "color",
2621
+ "$extensions": {
2622
+ "org.primer.figma": {
2623
+ "collection": "mode",
2624
+ "group": "component",
2625
+ "scopes": [
2626
+ "bgColor"
2627
+ ]
2628
+ }
2629
+ }
2630
+ }
2631
+ },
2632
+ "fgColor": {
2633
+ "rest": {
2634
+ "$value": "{base.display.color.red.6}",
2635
+ "$type": "color",
2636
+ "$extensions": {
2637
+ "org.primer.figma": {
2638
+ "collection": "mode",
2639
+ "group": "component",
2640
+ "scopes": [
2641
+ "fgColor"
2642
+ ]
2643
+ }
2644
+ }
2645
+ },
2646
+ "hover": {
2647
+ "$value": "{base.display.color.red.7}",
2648
+ "$type": "color",
2649
+ "$extensions": {
2650
+ "org.primer.figma": {
2651
+ "collection": "mode",
2652
+ "group": "component",
2653
+ "scopes": [
2654
+ "fgColor"
2655
+ ]
2656
+ }
2657
+ }
2658
+ },
2659
+ "active": {
2660
+ "$value": "{base.display.color.red.8}",
2661
+ "$type": "color",
2662
+ "$extensions": {
2663
+ "org.primer.figma": {
2664
+ "collection": "mode",
2665
+ "group": "component",
2666
+ "scopes": [
2667
+ "fgColor"
2668
+ ]
2669
+ }
2670
+ }
2671
+ }
2672
+ }
2673
+ },
2674
+ "yellow": {
2675
+ "bgColor": {
2676
+ "rest": {
2677
+ "$value": "{base.display.color.yellow.0}",
2678
+ "$type": "color",
2679
+ "$extensions": {
2680
+ "org.primer.figma": {
2681
+ "collection": "mode",
2682
+ "group": "component",
2683
+ "scopes": [
2684
+ "bgColor"
2685
+ ]
2686
+ }
2687
+ }
2688
+ },
2689
+ "hover": {
2690
+ "$value": "{base.display.color.yellow.1}",
2691
+ "$type": "color",
2692
+ "$extensions": {
2693
+ "org.primer.figma": {
2694
+ "collection": "mode",
2695
+ "group": "component",
2696
+ "scopes": [
2697
+ "bgColor"
2698
+ ]
2699
+ }
2700
+ }
2701
+ },
2702
+ "active": {
2703
+ "$value": "{base.display.color.yellow.2}",
2704
+ "$type": "color",
2705
+ "$extensions": {
2706
+ "org.primer.figma": {
2707
+ "collection": "mode",
2708
+ "group": "component",
2709
+ "scopes": [
2710
+ "bgColor"
2711
+ ]
2712
+ }
2713
+ }
2714
+ }
2715
+ },
2716
+ "fgColor": {
2717
+ "rest": {
2718
+ "$value": "{base.display.color.yellow.6}",
2719
+ "$type": "color",
2720
+ "$extensions": {
2721
+ "org.primer.figma": {
2722
+ "collection": "mode",
2723
+ "group": "component",
2724
+ "scopes": [
2725
+ "fgColor"
2726
+ ]
2727
+ }
2728
+ }
2729
+ },
2730
+ "hover": {
2731
+ "$value": "{base.display.color.yellow.7}",
2732
+ "$type": "color",
2733
+ "$extensions": {
2734
+ "org.primer.figma": {
2735
+ "collection": "mode",
2736
+ "group": "component",
2737
+ "scopes": [
2738
+ "fgColor"
2739
+ ]
2740
+ }
2741
+ }
2742
+ },
2743
+ "active": {
2744
+ "$value": "{base.display.color.yellow.8}",
2745
+ "$type": "color",
2746
+ "$extensions": {
2747
+ "org.primer.figma": {
2748
+ "collection": "mode",
2749
+ "group": "component",
2750
+ "scopes": [
2751
+ "fgColor"
2752
+ ]
2753
+ }
2754
+ }
2755
+ }
2756
+ }
2757
+ },
2758
+ "gray": {
2759
+ "bgColor": {
2760
+ "rest": {
2761
+ "$value": "{base.display.color.gray.0}",
2762
+ "$type": "color",
2763
+ "$extensions": {
2764
+ "org.primer.figma": {
2765
+ "collection": "mode",
2766
+ "group": "component",
2767
+ "scopes": [
2768
+ "bgColor"
2769
+ ]
2770
+ }
2771
+ }
2772
+ },
2773
+ "hover": {
2774
+ "$value": "{base.display.color.gray.1}",
2775
+ "$type": "color",
2776
+ "$extensions": {
2777
+ "org.primer.figma": {
2778
+ "collection": "mode",
2779
+ "group": "component",
2780
+ "scopes": [
2781
+ "bgColor"
2782
+ ]
2783
+ }
2784
+ }
2785
+ },
2786
+ "active": {
2787
+ "$value": "{base.display.color.gray.2}",
2788
+ "$type": "color",
2789
+ "$extensions": {
2790
+ "org.primer.figma": {
2791
+ "collection": "mode",
2792
+ "group": "component",
2793
+ "scopes": [
2794
+ "bgColor"
2795
+ ]
2796
+ }
2797
+ }
2798
+ }
2799
+ },
2800
+ "fgColor": {
2801
+ "rest": {
2802
+ "$value": "{base.display.color.gray.6}",
2803
+ "$type": "color",
2804
+ "$extensions": {
2805
+ "org.primer.figma": {
2806
+ "collection": "mode",
2807
+ "group": "component",
2808
+ "scopes": [
2809
+ "fgColor"
2810
+ ]
2811
+ }
2812
+ }
2813
+ },
2814
+ "hover": {
2815
+ "$value": "{base.display.color.gray.7}",
2816
+ "$type": "color",
2817
+ "$extensions": {
2818
+ "org.primer.figma": {
2819
+ "collection": "mode",
2820
+ "group": "component",
2821
+ "scopes": [
2822
+ "fgColor"
2823
+ ]
2824
+ }
2825
+ }
2826
+ },
2827
+ "active": {
2828
+ "$value": "{base.display.color.gray.8}",
2829
+ "$type": "color",
2830
+ "$extensions": {
2831
+ "org.primer.figma": {
2832
+ "collection": "mode",
2833
+ "group": "component",
2834
+ "scopes": [
2835
+ "fgColor"
2836
+ ]
2837
+ }
2838
+ }
2839
+ }
2840
+ }
2841
+ },
2842
+ "auburn": {
2843
+ "bgColor": {
2844
+ "rest": {
2845
+ "$value": "{base.display.color.auburn.0}",
2846
+ "$type": "color",
2847
+ "$extensions": {
2848
+ "org.primer.figma": {
2849
+ "collection": "mode",
2850
+ "group": "component",
2851
+ "scopes": [
2852
+ "bgColor"
2853
+ ]
2854
+ }
2855
+ }
2856
+ },
2857
+ "hover": {
2858
+ "$value": "{base.display.color.auburn.1}",
2859
+ "$type": "color",
2860
+ "$extensions": {
2861
+ "org.primer.figma": {
2862
+ "collection": "mode",
2863
+ "group": "component",
2864
+ "scopes": [
2865
+ "bgColor"
2866
+ ]
2867
+ }
2868
+ }
2869
+ },
2870
+ "active": {
2871
+ "$value": "{base.display.color.auburn.2}",
2872
+ "$type": "color",
2873
+ "$extensions": {
2874
+ "org.primer.figma": {
2875
+ "collection": "mode",
2876
+ "group": "component",
2877
+ "scopes": [
2878
+ "bgColor"
2879
+ ]
2880
+ }
2881
+ }
2882
+ }
2883
+ },
2884
+ "fgColor": {
2885
+ "rest": {
2886
+ "$value": "{base.display.color.auburn.6}",
2887
+ "$type": "color",
2888
+ "$extensions": {
2889
+ "org.primer.figma": {
2890
+ "collection": "mode",
2891
+ "group": "component",
2892
+ "scopes": [
2893
+ "fgColor"
2894
+ ]
2895
+ }
2896
+ }
2897
+ },
2898
+ "hover": {
2899
+ "$value": "{base.display.color.auburn.7}",
2900
+ "$type": "color",
2901
+ "$extensions": {
2902
+ "org.primer.figma": {
2903
+ "collection": "mode",
2904
+ "group": "component",
2905
+ "scopes": [
2906
+ "fgColor"
2907
+ ]
2908
+ }
2909
+ }
2910
+ },
2911
+ "active": {
2912
+ "$value": "{base.display.color.auburn.8}",
2913
+ "$type": "color",
2914
+ "$extensions": {
2915
+ "org.primer.figma": {
2916
+ "collection": "mode",
2917
+ "group": "component",
2918
+ "scopes": [
2919
+ "fgColor"
2920
+ ]
2921
+ }
2922
+ }
2923
+ }
2924
+ }
2925
+ },
2926
+ "brown": {
2927
+ "bgColor": {
2928
+ "rest": {
2929
+ "$value": "{base.display.color.brown.0}",
2930
+ "$type": "color",
2931
+ "$extensions": {
2932
+ "org.primer.figma": {
2933
+ "collection": "mode",
2934
+ "group": "component",
2935
+ "scopes": [
2936
+ "bgColor"
2937
+ ]
2938
+ }
2939
+ }
2940
+ },
2941
+ "hover": {
2942
+ "$value": "{base.display.color.brown.1}",
2943
+ "$type": "color",
2944
+ "$extensions": {
2945
+ "org.primer.figma": {
2946
+ "collection": "mode",
2947
+ "group": "component",
2948
+ "scopes": [
2949
+ "bgColor"
2950
+ ]
2951
+ }
2952
+ }
2953
+ },
2954
+ "active": {
2955
+ "$value": "{base.display.color.brown.2}",
2956
+ "$type": "color",
2957
+ "$extensions": {
2958
+ "org.primer.figma": {
2959
+ "collection": "mode",
2960
+ "group": "component",
2961
+ "scopes": [
2962
+ "bgColor"
2963
+ ]
2964
+ }
2965
+ }
2966
+ }
2967
+ },
2968
+ "fgColor": {
2969
+ "rest": {
2970
+ "$value": "{base.display.color.brown.6}",
2971
+ "$type": "color",
2972
+ "$extensions": {
2973
+ "org.primer.figma": {
2974
+ "collection": "mode",
2975
+ "group": "component",
2976
+ "scopes": [
2977
+ "fgColor"
2978
+ ]
2979
+ }
2980
+ }
2981
+ },
2982
+ "hover": {
2983
+ "$value": "{base.display.color.brown.7}",
2984
+ "$type": "color",
2985
+ "$extensions": {
2986
+ "org.primer.figma": {
2987
+ "collection": "mode",
2988
+ "group": "component",
2989
+ "scopes": [
2990
+ "fgColor"
2991
+ ]
2992
+ }
2993
+ }
2994
+ },
2995
+ "active": {
2996
+ "$value": "{base.display.color.brown.8}",
2997
+ "$type": "color",
2998
+ "$extensions": {
2999
+ "org.primer.figma": {
3000
+ "collection": "mode",
3001
+ "group": "component",
3002
+ "scopes": [
3003
+ "fgColor"
3004
+ ]
3005
+ }
3006
+ }
3007
+ }
3008
+ }
3009
+ },
3010
+ "lemon": {
3011
+ "bgColor": {
3012
+ "rest": {
3013
+ "$value": "{base.display.color.lemon.0}",
3014
+ "$type": "color",
3015
+ "$extensions": {
3016
+ "org.primer.figma": {
3017
+ "collection": "mode",
3018
+ "group": "component",
3019
+ "scopes": [
3020
+ "bgColor"
3021
+ ]
3022
+ }
3023
+ }
3024
+ },
3025
+ "hover": {
3026
+ "$value": "{base.display.color.lemon.1}",
3027
+ "$type": "color",
3028
+ "$extensions": {
3029
+ "org.primer.figma": {
3030
+ "collection": "mode",
3031
+ "group": "component",
3032
+ "scopes": [
3033
+ "bgColor"
3034
+ ]
3035
+ }
3036
+ }
3037
+ },
3038
+ "active": {
3039
+ "$value": "{base.display.color.lemon.2}",
3040
+ "$type": "color",
3041
+ "$extensions": {
3042
+ "org.primer.figma": {
3043
+ "collection": "mode",
3044
+ "group": "component",
3045
+ "scopes": [
3046
+ "bgColor"
3047
+ ]
3048
+ }
3049
+ }
3050
+ }
3051
+ },
3052
+ "fgColor": {
3053
+ "rest": {
3054
+ "$value": "{base.display.color.lemon.6}",
3055
+ "$type": "color",
3056
+ "$extensions": {
3057
+ "org.primer.figma": {
3058
+ "collection": "mode",
3059
+ "group": "component",
3060
+ "scopes": [
3061
+ "fgColor"
3062
+ ]
3063
+ }
3064
+ }
3065
+ },
3066
+ "hover": {
3067
+ "$value": "{base.display.color.lemon.7}",
3068
+ "$type": "color",
3069
+ "$extensions": {
3070
+ "org.primer.figma": {
3071
+ "collection": "mode",
3072
+ "group": "component",
3073
+ "scopes": [
3074
+ "fgColor"
3075
+ ]
3076
+ }
3077
+ }
3078
+ },
3079
+ "active": {
3080
+ "$value": "{base.display.color.lemon.8}",
3081
+ "$type": "color",
3082
+ "$extensions": {
3083
+ "org.primer.figma": {
3084
+ "collection": "mode",
3085
+ "group": "component",
3086
+ "scopes": [
3087
+ "fgColor"
3088
+ ]
3089
+ }
3090
+ }
3091
+ }
3092
+ }
3093
+ },
3094
+ "olive": {
3095
+ "bgColor": {
3096
+ "rest": {
3097
+ "$value": "{base.display.color.olive.0}",
3098
+ "$type": "color",
3099
+ "$extensions": {
3100
+ "org.primer.figma": {
3101
+ "collection": "mode",
3102
+ "group": "component",
3103
+ "scopes": [
3104
+ "bgColor"
3105
+ ]
3106
+ }
3107
+ }
3108
+ },
3109
+ "hover": {
3110
+ "$value": "{base.display.color.olive.1}",
3111
+ "$type": "color",
3112
+ "$extensions": {
3113
+ "org.primer.figma": {
3114
+ "collection": "mode",
3115
+ "group": "component",
3116
+ "scopes": [
3117
+ "bgColor"
3118
+ ]
3119
+ }
3120
+ }
3121
+ },
3122
+ "active": {
3123
+ "$value": "{base.display.color.olive.2}",
3124
+ "$type": "color",
3125
+ "$extensions": {
3126
+ "org.primer.figma": {
3127
+ "collection": "mode",
3128
+ "group": "component",
3129
+ "scopes": [
3130
+ "bgColor"
3131
+ ]
3132
+ }
3133
+ }
3134
+ }
3135
+ },
3136
+ "fgColor": {
3137
+ "rest": {
3138
+ "$value": "{base.display.color.olive.6}",
3139
+ "$type": "color",
3140
+ "$extensions": {
3141
+ "org.primer.figma": {
3142
+ "collection": "mode",
3143
+ "group": "component",
3144
+ "scopes": [
3145
+ "fgColor"
3146
+ ]
3147
+ }
3148
+ }
3149
+ },
3150
+ "hover": {
3151
+ "$value": "{base.display.color.olive.7}",
3152
+ "$type": "color",
3153
+ "$extensions": {
3154
+ "org.primer.figma": {
3155
+ "collection": "mode",
3156
+ "group": "component",
3157
+ "scopes": [
3158
+ "fgColor"
3159
+ ]
3160
+ }
3161
+ }
3162
+ },
3163
+ "active": {
3164
+ "$value": "{base.display.color.olive.8}",
3165
+ "$type": "color",
3166
+ "$extensions": {
3167
+ "org.primer.figma": {
3168
+ "collection": "mode",
3169
+ "group": "component",
3170
+ "scopes": [
3171
+ "fgColor"
3172
+ ]
3173
+ }
3174
+ }
3175
+ }
3176
+ }
3177
+ },
3178
+ "lime": {
3179
+ "bgColor": {
3180
+ "rest": {
3181
+ "$value": "{base.display.color.lime.0}",
3182
+ "$type": "color",
3183
+ "$extensions": {
3184
+ "org.primer.figma": {
3185
+ "collection": "mode",
3186
+ "group": "component",
3187
+ "scopes": [
3188
+ "bgColor"
3189
+ ]
3190
+ }
3191
+ }
3192
+ },
3193
+ "hover": {
3194
+ "$value": "{base.display.color.lime.1}",
3195
+ "$type": "color",
3196
+ "$extensions": {
3197
+ "org.primer.figma": {
3198
+ "collection": "mode",
3199
+ "group": "component",
3200
+ "scopes": [
3201
+ "bgColor"
3202
+ ]
3203
+ }
3204
+ }
3205
+ },
3206
+ "active": {
3207
+ "$value": "{base.display.color.lime.2}",
3208
+ "$type": "color",
3209
+ "$extensions": {
3210
+ "org.primer.figma": {
3211
+ "collection": "mode",
3212
+ "group": "component",
3213
+ "scopes": [
3214
+ "bgColor"
3215
+ ]
3216
+ }
3217
+ }
3218
+ }
3219
+ },
3220
+ "fgColor": {
3221
+ "rest": {
3222
+ "$value": "{base.display.color.lime.6}",
3223
+ "$type": "color",
3224
+ "$extensions": {
3225
+ "org.primer.figma": {
3226
+ "collection": "mode",
3227
+ "group": "component",
3228
+ "scopes": [
3229
+ "fgColor"
3230
+ ]
3231
+ }
3232
+ }
3233
+ },
3234
+ "hover": {
3235
+ "$value": "{base.display.color.lime.7}",
3236
+ "$type": "color",
3237
+ "$extensions": {
3238
+ "org.primer.figma": {
3239
+ "collection": "mode",
3240
+ "group": "component",
3241
+ "scopes": [
3242
+ "fgColor"
3243
+ ]
3244
+ }
3245
+ }
3246
+ },
3247
+ "active": {
3248
+ "$value": "{base.display.color.lime.8}",
3249
+ "$type": "color",
3250
+ "$extensions": {
3251
+ "org.primer.figma": {
3252
+ "collection": "mode",
3253
+ "group": "component",
3254
+ "scopes": [
3255
+ "fgColor"
3256
+ ]
3257
+ }
3258
+ }
3259
+ }
3260
+ }
3261
+ },
3262
+ "pine": {
3263
+ "bgColor": {
3264
+ "rest": {
3265
+ "$value": "{base.display.color.pine.0}",
3266
+ "$type": "color",
3267
+ "$extensions": {
3268
+ "org.primer.figma": {
3269
+ "collection": "mode",
3270
+ "group": "component",
3271
+ "scopes": [
3272
+ "bgColor"
3273
+ ]
3274
+ }
3275
+ }
3276
+ },
3277
+ "hover": {
3278
+ "$value": "{base.display.color.pine.1}",
3279
+ "$type": "color",
3280
+ "$extensions": {
3281
+ "org.primer.figma": {
3282
+ "collection": "mode",
3283
+ "group": "component",
3284
+ "scopes": [
3285
+ "bgColor"
3286
+ ]
3287
+ }
3288
+ }
3289
+ },
3290
+ "active": {
3291
+ "$value": "{base.display.color.pine.2}",
3292
+ "$type": "color",
3293
+ "$extensions": {
3294
+ "org.primer.figma": {
3295
+ "collection": "mode",
3296
+ "group": "component",
3297
+ "scopes": [
3298
+ "bgColor"
3299
+ ]
3300
+ }
3301
+ }
3302
+ }
3303
+ },
3304
+ "fgColor": {
3305
+ "rest": {
3306
+ "$value": "{base.display.color.pine.6}",
3307
+ "$type": "color",
3308
+ "$extensions": {
3309
+ "org.primer.figma": {
3310
+ "collection": "mode",
3311
+ "group": "component",
3312
+ "scopes": [
3313
+ "fgColor"
3314
+ ]
3315
+ }
3316
+ }
3317
+ },
3318
+ "hover": {
3319
+ "$value": "{base.display.color.pine.7}",
3320
+ "$type": "color",
3321
+ "$extensions": {
3322
+ "org.primer.figma": {
3323
+ "collection": "mode",
3324
+ "group": "component",
3325
+ "scopes": [
3326
+ "fgColor"
3327
+ ]
3328
+ }
3329
+ }
3330
+ },
3331
+ "active": {
3332
+ "$value": "{base.display.color.pine.8}",
3333
+ "$type": "color",
3334
+ "$extensions": {
3335
+ "org.primer.figma": {
3336
+ "collection": "mode",
3337
+ "group": "component",
3338
+ "scopes": [
3339
+ "fgColor"
3340
+ ]
3341
+ }
3342
+ }
3343
+ }
3344
+ }
3345
+ },
3346
+ "teal": {
3347
+ "bgColor": {
3348
+ "rest": {
3349
+ "$value": "{base.display.color.teal.0}",
3350
+ "$type": "color",
3351
+ "$extensions": {
3352
+ "org.primer.figma": {
3353
+ "collection": "mode",
3354
+ "group": "component",
3355
+ "scopes": [
3356
+ "bgColor"
3357
+ ]
3358
+ }
3359
+ }
3360
+ },
3361
+ "hover": {
3362
+ "$value": "{base.display.color.teal.1}",
3363
+ "$type": "color",
3364
+ "$extensions": {
3365
+ "org.primer.figma": {
3366
+ "collection": "mode",
3367
+ "group": "component",
3368
+ "scopes": [
3369
+ "bgColor"
3370
+ ]
3371
+ }
3372
+ }
3373
+ },
3374
+ "active": {
3375
+ "$value": "{base.display.color.teal.2}",
3376
+ "$type": "color",
3377
+ "$extensions": {
3378
+ "org.primer.figma": {
3379
+ "collection": "mode",
3380
+ "group": "component",
3381
+ "scopes": [
3382
+ "bgColor"
3383
+ ]
3384
+ }
3385
+ }
3386
+ }
3387
+ },
3388
+ "fgColor": {
3389
+ "rest": {
3390
+ "$value": "{base.display.color.teal.6}",
3391
+ "$type": "color",
3392
+ "$extensions": {
3393
+ "org.primer.figma": {
3394
+ "collection": "mode",
3395
+ "group": "component",
3396
+ "scopes": [
3397
+ "fgColor"
3398
+ ]
3399
+ }
3400
+ }
3401
+ },
3402
+ "hover": {
3403
+ "$value": "{base.display.color.teal.7}",
3404
+ "$type": "color",
3405
+ "$extensions": {
3406
+ "org.primer.figma": {
3407
+ "collection": "mode",
3408
+ "group": "component",
3409
+ "scopes": [
3410
+ "fgColor"
3411
+ ]
3412
+ }
3413
+ }
3414
+ },
3415
+ "active": {
3416
+ "$value": "{base.display.color.teal.8}",
3417
+ "$type": "color",
3418
+ "$extensions": {
3419
+ "org.primer.figma": {
3420
+ "collection": "mode",
3421
+ "group": "component",
3422
+ "scopes": [
3423
+ "fgColor"
3424
+ ]
3425
+ }
3426
+ }
3427
+ }
3428
+ }
3429
+ },
3430
+ "cyan": {
3431
+ "bgColor": {
3432
+ "rest": {
3433
+ "$value": "{base.display.color.cyan.0}",
3434
+ "$type": "color",
3435
+ "$extensions": {
3436
+ "org.primer.figma": {
3437
+ "collection": "mode",
3438
+ "group": "component",
3439
+ "scopes": [
3440
+ "bgColor"
3441
+ ]
3442
+ }
3443
+ }
3444
+ },
3445
+ "hover": {
3446
+ "$value": "{base.display.color.cyan.1}",
3447
+ "$type": "color",
3448
+ "$extensions": {
3449
+ "org.primer.figma": {
3450
+ "collection": "mode",
3451
+ "group": "component",
3452
+ "scopes": [
3453
+ "bgColor"
3454
+ ]
3455
+ }
3456
+ }
3457
+ },
3458
+ "active": {
3459
+ "$value": "{base.display.color.cyan.2}",
3460
+ "$type": "color",
3461
+ "$extensions": {
3462
+ "org.primer.figma": {
3463
+ "collection": "mode",
3464
+ "group": "component",
3465
+ "scopes": [
3466
+ "bgColor"
3467
+ ]
3468
+ }
3469
+ }
3470
+ }
3471
+ },
3472
+ "fgColor": {
3473
+ "rest": {
3474
+ "$value": "{base.display.color.cyan.6}",
3475
+ "$type": "color",
3476
+ "$extensions": {
3477
+ "org.primer.figma": {
3478
+ "collection": "mode",
3479
+ "group": "component",
3480
+ "scopes": [
3481
+ "fgColor"
3482
+ ]
3483
+ }
3484
+ }
3485
+ },
3486
+ "hover": {
3487
+ "$value": "{base.display.color.cyan.7}",
3488
+ "$type": "color",
3489
+ "$extensions": {
3490
+ "org.primer.figma": {
3491
+ "collection": "mode",
3492
+ "group": "component",
3493
+ "scopes": [
3494
+ "fgColor"
3495
+ ]
3496
+ }
3497
+ }
3498
+ },
3499
+ "active": {
3500
+ "$value": "{base.display.color.cyan.8}",
3501
+ "$type": "color",
3502
+ "$extensions": {
3503
+ "org.primer.figma": {
3504
+ "collection": "mode",
3505
+ "group": "component",
3506
+ "scopes": [
3507
+ "fgColor"
3508
+ ]
3509
+ }
3510
+ }
3511
+ }
3512
+ }
3513
+ },
3514
+ "indigo": {
3515
+ "bgColor": {
3516
+ "rest": {
3517
+ "$value": "{base.display.color.indigo.0}",
3518
+ "$type": "color",
3519
+ "$extensions": {
3520
+ "org.primer.figma": {
3521
+ "collection": "mode",
3522
+ "group": "component",
3523
+ "scopes": [
3524
+ "bgColor"
3525
+ ]
3526
+ }
3527
+ }
3528
+ },
3529
+ "hover": {
3530
+ "$value": "{base.display.color.indigo.1}",
3531
+ "$type": "color",
3532
+ "$extensions": {
3533
+ "org.primer.figma": {
3534
+ "collection": "mode",
3535
+ "group": "component",
3536
+ "scopes": [
3537
+ "bgColor"
3538
+ ]
3539
+ }
3540
+ }
3541
+ },
3542
+ "active": {
3543
+ "$value": "{base.display.color.indigo.2}",
3544
+ "$type": "color",
3545
+ "$extensions": {
3546
+ "org.primer.figma": {
3547
+ "collection": "mode",
3548
+ "group": "component",
3549
+ "scopes": [
3550
+ "bgColor"
3551
+ ]
3552
+ }
3553
+ }
3554
+ }
3555
+ },
3556
+ "fgColor": {
3557
+ "rest": {
3558
+ "$value": "{base.display.color.indigo.6}",
3559
+ "$type": "color",
3560
+ "$extensions": {
3561
+ "org.primer.figma": {
3562
+ "collection": "mode",
3563
+ "group": "component",
3564
+ "scopes": [
3565
+ "fgColor"
3566
+ ]
3567
+ }
3568
+ }
3569
+ },
3570
+ "hover": {
3571
+ "$value": "{base.display.color.indigo.7}",
3572
+ "$type": "color",
3573
+ "$extensions": {
3574
+ "org.primer.figma": {
3575
+ "collection": "mode",
3576
+ "group": "component",
3577
+ "scopes": [
3578
+ "fgColor"
3579
+ ]
3580
+ }
3581
+ }
3582
+ },
3583
+ "active": {
3584
+ "$value": "{base.display.color.indigo.8}",
3585
+ "$type": "color",
3586
+ "$extensions": {
3587
+ "org.primer.figma": {
3588
+ "collection": "mode",
3589
+ "group": "component",
3590
+ "scopes": [
3591
+ "fgColor"
3592
+ ]
3593
+ }
3594
+ }
3595
+ }
3596
+ }
3597
+ },
3598
+ "blue": {
3599
+ "bgColor": {
3600
+ "rest": {
3601
+ "$value": "{base.display.color.blue.0}",
3602
+ "$type": "color",
3603
+ "$extensions": {
3604
+ "org.primer.figma": {
3605
+ "collection": "mode",
3606
+ "group": "component",
3607
+ "scopes": [
3608
+ "bgColor"
3609
+ ]
3610
+ }
3611
+ }
3612
+ },
3613
+ "hover": {
3614
+ "$value": "{base.display.color.blue.1}",
3615
+ "$type": "color",
3616
+ "$extensions": {
3617
+ "org.primer.figma": {
3618
+ "collection": "mode",
3619
+ "group": "component",
3620
+ "scopes": [
3621
+ "bgColor"
3622
+ ]
3623
+ }
3624
+ }
3625
+ },
3626
+ "active": {
3627
+ "$value": "{base.display.color.blue.2}",
3628
+ "$type": "color",
3629
+ "$extensions": {
3630
+ "org.primer.figma": {
3631
+ "collection": "mode",
3632
+ "group": "component",
3633
+ "scopes": [
3634
+ "bgColor"
3635
+ ]
3636
+ }
3637
+ }
3638
+ }
3639
+ },
3640
+ "fgColor": {
3641
+ "rest": {
3642
+ "$value": "{base.display.color.blue.6}",
3643
+ "$type": "color",
3644
+ "$extensions": {
3645
+ "org.primer.figma": {
3646
+ "collection": "mode",
3647
+ "group": "component",
3648
+ "scopes": [
3649
+ "fgColor"
3650
+ ]
3651
+ }
3652
+ }
3653
+ },
3654
+ "hover": {
3655
+ "$value": "{base.display.color.blue.7}",
3656
+ "$type": "color",
3657
+ "$extensions": {
3658
+ "org.primer.figma": {
3659
+ "collection": "mode",
3660
+ "group": "component",
3661
+ "scopes": [
3662
+ "fgColor"
3663
+ ]
3664
+ }
3665
+ }
3666
+ },
3667
+ "active": {
3668
+ "$value": "{base.display.color.blue.8}",
3669
+ "$type": "color",
3670
+ "$extensions": {
3671
+ "org.primer.figma": {
3672
+ "collection": "mode",
3673
+ "group": "component",
3674
+ "scopes": [
3675
+ "fgColor"
3676
+ ]
3677
+ }
3678
+ }
3679
+ }
3680
+ }
3681
+ },
3682
+ "plum": {
3683
+ "bgColor": {
3684
+ "rest": {
3685
+ "$value": "{base.display.color.plum.0}",
3686
+ "$type": "color",
3687
+ "$extensions": {
3688
+ "org.primer.figma": {
3689
+ "collection": "mode",
3690
+ "group": "component",
3691
+ "scopes": [
3692
+ "bgColor"
3693
+ ]
3694
+ }
3695
+ }
3696
+ },
3697
+ "hover": {
3698
+ "$value": "{base.display.color.plum.1}",
3699
+ "$type": "color",
3700
+ "$extensions": {
3701
+ "org.primer.figma": {
3702
+ "collection": "mode",
3703
+ "group": "component",
3704
+ "scopes": [
3705
+ "bgColor"
3706
+ ]
3707
+ }
3708
+ }
3709
+ },
3710
+ "active": {
3711
+ "$value": "{base.display.color.plum.2}",
3712
+ "$type": "color",
3713
+ "$extensions": {
3714
+ "org.primer.figma": {
3715
+ "collection": "mode",
3716
+ "group": "component",
3717
+ "scopes": [
3718
+ "bgColor"
3719
+ ]
3720
+ }
3721
+ }
3722
+ }
3723
+ },
3724
+ "fgColor": {
3725
+ "rest": {
3726
+ "$value": "{base.display.color.plum.6}",
3727
+ "$type": "color",
3728
+ "$extensions": {
3729
+ "org.primer.figma": {
3730
+ "collection": "mode",
3731
+ "group": "component",
3732
+ "scopes": [
3733
+ "fgColor"
3734
+ ]
3735
+ }
3736
+ }
3737
+ },
3738
+ "hover": {
3739
+ "$value": "{base.display.color.plum.7}",
3740
+ "$type": "color",
3741
+ "$extensions": {
3742
+ "org.primer.figma": {
3743
+ "collection": "mode",
3744
+ "group": "component",
3745
+ "scopes": [
3746
+ "fgColor"
3747
+ ]
3748
+ }
3749
+ }
3750
+ },
3751
+ "active": {
3752
+ "$value": "{base.display.color.plum.8}",
3753
+ "$type": "color",
3754
+ "$extensions": {
3755
+ "org.primer.figma": {
3756
+ "collection": "mode",
3757
+ "group": "component",
3758
+ "scopes": [
3759
+ "fgColor"
3760
+ ]
3761
+ }
3762
+ }
3763
+ }
3764
+ }
3765
+ },
3766
+ "pink": {
3767
+ "bgColor": {
3768
+ "rest": {
3769
+ "$value": "{base.display.color.pink.0}",
3770
+ "$type": "color",
3771
+ "$extensions": {
3772
+ "org.primer.figma": {
3773
+ "collection": "mode",
3774
+ "group": "component",
3775
+ "scopes": [
3776
+ "bgColor"
3777
+ ]
3778
+ }
3779
+ }
3780
+ },
3781
+ "hover": {
3782
+ "$value": "{base.display.color.pink.1}",
3783
+ "$type": "color",
3784
+ "$extensions": {
3785
+ "org.primer.figma": {
3786
+ "collection": "mode",
3787
+ "group": "component",
3788
+ "scopes": [
3789
+ "bgColor"
3790
+ ]
3791
+ }
3792
+ }
3793
+ },
3794
+ "active": {
3795
+ "$value": "{base.display.color.pink.2}",
3796
+ "$type": "color",
3797
+ "$extensions": {
3798
+ "org.primer.figma": {
3799
+ "collection": "mode",
3800
+ "group": "component",
3801
+ "scopes": [
3802
+ "bgColor"
3803
+ ]
3804
+ }
3805
+ }
3806
+ }
3807
+ },
3808
+ "fgColor": {
3809
+ "rest": {
3810
+ "$value": "{base.display.color.pink.6}",
3811
+ "$type": "color",
3812
+ "$extensions": {
3813
+ "org.primer.figma": {
3814
+ "collection": "mode",
3815
+ "group": "component",
3816
+ "scopes": [
3817
+ "fgColor"
3818
+ ]
3819
+ }
3820
+ }
3821
+ },
3822
+ "hover": {
3823
+ "$value": "{base.display.color.pink.7}",
3824
+ "$type": "color",
3825
+ "$extensions": {
3826
+ "org.primer.figma": {
3827
+ "collection": "mode",
3828
+ "group": "component",
3829
+ "scopes": [
3830
+ "fgColor"
3831
+ ]
3832
+ }
3833
+ }
3834
+ },
3835
+ "active": {
3836
+ "$value": "{base.display.color.pink.8}",
3837
+ "$type": "color",
3838
+ "$extensions": {
3839
+ "org.primer.figma": {
3840
+ "collection": "mode",
3841
+ "group": "component",
3842
+ "scopes": [
3843
+ "fgColor"
3844
+ ]
3845
+ }
3846
+ }
3847
+ }
3848
+ }
3849
+ },
3850
+ "coral": {
3851
+ "bgColor": {
3852
+ "rest": {
3853
+ "$value": "{base.display.color.coral.0}",
3854
+ "$type": "color",
3855
+ "$extensions": {
3856
+ "org.primer.figma": {
3857
+ "collection": "mode",
3858
+ "group": "component",
3859
+ "scopes": [
3860
+ "bgColor"
3861
+ ]
3862
+ }
3863
+ }
3864
+ },
3865
+ "hover": {
3866
+ "$value": "{base.display.color.coral.1}",
3867
+ "$type": "color",
3868
+ "$extensions": {
3869
+ "org.primer.figma": {
3870
+ "collection": "mode",
3871
+ "group": "component",
3872
+ "scopes": [
3873
+ "bgColor"
3874
+ ]
3875
+ }
3876
+ }
3877
+ },
3878
+ "active": {
3879
+ "$value": "{base.display.color.coral.2}",
3880
+ "$type": "color",
3881
+ "$extensions": {
3882
+ "org.primer.figma": {
3883
+ "collection": "mode",
3884
+ "group": "component",
3885
+ "scopes": [
3886
+ "bgColor"
3887
+ ]
3888
+ }
3889
+ }
3890
+ }
3891
+ },
3892
+ "fgColor": {
3893
+ "rest": {
3894
+ "$value": "{base.display.color.coral.6}",
3895
+ "$type": "color",
3896
+ "$extensions": {
3897
+ "org.primer.figma": {
3898
+ "collection": "mode",
3899
+ "group": "component",
3900
+ "scopes": [
3901
+ "fgColor"
3902
+ ]
3903
+ }
3904
+ }
3905
+ },
3906
+ "hover": {
3907
+ "$value": "{base.display.color.coral.7}",
3908
+ "$type": "color",
3909
+ "$extensions": {
3910
+ "org.primer.figma": {
3911
+ "collection": "mode",
3912
+ "group": "component",
3913
+ "scopes": [
3914
+ "fgColor"
3915
+ ]
3916
+ }
3917
+ }
3918
+ },
3919
+ "active": {
3920
+ "$value": "{base.display.color.coral.8}",
3921
+ "$type": "color",
3922
+ "$extensions": {
3923
+ "org.primer.figma": {
3924
+ "collection": "mode",
3925
+ "group": "component",
3926
+ "scopes": [
3927
+ "fgColor"
3928
+ ]
3929
+ }
3930
+ }
3931
+ }
3932
+ }
3933
+ }
3934
+ },
3935
+ "tooltip": {
3936
+ "bgColor": {
3937
+ "$value": "{bgColor.emphasis}",
3938
+ "$type": "color",
3939
+ "$extensions": {
3940
+ "org.primer.figma": {
3941
+ "collection": "mode",
3942
+ "group": "component",
3943
+ "scopes": [
3944
+ "bgColor"
3945
+ ]
3946
+ }
3947
+ }
3948
+ },
3949
+ "fgColor": {
3950
+ "$value": "{fgColor.onEmphasis}",
3951
+ "$type": "color",
3952
+ "$extensions": {
3953
+ "org.primer.figma": {
3954
+ "collection": "mode",
3955
+ "group": "component",
3956
+ "scopes": [
3957
+ "fgColor"
3958
+ ]
3959
+ }
3960
+ }
3961
+ }
3962
+ }
3963
+ }