@primer/primitives 10.4.0-rc.e41ed5ed → 10.4.0-rc.eab36abe

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 (96) hide show
  1. package/dist/build/schemas/shadowToken.d.ts +1992 -0
  2. package/dist/build/schemas/shadowToken.js +27 -0
  3. package/dist/css/base/motion/motion.css +1 -0
  4. package/dist/css/functional/themes/dark-colorblind.css +2 -2
  5. package/dist/css/functional/themes/dark-dimmed.css +2 -2
  6. package/dist/css/functional/themes/dark-high-contrast.css +2 -2
  7. package/dist/css/functional/themes/dark-tritanopia.css +2 -2
  8. package/dist/css/functional/themes/dark.css +2 -2
  9. package/dist/css/functional/themes/light-colorblind.css +2 -2
  10. package/dist/css/functional/themes/light-high-contrast.css +2 -2
  11. package/dist/css/functional/themes/light-tritanopia.css +2 -2
  12. package/dist/css/functional/themes/light.css +2 -2
  13. package/dist/css/primitives.css +1 -6
  14. package/dist/docs/base/motion/motion.json +14 -0
  15. package/dist/docs/functional/themes/dark-colorblind.json +9685 -465
  16. package/dist/docs/functional/themes/dark-dimmed.json +9811 -547
  17. package/dist/docs/functional/themes/dark-high-contrast.json +10869 -627
  18. package/dist/docs/functional/themes/dark-tritanopia.json +9577 -475
  19. package/dist/docs/functional/themes/dark.json +9311 -469
  20. package/dist/docs/functional/themes/light-colorblind.json +9630 -458
  21. package/dist/docs/functional/themes/light-high-contrast.json +10860 -690
  22. package/dist/docs/functional/themes/light-tritanopia.json +9543 -489
  23. package/dist/docs/functional/themes/light.json +9307 -439
  24. package/dist/fallbacks/base/motion/motion.json +1 -0
  25. package/dist/figma/figma.json +1 -10
  26. package/dist/figma/themes/dark-colorblind.json +5060 -4813
  27. package/dist/figma/themes/dark-dimmed.json +5049 -4695
  28. package/dist/figma/themes/dark-high-contrast.json +6050 -4558
  29. package/dist/figma/themes/dark-tritanopia.json +5065 -4932
  30. package/dist/figma/themes/dark.json +4775 -4891
  31. package/dist/figma/themes/light-colorblind.json +5026 -4742
  32. package/dist/figma/themes/light-high-contrast.json +6075 -4592
  33. package/dist/figma/themes/light-tritanopia.json +5084 -4911
  34. package/dist/figma/themes/light.json +5230 -5230
  35. package/dist/internalCss/dark-colorblind.css +2 -2
  36. package/dist/internalCss/dark-dimmed.css +2 -2
  37. package/dist/internalCss/dark-high-contrast.css +2 -2
  38. package/dist/internalCss/dark-tritanopia.css +2 -2
  39. package/dist/internalCss/dark.css +2 -2
  40. package/dist/internalCss/light-colorblind.css +2 -2
  41. package/dist/internalCss/light-high-contrast.css +2 -2
  42. package/dist/internalCss/light-tritanopia.css +2 -2
  43. package/dist/internalCss/light.css +2 -2
  44. package/dist/styleLint/base/motion/motion.json +14 -0
  45. package/dist/styleLint/functional/themes/dark-colorblind.json +9685 -465
  46. package/dist/styleLint/functional/themes/dark-dimmed.json +9811 -547
  47. package/dist/styleLint/functional/themes/dark-high-contrast.json +10869 -627
  48. package/dist/styleLint/functional/themes/dark-tritanopia.json +9577 -475
  49. package/dist/styleLint/functional/themes/dark.json +9311 -469
  50. package/dist/styleLint/functional/themes/light-colorblind.json +9630 -458
  51. package/dist/styleLint/functional/themes/light-high-contrast.json +10853 -683
  52. package/dist/styleLint/functional/themes/light-tritanopia.json +9543 -489
  53. package/dist/styleLint/functional/themes/light.json +9307 -439
  54. package/package.json +1 -1
  55. package/src/tokens/base/motion/timing.json5 +4 -0
  56. package/src/tokens/component/avatar.json5 +33 -0
  57. package/src/tokens/component/button.json5 +1714 -0
  58. package/src/tokens/component/header.json5 +3 -0
  59. package/src/tokens/component/label.json5 +1942 -0
  60. package/src/tokens/component/menu.json5 +24 -0
  61. package/src/tokens/component/selectMenu.json5 +38 -0
  62. package/src/tokens/component/sideNav.json5 +22 -0
  63. package/src/tokens/component/treeView.json5 +24 -0
  64. package/src/tokens/component/underlineNav.json5 +56 -0
  65. package/src/tokens/functional/color/control.json5 +1087 -0
  66. package/src/tokens/functional/color/display.json5 +2170 -0
  67. package/src/tokens/functional/color/selection.json5 +22 -0
  68. package/src/tokens/functional/color/syntax.json5 +256 -210
  69. package/src/tokens/functional/shadow/{light.json5 → shadow.json5} +202 -120
  70. package/dist/css/functional/motion/motion.css +0 -6
  71. package/dist/docs/functional/motion/motion.json +0 -66
  72. package/dist/fallbacks/functional/motion/motion.json +0 -6
  73. package/dist/figma/shadows/dark-colorblind.json +0 -1152
  74. package/dist/figma/shadows/dark-dimmed.json +0 -1152
  75. package/dist/figma/shadows/dark-high-contrast.json +0 -1152
  76. package/dist/figma/shadows/dark-tritanopia.json +0 -1152
  77. package/dist/figma/shadows/dark.json +0 -1152
  78. package/dist/figma/shadows/light-colorblind.json +0 -1052
  79. package/dist/figma/shadows/light-high-contrast.json +0 -1052
  80. package/dist/figma/shadows/light-tritanopia.json +0 -1052
  81. package/dist/figma/shadows/light.json +0 -1052
  82. package/dist/styleLint/functional/motion/motion.json +0 -66
  83. package/src/tokens/functional/color/dark/display-dark.json5 +0 -1258
  84. package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +0 -199
  85. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +0 -618
  86. package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +0 -145
  87. package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +0 -97
  88. package/src/tokens/functional/color/dark/patterns-dark.json5 +0 -2589
  89. package/src/tokens/functional/color/light/display-light.json5 +0 -1163
  90. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +0 -581
  91. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +0 -145
  92. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +0 -87
  93. package/src/tokens/functional/color/light/patterns-light.json5 +0 -2583
  94. package/src/tokens/functional/motion/loading.json5 +0 -17
  95. package/src/tokens/functional/motion/patterns.json5 +0 -35
  96. package/src/tokens/functional/shadow/dark.json5 +0 -369
package/src/tokens/component/button.json5 ADDED
@@ -0,0 +1,1714 @@
1
+ {
2
+ button: {
3
+ default: {
4
+ fgColor: {
5
+ rest: {
6
+ $value: '{control.fgColor.rest}',
7
+ $type: 'color',
8
+ $extensions: {
9
+ 'org.primer.figma': {
10
+ collection: 'mode',
11
+ group: 'component (internal)',
12
+ scopes: ['fgColor'],
13
+ },
14
+ 'org.primer.overrides': {
15
+ dark: {
16
+ $value: '{control.fgColor.rest}',
17
+ },
18
+ },
19
+ },
20
+ },
21
+ },
22
+ bgColor: {
23
+ rest: {
24
+ $value: '{control.bgColor.rest}',
25
+ $type: 'color',
26
+ $extensions: {
27
+ 'org.primer.figma': {
28
+ collection: 'mode',
29
+ group: 'component (internal)',
30
+ scopes: ['bgColor'],
31
+ },
32
+ 'org.primer.overrides': {
33
+ dark: {
34
+ $value: '{control.bgColor.rest}',
35
+ },
36
+ },
37
+ },
38
+ },
39
+ hover: {
40
+ $value: '{control.bgColor.hover}',
41
+ $type: 'color',
42
+ $extensions: {
43
+ 'org.primer.figma': {
44
+ collection: 'mode',
45
+ group: 'component (internal)',
46
+ scopes: ['bgColor'],
47
+ },
48
+ 'org.primer.overrides': {
49
+ dark: {
50
+ $value: '{control.bgColor.hover}',
51
+ },
52
+ },
53
+ },
54
+ },
55
+ active: {
56
+ $value: '{control.bgColor.active}',
57
+ $type: 'color',
58
+ $extensions: {
59
+ 'org.primer.figma': {
60
+ collection: 'mode',
61
+ group: 'component (internal)',
62
+ scopes: ['bgColor'],
63
+ },
64
+ },
65
+ },
66
+ selected: {
67
+ $value: '{control.bgColor.active}',
68
+ $type: 'color',
69
+ $extensions: {
70
+ 'org.primer.figma': {
71
+ collection: 'mode',
72
+ group: 'component (internal)',
73
+ scopes: ['bgColor'],
74
+ },
75
+ },
76
+ },
77
+ disabled: {
78
+ $value: '{control.bgColor.disabled}',
79
+ $type: 'color',
80
+ $extensions: {},
81
+ },
82
+ },
83
+ borderColor: {
84
+ rest: {
85
+ $value: '{control.borderColor.rest}',
86
+ $type: 'color',
87
+ $extensions: {
88
+ 'org.primer.figma': {
89
+ collection: 'mode',
90
+ group: 'component (internal)',
91
+ scopes: ['borderColor'],
92
+ },
93
+ },
94
+ },
95
+ hover: {
96
+ $value: '{button.default.borderColor.rest}',
97
+ $type: 'color',
98
+ $extensions: {
99
+ 'org.primer.figma': {
100
+ collection: 'mode',
101
+ group: 'component (internal)',
102
+ scopes: ['borderColor'],
103
+ },
104
+ },
105
+ },
106
+ active: {
107
+ $value: '{control.borderColor.rest}',
108
+ $type: 'color',
109
+ $extensions: {
110
+ 'org.primer.figma': {
111
+ collection: 'mode',
112
+ group: 'component (internal)',
113
+ scopes: ['borderColor'],
114
+ },
115
+ 'org.primer.overrides': {
116
+ dark: {
117
+ $value: '{button.default.borderColor.rest}',
118
+ },
119
+ },
120
+ },
121
+ },
122
+ disabled: {
123
+ $value: '{control.borderColor.disabled}',
124
+ $type: 'color',
125
+ $extensions: {
126
+ 'org.primer.figma': {
127
+ collection: 'mode',
128
+ group: 'component (internal)',
129
+ scopes: ['borderColor'],
130
+ },
131
+ 'org.primer.overrides': {
132
+ dark: {
133
+ $value: '{control.borderColor.disabled}',
134
+ },
135
+ },
136
+ },
137
+ },
138
+ },
139
+ shadow: {
140
+ resting: {
141
+ $value: [
142
+ {
143
+ color: '{base.color.neutral.13}',
144
+ alpha: 0.04,
145
+ offsetX: '0px',
146
+ offsetY: '1px',
147
+ blur: '0px',
148
+ spread: '0px',
149
+ inset: false,
150
+ },
151
+ ],
152
+ $type: 'shadow',
153
+ $extensions: {
154
+ 'org.primer.figma': {
155
+ collection: 'mode',
156
+ group: 'component shadow',
157
+ },
158
+ 'org.primer.overrides': {
159
+ dark: {
160
+ $value: [
161
+ {
162
+ color: '{base.color.transparent}',
163
+ alpha: 0,
164
+ offsetX: '0px',
165
+ offsetY: '0px',
166
+ blur: '0px',
167
+ spread: '0px',
168
+ inset: false,
169
+ },
170
+ ],
171
+ },
172
+ },
173
+ },
174
+ },
175
+ },
176
+ },
177
+ primary: {
178
+ fgColor: {
179
+ rest: {
180
+ $value: '{fgColor.white}',
181
+ $type: 'color',
182
+ $extensions: {
183
+ 'org.primer.figma': {
184
+ collection: 'mode',
185
+ group: 'component (internal)',
186
+ scopes: ['fgColor'],
187
+ },
188
+ 'org.primer.overrides': {
189
+ dark: {
190
+ $value: '{fgColor.white}',
191
+ },
192
+ 'dark-dimmed': {
193
+ $value: '#ffffff',
194
+ },
195
+ },
196
+ },
197
+ },
198
+ disabled: {
199
+ $value: '{base.color.neutral.0}',
200
+ $type: 'color',
201
+ $extensions: {
202
+ 'org.primer.figma': {
203
+ collection: 'mode',
204
+ group: 'component (internal)',
205
+ scopes: ['fgColor'],
206
+ },
207
+ 'org.primer.overrides': {
208
+ dark: {
209
+ $value: '{base.color.neutral.13}',
210
+ alpha: 0.4,
211
+ },
212
+ },
213
+ },
214
+ alpha: 0.8,
215
+ },
216
+ },
217
+ iconColor: {
218
+ rest: {
219
+ $value: '{fgColor.white}',
220
+ $type: 'color',
221
+ $extensions: {
222
+ 'org.primer.figma': {
223
+ collection: 'mode',
224
+ group: 'component (internal)',
225
+ scopes: ['fgColor'],
226
+ },
227
+ 'org.primer.overrides': {
228
+ light: {
229
+ $value: '{fgColor.white}',
230
+ alpha: 0.8,
231
+ },
232
+ dark: {
233
+ $value: '{fgColor.white}',
234
+ },
235
+ 'dark-dimmed': {
236
+ $value: '#ffffff',
237
+ },
238
+ },
239
+ },
240
+ },
241
+ },
242
+ bgColor: {
243
+ rest: {
244
+ $value: '{bgColor.success.emphasis}',
245
+ $type: 'color',
246
+ $extensions: {
247
+ 'org.primer.figma': {
248
+ collection: 'mode',
249
+ group: 'component (internal)',
250
+ scopes: ['bgColor'],
251
+ },
252
+ 'org.primer.overrides': {
253
+ dark: {
254
+ $value: '{bgColor.success.emphasis}',
255
+ },
256
+ 'light-high-contrast': {
257
+ $value: '{base.color.green.5}',
258
+ },
259
+ },
260
+ },
261
+ },
262
+ hover: {
263
+ $value: '#1c8139',
264
+ $type: 'color',
265
+ $extensions: {
266
+ 'org.primer.figma': {
267
+ collection: 'mode',
268
+ group: 'component (internal)',
269
+ scopes: ['bgColor'],
270
+ },
271
+ 'org.primer.overrides': {
272
+ dark: {
273
+ $value: '#29903B',
274
+ },
275
+ 'dark-dimmed': {
276
+ $value: '#3b8640',
277
+ },
278
+ 'dark-tritanopia': {
279
+ $value: '#2a7aef',
280
+ },
281
+ 'dark-protanopia-deuteranopia': {
282
+ $value: '#2a7aef',
283
+ },
284
+ 'dark-high-contrast': {
285
+ $value: '#08792b',
286
+ },
287
+ 'light-tritanopia': {
288
+ $value: '#0864d1',
289
+ },
290
+ 'light-protanopia-deuteranopia': {
291
+ $value: '#0864d1',
292
+ },
293
+ 'light-high-contrast': {
294
+ $value: '#04571e',
295
+ },
296
+ },
297
+ },
298
+ },
299
+ active: {
300
+ $value: '#197935',
301
+ $type: 'color',
302
+ $extensions: {
303
+ 'org.primer.figma': {
304
+ collection: 'mode',
305
+ group: 'component (internal)',
306
+ scopes: ['bgColor'],
307
+ },
308
+ 'org.primer.overrides': {
309
+ dark: {
310
+ $value: '#2E9A40',
311
+ },
312
+ 'dark-dimmed': {
313
+ $value: '#428f46',
314
+ },
315
+ 'dark-tritanopia': {
316
+ $value: '#3685f3',
317
+ },
318
+ 'dark-protanopia-deuteranopia': {
319
+ $value: '#3685f3',
320
+ },
321
+ 'dark-high-contrast': {
322
+ $value: '#109135',
323
+ },
324
+ 'light-tritanopia': {
325
+ $value: '#075fc8',
326
+ },
327
+ 'light-protanopia-deuteranopia': {
328
+ $value: '#075fc8',
329
+ },
330
+ 'light-high-contrast': {
331
+ $value: '#03501b',
332
+ },
333
+ },
334
+ },
335
+ },
336
+ disabled: {
337
+ $value: '#95d8a6',
338
+ $type: 'color',
339
+ $extensions: {
340
+ 'org.primer.figma': {
341
+ collection: 'mode',
342
+ group: 'component (internal)',
343
+ scopes: ['bgColor'],
344
+ },
345
+ 'org.primer.overrides': {
346
+ dark: {
347
+ $value: '#105823',
348
+ },
349
+ 'dark-dimmed': {
350
+ $value: '#50a254',
351
+ },
352
+ 'dark-tritanopia': {
353
+ $value: '#5fabfe',
354
+ },
355
+ 'dark-protanopia-deuteranopia': {
356
+ $value: '{base.color.blue.6}',
357
+ },
358
+ 'dark-high-contrast': {
359
+ $value: '#048f2f',
360
+ },
361
+ 'light-tritanopia': {
362
+ $value: '#92caff',
363
+ },
364
+ 'light-protanopia-deuteranopia': {
365
+ $value: '#92caff',
366
+ },
367
+ 'light-high-contrast': {
368
+ $value: '#85cb97',
369
+ },
370
+ },
371
+ },
372
+ },
373
+ },
374
+ borderColor: {
375
+ rest: {
376
+ $value: '{base.color.neutral.13}',
377
+ $type: 'color',
378
+ $extensions: {
379
+ 'org.primer.figma': {
380
+ collection: 'mode',
381
+ group: 'component (internal)',
382
+ scopes: ['borderColor'],
383
+ },
384
+ 'org.primer.overrides': {
385
+ dark: {
386
+ $value: '{base.color.neutral.13}',
387
+ alpha: 0.1,
388
+ },
389
+ 'dark-high-contrast': {
390
+ $value: '{base.color.green.2}',
391
+ alpha: 1,
392
+ },
393
+ 'light-high-contrast': {
394
+ $value: '{base.color.green.7}',
395
+ alpha: 1,
396
+ },
397
+ },
398
+ },
399
+ alpha: 0.15,
400
+ },
401
+ hover: {
402
+ $value: '{button.primary.borderColor.rest}',
403
+ $type: 'color',
404
+ $extensions: {
405
+ 'org.primer.figma': {
406
+ collection: 'mode',
407
+ group: 'component (internal)',
408
+ scopes: ['borderColor'],
409
+ },
410
+ 'org.primer.overrides': {
411
+ dark: {
412
+ $value: '{button.primary.borderColor.rest}',
413
+ },
414
+ 'dark-high-contrast': {
415
+ $value: '{base.color.green.2}',
416
+ alpha: 1,
417
+ },
418
+ 'light-high-contrast': {
419
+ $value: '{base.color.green.7}',
420
+ alpha: 1,
421
+ },
422
+ },
423
+ },
424
+ },
425
+ active: {
426
+ $value: '{button.primary.borderColor.rest}',
427
+ $type: 'color',
428
+ $extensions: {
429
+ 'org.primer.figma': {
430
+ collection: 'mode',
431
+ group: 'component (internal)',
432
+ scopes: ['borderColor'],
433
+ },
434
+ 'org.primer.overrides': {
435
+ dark: {
436
+ $value: '{button.primary.borderColor.rest}',
437
+ },
438
+ 'dark-high-contrast': {
439
+ $value: '{base.color.green.2}',
440
+ alpha: 1,
441
+ },
442
+ 'light-high-contrast': {
443
+ $value: '{base.color.green.7}',
444
+ alpha: 1,
445
+ },
446
+ },
447
+ },
448
+ },
449
+ disabled: {
450
+ $value: '{button.primary.bgColor.disabled}',
451
+ $type: 'color',
452
+ $extensions: {
453
+ 'org.primer.figma': {
454
+ collection: 'mode',
455
+ group: 'component (internal)',
456
+ scopes: ['borderColor'],
457
+ },
458
+ 'org.primer.overrides': {
459
+ dark: {
460
+ $value: '#105823',
461
+ },
462
+ 'dark-dimmed': {
463
+ $value: '#50a254',
464
+ },
465
+ 'dark-tritanopia': {
466
+ $value: '#5fabfe',
467
+ },
468
+ 'dark-protanopia-deuteranopia': {
469
+ $value: '#1158c7',
470
+ },
471
+ 'dark-high-contrast': {
472
+ $value: '{base.color.green.2}',
473
+ alpha: 0.4,
474
+ },
475
+ 'light-high-contrast': {
476
+ $value: '#85cb97',
477
+ },
478
+ },
479
+ },
480
+ },
481
+ },
482
+ shadow: {
483
+ selected: {
484
+ $value: [
485
+ {
486
+ color: '{base.color.green.9}',
487
+ alpha: 0.3,
488
+ offsetX: '0px',
489
+ offsetY: '1px',
490
+ blur: '0px',
491
+ spread: '0px',
492
+ inset: true,
493
+ },
494
+ ],
495
+ $type: 'shadow',
496
+ $extensions: {
497
+ 'org.primer.figma': {
498
+ collection: 'mode',
499
+ group: 'component shadow',
500
+ },
501
+ 'org.primer.overrides': {
502
+ 'light-tritanopia': {
503
+ $value: [
504
+ {
505
+ color: '{base.color.blue.9}',
506
+ alpha: 0.3,
507
+ offsetX: '0px',
508
+ offsetY: '1px',
509
+ blur: '0px',
510
+ spread: '0px',
511
+ inset: true,
512
+ },
513
+ ],
514
+ },
515
+ 'light-protanopia-deuteranopia': {
516
+ $value: [
517
+ {
518
+ color: '{base.color.blue.9}',
519
+ alpha: 0.3,
520
+ offsetX: '0px',
521
+ offsetY: '1px',
522
+ blur: '0px',
523
+ spread: '0px',
524
+ inset: true,
525
+ },
526
+ ],
527
+ },
528
+ dark: {
529
+ $value: [
530
+ {
531
+ color: '{base.color.transparent}',
532
+ alpha: 0,
533
+ offsetX: '0px',
534
+ offsetY: '0px',
535
+ blur: '0px',
536
+ spread: '0px',
537
+ inset: false,
538
+ },
539
+ ],
540
+ },
541
+ },
542
+ },
543
+ },
544
+ },
545
+ },
546
+ invisible: {
547
+ fgColor: {
548
+ rest: {
549
+ $value: '{control.fgColor.rest}',
550
+ $type: 'color',
551
+ $extensions: {
552
+ 'org.primer.figma': {
553
+ collection: 'mode',
554
+ group: 'component (internal)',
555
+ scopes: ['fgColor'],
556
+ },
557
+ 'org.primer.overrides': {
558
+ dark: {
559
+ $value: '{control.fgColor.rest}',
560
+ },
561
+ },
562
+ },
563
+ },
564
+ hover: {
565
+ $value: '{control.fgColor.rest}',
566
+ $type: 'color',
567
+ $extensions: {
568
+ 'org.primer.figma': {
569
+ collection: 'mode',
570
+ group: 'component (internal)',
571
+ scopes: ['fgColor'],
572
+ },
573
+ 'org.primer.overrides': {
574
+ dark: {
575
+ $value: '{control.fgColor.rest}',
576
+ },
577
+ 'light-high-contrast': {
578
+ $value: '{base.color.neutral.11}',
579
+ },
580
+ },
581
+ },
582
+ },
583
+ active: {
584
+ $value: '{control.fgColor.rest}',
585
+ $type: 'color',
586
+ $extensions: {
587
+ 'org.primer.figma': {
588
+ collection: 'mode',
589
+ group: 'component (internal)',
590
+ scopes: ['fgColor'],
591
+ },
592
+ 'org.primer.overrides': {
593
+ dark: {
594
+ $value: '{control.fgColor.rest}',
595
+ },
596
+ },
597
+ },
598
+ },
599
+ disabled: {
600
+ $value: '{control.fgColor.disabled}',
601
+ $type: 'color',
602
+ $extensions: {
603
+ 'org.primer.figma': {
604
+ collection: 'mode',
605
+ group: 'component (internal)',
606
+ scopes: ['fgColor'],
607
+ },
608
+ 'org.primer.overrides': {
609
+ dark: {
610
+ $value: '{control.fgColor.disabled}',
611
+ },
612
+ },
613
+ },
614
+ },
615
+ },
616
+ iconColor: {
617
+ rest: {
618
+ $value: '{fgColor.muted}',
619
+ $type: 'color',
620
+ $extensions: {
621
+ 'org.primer.figma': {
622
+ collection: 'mode',
623
+ group: 'component (internal)',
624
+ scopes: ['fgColor'],
625
+ },
626
+ 'org.primer.overrides': {
627
+ dark: {
628
+ $value: '{fgColor.muted}',
629
+ },
630
+ 'dark-dimmed': {
631
+ $value: '{base.color.neutral.10}',
632
+ },
633
+ 'dark-high-contrast': {
634
+ $value: '{base.color.neutral.11}',
635
+ },
636
+ },
637
+ },
638
+ },
639
+ hover: {
640
+ $value: '{fgColor.muted}',
641
+ $type: 'color',
642
+ $extensions: {
643
+ 'org.primer.figma': {
644
+ collection: 'mode',
645
+ group: 'component (internal)',
646
+ scopes: ['fgColor'],
647
+ },
648
+ 'org.primer.overrides': {
649
+ dark: {
650
+ $value: '{fgColor.muted}',
651
+ },
652
+ 'dark-dimmed': {
653
+ $value: '{base.color.neutral.10}',
654
+ },
655
+ 'dark-high-contrast': {
656
+ $value: '{base.color.neutral.11}',
657
+ },
658
+ 'light-high-contrast': {
659
+ $value: '{base.color.neutral.11}',
660
+ },
661
+ },
662
+ },
663
+ },
664
+ disabled: {
665
+ $value: '{control.fgColor.disabled}',
666
+ $type: 'color',
667
+ $extensions: {
668
+ 'org.primer.figma': {
669
+ collection: 'mode',
670
+ group: 'component (internal)',
671
+ scopes: ['fgColor'],
672
+ },
673
+ 'org.primer.overrides': {
674
+ dark: {
675
+ $value: '{control.fgColor.disabled}',
676
+ },
677
+ },
678
+ },
679
+ },
680
+ },
681
+ bgColor: {
682
+ rest: {
683
+ $value: '{control.transparent.bgColor.rest}',
684
+ $type: 'color',
685
+ $extensions: {
686
+ 'org.primer.figma': {
687
+ collection: 'mode',
688
+ group: 'component (internal)',
689
+ scopes: ['bgColor'],
690
+ },
691
+ 'org.primer.overrides': {
692
+ dark: {
693
+ $value: '{control.transparent.bgColor.rest}',
694
+ },
695
+ },
696
+ },
697
+ },
698
+ hover: {
699
+ $value: '{control.transparent.bgColor.hover}',
700
+ $type: 'color',
701
+ $extensions: {
702
+ 'org.primer.figma': {
703
+ collection: 'mode',
704
+ group: 'component (internal)',
705
+ scopes: ['bgColor'],
706
+ },
707
+ 'org.primer.overrides': {
708
+ dark: {
709
+ $value: '{control.transparent.bgColor.hover}',
710
+ },
711
+ 'dark-high-contrast': {
712
+ $value: '{base.color.neutral.2}',
713
+ alpha: null,
714
+ },
715
+ },
716
+ },
717
+ },
718
+ active: {
719
+ $value: '{control.transparent.bgColor.active}',
720
+ $type: 'color',
721
+ $extensions: {
722
+ 'org.primer.figma': {
723
+ collection: 'mode',
724
+ group: 'component (internal)',
725
+ scopes: ['bgColor'],
726
+ },
727
+ 'org.primer.overrides': {
728
+ dark: {
729
+ $value: '{control.transparent.bgColor.active}',
730
+ },
731
+ 'dark-high-contrast': {
732
+ $value: '{base.color.neutral.3}',
733
+ alpha: null,
734
+ },
735
+ },
736
+ },
737
+ },
738
+ disabled: {
739
+ $value: '{base.color.transparent}',
740
+ $type: 'color',
741
+ $extensions: {
742
+ 'org.primer.figma': {
743
+ collection: 'mode',
744
+ group: 'component (internal)',
745
+ scopes: ['bgColor'],
746
+ },
747
+ 'org.primer.overrides': {
748
+ dark: {
749
+ $value: '{base.color.transparent}',
750
+ },
751
+ },
752
+ },
753
+ },
754
+ },
755
+ borderColor: {
756
+ rest: {
757
+ $value: '{control.transparent.borderColor.rest}',
758
+ $type: 'color',
759
+ $extensions: {
760
+ 'org.primer.figma': {
761
+ collection: 'mode',
762
+ group: 'component (internal)',
763
+ scopes: ['borderColor'],
764
+ },
765
+ 'org.primer.overrides': {
766
+ dark: {
767
+ $value: '{control.transparent.borderColor.rest}',
768
+ },
769
+ },
770
+ },
771
+ },
772
+ hover: {
773
+ $value: '{control.transparent.borderColor.hover}',
774
+ $type: 'color',
775
+ $extensions: {
776
+ 'org.primer.figma': {
777
+ collection: 'mode',
778
+ group: 'component (internal)',
779
+ scopes: ['borderColor'],
780
+ },
781
+ 'org.primer.overrides': {
782
+ dark: {
783
+ $value: '{control.transparent.borderColor.hover}',
784
+ },
785
+ },
786
+ },
787
+ },
788
+ disabled: {
789
+ $value: '{base.color.transparent}',
790
+ $type: 'color',
791
+ $extensions: {
792
+ 'org.primer.figma': {
793
+ collection: 'mode',
794
+ group: 'component (internal)',
795
+ scopes: ['borderColor'],
796
+ },
797
+ 'org.primer.overrides': {
798
+ dark: {
799
+ $value: '{base.color.transparent}',
800
+ },
801
+ },
802
+ },
803
+ },
804
+ },
805
+ },
806
+ outline: {
807
+ fgColor: {
808
+ rest: {
809
+ $value: '{fgColor.accent}',
810
+ $type: 'color',
811
+ $extensions: {
812
+ 'org.primer.figma': {
813
+ collection: 'mode',
814
+ group: 'component (internal)',
815
+ scopes: ['fgColor'],
816
+ },
817
+ 'org.primer.overrides': {
818
+ dark: {
819
+ $value: '{base.color.blue.4}',
820
+ },
821
+ },
822
+ },
823
+ },
824
+ hover: {
825
+ $value: '{base.color.neutral.0}',
826
+ $type: 'color',
827
+ $extensions: {
828
+ 'org.primer.figma': {
829
+ collection: 'mode',
830
+ group: 'component (internal)',
831
+ scopes: ['fgColor'],
832
+ },
833
+ 'org.primer.overrides': {
834
+ dark: {
835
+ $value: '{base.color.blue.3}',
836
+ },
837
+ },
838
+ },
839
+ },
840
+ active: {
841
+ $value: '{base.color.neutral.0}',
842
+ $type: 'color',
843
+ $extensions: {
844
+ 'org.primer.figma': {
845
+ collection: 'mode',
846
+ group: 'component (internal)',
847
+ scopes: ['fgColor'],
848
+ },
849
+ 'org.primer.overrides': {
850
+ dark: {
851
+ $value: '{base.color.neutral.13}',
852
+ },
853
+ },
854
+ },
855
+ },
856
+ disabled: {
857
+ $value: '{fgColor.accent}',
858
+ $type: 'color',
859
+ $extensions: {
860
+ 'org.primer.figma': {
861
+ collection: 'mode',
862
+ group: 'component (internal)',
863
+ scopes: ['fgColor'],
864
+ },
865
+ 'org.primer.overrides': {
866
+ dark: {
867
+ $value: '{fgColor.accent}',
868
+ alpha: 0.5,
869
+ },
870
+ 'dark-dimmed': {
871
+ $value: '#478be680',
872
+ },
873
+ },
874
+ },
875
+ alpha: 0.5,
876
+ },
877
+ },
878
+ bgColor: {
879
+ rest: {
880
+ $value: '{control.bgColor.rest}',
881
+ $type: 'color',
882
+ $extensions: {
883
+ 'org.primer.figma': {
884
+ collection: 'mode',
885
+ group: 'component (internal)',
886
+ scopes: ['bgColor'],
887
+ },
888
+ 'org.primer.overrides': {
889
+ dark: {
890
+ $value: '{base.color.neutral.12}',
891
+ },
892
+ },
893
+ },
894
+ },
895
+ hover: {
896
+ $value: '{bgColor.accent.emphasis}',
897
+ $type: 'color',
898
+ $extensions: {
899
+ 'org.primer.figma': {
900
+ collection: 'mode',
901
+ group: 'component (internal)',
902
+ scopes: ['bgColor'],
903
+ },
904
+ 'org.primer.overrides': {
905
+ dark: {
906
+ $value: '{control.bgColor.hover}',
907
+ },
908
+ 'dark-tritanopia': {
909
+ $value: '#262c36',
910
+ },
911
+ },
912
+ },
913
+ },
914
+ active: {
915
+ $value: '#0757ba',
916
+ $type: 'color',
917
+ $extensions: {
918
+ 'org.primer.figma': {
919
+ collection: 'mode',
920
+ group: 'component (internal)',
921
+ scopes: ['bgColor'],
922
+ },
923
+ 'org.primer.overrides': {
924
+ dark: {
925
+ $value: '{base.color.blue.7}',
926
+ },
927
+ 'dark-tritanopia': {
928
+ $value: '#0d419d',
929
+ },
930
+ 'light-high-contrast': {
931
+ $value: '#033f9d',
932
+ },
933
+ },
934
+ },
935
+ },
936
+ disabled: {
937
+ $value: '{control.bgColor.disabled}',
938
+ $type: 'color',
939
+ $extensions: {
940
+ 'org.primer.figma': {
941
+ collection: 'mode',
942
+ group: 'component (internal)',
943
+ scopes: ['bgColor'],
944
+ },
945
+ 'org.primer.overrides': {
946
+ dark: {
947
+ $value: '{control.bgColor.disabled}',
948
+ },
949
+ 'dark-tritanopia': {
950
+ $value: '#212830',
951
+ },
952
+ },
953
+ },
954
+ },
955
+ },
956
+ borderColor: {
957
+ hover: {
958
+ $value: '{button.primary.borderColor.hover}',
959
+ $type: 'color',
960
+ $extensions: {
961
+ 'org.primer.figma': {
962
+ collection: 'mode',
963
+ group: 'component (internal)',
964
+ scopes: ['borderColor'],
965
+ },
966
+ 'org.primer.overrides': {
967
+ dark: {
968
+ $value: '{button.default.borderColor.hover}',
969
+ },
970
+ },
971
+ },
972
+ },
973
+ active: {
974
+ $value: '{button.outline.borderColor.hover}',
975
+ $type: 'color',
976
+ $extensions: {
977
+ 'org.primer.figma': {
978
+ collection: 'mode',
979
+ group: 'component (internal)',
980
+ scopes: ['borderColor'],
981
+ },
982
+ },
983
+ },
984
+ },
985
+ shadow: {
986
+ selected: {
987
+ $value: [
988
+ {
989
+ color: '{base.color.blue.9}',
990
+ alpha: 0.2,
991
+ offsetX: '0px',
992
+ offsetY: '1px',
993
+ blur: '0px',
994
+ spread: '0px',
995
+ inset: true,
996
+ },
997
+ ],
998
+ $type: 'shadow',
999
+ $extensions: {
1000
+ 'org.primer.figma': {
1001
+ collection: 'mode',
1002
+ group: 'component shadow',
1003
+ },
1004
+ 'org.primer.overrides': {
1005
+ dark: {
1006
+ $value: [
1007
+ {
1008
+ color: '{base.color.transparent}',
1009
+ alpha: 0,
1010
+ offsetX: '0px',
1011
+ offsetY: '0px',
1012
+ blur: '0px',
1013
+ spread: '0px',
1014
+ inset: false,
1015
+ },
1016
+ ],
1017
+ },
1018
+ },
1019
+ },
1020
+ },
1021
+ },
1022
+ },
1023
+ danger: {
1024
+ fgColor: {
1025
+ rest: {
1026
+ $value: '{fgColor.danger}',
1027
+ $type: 'color',
1028
+ $extensions: {
1029
+ 'org.primer.figma': {
1030
+ collection: 'mode',
1031
+ group: 'component (internal)',
1032
+ scopes: ['fgColor'],
1033
+ },
1034
+ 'org.primer.overrides': {
1035
+ dark: {
1036
+ $value: '#FA5E55',
1037
+ },
1038
+ 'dark-dimmed': {
1039
+ $value: '#ea5c53',
1040
+ },
1041
+ 'dark-protanopia-deuteranopia': {
1042
+ $value: '{fgColor.danger}',
1043
+ },
1044
+ 'dark-high-contrast': {
1045
+ $value: '{base.color.red.2}',
1046
+ },
1047
+ },
1048
+ },
1049
+ },
1050
+ hover: {
1051
+ $value: '{base.color.neutral.0}',
1052
+ $type: 'color',
1053
+ $extensions: {
1054
+ 'org.primer.figma': {
1055
+ collection: 'mode',
1056
+ group: 'component (internal)',
1057
+ scopes: ['fgColor'],
1058
+ },
1059
+ 'org.primer.overrides': {
1060
+ dark: {
1061
+ $value: '{base.color.neutral.13}',
1062
+ },
1063
+ },
1064
+ },
1065
+ },
1066
+ active: {
1067
+ $value: '{base.color.neutral.0}',
1068
+ $type: 'color',
1069
+ $extensions: {
1070
+ 'org.primer.figma': {
1071
+ collection: 'mode',
1072
+ group: 'component (internal)',
1073
+ scopes: ['fgColor'],
1074
+ },
1075
+ 'org.primer.overrides': {
1076
+ dark: {
1077
+ $value: '{base.color.neutral.13}',
1078
+ },
1079
+ },
1080
+ },
1081
+ },
1082
+ disabled: {
1083
+ $value: '{fgColor.danger}',
1084
+ $type: 'color',
1085
+ $extensions: {
1086
+ 'org.primer.figma': {
1087
+ collection: 'mode',
1088
+ group: 'component (internal)',
1089
+ scopes: ['fgColor'],
1090
+ },
1091
+ 'org.primer.overrides': {
1092
+ dark: {
1093
+ $value: '{fgColor.danger}',
1094
+ alpha: 0.5,
1095
+ },
1096
+ },
1097
+ },
1098
+ alpha: 0.5,
1099
+ },
1100
+ },
1101
+ iconColor: {
1102
+ rest: {
1103
+ $value: '{fgColor.danger}',
1104
+ $type: 'color',
1105
+ $extensions: {
1106
+ 'org.primer.figma': {
1107
+ collection: 'mode',
1108
+ group: 'component (internal)',
1109
+ scopes: ['fgColor'],
1110
+ },
1111
+ 'org.primer.overrides': {
1112
+ dark: {
1113
+ $value: '#FA5E55',
1114
+ },
1115
+ 'dark-dimmed': {
1116
+ $value: '#ea5c53',
1117
+ },
1118
+ 'dark-protanopia-deuteranopia': {
1119
+ $value: '#f0883e',
1120
+ },
1121
+ 'dark-high-contrast': {
1122
+ $value: '#ffb1af',
1123
+ },
1124
+ },
1125
+ },
1126
+ },
1127
+ hover: {
1128
+ $value: '{base.color.neutral.0}',
1129
+ $type: 'color',
1130
+ $extensions: {
1131
+ 'org.primer.figma': {
1132
+ collection: 'mode',
1133
+ group: 'component (internal)',
1134
+ scopes: ['fgColor'],
1135
+ },
1136
+ 'org.primer.overrides': {
1137
+ dark: {
1138
+ $value: '{base.color.neutral.13}',
1139
+ },
1140
+ },
1141
+ },
1142
+ },
1143
+ },
1144
+ bgColor: {
1145
+ rest: {
1146
+ $value: '{control.bgColor.rest}',
1147
+ $type: 'color',
1148
+ $extensions: {
1149
+ 'org.primer.figma': {
1150
+ collection: 'mode',
1151
+ group: 'component (internal)',
1152
+ scopes: ['bgColor'],
1153
+ },
1154
+ 'org.primer.overrides': {
1155
+ dark: {
1156
+ $value: '{control.bgColor.rest}',
1157
+ },
1158
+ },
1159
+ },
1160
+ },
1161
+ hover: {
1162
+ $value: '{base.color.red.6}',
1163
+ $type: 'color',
1164
+ $extensions: {
1165
+ 'org.primer.figma': {
1166
+ collection: 'mode',
1167
+ group: 'component (internal)',
1168
+ scopes: ['bgColor'],
1169
+ },
1170
+ 'org.primer.overrides': {
1171
+ dark: {
1172
+ $value: '{base.color.red.6}',
1173
+ },
1174
+ 'dark-protanopia-deuteranopia': {
1175
+ $value: '{base.color.orange.6}',
1176
+ },
1177
+ 'dark-high-contrast': {
1178
+ $value: '{bgColor.danger.emphasis}',
1179
+ },
1180
+ 'light-protanopia-deuteranopia': {
1181
+ $value: '{base.color.orange.6}',
1182
+ },
1183
+ },
1184
+ },
1185
+ },
1186
+ active: {
1187
+ $value: '#8b0820',
1188
+ $type: 'color',
1189
+ $extensions: {
1190
+ 'org.primer.figma': {
1191
+ collection: 'mode',
1192
+ group: 'component (internal)',
1193
+ scopes: ['bgColor'],
1194
+ },
1195
+ 'org.primer.overrides': {
1196
+ dark: {
1197
+ $value: '#D03533',
1198
+ },
1199
+ 'dark-dimmed': {
1200
+ $value: '#c33d38',
1201
+ },
1202
+ 'dark-protanopia-deuteranopia': {
1203
+ $value: '#b5531d',
1204
+ },
1205
+ 'dark-high-contrast': {
1206
+ $value: '{bgColor.danger.emphasis}',
1207
+ },
1208
+ 'light-protanopia-deuteranopia': {
1209
+ $value: '#7e2f00',
1210
+ },
1211
+ 'light-high-contrast': {
1212
+ $value: '#74041a',
1213
+ },
1214
+ },
1215
+ },
1216
+ },
1217
+ disabled: {
1218
+ $value: '{control.bgColor.disabled}',
1219
+ $type: 'color',
1220
+ $extensions: {
1221
+ 'org.primer.figma': {
1222
+ collection: 'mode',
1223
+ group: 'component (internal)',
1224
+ scopes: ['bgColor'],
1225
+ },
1226
+ 'org.primer.overrides': {
1227
+ dark: {
1228
+ $value: '{control.bgColor.disabled}',
1229
+ },
1230
+ },
1231
+ },
1232
+ },
1233
+ },
1234
+ borderColor: {
1235
+ rest: {
1236
+ $value: '{control.borderColor.rest}',
1237
+ $type: 'color',
1238
+ $extensions: {
1239
+ 'org.primer.figma': {
1240
+ collection: 'mode',
1241
+ group: 'component (internal)',
1242
+ scopes: ['borderColor'],
1243
+ },
1244
+ 'org.primer.overrides': {
1245
+ dark: {
1246
+ $value: '{control.borderColor.rest}',
1247
+ },
1248
+ },
1249
+ },
1250
+ },
1251
+ hover: {
1252
+ $value: '{button.primary.borderColor.rest}',
1253
+ $type: 'color',
1254
+ $extensions: {
1255
+ 'org.primer.figma': {
1256
+ collection: 'mode',
1257
+ group: 'component (internal)',
1258
+ scopes: ['borderColor'],
1259
+ },
1260
+ 'org.primer.overrides': {
1261
+ dark: {
1262
+ $value: '{button.primary.borderColor.rest}',
1263
+ },
1264
+ 'dark-high-contrast': {
1265
+ $value: '{base.color.red.2}',
1266
+ alpha: 1,
1267
+ },
1268
+ },
1269
+ },
1270
+ },
1271
+ active: {
1272
+ $value: '{button.danger.borderColor.hover}',
1273
+ $type: 'color',
1274
+ $extensions: {
1275
+ 'org.primer.figma': {
1276
+ collection: 'mode',
1277
+ group: 'component (internal)',
1278
+ scopes: ['borderColor'],
1279
+ },
1280
+ 'org.primer.overrides': {
1281
+ dark: {
1282
+ $value: '{button.danger.borderColor.hover}',
1283
+ },
1284
+ 'dark-high-contrast': {
1285
+ $value: '{base.color.red.2}',
1286
+ alpha: 1,
1287
+ },
1288
+ },
1289
+ },
1290
+ },
1291
+ },
1292
+ shadow: {
1293
+ selected: {
1294
+ $value: [
1295
+ {
1296
+ color: '{base.color.red.9}',
1297
+ alpha: 0.2,
1298
+ offsetX: '0px',
1299
+ offsetY: '1px',
1300
+ blur: '0px',
1301
+ spread: '0px',
1302
+ inset: true,
1303
+ },
1304
+ ],
1305
+ $type: 'shadow',
1306
+ $extensions: {
1307
+ 'org.primer.figma': {
1308
+ collection: 'mode',
1309
+ group: 'component shadow',
1310
+ },
1311
+ 'org.primer.overrides': {
1312
+ 'light-protanopia-deuteranopia': {
1313
+ $value: [
1314
+ {
1315
+ color: '{base.color.orange.9}',
1316
+ alpha: 0.2,
1317
+ offsetX: '0px',
1318
+ offsetY: '1px',
1319
+ blur: '0px',
1320
+ spread: '0px',
1321
+ inset: true,
1322
+ },
1323
+ ],
1324
+ },
1325
+ dark: {
1326
+ $value: [
1327
+ {
1328
+ color: '{base.color.transparent}',
1329
+ alpha: 0,
1330
+ offsetX: '0px',
1331
+ offsetY: '0px',
1332
+ blur: '0px',
1333
+ spread: '0px',
1334
+ inset: false,
1335
+ },
1336
+ ],
1337
+ },
1338
+ },
1339
+ },
1340
+ },
1341
+ },
1342
+ },
1343
+ inactive: {
1344
+ fgColor: {
1345
+ $value: '{base.color.neutral.9}',
1346
+ $type: 'color',
1347
+ $extensions: {
1348
+ 'org.primer.figma': {
1349
+ collection: 'mode',
1350
+ group: 'component (internal)',
1351
+ scopes: ['fgColor'],
1352
+ },
1353
+ 'org.primer.overrides': {
1354
+ dark: {
1355
+ $value: '{base.color.neutral.9}',
1356
+ },
1357
+ 'dark-dimmed': {
1358
+ $value: '{base.color.neutral.8}',
1359
+ },
1360
+ 'dark-high-contrast': {
1361
+ $value: '{base.color.neutral.10}',
1362
+ },
1363
+ 'light-high-contrast': {
1364
+ $value: '{base.color.neutral.10}',
1365
+ },
1366
+ },
1367
+ },
1368
+ },
1369
+ bgColor: {
1370
+ $value: '{base.color.neutral.3}',
1371
+ $type: 'color',
1372
+ $extensions: {
1373
+ 'org.primer.figma': {
1374
+ collection: 'mode',
1375
+ group: 'component (internal)',
1376
+ scopes: ['bgColor'],
1377
+ },
1378
+ 'org.primer.overrides': {
1379
+ dark: {
1380
+ $value: '{base.color.neutral.4}',
1381
+ },
1382
+ 'dark-dimmed': {
1383
+ $value: '{base.color.neutral.5}',
1384
+ },
1385
+ 'dark-high-contrast': {
1386
+ $value: '{control.bgColor.rest}',
1387
+ },
1388
+ 'light-high-contrast': {
1389
+ $value: '{control.bgColor.rest}',
1390
+ },
1391
+ },
1392
+ },
1393
+ },
1394
+ },
1395
+ star: {
1396
+ iconColor: {
1397
+ $value: '{base.color.yellow.2}',
1398
+ $type: 'color',
1399
+ $extensions: {
1400
+ 'org.primer.figma': {
1401
+ collection: 'mode',
1402
+ group: 'component (internal)',
1403
+ scopes: ['bgColor'],
1404
+ },
1405
+ 'org.primer.overrides': {
1406
+ dark: {
1407
+ $value: '{base.color.yellow.2}',
1408
+ },
1409
+ },
1410
+ },
1411
+ },
1412
+ },
1413
+ },
1414
+ buttonCounter: {
1415
+ default: {
1416
+ bgColor: {
1417
+ rest: {
1418
+ $value: '{bgColor.neutral.muted}',
1419
+ $type: 'color',
1420
+ $extensions: {
1421
+ 'org.primer.figma': {
1422
+ collection: 'mode',
1423
+ group: 'component (internal)',
1424
+ scopes: ['bgColor'],
1425
+ },
1426
+ 'org.primer.overrides': {
1427
+ dark: {
1428
+ $value: '{base.color.neutral.6}',
1429
+ },
1430
+ 'light-high-contrast': '{base.color.neutral.7}',
1431
+ },
1432
+ },
1433
+ },
1434
+ },
1435
+ },
1436
+ invisible: {
1437
+ bgColor: {
1438
+ rest: {
1439
+ $value: '{bgColor.neutral.muted}',
1440
+ $type: 'color',
1441
+ $extensions: {
1442
+ 'org.primer.figma': {
1443
+ collection: 'mode',
1444
+ group: 'component (internal)',
1445
+ scopes: ['bgColor'],
1446
+ },
1447
+ 'org.primer.overrides': {
1448
+ dark: {
1449
+ $value: '{bgColor.neutral.muted}',
1450
+ },
1451
+ },
1452
+ },
1453
+ },
1454
+ },
1455
+ },
1456
+ primary: {
1457
+ bgColor: {
1458
+ rest: {
1459
+ $value: '{base.color.green.9}',
1460
+ $type: 'color',
1461
+ $extensions: {
1462
+ 'org.primer.figma': {
1463
+ collection: 'mode',
1464
+ group: 'component (internal)',
1465
+ scopes: ['bgColor'],
1466
+ },
1467
+ 'org.primer.overrides': {
1468
+ dark: {
1469
+ $value: '{base.color.green.9}',
1470
+ alpha: 0.2,
1471
+ },
1472
+ 'dark-high-contrast': {
1473
+ $value: '{base.color.neutral.0}',
1474
+ alpha: 0.15,
1475
+ },
1476
+ },
1477
+ },
1478
+ alpha: 0.2,
1479
+ },
1480
+ },
1481
+ },
1482
+ outline: {
1483
+ bgColor: {
1484
+ rest: {
1485
+ $value: '{bgColor.accent.emphasis}',
1486
+ $type: 'color',
1487
+ $extensions: {
1488
+ 'org.primer.figma': {
1489
+ collection: 'mode',
1490
+ group: 'component (internal)',
1491
+ scopes: ['bgColor'],
1492
+ },
1493
+ 'org.primer.overrides': {
1494
+ dark: {
1495
+ $value: '{base.color.blue.9}',
1496
+ alpha: 0.2,
1497
+ },
1498
+ },
1499
+ },
1500
+ alpha: 0.1,
1501
+ },
1502
+ hover: {
1503
+ $value: '{base.color.neutral.0}',
1504
+ $type: 'color',
1505
+ $extensions: {
1506
+ 'org.primer.figma': {
1507
+ collection: 'mode',
1508
+ group: 'component (internal)',
1509
+ scopes: ['bgColor'],
1510
+ },
1511
+ 'org.primer.overrides': {
1512
+ dark: {
1513
+ $value: '{base.color.blue.9}',
1514
+ alpha: 0.2,
1515
+ },
1516
+ },
1517
+ },
1518
+ alpha: 0.2,
1519
+ },
1520
+ disabled: {
1521
+ $value: '{bgColor.accent.emphasis}',
1522
+ $type: 'color',
1523
+ $extensions: {
1524
+ 'org.primer.figma': {
1525
+ collection: 'mode',
1526
+ group: 'component (internal)',
1527
+ scopes: ['bgColor'],
1528
+ },
1529
+ 'org.primer.overrides': {
1530
+ dark: {
1531
+ $value: '{bgColor.accent.emphasis}',
1532
+ alpha: 0.05,
1533
+ },
1534
+ },
1535
+ },
1536
+ alpha: 0.05,
1537
+ },
1538
+ },
1539
+ fgColor: {
1540
+ rest: {
1541
+ $value: '{base.color.blue.6}',
1542
+ $type: 'color',
1543
+ $extensions: {
1544
+ 'org.primer.figma': {
1545
+ collection: 'mode',
1546
+ group: 'component (internal)',
1547
+ scopes: ['fgColor'],
1548
+ },
1549
+ 'org.primer.overrides': {
1550
+ dark: {
1551
+ $value: '{base.color.blue.4}',
1552
+ },
1553
+ },
1554
+ },
1555
+ },
1556
+ hover: {
1557
+ $value: '{base.color.neutral.0}',
1558
+ $type: 'color',
1559
+ $extensions: {
1560
+ 'org.primer.figma': {
1561
+ collection: 'mode',
1562
+ group: 'component (internal)',
1563
+ scopes: ['fgColor'],
1564
+ },
1565
+ 'org.primer.overrides': {
1566
+ dark: {
1567
+ $value: '{base.color.blue.3}',
1568
+ },
1569
+ },
1570
+ },
1571
+ },
1572
+ disabled: {
1573
+ $value: '{fgColor.accent}',
1574
+ $type: 'color',
1575
+ $extensions: {
1576
+ 'org.primer.figma': {
1577
+ collection: 'mode',
1578
+ group: 'component (internal)',
1579
+ scopes: ['fgColor'],
1580
+ },
1581
+ 'org.primer.overrides': {
1582
+ dark: {
1583
+ $value: '{fgColor.accent}',
1584
+ alpha: 0.5,
1585
+ },
1586
+ },
1587
+ },
1588
+ alpha: 0.5,
1589
+ },
1590
+ },
1591
+ },
1592
+ danger: {
1593
+ bgColor: {
1594
+ hover: {
1595
+ $value: '{base.color.neutral.0}',
1596
+ $type: 'color',
1597
+ $extensions: {
1598
+ 'org.primer.figma': {
1599
+ collection: 'mode',
1600
+ group: 'component (internal)',
1601
+ scopes: ['bgColor'],
1602
+ },
1603
+ 'org.primer.overrides': {
1604
+ dark: {
1605
+ $value: '{base.color.neutral.13}',
1606
+ alpha: 0.2,
1607
+ },
1608
+ 'dark-high-contrast': {
1609
+ $value: '{base.color.neutral.0}',
1610
+ alpha: 0.15,
1611
+ },
1612
+ },
1613
+ },
1614
+ alpha: 0.2,
1615
+ },
1616
+ disabled: {
1617
+ $value: '{bgColor.danger.emphasis}',
1618
+ $type: 'color',
1619
+ $extensions: {
1620
+ 'org.primer.figma': {
1621
+ collection: 'mode',
1622
+ group: 'component (internal)',
1623
+ scopes: ['bgColor'],
1624
+ },
1625
+ 'org.primer.overrides': {
1626
+ dark: {
1627
+ $value: '{bgColor.danger.emphasis}',
1628
+ alpha: 0.05,
1629
+ },
1630
+ },
1631
+ },
1632
+ alpha: 0.05,
1633
+ },
1634
+ rest: {
1635
+ $value: '{bgColor.danger.emphasis}',
1636
+ $type: 'color',
1637
+ $extensions: {
1638
+ 'org.primer.figma': {
1639
+ collection: 'mode',
1640
+ group: 'component (internal)',
1641
+ scopes: ['bgColor'],
1642
+ },
1643
+ 'org.primer.overrides': {
1644
+ dark: {
1645
+ $value: '{base.color.red.9}',
1646
+ alpha: 0.2,
1647
+ },
1648
+ 'dark-high-contrast': {
1649
+ $value: '{base.color.neutral.0}',
1650
+ alpha: 0.15,
1651
+ },
1652
+ },
1653
+ },
1654
+ alpha: 0.1,
1655
+ },
1656
+ },
1657
+ fgColor: {
1658
+ rest: {
1659
+ $value: '#c21c2c',
1660
+ $type: 'color',
1661
+ $extensions: {
1662
+ 'org.primer.figma': {
1663
+ collection: 'mode',
1664
+ group: 'component (internal)',
1665
+ scopes: ['fgColor'],
1666
+ },
1667
+ 'org.primer.overrides': {
1668
+ dark: {
1669
+ $value: '{fgColor.danger}',
1670
+ },
1671
+ 'light-high-contrast': {
1672
+ $value: '#980e1e',
1673
+ },
1674
+ },
1675
+ },
1676
+ },
1677
+ hover: {
1678
+ $value: '{base.color.neutral.0}',
1679
+ $type: 'color',
1680
+ $extensions: {
1681
+ 'org.primer.figma': {
1682
+ collection: 'mode',
1683
+ group: 'component (internal)',
1684
+ scopes: ['fgColor'],
1685
+ },
1686
+ 'org.primer.overrides': {
1687
+ dark: {
1688
+ $value: '{base.color.neutral.13}',
1689
+ },
1690
+ },
1691
+ },
1692
+ },
1693
+ disabled: {
1694
+ $value: '{fgColor.danger}',
1695
+ $type: 'color',
1696
+ $extensions: {
1697
+ 'org.primer.figma': {
1698
+ collection: 'mode',
1699
+ group: 'component (internal)',
1700
+ scopes: ['fgColor'],
1701
+ },
1702
+ 'org.primer.overrides': {
1703
+ dark: {
1704
+ $value: '{fgColor.danger}',
1705
+ alpha: 0.5,
1706
+ },
1707
+ },
1708
+ },
1709
+ alpha: 0.5,
1710
+ },
1711
+ },
1712
+ },
1713
+ },
1714
+ }