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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. package/dist/css/base/motion/motion.css +1 -0
  2. package/dist/css/functional/themes/dark-colorblind.css +36 -0
  3. package/dist/css/functional/themes/dark-dimmed.css +36 -0
  4. package/dist/css/functional/themes/dark-high-contrast.css +36 -0
  5. package/dist/css/functional/themes/dark-tritanopia.css +36 -0
  6. package/dist/css/functional/themes/dark.css +36 -0
  7. package/dist/css/functional/themes/light-colorblind.css +36 -0
  8. package/dist/css/functional/themes/light-high-contrast.css +36 -0
  9. package/dist/css/functional/themes/light-tritanopia.css +36 -0
  10. package/dist/css/functional/themes/light.css +36 -0
  11. package/dist/css/primitives.css +1 -0
  12. package/dist/docs/base/motion/motion.json +14 -0
  13. package/dist/docs/functional/themes/dark-colorblind.json +2600 -226
  14. package/dist/docs/functional/themes/dark-dimmed.json +2152 -166
  15. package/dist/docs/functional/themes/dark-high-contrast.json +2786 -260
  16. package/dist/docs/functional/themes/dark-tritanopia.json +2446 -160
  17. package/dist/docs/functional/themes/dark.json +2379 -215
  18. package/dist/docs/functional/themes/light-colorblind.json +2573 -225
  19. package/dist/docs/functional/themes/light-high-contrast.json +1990 -234
  20. package/dist/docs/functional/themes/light-tritanopia.json +2437 -163
  21. package/dist/docs/functional/themes/light.json +2380 -216
  22. package/dist/fallbacks/base/motion/motion.json +1 -0
  23. package/dist/figma/themes/dark-colorblind.json +4154 -3589
  24. package/dist/figma/themes/dark-dimmed.json +3945 -3563
  25. package/dist/figma/themes/dark-high-contrast.json +3361 -2651
  26. package/dist/figma/themes/dark-tritanopia.json +4128 -3675
  27. package/dist/figma/themes/dark.json +4039 -3746
  28. package/dist/figma/themes/light-colorblind.json +4084 -3551
  29. package/dist/figma/themes/light-high-contrast.json +3409 -3101
  30. package/dist/figma/themes/light-tritanopia.json +4086 -3649
  31. package/dist/figma/themes/light.json +3991 -3698
  32. package/dist/internalCss/dark-colorblind.css +36 -0
  33. package/dist/internalCss/dark-dimmed.css +36 -0
  34. package/dist/internalCss/dark-high-contrast.css +36 -0
  35. package/dist/internalCss/dark-tritanopia.css +36 -0
  36. package/dist/internalCss/dark.css +36 -0
  37. package/dist/internalCss/light-colorblind.css +36 -0
  38. package/dist/internalCss/light-high-contrast.css +36 -0
  39. package/dist/internalCss/light-tritanopia.css +36 -0
  40. package/dist/internalCss/light.css +36 -0
  41. package/dist/styleLint/base/motion/motion.json +14 -0
  42. package/dist/styleLint/functional/themes/dark-colorblind.json +2599 -225
  43. package/dist/styleLint/functional/themes/dark-dimmed.json +2151 -165
  44. package/dist/styleLint/functional/themes/dark-high-contrast.json +2785 -259
  45. package/dist/styleLint/functional/themes/dark-tritanopia.json +2446 -160
  46. package/dist/styleLint/functional/themes/dark.json +2379 -215
  47. package/dist/styleLint/functional/themes/light-colorblind.json +2575 -227
  48. package/dist/styleLint/functional/themes/light-high-contrast.json +1989 -233
  49. package/dist/styleLint/functional/themes/light-tritanopia.json +2436 -162
  50. package/dist/styleLint/functional/themes/light.json +2380 -216
  51. package/package.json +1 -1
  52. package/src/tokens/base/motion/timing.json5 +4 -0
  53. package/src/tokens/component/card.json5 +18 -0
  54. package/src/tokens/{functional/color/light/app-light.json5 → component/codeMirror.json5} +67 -0
  55. package/src/tokens/component/contribution.json5 +344 -0
  56. package/src/tokens/component/counter.json5 +43 -0
  57. package/src/tokens/component/tooltip.json5 +32 -0
  58. package/src/tokens/functional/color/bgColor.json5 +24 -20
  59. package/src/tokens/functional/color/control.json5 +968 -0
  60. package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +0 -24
  61. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +0 -164
  62. package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +0 -104
  63. package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +0 -60
  64. package/src/tokens/functional/color/dark/patterns-dark.json5 +725 -1432
  65. package/src/tokens/functional/color/{dark/data-vis-dark.json5 → data-vis.json5} +61 -21
  66. package/src/tokens/functional/color/focus.json5 +15 -0
  67. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +0 -20
  68. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +0 -90
  69. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +0 -56
  70. package/src/tokens/functional/color/light/patterns-light.json5 +720 -1428
  71. package/src/tokens/functional/color/{light/syntax-light.json5 → syntax.json5} +187 -0
  72. package/src/tokens/functional/color/dark/app-dark.json5 +0 -254
  73. package/src/tokens/functional/color/dark/syntax-dark.json5 +0 -559
  74. package/src/tokens/functional/color/light/data-vis-light.json5 +0 -284
package/src/tokens/functional/color/control.json5 ADDED
@@ -0,0 +1,968 @@
1
+ {
2
+ control: {
3
+ bgColor: {
4
+ rest: {
5
+ $value: '{base.color.neutral.1}',
6
+ $type: 'color',
7
+ $extensions: {
8
+ 'org.primer.figma': {
9
+ collection: 'mode',
10
+ group: 'component',
11
+ scopes: [
12
+ 'bgColor',
13
+ ],
14
+ },
15
+ 'org.primer.overrides': {
16
+ dark: '{base.color.neutral.3}',
17
+ 'dark-high-contrast': {
18
+ $value: '{base.color.neutral.4}',
19
+ },
20
+ },
21
+ },
22
+ },
23
+ hover: {
24
+ $value: '{base.color.neutral.2}',
25
+ $type: 'color',
26
+ $extensions: {
27
+ 'org.primer.figma': {
28
+ collection: 'mode',
29
+ group: 'component',
30
+ scopes: [
31
+ 'bgColor',
32
+ ],
33
+ },
34
+ 'org.primer.overrides': {
35
+ dark: '{base.color.neutral.4}',
36
+ 'dark-high-contrast': {
37
+ $value: '{base.color.neutral.5}',
38
+ },
39
+ },
40
+ },
41
+ },
42
+ active: {
43
+ $value: '{base.color.neutral.3}',
44
+ $type: 'color',
45
+ $extensions: {
46
+ 'org.primer.figma': {
47
+ collection: 'mode',
48
+ group: 'component',
49
+ scopes: [
50
+ 'bgColor',
51
+ ],
52
+ },
53
+ 'org.primer.overrides': {
54
+ dark: '{base.color.neutral.5}',
55
+ 'dark-high-contrast': {
56
+ $value: '{base.color.neutral.6}',
57
+ },
58
+ },
59
+ },
60
+ },
61
+ disabled: {
62
+ $value: '{bgColor.disabled}',
63
+ $type: 'color',
64
+ $extensions: {
65
+ 'org.primer.figma': {
66
+ collection: 'mode',
67
+ group: 'component',
68
+ scopes: [
69
+ 'bgColor',
70
+ ],
71
+ },
72
+ 'org.primer.overrides': {
73
+ dark: '{bgColor.disabled}',
74
+ },
75
+ },
76
+ },
77
+ selected: {
78
+ $value: '{control.bgColor.rest}',
79
+ $type: 'color',
80
+ $extensions: {
81
+ 'org.primer.figma': {
82
+ collection: 'mode',
83
+ group: 'component',
84
+ scopes: [
85
+ 'bgColor',
86
+ ],
87
+ },
88
+ 'org.primer.overrides': {
89
+ dark: '{control.bgColor.rest}',
90
+ },
91
+ },
92
+ },
93
+ },
94
+ fgColor: {
95
+ rest: {
96
+ $value: '{base.color.neutral.12}',
97
+ $type: 'color',
98
+ $extensions: {
99
+ 'org.primer.figma': {
100
+ collection: 'mode',
101
+ group: 'component',
102
+ scopes: [
103
+ 'fgColor',
104
+ ],
105
+ },
106
+ 'org.primer.overrides': {
107
+ dark: '{fgColor.default}',
108
+ },
109
+ },
110
+ },
111
+ placeholder: {
112
+ $value: '{fgColor.muted}',
113
+ $type: 'color',
114
+ $extensions: {
115
+ 'org.primer.figma': {
116
+ collection: 'mode',
117
+ group: 'component',
118
+ scopes: [
119
+ 'fgColor',
120
+ ],
121
+ },
122
+ 'org.primer.overrides': {
123
+ dark: '{fgColor.muted}',
124
+ 'dark-high-contrast': {
125
+ $value: '{base.color.neutral.10}',
126
+ },
127
+ },
128
+ },
129
+ },
130
+ disabled: {
131
+ $value: '{fgColor.disabled}',
132
+ $type: 'color',
133
+ $extensions: {
134
+ 'org.primer.figma': {
135
+ collection: 'mode',
136
+ group: 'component',
137
+ scopes: [
138
+ 'fgColor',
139
+ ],
140
+ },
141
+ 'org.primer.overrides': {
142
+ dark: '{fgColor.disabled}',
143
+ },
144
+ },
145
+ },
146
+ },
147
+ borderColor: {
148
+ rest: {
149
+ $value: '{borderColor.default}',
150
+ $type: 'color',
151
+ $extensions: {
152
+ 'org.primer.figma': {
153
+ collection: 'mode',
154
+ group: 'component',
155
+ scopes: [
156
+ 'borderColor',
157
+ ],
158
+ },
159
+ 'org.primer.overrides': {
160
+ dark: '{borderColor.default}',
161
+ },
162
+ },
163
+ },
164
+ emphasis: {
165
+ $value: '{borderColor.emphasis}',
166
+ $type: 'color',
167
+ $extensions: {
168
+ 'org.primer.figma': {
169
+ collection: 'mode',
170
+ group: 'component',
171
+ scopes: [
172
+ 'borderColor',
173
+ ],
174
+ },
175
+ 'org.primer.overrides': {
176
+ dark: '{borderColor.emphasis}',
177
+ 'dark-high-contrast': {
178
+ $value: '{borderColor.emphasis}',
179
+ },
180
+ },
181
+ },
182
+ },
183
+ disabled: {
184
+ $value: '{borderColor.disabled}',
185
+ $type: 'color',
186
+ $extensions: {
187
+ 'org.primer.figma': {
188
+ collection: 'mode',
189
+ group: 'component',
190
+ scopes: [
191
+ 'borderColor',
192
+ ],
193
+ },
194
+ 'org.primer.overrides': {
195
+ dark: '{borderColor.disabled}',
196
+ },
197
+ },
198
+ },
199
+ selected: {
200
+ $value: '{control.bgColor.selected}',
201
+ $type: 'color',
202
+ $extensions: {
203
+ 'org.primer.figma': {
204
+ collection: 'mode',
205
+ group: 'component',
206
+ scopes: [
207
+ 'borderColor',
208
+ ],
209
+ },
210
+ 'org.primer.overrides': {
211
+ dark: '{base.color.neutral.12}',
212
+ },
213
+ },
214
+ },
215
+ success: {
216
+ $value: '{borderColor.success.emphasis}',
217
+ $type: 'color',
218
+ $extensions: {
219
+ 'org.primer.figma': {
220
+ collection: 'mode',
221
+ group: 'component',
222
+ scopes: [
223
+ 'borderColor',
224
+ ],
225
+ },
226
+ 'org.primer.overrides': {
227
+ dark: '{borderColor.success.emphasis}',
228
+ },
229
+ },
230
+ },
231
+ danger: {
232
+ $value: '{borderColor.danger.emphasis}',
233
+ $type: 'color',
234
+ $extensions: {
235
+ 'org.primer.figma': {
236
+ collection: 'mode',
237
+ group: 'component',
238
+ scopes: [
239
+ 'borderColor',
240
+ ],
241
+ },
242
+ 'org.primer.overrides': {
243
+ dark: '{borderColor.danger.emphasis}',
244
+ },
245
+ },
246
+ },
247
+ warning: {
248
+ $value: '{borderColor.attention.emphasis}',
249
+ $type: 'color',
250
+ $extensions: {
251
+ 'org.primer.figma': {
252
+ collection: 'mode',
253
+ group: 'component',
254
+ scopes: [
255
+ 'borderColor',
256
+ ],
257
+ },
258
+ 'org.primer.overrides': {
259
+ dark: '{borderColor.attention.emphasis}',
260
+ },
261
+ },
262
+ },
263
+ },
264
+ iconColor: {
265
+ rest: {
266
+ $value: '{fgColor.muted}',
267
+ $type: 'color',
268
+ $extensions: {
269
+ 'org.primer.figma': {
270
+ collection: 'mode',
271
+ group: 'component',
272
+ scopes: [
273
+ 'fgColor',
274
+ ],
275
+ },
276
+ 'org.primer.overrides': {
277
+ dark: '{fgColor.muted}',
278
+ },
279
+ },
280
+ },
281
+ },
282
+ transparent: {
283
+ bgColor: {
284
+ rest: {
285
+ $value: '{base.color.transparent}',
286
+ $type: 'color',
287
+ $extensions: {
288
+ 'org.primer.figma': {
289
+ collection: 'mode',
290
+ group: 'component',
291
+ scopes: [
292
+ 'bgColor',
293
+ ],
294
+ },
295
+ 'org.primer.overrides': {
296
+ dark: '{base.color.transparent}',
297
+ },
298
+ },
299
+ },
300
+ hover: {
301
+ $value: '{base.color.neutral.8}',
302
+ $type: 'color',
303
+ $extensions: {
304
+ 'org.primer.figma': {
305
+ collection: 'mode',
306
+ group: 'component',
307
+ scopes: [
308
+ 'bgColor',
309
+ ],
310
+ },
311
+ 'org.primer.overrides': {
312
+ dark: {
313
+ $value: '{base.color.neutral.8}',
314
+ alpha: 0.2,
315
+ },
316
+ 'dark-high-contrast': {
317
+ $value: '{base.color.neutral.6}',
318
+ alpha: 1,
319
+ },
320
+ },
321
+ },
322
+ alpha: 0.1,
323
+ },
324
+ active: {
325
+ $value: '{base.color.neutral.8}',
326
+ $type: 'color',
327
+ $extensions: {
328
+ 'org.primer.figma': {
329
+ collection: 'mode',
330
+ group: 'component',
331
+ scopes: [
332
+ 'bgColor',
333
+ ],
334
+ },
335
+ 'org.primer.overrides': {
336
+ dark: {
337
+ $value: '{base.color.neutral.8}',
338
+ alpha: 0.25,
339
+ },
340
+ 'dark-high-contrast': {
341
+ $value: '{base.color.neutral.7}',
342
+ alpha: 1,
343
+ },
344
+ },
345
+ },
346
+ alpha: 0.15,
347
+ },
348
+ disabled: {
349
+ $value: '{bgColor.disabled}',
350
+ $type: 'color',
351
+ $extensions: {
352
+ 'org.primer.figma': {
353
+ collection: 'mode',
354
+ group: 'component',
355
+ scopes: [
356
+ 'bgColor',
357
+ ],
358
+ },
359
+ 'org.primer.overrides': {
360
+ dark: '{bgColor.disabled}',
361
+ },
362
+ },
363
+ },
364
+ selected: {
365
+ $value: '{base.color.neutral.8}',
366
+ $type: 'color',
367
+ $extensions: {
368
+ 'org.primer.figma': {
369
+ collection: 'mode',
370
+ group: 'component',
371
+ scopes: [
372
+ 'bgColor',
373
+ ],
374
+ },
375
+ 'org.primer.overrides': {
376
+ dark: {
377
+ $value: '{base.color.neutral.8}',
378
+ alpha: 0.1,
379
+ },
380
+ 'dark-high-contrast': {
381
+ $value: '{base.color.neutral.6}',
382
+ alpha: 1,
383
+ },
384
+ },
385
+ },
386
+ alpha: 0.15,
387
+ },
388
+ },
389
+ borderColor: {
390
+ rest: {
391
+ $value: '{base.color.transparent}',
392
+ $type: 'color',
393
+ $extensions: {
394
+ 'org.primer.figma': {
395
+ collection: 'mode',
396
+ group: 'component',
397
+ scopes: [
398
+ 'borderColor',
399
+ ],
400
+ },
401
+ 'org.primer.overrides': {
402
+ dark: '{base.color.transparent}',
403
+ },
404
+ },
405
+ },
406
+ hover: {
407
+ $value: '{base.color.transparent}',
408
+ $type: 'color',
409
+ $extensions: {
410
+ 'org.primer.figma': {
411
+ collection: 'mode',
412
+ group: 'component',
413
+ scopes: [
414
+ 'borderColor',
415
+ ],
416
+ },
417
+ 'org.primer.overrides': {
418
+ dark: '{base.color.transparent}',
419
+ 'dark-high-contrast': {
420
+ $value: '{borderColor.default}',
421
+ },
422
+ },
423
+ },
424
+ },
425
+ active: {
426
+ $value: '{base.color.transparent}',
427
+ $type: 'color',
428
+ $extensions: {
429
+ 'org.primer.figma': {
430
+ collection: 'mode',
431
+ group: 'component',
432
+ scopes: [
433
+ 'borderColor',
434
+ ],
435
+ },
436
+ 'org.primer.overrides': {
437
+ dark: '{base.color.transparent}',
438
+ 'dark-high-contrast': {
439
+ $value: '{borderColor.default}',
440
+ },
441
+ },
442
+ },
443
+ },
444
+ },
445
+ },
446
+ danger: {
447
+ fgColor: {
448
+ rest: {
449
+ $value: '{fgColor.danger}',
450
+ $type: 'color',
451
+ $extensions: {
452
+ 'org.primer.figma': {
453
+ collection: 'mode',
454
+ group: 'component',
455
+ scopes: [
456
+ 'fgColor',
457
+ ],
458
+ },
459
+ 'org.primer.overrides': {
460
+ dark: '{fgColor.danger}',
461
+ },
462
+ },
463
+ },
464
+ hover: {
465
+ $value: '{fgColor.danger}',
466
+ $type: 'color',
467
+ $extensions: {
468
+ 'org.primer.figma': {
469
+ collection: 'mode',
470
+ group: 'component',
471
+ scopes: [
472
+ 'fgColor',
473
+ ],
474
+ },
475
+ 'org.primer.overrides': {
476
+ dark: '{base.color.red.3}',
477
+ 'dark-protanopia-deuteranopia': '{base.color.orange.3}',
478
+ },
479
+ },
480
+ },
481
+ },
482
+ bgColor: {
483
+ hover: {
484
+ $value: '{bgColor.danger.muted}',
485
+ $type: 'color',
486
+ $extensions: {
487
+ 'org.primer.figma': {
488
+ collection: 'mode',
489
+ group: 'component',
490
+ scopes: [
491
+ 'bgColor',
492
+ ],
493
+ },
494
+ 'org.primer.overrides': {
495
+ dark: '{bgColor.danger.muted}',
496
+ 'dark-high-contrast': {
497
+ $value: '{bgColor.danger.emphasis}',
498
+ },
499
+ },
500
+ },
501
+ },
502
+ active: {
503
+ $value: '{bgColor.danger.muted}',
504
+ $type: 'color',
505
+ $extensions: {
506
+ 'org.primer.figma': {
507
+ collection: 'mode',
508
+ group: 'component',
509
+ scopes: [
510
+ 'bgColor',
511
+ ],
512
+ },
513
+ 'org.primer.overrides': {
514
+ light: {
515
+ $value: '{bgColor.danger.muted}',
516
+ alpha: 0.4,
517
+ },
518
+ dark: {
519
+ $value: '{bgColor.danger.muted}',
520
+ alpha: 0.4,
521
+ },
522
+ 'dark-high-contrast': {
523
+ $value: '#c51120',
524
+ alpha: 1,
525
+ },
526
+ },
527
+ },
528
+ },
529
+ },
530
+ },
531
+ checked: {
532
+ bgColor: {
533
+ rest: {
534
+ $value: '{bgColor.accent.emphasis}',
535
+ $type: 'color',
536
+ $extensions: {
537
+ 'org.primer.figma': {
538
+ collection: 'mode',
539
+ group: 'component',
540
+ scopes: [
541
+ 'bgColor',
542
+ ],
543
+ },
544
+ 'org.primer.overrides': {
545
+ dark: '{bgColor.accent.emphasis}',
546
+ },
547
+ },
548
+ },
549
+ hover: {
550
+ $value: '#0860ca',
551
+ $type: 'color',
552
+ $extensions: {
553
+ 'org.primer.figma': {
554
+ collection: 'mode',
555
+ group: 'component',
556
+ scopes: [
557
+ 'bgColor',
558
+ ],
559
+ },
560
+ 'org.primer.overrides': {
561
+ dark: '#2A7AEF',
562
+ 'dark-high-contrast': {
563
+ $value: '#2b64c1',
564
+ },
565
+ },
566
+ },
567
+ },
568
+ active: {
569
+ $value: '#0757ba',
570
+ $type: 'color',
571
+ $extensions: {
572
+ 'org.primer.figma': {
573
+ collection: 'mode',
574
+ group: 'component',
575
+ scopes: [
576
+ 'bgColor',
577
+ ],
578
+ },
579
+ 'org.primer.overrides': {
580
+ dark: '#3685F3',
581
+ 'dark-high-contrast': {
582
+ $value: '#3c79d0',
583
+ },
584
+ },
585
+ },
586
+ },
587
+ disabled: {
588
+ $value: '{fgColor.disabled}',
589
+ $type: 'color',
590
+ $extensions: {
591
+ 'org.primer.figma': {
592
+ collection: 'mode',
593
+ group: 'component',
594
+ scopes: [
595
+ 'bgColor',
596
+ ],
597
+ },
598
+ 'org.primer.overrides': {
599
+ dark: '{fgColor.disabled}',
600
+ },
601
+ },
602
+ },
603
+ },
604
+ fgColor: {
605
+ rest: {
606
+ $value: '{fgColor.onEmphasis}',
607
+ $type: 'color',
608
+ $extensions: {
609
+ 'org.primer.figma': {
610
+ collection: 'mode',
611
+ group: 'component',
612
+ scopes: [
613
+ 'fgColor',
614
+ ],
615
+ },
616
+ 'org.primer.overrides': {
617
+ dark: '{fgColor.onEmphasis}',
618
+ },
619
+ },
620
+ },
621
+ disabled: {
622
+ $value: '{fgColor.onEmphasis}',
623
+ $type: 'color',
624
+ $extensions: {
625
+ 'org.primer.figma': {
626
+ collection: 'mode',
627
+ group: 'component',
628
+ scopes: [
629
+ 'fgColor',
630
+ ],
631
+ },
632
+ 'org.primer.overrides': {
633
+ dark: '{base.color.inset}',
634
+ },
635
+ },
636
+ },
637
+ },
638
+ borderColor: {
639
+ rest: {
640
+ $value: '{control.checked.bgColor.rest}',
641
+ $type: 'color',
642
+ $extensions: {
643
+ 'org.primer.figma': {
644
+ collection: 'mode',
645
+ group: 'component',
646
+ scopes: [
647
+ 'borderColor',
648
+ ],
649
+ },
650
+ 'org.primer.overrides': {
651
+ dark: '{control.checked.bgColor.rest}',
652
+ 'dark-high-contrast': {
653
+ $value: '{base.color.blue.2}',
654
+ },
655
+ },
656
+ },
657
+ },
658
+ hover: {
659
+ $value: '{control.checked.bgColor.hover}',
660
+ $type: 'color',
661
+ $extensions: {
662
+ 'org.primer.figma': {
663
+ collection: 'mode',
664
+ group: 'component',
665
+ scopes: [
666
+ 'borderColor',
667
+ ],
668
+ },
669
+ 'org.primer.overrides': {
670
+ dark: '{control.checked.bgColor.hover}',
671
+ 'dark-high-contrast': {
672
+ $value: '{base.color.blue.2}',
673
+ },
674
+ },
675
+ },
676
+ },
677
+ active: {
678
+ $value: '{control.checked.bgColor.active}',
679
+ $type: 'color',
680
+ $extensions: {
681
+ 'org.primer.figma': {
682
+ collection: 'mode',
683
+ group: 'component',
684
+ scopes: [
685
+ 'borderColor',
686
+ ],
687
+ },
688
+ 'org.primer.overrides': {
689
+ dark: '{control.checked.bgColor.active}',
690
+ 'dark-high-contrast': {
691
+ $value: '{base.color.blue.2}',
692
+ },
693
+ },
694
+ },
695
+ },
696
+ disabled: {
697
+ $value: '{control.checked.bgColor.disabled}',
698
+ $type: 'color',
699
+ $extensions: {
700
+ 'org.primer.figma': {
701
+ collection: 'mode',
702
+ group: 'component',
703
+ scopes: [
704
+ 'borderColor',
705
+ ],
706
+ },
707
+ 'org.primer.overrides': {
708
+ dark: '{control.checked.bgColor.disabled}',
709
+ },
710
+ },
711
+ },
712
+ },
713
+ },
714
+ },
715
+ controlTrack: {
716
+ bgColor: {
717
+ rest: {
718
+ $value: '{base.color.neutral.3}',
719
+ $type: 'color',
720
+ $extensions: {
721
+ 'org.primer.figma': {
722
+ collection: 'mode',
723
+ group: 'component (internal)',
724
+ scopes: [
725
+ 'bgColor',
726
+ ],
727
+ },
728
+ 'org.primer.overrides': {
729
+ dark: '{base.color.neutral.4}',
730
+ 'dark-high-contrast': {
731
+ $value: '{base.color.neutral.5}',
732
+ },
733
+ },
734
+ },
735
+ },
736
+ hover: {
737
+ $value: '{base.color.neutral.4}',
738
+ $type: 'color',
739
+ $extensions: {
740
+ 'org.primer.figma': {
741
+ collection: 'mode',
742
+ group: 'component (internal)',
743
+ scopes: [
744
+ 'bgColor',
745
+ ],
746
+ },
747
+ 'org.primer.overrides': {
748
+ dark: '{base.color.neutral.5}',
749
+ 'dark-high-contrast': {
750
+ $value: '{base.color.neutral.6}',
751
+ },
752
+ },
753
+ },
754
+ },
755
+ active: {
756
+ $value: '{base.color.neutral.5}',
757
+ $type: 'color',
758
+ $extensions: {
759
+ 'org.primer.figma': {
760
+ collection: 'mode',
761
+ group: 'component (internal)',
762
+ scopes: [
763
+ 'bgColor',
764
+ ],
765
+ },
766
+ 'org.primer.overrides': {
767
+ dark: '{base.color.neutral.6}',
768
+ 'dark-high-contrast': {
769
+ $value: '{base.color.neutral.7}',
770
+ },
771
+ },
772
+ },
773
+ },
774
+ disabled: {
775
+ $value: '{fgColor.disabled}',
776
+ $type: 'color',
777
+ $extensions: {
778
+ 'org.primer.figma': {
779
+ collection: 'mode',
780
+ group: 'component (internal)',
781
+ scopes: [
782
+ 'bgColor',
783
+ ],
784
+ },
785
+ 'org.primer.overrides': {
786
+ dark: '{fgColor.disabled}',
787
+ },
788
+ },
789
+ },
790
+ },
791
+ fgColor: {
792
+ rest: {
793
+ $value: '{base.color.neutral.9}',
794
+ $type: 'color',
795
+ $extensions: {
796
+ 'org.primer.figma': {
797
+ collection: 'mode',
798
+ group: 'component (internal)',
799
+ scopes: [
800
+ 'fgColor',
801
+ ],
802
+ },
803
+ 'org.primer.overrides': {
804
+ dark: '{fgColor.muted}',
805
+ 'dark-high-contrast': {
806
+ $value: '{fgColor.default}',
807
+ },
808
+ },
809
+ },
810
+ },
811
+ disabled: {
812
+ $value: '{fgColor.onEmphasis}',
813
+ $type: 'color',
814
+ $extensions: {
815
+ 'org.primer.figma': {
816
+ collection: 'mode',
817
+ group: 'component (internal)',
818
+ scopes: [
819
+ 'fgColor',
820
+ ],
821
+ },
822
+ 'org.primer.overrides': {
823
+ dark: '{fgColor.onEmphasis}',
824
+ },
825
+ },
826
+ },
827
+ },
828
+ borderColor: {
829
+ rest: {
830
+ $value: '{borderColor.default}',
831
+ $type: 'color',
832
+ $extensions: {
833
+ 'org.primer.figma': {
834
+ collection: 'mode',
835
+ group: 'component (internal)',
836
+ scopes: [
837
+ 'borderColor',
838
+ ],
839
+ },
840
+ 'org.primer.overrides': {
841
+ dark: '{borderColor.default}',
842
+ 'dark-high-contrast': {
843
+ $value: '{borderColor.emphasis}',
844
+ },
845
+ },
846
+ },
847
+ },
848
+ disabled: {
849
+ $value: '{fgColor.disabled}',
850
+ $type: 'color',
851
+ $extensions: {
852
+ 'org.primer.figma': {
853
+ collection: 'mode',
854
+ group: 'component (internal)',
855
+ scopes: [
856
+ 'borderColor',
857
+ ],
858
+ },
859
+ 'org.primer.overrides': {
860
+ dark: '{fgColor.disabled}',
861
+ },
862
+ },
863
+ },
864
+ },
865
+ },
866
+ controlKnob: {
867
+ bgColor: {
868
+ rest: {
869
+ $value: '{base.color.neutral.0}',
870
+ $type: 'color',
871
+ $extensions: {
872
+ 'org.primer.figma': {
873
+ collection: 'mode',
874
+ group: 'component (internal)',
875
+ scopes: [
876
+ 'bgColor',
877
+ ],
878
+ },
879
+ 'org.primer.overrides': {
880
+ dark: '{bgColor.inset}',
881
+ },
882
+ },
883
+ },
884
+ disabled: {
885
+ $value: '{control.bgColor.disabled}',
886
+ $type: 'color',
887
+ $extensions: {
888
+ 'org.primer.figma': {
889
+ collection: 'mode',
890
+ group: 'component (internal)',
891
+ scopes: [
892
+ 'bgColor',
893
+ ],
894
+ },
895
+ 'org.primer.overrides': {
896
+ dark: '{control.bgColor.disabled}',
897
+ },
898
+ },
899
+ },
900
+ checked: {
901
+ $value: '{base.color.neutral.0}',
902
+ $type: 'color',
903
+ $extensions: {
904
+ 'org.primer.figma': {
905
+ collection: 'mode',
906
+ group: 'component (internal)',
907
+ scopes: [
908
+ 'bgColor',
909
+ ],
910
+ },
911
+ 'org.primer.overrides': {
912
+ dark: '{base.color.neutral.13}',
913
+ },
914
+ },
915
+ },
916
+ },
917
+ borderColor: {
918
+ rest: {
919
+ $value: '{control.borderColor.emphasis}',
920
+ $type: 'color',
921
+ $extensions: {
922
+ 'org.primer.figma': {
923
+ collection: 'mode',
924
+ group: 'component (internal)',
925
+ scopes: [
926
+ 'borderColor',
927
+ ],
928
+ },
929
+ 'org.primer.overrides': {
930
+ dark: '{control.borderColor.emphasis}',
931
+ },
932
+ },
933
+ },
934
+ disabled: {
935
+ $value: '{control.bgColor.disabled}',
936
+ $type: 'color',
937
+ $extensions: {
938
+ 'org.primer.figma': {
939
+ collection: 'mode',
940
+ group: 'component (internal)',
941
+ scopes: [
942
+ 'borderColor',
943
+ ],
944
+ },
945
+ 'org.primer.overrides': {
946
+ dark: '{control.bgColor.disabled}',
947
+ },
948
+ },
949
+ },
950
+ checked: {
951
+ $value: '{control.checked.bgColor.rest}',
952
+ $type: 'color',
953
+ $extensions: {
954
+ 'org.primer.figma': {
955
+ collection: 'mode',
956
+ group: 'component (internal)',
957
+ scopes: [
958
+ 'borderColor',
959
+ ],
960
+ },
961
+ 'org.primer.overrides': {
962
+ dark: '{control.checked.bgColor.rest}',
963
+ },
964
+ },
965
+ },
966
+ },
967
+ },
968
+ }