@bcc-code/design-tokens 5.0.3 → 5.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,2390 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+
6
+ export default {
7
+ "accordion": {
8
+ "panel": {
9
+ "border": {
10
+ "width": "{border-width.1}",
11
+ "color": "{color.border.default}"
12
+ }
13
+ },
14
+ "header": {
15
+ "color": "{color.text.subtle}",
16
+ "hover": {
17
+ "color": "{color.text.default}",
18
+ "background": "{color.elevation.surface.default}"
19
+ },
20
+ "active": {
21
+ "color": "{color.text.default}",
22
+ "background": "{color.elevation.surface.default}",
23
+ "hover": {
24
+ "background": "{color.elevation.surface.default}"
25
+ }
26
+ },
27
+ "padding": "{space.200}",
28
+ "font": {
29
+ "weight": "{font-weight.bold}"
30
+ },
31
+ "border": {
32
+ "radius": "0",
33
+ "width": "{border-width.0}",
34
+ "color": "{color.elevation.surface.default}"
35
+ },
36
+ "background": "{color.elevation.surface.default}",
37
+ "focus": {
38
+ "ring": {
39
+ "width": "{focus.ring.width}",
40
+ "style": "{focus.ring.style}",
41
+ "color": "{color.border.focused}",
42
+ "offset": "{focus.ring.offset}",
43
+ "shadow": "{focus.ring.shadow}"
44
+ }
45
+ },
46
+ "toggle": {
47
+ "icon": {
48
+ "color": "{color.icon.subtle}",
49
+ "hover": {
50
+ "color": "{color.icon.default}"
51
+ },
52
+ "active": {
53
+ "color": "{color.icon.default}",
54
+ "hover": {
55
+ "color": "{color.icon.default}"
56
+ }
57
+ }
58
+ }
59
+ },
60
+ "first": {
61
+ "top": {
62
+ "border": {
63
+ "radius": "{border-radius.sm}"
64
+ }
65
+ },
66
+ "border": {
67
+ "width": "{border-width.0}"
68
+ }
69
+ },
70
+ "last": {
71
+ "bottom": {
72
+ "border": {
73
+ "radius": "{border-radius.sm}"
74
+ }
75
+ },
76
+ "active": {
77
+ "bottom": {
78
+ "border": {
79
+ "radius": "0"
80
+ }
81
+ }
82
+ }
83
+ }
84
+ },
85
+ "content": {
86
+ "border": {
87
+ "width": "{border-width.0}",
88
+ "color": "{color.border.default}"
89
+ },
90
+ "background": "{color.elevation.surface.default}",
91
+ "color": "{color.text.default}",
92
+ "padding": "{space.200} 0 {space.200} {space.200}"
93
+ },
94
+ "transition": {
95
+ "duration": "{transition.duration}"
96
+ }
97
+ },
98
+ "autocomplete": {
99
+ "background": "{color.elevation.surface.default}",
100
+ "disabled": {
101
+ "background": "{color.background.disabled.default}",
102
+ "color": "{color.text.disabled}"
103
+ },
104
+ "filled": {
105
+ "background": "{color.background.accent.gray.subtler.default}",
106
+ "focus": {
107
+ "background": "{color.background.accent.gray.subtler.default}"
108
+ },
109
+ "hover": {
110
+ "background": "{color.background.accent.gray.subtler.default}"
111
+ }
112
+ },
113
+ "border": {
114
+ "color": "{color.border.default}",
115
+ "radius": "{border-radius.sm}"
116
+ },
117
+ "hover": {
118
+ "border": {
119
+ "color": "{color.border.input}"
120
+ }
121
+ },
122
+ "focus": {
123
+ "border": {
124
+ "color": "{color.border.focused}"
125
+ },
126
+ "ring": {
127
+ "width": "{form.field.focus.ring.width}",
128
+ "style": "{form.field.focus.ring.style}",
129
+ "color": "{color.transparent}",
130
+ "offset": "{form.field.focus.ring.offset}",
131
+ "shadow": "{form.field.focus.ring.shadow}"
132
+ }
133
+ },
134
+ "invalid": {
135
+ "border": {
136
+ "color": "{color.border.danger}"
137
+ },
138
+ "placeholder": {
139
+ "color": "{color.text.danger}"
140
+ }
141
+ },
142
+ "color": "{color.text.default}",
143
+ "placeholder": {
144
+ "color": "{color.text.subtlest}"
145
+ },
146
+ "shadow": "{form.field.shadow}",
147
+ "padding": {
148
+ "x": "{space.75}",
149
+ "y": "{space.25}"
150
+ },
151
+ "overlay": {
152
+ "background": "{color.elevation.surface.default}",
153
+ "border": {
154
+ "color": "{color.border.default}",
155
+ "radius": "{border-radius.sm}"
156
+ },
157
+ "color": "{overlay.select.color}",
158
+ "shadow": "{overlay.select.shadow}"
159
+ },
160
+ "list": {
161
+ "padding": "{space.100}",
162
+ "gap": "{space.25}"
163
+ },
164
+ "option": {
165
+ "focus": {
166
+ "background": "{color.background.accent.gray.subtle.hover}",
167
+ "color": "{color.text.default}"
168
+ },
169
+ "selected": {
170
+ "background": "{color.background.brand.subtlest.default}",
171
+ "focus": {
172
+ "background": "{color.background.brand.subtler.default}",
173
+ "color": "{color.text.selected}"
174
+ },
175
+ "color": "{color.text.selected}"
176
+ },
177
+ "color": "{color.text.subtle}",
178
+ "padding": "{space.150} {space.100}",
179
+ "border": {
180
+ "radius": "{border-radius.xs}"
181
+ },
182
+ "group": {
183
+ "background": "{color.elevation.surface.default}",
184
+ "color": "{color.text.subtlest}",
185
+ "font": {
186
+ "weight": "{list.option.group.font.weight}"
187
+ },
188
+ "padding": "{space.100} {space.150}"
189
+ }
190
+ },
191
+ "dropdown": {
192
+ "width": "{space.500}",
193
+ "border": {
194
+ "color": "{color.border.default}",
195
+ "radius": "{border-radius.sm}"
196
+ },
197
+ "hover": {
198
+ "border": {
199
+ "color": "{color.border.default}"
200
+ },
201
+ "background": "{surface.700}",
202
+ "color": "{surface.200}"
203
+ },
204
+ "active": {
205
+ "border": {
206
+ "color": "{color.border.default}"
207
+ },
208
+ "background": "{surface.600}",
209
+ "color": "{surface.100}"
210
+ },
211
+ "focus": {
212
+ "ring": {
213
+ "width": "{focus.ring.width}",
214
+ "offset": "{focus.ring.offset}",
215
+ "style": "{focus.ring.style}",
216
+ "color": "{color.border.focused}",
217
+ "shadow": "{focus.ring.shadow}"
218
+ }
219
+ },
220
+ "sm": {
221
+ "width": "{space.400}"
222
+ },
223
+ "lg": {
224
+ "width": "{space.600}"
225
+ },
226
+ "background": "{surface.800}",
227
+ "color": "{surface.300}"
228
+ },
229
+ "chip": {
230
+ "border": {
231
+ "radius": "{border-radius.xs}"
232
+ },
233
+ "focus": {
234
+ "background": "{surface.700}",
235
+ "color": "{surface.0}"
236
+ }
237
+ },
238
+ "empty": {
239
+ "message": {
240
+ "padding": "{space.150} {space.100}"
241
+ }
242
+ },
243
+ "transition": {
244
+ "duration": "{transition.duration}"
245
+ }
246
+ },
247
+ "avatar": {
248
+ "width": "{space.400}",
249
+ "height": "{space.400}",
250
+ "font": {
251
+ "size": "{font-size.md}"
252
+ },
253
+ "background": "{color.background.accent.gray.default}",
254
+ "border": {
255
+ "radius": "{border-radius.sm}"
256
+ },
257
+ "group": {
258
+ "border": {
259
+ "color": "{color.border.inverse}"
260
+ },
261
+ "offset": "{space.negative.150}",
262
+ "stroke": "2px solid #18191a"
263
+ },
264
+ "lg": {
265
+ "width": "{space.500}",
266
+ "height": "{space.500}",
267
+ "font": {
268
+ "size": "{font-size.lg}"
269
+ },
270
+ "icon": {
271
+ "size": "{icon-size.md}"
272
+ },
273
+ "group": {
274
+ "offset": "{space.negative.200}"
275
+ }
276
+ },
277
+ "xl": {
278
+ "width": "{space.800}",
279
+ "height": "{space.800}",
280
+ "font": {
281
+ "size": "{font-size.2xl}"
282
+ },
283
+ "icon": {
284
+ "size": "{icon-size.lg}"
285
+ },
286
+ "group": {
287
+ "offset": "{space.negative.300}"
288
+ }
289
+ },
290
+ "color": "{color.text.default}",
291
+ "icon": {
292
+ "size": "{icon-size.sm}"
293
+ }
294
+ },
295
+ "badge": {
296
+ "border": {
297
+ "radius": "{border-radius.sm}"
298
+ },
299
+ "padding": "{space.50}",
300
+ "font": {
301
+ "size": "{font-size.xs}",
302
+ "weight": "{font-weight.bold}"
303
+ },
304
+ "min": {
305
+ "width": "{space.250}"
306
+ },
307
+ "height": "{space.250}",
308
+ "dot": {
309
+ "size": "{space.100}"
310
+ },
311
+ "sm": {
312
+ "font": {
313
+ "size": "{font-size.xs}"
314
+ },
315
+ "min": {
316
+ "width": "{space.200}"
317
+ },
318
+ "height": "{space.200}"
319
+ },
320
+ "lg": {
321
+ "font": {
322
+ "size": "{font-size.sm}"
323
+ },
324
+ "min": {
325
+ "width": "{space.300}"
326
+ },
327
+ "height": "{space.300}"
328
+ },
329
+ "xl": {
330
+ "font": {
331
+ "size": "{font-size.md}"
332
+ },
333
+ "min": {
334
+ "width": "{space.400}"
335
+ },
336
+ "height": "{space.400}"
337
+ },
338
+ "primary": {
339
+ "background": "{primary.color}",
340
+ "color": "{primary.contrast.color}"
341
+ },
342
+ "secondary": {
343
+ "background": "{surface.800}",
344
+ "color": "{surface.300}"
345
+ },
346
+ "success": {
347
+ "background": "{green.400}",
348
+ "color": "{green.950}"
349
+ },
350
+ "info": {
351
+ "background": "{sky.400}",
352
+ "color": "{sky.950}"
353
+ },
354
+ "warn": {
355
+ "background": "{orange.400}",
356
+ "color": "{orange.950}"
357
+ },
358
+ "danger": {
359
+ "background": "{red.400}",
360
+ "color": "{red.950}"
361
+ },
362
+ "contrast": {
363
+ "background": "{surface.0}",
364
+ "color": "{surface.950}"
365
+ }
366
+ },
367
+ "button": {
368
+ "border": {
369
+ "radius": "{border-radius.md}"
370
+ },
371
+ "rounded": {
372
+ "border": {
373
+ "radius": "2rem"
374
+ }
375
+ },
376
+ "gap": "{space.100}",
377
+ "padding": {
378
+ "x": "{space.200}",
379
+ "y": "{space.75}"
380
+ },
381
+ "icon": {
382
+ "only": {
383
+ "width": "{space.500}"
384
+ }
385
+ },
386
+ "sm": {
387
+ "font": {
388
+ "size": "{font-size.sm}"
389
+ },
390
+ "padding": {
391
+ "x": "{space.150}",
392
+ "y": "{space.50}"
393
+ },
394
+ "icon": {
395
+ "only": {
396
+ "width": "{space.400}"
397
+ }
398
+ }
399
+ },
400
+ "lg": {
401
+ "font": {
402
+ "size": "{font-size.lg}"
403
+ },
404
+ "padding": {
405
+ "x": "{space.250}",
406
+ "y": "{space.100}"
407
+ },
408
+ "icon": {
409
+ "only": {
410
+ "width": "{space.600}"
411
+ }
412
+ }
413
+ },
414
+ "label": {
415
+ "font": {
416
+ "weight": "{font-weight.medium}"
417
+ }
418
+ },
419
+ "raised": {
420
+ "shadow": "0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12)"
421
+ },
422
+ "focus": {
423
+ "ring": {
424
+ "width": "{focus.ring.width}",
425
+ "offset": "{focus.ring.offset}",
426
+ "style": "{focus.ring.style}"
427
+ }
428
+ },
429
+ "badge": {
430
+ "size": "{space.200}"
431
+ },
432
+ "transition": {
433
+ "duration": "{form.field.transition.duration}"
434
+ },
435
+ "primary": {
436
+ "background": "{primary.color}",
437
+ "hover": {
438
+ "background": "{primary.hover.color}",
439
+ "border": {
440
+ "color": "{primary.hover.color}"
441
+ },
442
+ "color": "{primary.contrast.color}"
443
+ },
444
+ "active": {
445
+ "background": "{primary.active.color}",
446
+ "border": {
447
+ "color": "{primary.active.color}"
448
+ },
449
+ "color": "{primary.contrast.color}"
450
+ },
451
+ "border": {
452
+ "color": "{primary.color}"
453
+ },
454
+ "color": "{primary.contrast.color}",
455
+ "focus": {
456
+ "ring": {
457
+ "color": "{primary.color}",
458
+ "shadow": "0 0 0 0 #00000000"
459
+ }
460
+ }
461
+ },
462
+ "secondary": {
463
+ "background": "{surface.800}",
464
+ "hover": {
465
+ "background": "{surface.700}",
466
+ "border": {
467
+ "color": "{surface.700}"
468
+ },
469
+ "color": "{surface.200}"
470
+ },
471
+ "active": {
472
+ "background": "{surface.600}",
473
+ "border": {
474
+ "color": "{surface.600}"
475
+ },
476
+ "color": "{surface.100}"
477
+ },
478
+ "border": {
479
+ "color": "{surface.800}"
480
+ },
481
+ "color": "{surface.300}",
482
+ "focus": {
483
+ "ring": {
484
+ "color": "{surface.300}",
485
+ "shadow": "0 0 0 0 #00000000"
486
+ }
487
+ }
488
+ },
489
+ "info": {
490
+ "background": "{sky.400}",
491
+ "hover": {
492
+ "background": "{sky.300}",
493
+ "border": {
494
+ "color": "{sky.300}"
495
+ },
496
+ "color": "{sky.950}"
497
+ },
498
+ "active": {
499
+ "background": "{sky.200}",
500
+ "border": {
501
+ "color": "{sky.200}"
502
+ },
503
+ "color": "{sky.950}"
504
+ },
505
+ "border": {
506
+ "color": "{sky.400}"
507
+ },
508
+ "color": "{sky.950}",
509
+ "focus": {
510
+ "ring": {
511
+ "color": "{sky.400}",
512
+ "shadow": "0 0 0 0 #00000000"
513
+ }
514
+ }
515
+ },
516
+ "success": {
517
+ "background": "{green.400}",
518
+ "hover": {
519
+ "background": "{green.300}",
520
+ "border": {
521
+ "color": "{green.300}"
522
+ },
523
+ "color": "{green.950}"
524
+ },
525
+ "active": {
526
+ "background": "{green.200}",
527
+ "border": {
528
+ "color": "{green.200}"
529
+ },
530
+ "color": "{green.950}"
531
+ },
532
+ "border": {
533
+ "color": "{green.400}"
534
+ },
535
+ "color": "{green.950}",
536
+ "focus": {
537
+ "ring": {
538
+ "color": "{green.400}",
539
+ "shadow": "0 0 0 0 #00000000"
540
+ }
541
+ }
542
+ },
543
+ "warn": {
544
+ "background": "{orange.400}",
545
+ "hover": {
546
+ "background": "{orange.300}",
547
+ "border": {
548
+ "color": "{orange.300}"
549
+ },
550
+ "color": "{orange.950}"
551
+ },
552
+ "active": {
553
+ "background": "{orange.200}",
554
+ "border": {
555
+ "color": "{orange.200}"
556
+ },
557
+ "color": "{orange.950}"
558
+ },
559
+ "border": {
560
+ "color": "{orange.400}"
561
+ },
562
+ "color": "{orange.950}",
563
+ "focus": {
564
+ "ring": {
565
+ "color": "{orange.400}",
566
+ "shadow": "0 0 0 0 #00000000"
567
+ }
568
+ }
569
+ },
570
+ "help": {
571
+ "background": "{purple.400}",
572
+ "hover": {
573
+ "background": "{purple.300}",
574
+ "border": {
575
+ "color": "{purple.300}"
576
+ },
577
+ "color": "{purple.950}"
578
+ },
579
+ "active": {
580
+ "background": "{purple.200}",
581
+ "border": {
582
+ "color": "{purple.200}"
583
+ },
584
+ "color": "{purple.950}"
585
+ },
586
+ "border": {
587
+ "color": "{purple.400}"
588
+ },
589
+ "color": "{purple.950}",
590
+ "focus": {
591
+ "ring": {
592
+ "color": "{purple.400}",
593
+ "shadow": "0 0 0 0 #00000000"
594
+ }
595
+ }
596
+ },
597
+ "danger": {
598
+ "background": "{red.400}",
599
+ "hover": {
600
+ "background": "{red.300}",
601
+ "border": {
602
+ "color": "{red.300}"
603
+ },
604
+ "color": "{red.950}"
605
+ },
606
+ "active": {
607
+ "background": "{red.200}",
608
+ "border": {
609
+ "color": "{red.200}"
610
+ },
611
+ "color": "{red.950}"
612
+ },
613
+ "border": {
614
+ "color": "{red.400}"
615
+ },
616
+ "color": "{red.950}",
617
+ "focus": {
618
+ "ring": {
619
+ "color": "{red.400}",
620
+ "shadow": "0 0 0 0 #00000000"
621
+ }
622
+ }
623
+ },
624
+ "contrast": {
625
+ "background": "{surface.0}",
626
+ "hover": {
627
+ "background": "{surface.100}",
628
+ "border": {
629
+ "color": "{surface.100}"
630
+ },
631
+ "color": "{surface.950}"
632
+ },
633
+ "active": {
634
+ "background": "{surface.200}",
635
+ "border": {
636
+ "color": "{surface.200}"
637
+ },
638
+ "color": "{surface.950}"
639
+ },
640
+ "border": {
641
+ "color": "{surface.0}"
642
+ },
643
+ "color": "{surface.950}",
644
+ "focus": {
645
+ "ring": {
646
+ "color": "{surface.0}",
647
+ "shadow": "0 0 0 0 #00000000"
648
+ }
649
+ }
650
+ },
651
+ "outlined": {
652
+ "primary": {
653
+ "hover": {
654
+ "background": "{primary.color}"
655
+ },
656
+ "active": {
657
+ "background": "{primary.color}"
658
+ },
659
+ "border": {
660
+ "color": "{primary.700}"
661
+ },
662
+ "color": "{primary.color}"
663
+ },
664
+ "secondary": {
665
+ "hover": {
666
+ "background": "rgba(255, 255, 255, 0.04)"
667
+ },
668
+ "active": {
669
+ "background": "rgba(255, 255, 255, 0.16)"
670
+ },
671
+ "border": {
672
+ "color": "{surface.700}"
673
+ },
674
+ "color": "{surface.400}"
675
+ },
676
+ "success": {
677
+ "hover": {
678
+ "background": "{green.400}"
679
+ },
680
+ "active": {
681
+ "background": "{green.400}"
682
+ },
683
+ "border": {
684
+ "color": "{green.700}"
685
+ },
686
+ "color": "{green.400}"
687
+ },
688
+ "info": {
689
+ "hover": {
690
+ "background": "{sky.400}"
691
+ },
692
+ "active": {
693
+ "background": "{sky.400}"
694
+ },
695
+ "border": {
696
+ "color": "{sky.700}"
697
+ },
698
+ "color": "{sky.400}"
699
+ },
700
+ "warn": {
701
+ "hover": {
702
+ "background": "{orange.400}"
703
+ },
704
+ "active": {
705
+ "background": "{orange.400}"
706
+ },
707
+ "border": {
708
+ "color": "{orange.700}"
709
+ },
710
+ "color": "{orange.400}"
711
+ },
712
+ "help": {
713
+ "hover": {
714
+ "background": "{purple.400}"
715
+ },
716
+ "active": {
717
+ "background": "{purple.400}"
718
+ },
719
+ "border": {
720
+ "color": "{purple.700}"
721
+ },
722
+ "color": "{purple.400}"
723
+ },
724
+ "danger": {
725
+ "hover": {
726
+ "background": "{red.400}"
727
+ },
728
+ "active": {
729
+ "background": "{red.400}"
730
+ },
731
+ "border": {
732
+ "color": "{red.700}"
733
+ },
734
+ "color": "{red.400}"
735
+ },
736
+ "contrast": {
737
+ "hover": {
738
+ "background": "{surface.800}"
739
+ },
740
+ "active": {
741
+ "background": "{surface.700}"
742
+ },
743
+ "border": {
744
+ "color": "{surface.500}"
745
+ },
746
+ "color": "{surface.0}"
747
+ },
748
+ "plain": {
749
+ "hover": {
750
+ "background": "{surface.800}"
751
+ },
752
+ "active": {
753
+ "background": "{surface.700}"
754
+ },
755
+ "border": {
756
+ "color": "{surface.600}"
757
+ },
758
+ "color": "{surface.0}"
759
+ }
760
+ },
761
+ "text": {
762
+ "primary": {
763
+ "hover": {
764
+ "background": "{primary.color}"
765
+ },
766
+ "active": {
767
+ "background": "{primary.color}"
768
+ },
769
+ "color": "{primary.color}"
770
+ },
771
+ "secondary": {
772
+ "hover": {
773
+ "background": "{surface.800}"
774
+ },
775
+ "active": {
776
+ "background": "{surface.700}"
777
+ },
778
+ "color": "{surface.400}"
779
+ },
780
+ "success": {
781
+ "hover": {
782
+ "background": "{green.400}"
783
+ },
784
+ "active": {
785
+ "background": "{green.400}"
786
+ },
787
+ "color": "{green.400}"
788
+ },
789
+ "info": {
790
+ "hover": {
791
+ "background": "{sky.400}"
792
+ },
793
+ "active": {
794
+ "background": "{sky.400}"
795
+ },
796
+ "color": "{sky.400}"
797
+ },
798
+ "warn": {
799
+ "hover": {
800
+ "background": "{orange.400}"
801
+ },
802
+ "active": {
803
+ "background": "{orange.400}"
804
+ },
805
+ "color": "{orange.400}"
806
+ },
807
+ "help": {
808
+ "hover": {
809
+ "background": "{purple.400}"
810
+ },
811
+ "active": {
812
+ "background": "{purple.400}"
813
+ },
814
+ "color": "{purple.400}"
815
+ },
816
+ "danger": {
817
+ "hover": {
818
+ "background": "{red.400}"
819
+ },
820
+ "active": {
821
+ "background": "{red.400}"
822
+ },
823
+ "color": "{red.400}"
824
+ },
825
+ "plain": {
826
+ "hover": {
827
+ "background": "{surface.800}"
828
+ },
829
+ "active": {
830
+ "background": "{surface.700}"
831
+ },
832
+ "color": "{surface.0}"
833
+ },
834
+ "contrast": {
835
+ "hover": {
836
+ "background": "{surface.800}"
837
+ },
838
+ "active": {
839
+ "background": "{surface.700}"
840
+ },
841
+ "color": "{surface.0}"
842
+ }
843
+ },
844
+ "link": {
845
+ "color": "{primary.color}",
846
+ "hover": {
847
+ "color": "{primary.color}"
848
+ },
849
+ "active": {
850
+ "color": "{primary.color}"
851
+ }
852
+ }
853
+ },
854
+ "checkbox": {
855
+ "border": {
856
+ "radius": "{border-radius.xs}",
857
+ "color": "{color.border.default}"
858
+ },
859
+ "width": "{space.250}",
860
+ "height": "{space.250}",
861
+ "background": "{color.elevation.surface.default}",
862
+ "checked": {
863
+ "background": "{color.background.brand.bolder.default}",
864
+ "hover": {
865
+ "background": "{color.background.brand.bolder.hover}",
866
+ "border": {
867
+ "color": "{color.background.brand.bolder.hover}"
868
+ }
869
+ },
870
+ "border": {
871
+ "color": "{color.background.brand.bolder.default}"
872
+ },
873
+ "focus": {
874
+ "border": {
875
+ "color": "{color.border.focused}"
876
+ }
877
+ },
878
+ "disabled": {
879
+ "border": {
880
+ "color": "{color.border.disabled}"
881
+ }
882
+ }
883
+ },
884
+ "disabled": {
885
+ "background": "{color.background.disabled.default}"
886
+ },
887
+ "filled": {
888
+ "background": "{color.background.accent.gray.subtler.default}"
889
+ },
890
+ "hover": {
891
+ "border": {
892
+ "color": "{color.border.bold}"
893
+ }
894
+ },
895
+ "focus": {
896
+ "border": {
897
+ "color": "{color.border.focused}"
898
+ },
899
+ "ring": {
900
+ "width": "{focus.ring.width}",
901
+ "style": "{focus.ring.style}",
902
+ "color": "{color.border.focused}",
903
+ "offset": "{focus.ring.offset}",
904
+ "shadow": "{focus.ring.shadow}"
905
+ }
906
+ },
907
+ "invalid": {
908
+ "border": {
909
+ "color": "{color.border.danger}"
910
+ }
911
+ },
912
+ "shadow": "{form.field.shadow}",
913
+ "icon": {
914
+ "size": "{icon-size.xs}",
915
+ "color": "{color.icon.inverse}",
916
+ "checked": {
917
+ "color": "{color.icon.inverse}",
918
+ "hover": {
919
+ "color": "{color.icon.inverse}"
920
+ }
921
+ },
922
+ "disabled": {
923
+ "color": "{color.icon.disabled}"
924
+ },
925
+ "sm": {
926
+ "size": "{icon-size.xs}"
927
+ },
928
+ "lg": {
929
+ "size": "{icon-size.sm}"
930
+ }
931
+ },
932
+ "sm": {
933
+ "width": "{space.200}",
934
+ "height": "{space.200}"
935
+ },
936
+ "lg": {
937
+ "width": "{space.300}",
938
+ "height": "{space.300}"
939
+ },
940
+ "transition": {
941
+ "duration": "{form.field.transition.duration}"
942
+ }
943
+ },
944
+ "chip": {
945
+ "border": {
946
+ "radius": "{border-radius.md}"
947
+ },
948
+ "padding": {
949
+ "x": "{space.150}",
950
+ "y": "{space.100}"
951
+ },
952
+ "gap": "{space.100}",
953
+ "image": {
954
+ "width": "{space.400}",
955
+ "height": "{space.400}"
956
+ },
957
+ "icon": {
958
+ "size": "{space.250}",
959
+ "color": "{surface.0}"
960
+ },
961
+ "remove": {
962
+ "icon": {
963
+ "focus": {
964
+ "ring": {
965
+ "width": "{focus.ring.width}",
966
+ "style": "{focus.ring.style}",
967
+ "offset": "{focus.ring.offset}",
968
+ "color": "{color.border.focused}",
969
+ "shadow": "{form.field.focus.ring.shadow}"
970
+ }
971
+ },
972
+ "size": "{space.250}",
973
+ "color": "{surface.0}"
974
+ }
975
+ },
976
+ "transition": {
977
+ "duration": "{transition.duration}"
978
+ },
979
+ "background": "{surface.800}",
980
+ "color": "{surface.0}"
981
+ },
982
+ "divider": {
983
+ "border": {
984
+ "color": "{color.border.default}"
985
+ },
986
+ "content": {
987
+ "background": "{color.transparent}",
988
+ "color": "{color.text.default}"
989
+ },
990
+ "horizontal": {
991
+ "margin": "{space.200} 0",
992
+ "padding": "{space.100}",
993
+ "content": {
994
+ "padding": "0 {space.100}"
995
+ }
996
+ },
997
+ "vertical": {
998
+ "margin": "0 {space.200}",
999
+ "padding": "{space.100}",
1000
+ "content": {
1001
+ "padding": "{space.100} 0"
1002
+ }
1003
+ }
1004
+ },
1005
+ "inputgroup": {
1006
+ "addon": {
1007
+ "background": "{color.elevation.surface.default}",
1008
+ "border": {
1009
+ "color": "{color.border.input}",
1010
+ "radius": "{border-radius.sm}"
1011
+ },
1012
+ "color": "{color.text.subtle}",
1013
+ "padding": "{space.100}",
1014
+ "min": {
1015
+ "width": "{space.500}"
1016
+ }
1017
+ }
1018
+ },
1019
+ "inputtext": {
1020
+ "background": "{color.elevation.surface.default}",
1021
+ "disabled": {
1022
+ "background": "{color.background.disabled.default}",
1023
+ "color": "{color.text.disabled}"
1024
+ },
1025
+ "filled": {
1026
+ "background": "{color.background.accent.gray.subtler.default}",
1027
+ "focus": {
1028
+ "background": "{color.background.accent.gray.subtler.default}"
1029
+ },
1030
+ "hover": {
1031
+ "background": "{color.background.accent.gray.subtler.default}"
1032
+ }
1033
+ },
1034
+ "border": {
1035
+ "color": "{color.border.default}",
1036
+ "radius": "{border-radius.sm}"
1037
+ },
1038
+ "hover": {
1039
+ "border": {
1040
+ "color": "{color.border.input}"
1041
+ }
1042
+ },
1043
+ "focus": {
1044
+ "border": {
1045
+ "color": "{color.border.focused}"
1046
+ },
1047
+ "ring": {
1048
+ "width": "{form.field.focus.ring.width}",
1049
+ "style": "{form.field.focus.ring.style}",
1050
+ "color": "{color.transparent}",
1051
+ "offset": "{form.field.focus.ring.offset}",
1052
+ "shadow": "{form.field.focus.ring.shadow}"
1053
+ }
1054
+ },
1055
+ "invalid": {
1056
+ "border": {
1057
+ "color": "{color.border.danger}"
1058
+ },
1059
+ "placeholder": {
1060
+ "color": "{color.text.danger}"
1061
+ }
1062
+ },
1063
+ "color": "{color.text.default}",
1064
+ "placeholder": {
1065
+ "color": "{color.text.subtlest}"
1066
+ },
1067
+ "shadow": "{form.field.shadow}",
1068
+ "padding": {
1069
+ "x": "{space.150}",
1070
+ "y": "{space.50}"
1071
+ },
1072
+ "sm": {
1073
+ "font": {
1074
+ "size": "{font-size.sm}"
1075
+ },
1076
+ "padding": {
1077
+ "x": "{space.150}",
1078
+ "y": "{space.25}"
1079
+ }
1080
+ },
1081
+ "lg": {
1082
+ "padding": {
1083
+ "x": "{space.150}",
1084
+ "y": "{space.100}"
1085
+ },
1086
+ "font": {
1087
+ "size": "{font-size.lg}"
1088
+ }
1089
+ },
1090
+ "transition": {
1091
+ "duration": "{form.field.transition.duration}"
1092
+ }
1093
+ },
1094
+ "listbox": {
1095
+ "background": "{color.elevation.surface.default}",
1096
+ "disabled": {
1097
+ "background": "{color.background.disabled.default}",
1098
+ "color": "{color.background.accent.gray.default}"
1099
+ },
1100
+ "border": {
1101
+ "color": "{color.border.default}",
1102
+ "radius": "{border-radius.sm}"
1103
+ },
1104
+ "invalid": {
1105
+ "border": {
1106
+ "color": "{color.border.danger}"
1107
+ }
1108
+ },
1109
+ "color": "{color.elevation.surface.default}",
1110
+ "shadow": "{form.field.shadow}",
1111
+ "list": {
1112
+ "padding": "{space.100}",
1113
+ "gap": "{space.25}",
1114
+ "header": {
1115
+ "padding": "{space.100}"
1116
+ }
1117
+ },
1118
+ "option": {
1119
+ "focus": {
1120
+ "background": "{color.background.accent.gray.subtle.hover}",
1121
+ "color": "{color.text.default}"
1122
+ },
1123
+ "selected": {
1124
+ "background": "{color.background.brand.subtlest.default}",
1125
+ "focus": {
1126
+ "background": "{color.background.brand.subtler.default}",
1127
+ "color": "{color.text.selected}"
1128
+ },
1129
+ "color": "{color.text.selected}"
1130
+ },
1131
+ "color": "{color.text.subtle}",
1132
+ "padding": "{space.150} {space.100}",
1133
+ "border": {
1134
+ "radius": "{border-radius.xs}"
1135
+ },
1136
+ "group": {
1137
+ "background": "{color.elevation.surface.default}",
1138
+ "color": "{color.text.subtlest}",
1139
+ "font": {
1140
+ "weight": "{list.option.group.font.weight}"
1141
+ },
1142
+ "padding": "{space.150}"
1143
+ },
1144
+ "striped": {
1145
+ "background": "{surface.900}"
1146
+ }
1147
+ },
1148
+ "checkmark": {
1149
+ "color": "{color.icon.subtle}",
1150
+ "gutter": {
1151
+ "start": "{space.negative.75}",
1152
+ "end": "{space.75}"
1153
+ }
1154
+ },
1155
+ "empty": {
1156
+ "message": {
1157
+ "padding": "{space.150} {space.100}"
1158
+ }
1159
+ },
1160
+ "transition": {
1161
+ "duration": "{form.field.transition.duration}"
1162
+ }
1163
+ },
1164
+ "message": {
1165
+ "border": {
1166
+ "radius": "{border-radius.sm}",
1167
+ "width": "{border-width.1}"
1168
+ },
1169
+ "content": {
1170
+ "padding": "{space.75} {space.150}",
1171
+ "gap": "{space.100}",
1172
+ "sm": {
1173
+ "padding": "{space.25} {space.100}"
1174
+ },
1175
+ "lg": {
1176
+ "padding": "{space.100} {space.200}"
1177
+ }
1178
+ },
1179
+ "text": {
1180
+ "font": {
1181
+ "size": "{font-size.sm}",
1182
+ "weight": "{font-weight.medium}"
1183
+ },
1184
+ "sm": {
1185
+ "font": {
1186
+ "size": "{font-size.sm}"
1187
+ }
1188
+ },
1189
+ "lg": {
1190
+ "font": {
1191
+ "size": "{font-size.md}"
1192
+ }
1193
+ }
1194
+ },
1195
+ "icon": {
1196
+ "size": "{space.250}",
1197
+ "sm": {
1198
+ "size": "{space.250}"
1199
+ },
1200
+ "lg": {
1201
+ "size": "{space.250}"
1202
+ }
1203
+ },
1204
+ "close": {
1205
+ "button": {
1206
+ "width": "{space.300}",
1207
+ "height": "{space.300}",
1208
+ "border": {
1209
+ "radius": "{border-radius.lg}"
1210
+ },
1211
+ "focus": {
1212
+ "ring": {
1213
+ "width": "{focus.ring.width}",
1214
+ "style": "{focus.ring.style}",
1215
+ "offset": "{focus.ring.offset}"
1216
+ }
1217
+ }
1218
+ },
1219
+ "icon": {
1220
+ "size": "{space.250}",
1221
+ "sm": {
1222
+ "size": "{space.150}"
1223
+ },
1224
+ "lg": {
1225
+ "size": "{space.200}"
1226
+ }
1227
+ }
1228
+ },
1229
+ "outlined": {
1230
+ "border": {
1231
+ "width": "{border-width.1}"
1232
+ }
1233
+ },
1234
+ "simple": {
1235
+ "content": {
1236
+ "padding": "{space.0}"
1237
+ }
1238
+ },
1239
+ "transition": {
1240
+ "duration": "{transition.duration}"
1241
+ },
1242
+ "info": {
1243
+ "background": "{color.background.information.default}",
1244
+ "border": {
1245
+ "color": "{color.border.information}"
1246
+ },
1247
+ "color": "{color.text.information}",
1248
+ "shadow": "0 4px 8px 0 rgba(2, 5, 10, 0.04)",
1249
+ "close": {
1250
+ "button": {
1251
+ "hover": {
1252
+ "background": "{color.background.information.hover}"
1253
+ },
1254
+ "focus": {
1255
+ "ring": {
1256
+ "color": "{color.border.information}",
1257
+ "shadow": "0 0 0 0 #00000000"
1258
+ }
1259
+ }
1260
+ }
1261
+ },
1262
+ "outlined": {
1263
+ "color": "{color.text.information}",
1264
+ "border": {
1265
+ "color": "{color.border.information}"
1266
+ }
1267
+ },
1268
+ "simple": {
1269
+ "color": "{color.text.information}"
1270
+ }
1271
+ },
1272
+ "success": {
1273
+ "background": "{color.background.success.default}",
1274
+ "border": {
1275
+ "color": "{color.border.success}"
1276
+ },
1277
+ "color": "{color.text.success}",
1278
+ "shadow": "0 4px 8px 0 rgba(1, 8, 4, 0.04)",
1279
+ "close": {
1280
+ "button": {
1281
+ "hover": {
1282
+ "background": "{color.background.success.hover}"
1283
+ },
1284
+ "focus": {
1285
+ "ring": {
1286
+ "color": "{color.border.success}",
1287
+ "shadow": "0 0 0 0 #00000000"
1288
+ }
1289
+ }
1290
+ }
1291
+ },
1292
+ "outlined": {
1293
+ "color": "{color.text.success}",
1294
+ "border": {
1295
+ "color": "{color.border.success}"
1296
+ }
1297
+ },
1298
+ "simple": {
1299
+ "color": "{color.text.success}"
1300
+ }
1301
+ },
1302
+ "warn": {
1303
+ "background": "{color.background.accent.orange.subtlest.default}",
1304
+ "border": {
1305
+ "color": "{color.border.accent.orange}"
1306
+ },
1307
+ "shadow": "0 4px 8px 0 rgba(9, 7, 0, 0.04)",
1308
+ "close": {
1309
+ "button": {
1310
+ "hover": {
1311
+ "background": "{color.background.accent.orange.subtlest.hover}"
1312
+ },
1313
+ "focus": {
1314
+ "ring": {
1315
+ "color": "{color.border.accent.orange}",
1316
+ "shadow": "0 0 0 0 #00000000"
1317
+ }
1318
+ }
1319
+ }
1320
+ },
1321
+ "color": "{color.text.accent.orange.default}",
1322
+ "outlined": {
1323
+ "color": "{color.text.accent.orange.default}",
1324
+ "border": {
1325
+ "color": "{color.border.accent.orange}"
1326
+ }
1327
+ },
1328
+ "simple": {
1329
+ "color": "{color.text.accent.orange.default}"
1330
+ }
1331
+ },
1332
+ "error": {
1333
+ "background": "{color.background.danger.default}",
1334
+ "border": {
1335
+ "color": "{color.border.danger}"
1336
+ },
1337
+ "color": "{color.text.danger}",
1338
+ "close": {
1339
+ "button": {
1340
+ "hover": {
1341
+ "background": "{color.background.danger.hover}"
1342
+ },
1343
+ "focus": {
1344
+ "ring": {
1345
+ "color": "{color.border.danger}",
1346
+ "shadow": "0 0 0 0 #00000000"
1347
+ }
1348
+ }
1349
+ }
1350
+ },
1351
+ "shadow": "0 4px 8px 0 rgba(10, 3, 3, 0.04)",
1352
+ "outlined": {
1353
+ "color": "{color.text.danger}",
1354
+ "border": {
1355
+ "color": "{color.border.danger}"
1356
+ }
1357
+ },
1358
+ "simple": {
1359
+ "color": "{color.text.danger}"
1360
+ }
1361
+ },
1362
+ "secondary": {
1363
+ "background": "{color.background.accent.gray.subtler.default}",
1364
+ "border": {
1365
+ "color": "{color.border.accent.gray}"
1366
+ },
1367
+ "color": "{color.text.default}",
1368
+ "shadow": "0 4px 8px 0 rgba(4, 5, 6, 0.04)",
1369
+ "close": {
1370
+ "button": {
1371
+ "hover": {
1372
+ "background": "{color.background.accent.gray.subtler.hover}"
1373
+ },
1374
+ "focus": {
1375
+ "ring": {
1376
+ "color": "{color.border.accent.gray}",
1377
+ "shadow": "0 0 0 0 #00000000"
1378
+ }
1379
+ }
1380
+ }
1381
+ },
1382
+ "outlined": {
1383
+ "color": "{color.text.default}",
1384
+ "border": {
1385
+ "color": "{color.border.accent.gray}"
1386
+ }
1387
+ },
1388
+ "simple": {
1389
+ "color": "{color.text.default}"
1390
+ }
1391
+ },
1392
+ "contrast": {
1393
+ "background": "{color.background.accent.gray.boldest.default}",
1394
+ "border": {
1395
+ "color": "{color.background.accent.gray.boldest.default}"
1396
+ },
1397
+ "color": "{color.text.inverse}",
1398
+ "shadow": "0 4px 8px 0 rgba(0, 0, 1, 0.04)",
1399
+ "close": {
1400
+ "button": {
1401
+ "hover": {
1402
+ "background": "{color.background.accent.gray.boldest.hover}"
1403
+ },
1404
+ "focus": {
1405
+ "ring": {
1406
+ "color": "{color.border.inverse}",
1407
+ "shadow": "0 0 0 0 #00000000"
1408
+ }
1409
+ }
1410
+ }
1411
+ },
1412
+ "outlined": {
1413
+ "color": "{color.text.default}",
1414
+ "border": {
1415
+ "color": "{color.background.accent.gray.boldest.default}"
1416
+ }
1417
+ },
1418
+ "simple": {
1419
+ "color": "{color.text.default}"
1420
+ }
1421
+ }
1422
+ },
1423
+ "multiselect": {
1424
+ "background": "{color.elevation.surface.default}",
1425
+ "disabled": {
1426
+ "background": "{color.background.disabled.default}",
1427
+ "color": "{color.text.disabled}"
1428
+ },
1429
+ "filled": {
1430
+ "background": "{color.background.accent.gray.subtler.default}",
1431
+ "focus": {
1432
+ "background": "{color.background.accent.gray.subtler.default}"
1433
+ },
1434
+ "hover": {
1435
+ "background": "{color.background.accent.gray.subtler.default}"
1436
+ }
1437
+ },
1438
+ "border": {
1439
+ "color": "{color.border.default}",
1440
+ "radius": "{border-radius.sm}"
1441
+ },
1442
+ "hover": {
1443
+ "border": {
1444
+ "color": "{color.border.input}"
1445
+ }
1446
+ },
1447
+ "focus": {
1448
+ "border": {
1449
+ "color": "{color.border.focused}"
1450
+ },
1451
+ "ring": {
1452
+ "width": "{form.field.focus.ring.width}",
1453
+ "offset": "{form.field.focus.ring.offset}",
1454
+ "style": "{form.field.focus.ring.style}",
1455
+ "color": "{color.transparent}",
1456
+ "shadow": "{form.field.focus.ring.shadow}"
1457
+ }
1458
+ },
1459
+ "invalid": {
1460
+ "border": {
1461
+ "color": "{color.border.danger}"
1462
+ },
1463
+ "placeholder": {
1464
+ "color": "{color.text.danger}"
1465
+ }
1466
+ },
1467
+ "color": "{color.text.default}",
1468
+ "placeholder": {
1469
+ "color": "{color.text.subtlest}"
1470
+ },
1471
+ "shadow": "{form.field.shadow}",
1472
+ "padding": {
1473
+ "x": "{space.150}",
1474
+ "y": "{space.50}"
1475
+ },
1476
+ "dropdown": {
1477
+ "width": "{space.500}",
1478
+ "color": "{color.icon.subtlest}"
1479
+ },
1480
+ "overlay": {
1481
+ "background": "{color.elevation.surface.default}",
1482
+ "border": {
1483
+ "color": "{color.border.default}",
1484
+ "radius": "{border-radius.sm}"
1485
+ },
1486
+ "color": "{overlay.select.color}",
1487
+ "shadow": "{overlay.select.shadow}"
1488
+ },
1489
+ "list": {
1490
+ "padding": "{space.100}",
1491
+ "gap": "{space.25}",
1492
+ "header": {
1493
+ "padding": "{space.100}"
1494
+ }
1495
+ },
1496
+ "header": {
1497
+ "padding": "{space.100}"
1498
+ },
1499
+ "option": {
1500
+ "focus": {
1501
+ "background": "{color.background.accent.gray.subtle.hover}",
1502
+ "color": "{color.text.default}"
1503
+ },
1504
+ "selected": {
1505
+ "background": "{color.background.brand.subtlest.default}",
1506
+ "focus": {
1507
+ "background": "{color.background.brand.subtler.default}",
1508
+ "color": "{color.text.selected}"
1509
+ },
1510
+ "color": "{color.text.selected}"
1511
+ },
1512
+ "color": "{color.text.subtle}",
1513
+ "padding": "{space.150} {space.100}",
1514
+ "border": {
1515
+ "radius": "{border-radius.xs}"
1516
+ },
1517
+ "gap": "{space.100}",
1518
+ "group": {
1519
+ "background": "{color.elevation.surface.default}",
1520
+ "color": "{color.text.subtlest}",
1521
+ "font": {
1522
+ "weight": "{list.option.group.font.weight}"
1523
+ },
1524
+ "padding": "{space.100} {space.150}"
1525
+ }
1526
+ },
1527
+ "chip": {
1528
+ "border": {
1529
+ "radius": "{border-radius.xs}"
1530
+ }
1531
+ },
1532
+ "empty": {
1533
+ "message": {
1534
+ "padding": "{space.150} {space.100}"
1535
+ }
1536
+ },
1537
+ "sm": {
1538
+ "padding": {
1539
+ "x": "{space.150}",
1540
+ "y": "{space.50}"
1541
+ },
1542
+ "font": {
1543
+ "size": "{font-size.sm}"
1544
+ }
1545
+ },
1546
+ "lg": {
1547
+ "padding": {
1548
+ "x": "{space.150}",
1549
+ "y": "{space.100}"
1550
+ },
1551
+ "font": {
1552
+ "size": "{font-size.md}"
1553
+ }
1554
+ },
1555
+ "clear": {
1556
+ "icon": {
1557
+ "color": "{color.icon.subtlest}"
1558
+ }
1559
+ },
1560
+ "transition": {
1561
+ "duration": "{form.field.transition.duration}"
1562
+ }
1563
+ },
1564
+ "progressbar": {
1565
+ "background": "{color.background.accent.gray.default}",
1566
+ "border": {
1567
+ "radius": "{border-radius.sm}"
1568
+ },
1569
+ "value": {
1570
+ "background": "{color.background.brand.bolder.default}"
1571
+ },
1572
+ "label": {
1573
+ "color": "{color.text.inverse}",
1574
+ "font": {
1575
+ "size": "{font-size.xs}",
1576
+ "weight": "{font-weight.medium}"
1577
+ }
1578
+ },
1579
+ "height": "{space.250}"
1580
+ },
1581
+ "radiobutton": {
1582
+ "width": "{space.250}",
1583
+ "height": "{space.250}",
1584
+ "background": "{color.elevation.surface.default}",
1585
+ "checked": {
1586
+ "background": "{color.background.brand.bolder.default}",
1587
+ "hover": {
1588
+ "background": "{color.background.brand.bolder.hover}",
1589
+ "border": {
1590
+ "color": "{color.background.brand.bolder.hover}"
1591
+ }
1592
+ },
1593
+ "border": {
1594
+ "color": "{color.background.brand.bolder.default}"
1595
+ },
1596
+ "focus": {
1597
+ "border": {
1598
+ "color": "{color.border.focused}"
1599
+ }
1600
+ },
1601
+ "disabled": {
1602
+ "border": {
1603
+ "color": "{color.border.disabled}"
1604
+ }
1605
+ }
1606
+ },
1607
+ "disabled": {
1608
+ "background": "{color.background.disabled.default}"
1609
+ },
1610
+ "filled": {
1611
+ "background": "{color.background.accent.gray.subtler.default}"
1612
+ },
1613
+ "border": {
1614
+ "color": "{color.border.default}"
1615
+ },
1616
+ "hover": {
1617
+ "border": {
1618
+ "color": "{color.border.bold}"
1619
+ }
1620
+ },
1621
+ "focus": {
1622
+ "border": {
1623
+ "color": "{color.border.focused}"
1624
+ },
1625
+ "ring": {
1626
+ "width": "{focus.ring.width}",
1627
+ "style": "{focus.ring.style}",
1628
+ "color": "{color.border.focused}",
1629
+ "offset": "{focus.ring.offset}",
1630
+ "shadow": "{focus.ring.shadow}"
1631
+ }
1632
+ },
1633
+ "invalid": {
1634
+ "border": {
1635
+ "color": "{color.border.danger}"
1636
+ }
1637
+ },
1638
+ "shadow": "{form.field.shadow}",
1639
+ "icon": {
1640
+ "size": "{space.150}",
1641
+ "checked": {
1642
+ "color": "{color.icon.inverse}",
1643
+ "hover": {
1644
+ "color": "{color.icon.inverse}"
1645
+ }
1646
+ },
1647
+ "disabled": {
1648
+ "color": "{color.icon.disabled}"
1649
+ },
1650
+ "sm": {
1651
+ "size": "{space.100}"
1652
+ },
1653
+ "lg": {
1654
+ "size": "{space.200}"
1655
+ }
1656
+ },
1657
+ "sm": {
1658
+ "width": "{space.200}",
1659
+ "height": "{space.200}"
1660
+ },
1661
+ "lg": {
1662
+ "width": "{space.300}",
1663
+ "height": "{space.300}"
1664
+ },
1665
+ "transition": {
1666
+ "duration": "{form.field.transition.duration}"
1667
+ }
1668
+ },
1669
+ "select": {
1670
+ "background": "{color.elevation.surface.default}",
1671
+ "disabled": {
1672
+ "background": "{color.background.disabled.default}",
1673
+ "color": "{color.text.disabled}"
1674
+ },
1675
+ "filled": {
1676
+ "background": "{color.background.accent.gray.subtler.default}",
1677
+ "focus": {
1678
+ "background": "{color.background.accent.gray.subtler.default}"
1679
+ },
1680
+ "hover": {
1681
+ "background": "{color.background.accent.gray.subtler.default}"
1682
+ }
1683
+ },
1684
+ "border": {
1685
+ "color": "{color.background.accent.gray.hover}",
1686
+ "radius": "{border-radius.sm}"
1687
+ },
1688
+ "hover": {
1689
+ "border": {
1690
+ "color": "{color.background.accent.gray.pressed}"
1691
+ }
1692
+ },
1693
+ "focus": {
1694
+ "border": {
1695
+ "color": "{color.border.focused}"
1696
+ },
1697
+ "ring": {
1698
+ "width": "{form.field.focus.ring.width}",
1699
+ "offset": "{form.field.focus.ring.offset}",
1700
+ "style": "{form.field.focus.ring.style}",
1701
+ "color": "{form.field.focus.ring.color}",
1702
+ "shadow": "{form.field.focus.ring.shadow}"
1703
+ }
1704
+ },
1705
+ "invalid": {
1706
+ "border": {
1707
+ "color": "{color.border.danger}"
1708
+ },
1709
+ "placeholder": {
1710
+ "color": "{color.text.danger}"
1711
+ }
1712
+ },
1713
+ "color": "{color.text.default}",
1714
+ "placeholder": {
1715
+ "color": "{color.text.subtlest}"
1716
+ },
1717
+ "shadow": "{form.field.shadow}",
1718
+ "padding": {
1719
+ "x": "{space.150}",
1720
+ "y": "{space.50}"
1721
+ },
1722
+ "dropdown": {
1723
+ "width": "{space.500}",
1724
+ "color": "{color.icon.subtlest}"
1725
+ },
1726
+ "overlay": {
1727
+ "background": "{color.elevation.surface.default}",
1728
+ "border": {
1729
+ "color": "{color.border.default}",
1730
+ "radius": "{border-radius.sm}"
1731
+ },
1732
+ "color": "{overlay.select.color}",
1733
+ "shadow": "{overlay.select.shadow}"
1734
+ },
1735
+ "list": {
1736
+ "padding": "{space.100}",
1737
+ "gap": "{space.25}",
1738
+ "header": {
1739
+ "padding": "{space.100}"
1740
+ }
1741
+ },
1742
+ "option": {
1743
+ "focus": {
1744
+ "background": "{color.background.accent.gray.subtle.hover}",
1745
+ "color": "{color.text.default}"
1746
+ },
1747
+ "selected": {
1748
+ "background": "{color.background.brand.subtlest.default}",
1749
+ "focus": {
1750
+ "background": "{color.background.brand.subtler.default}",
1751
+ "color": "{color.text.selected}"
1752
+ },
1753
+ "color": "{color.text.selected}"
1754
+ },
1755
+ "color": "{color.text.subtle}",
1756
+ "padding": "{space.150} {space.100}",
1757
+ "border": {
1758
+ "radius": "{border-radius.xs}"
1759
+ },
1760
+ "group": {
1761
+ "background": "{color.elevation.surface.default}",
1762
+ "color": "{color.text.subtlest}",
1763
+ "font": {
1764
+ "weight": "{list.option.group.font.weight}"
1765
+ },
1766
+ "padding": "{space.100} {space.150}"
1767
+ }
1768
+ },
1769
+ "clear": {
1770
+ "icon": {
1771
+ "color": "{color.icon.subtle}"
1772
+ }
1773
+ },
1774
+ "checkmark": {
1775
+ "color": "{color.text.subtle}",
1776
+ "gutter": {
1777
+ "start": "{space.negative.75}",
1778
+ "end": "{space.75}"
1779
+ }
1780
+ },
1781
+ "empty": {
1782
+ "message": {
1783
+ "padding": "{space.150} {space.100}"
1784
+ }
1785
+ },
1786
+ "sm": {
1787
+ "font": {
1788
+ "size": "{font-size.sm}"
1789
+ },
1790
+ "padding": {
1791
+ "x": "{space.150}",
1792
+ "y": "{space.50}"
1793
+ }
1794
+ },
1795
+ "lg": {
1796
+ "font": {
1797
+ "size": "{font-size.md}"
1798
+ },
1799
+ "padding": {
1800
+ "x": "{space.150}",
1801
+ "y": "{space.100}"
1802
+ }
1803
+ },
1804
+ "transition": {
1805
+ "duration": "{form.field.transition.duration}"
1806
+ }
1807
+ },
1808
+ "selectbutton": {
1809
+ "border": {
1810
+ "radius": "{border-radius.md}"
1811
+ },
1812
+ "invalid": {
1813
+ "border": {
1814
+ "color": "{form.field.invalid.border.color}"
1815
+ }
1816
+ }
1817
+ },
1818
+ "tabs": {
1819
+ "tablist": {
1820
+ "background": "{color.transparent}",
1821
+ "border": {
1822
+ "color": "{color.border.default}",
1823
+ "width": "{border-width.1}"
1824
+ }
1825
+ },
1826
+ "tab": {
1827
+ "border": {
1828
+ "color": "{color.border.default}",
1829
+ "width": "{border-width.1}"
1830
+ },
1831
+ "active": {
1832
+ "border": {
1833
+ "color": "{color.border.selected}"
1834
+ },
1835
+ "color": "{color.text.selected}",
1836
+ "background": "{color.transparent}"
1837
+ },
1838
+ "color": "{color.text.subtlest}",
1839
+ "hover": {
1840
+ "color": "{color.text.default}",
1841
+ "background": "{color.transparent}",
1842
+ "border": {
1843
+ "color": "{color.border.default}"
1844
+ }
1845
+ },
1846
+ "background": "{color.transparent}",
1847
+ "padding": "{space.150}",
1848
+ "font": {
1849
+ "weight": "{font-weight.medium}"
1850
+ },
1851
+ "margin": "0",
1852
+ "gap": "{space.100}",
1853
+ "focus": {
1854
+ "ring": {
1855
+ "width": "{focus.ring.width}",
1856
+ "offset": "-1px",
1857
+ "style": "{focus.ring.style}",
1858
+ "color": "{color.border.focused}",
1859
+ "shadow": "{focus.ring.shadow}"
1860
+ }
1861
+ }
1862
+ },
1863
+ "tabpanel": {
1864
+ "background": "{color.transparent}",
1865
+ "color": "{color.text.default}",
1866
+ "padding": "{space.200}",
1867
+ "focus": {
1868
+ "ring": {
1869
+ "width": "{focus.ring.width}",
1870
+ "offset": "{focus.ring.offset}",
1871
+ "color": "{color.border.focused}",
1872
+ "style": "{focus.ring.style}",
1873
+ "shadow": "{focus.ring.shadow}"
1874
+ }
1875
+ }
1876
+ },
1877
+ "nav": {
1878
+ "button": {
1879
+ "background": "{content.background}",
1880
+ "color": "{text.muted.color}",
1881
+ "hover": {
1882
+ "color": "{text.color}"
1883
+ },
1884
+ "width": "{space.500}",
1885
+ "focus": {
1886
+ "ring": {
1887
+ "color": "{focus.ring.color}",
1888
+ "width": "{focus.ring.width}",
1889
+ "offset": "-1px",
1890
+ "style": "{focus.ring.style}",
1891
+ "shadow": "{focus.ring.shadow}"
1892
+ }
1893
+ },
1894
+ "shadow": "0 0 10px 50px #0F172A80"
1895
+ }
1896
+ },
1897
+ "active": {
1898
+ "bar": {
1899
+ "height": "{space.25}",
1900
+ "bottom": "-1px",
1901
+ "background": "{primary.color}"
1902
+ }
1903
+ },
1904
+ "transition": {
1905
+ "duration": "{transition.duration}"
1906
+ }
1907
+ },
1908
+ "tag": {
1909
+ "font": {
1910
+ "size": "{font-size.sm}",
1911
+ "weight": "{font-weight.regular}"
1912
+ },
1913
+ "padding": "{space.100} {space.50}",
1914
+ "gap": "{space.50}",
1915
+ "border": {
1916
+ "radius": "{border-radius.sm}"
1917
+ },
1918
+ "rounded": {
1919
+ "border": {
1920
+ "radius": "{border-radius.full}"
1921
+ }
1922
+ },
1923
+ "icon": {
1924
+ "size": "{icon-size.xs}"
1925
+ },
1926
+ "primary": {
1927
+ "background": "{primary.500}",
1928
+ "color": "{primary.300}"
1929
+ },
1930
+ "secondary": {
1931
+ "background": "{surface.800}",
1932
+ "color": "{surface.300}"
1933
+ },
1934
+ "success": {
1935
+ "background": "{green.500}",
1936
+ "color": "{green.300}"
1937
+ },
1938
+ "info": {
1939
+ "background": "{sky.500}",
1940
+ "color": "{sky.300}"
1941
+ },
1942
+ "warn": {
1943
+ "background": "{orange.500}",
1944
+ "color": "{orange.300}"
1945
+ },
1946
+ "danger": {
1947
+ "background": "{red.500}",
1948
+ "color": "{red.300}"
1949
+ },
1950
+ "contrast": {
1951
+ "background": "{surface.0}",
1952
+ "color": "{surface.950}"
1953
+ }
1954
+ },
1955
+ "textarea": {
1956
+ "background": "{color.elevation.surface.default}",
1957
+ "disabled": {
1958
+ "background": "{color.background.disabled.default}",
1959
+ "color": "{color.text.disabled}"
1960
+ },
1961
+ "filled": {
1962
+ "background": "{color.background.accent.gray.subtler.default}",
1963
+ "focus": {
1964
+ "background": "{color.background.accent.gray.subtler.default}"
1965
+ },
1966
+ "hover": {
1967
+ "background": "{color.background.accent.gray.subtler.default}"
1968
+ }
1969
+ },
1970
+ "border": {
1971
+ "color": "{color.border.default}",
1972
+ "radius": "{border-radius.sm}"
1973
+ },
1974
+ "hover": {
1975
+ "border": {
1976
+ "color": "{color.border.bold}"
1977
+ }
1978
+ },
1979
+ "focus": {
1980
+ "border": {
1981
+ "color": "{color.border.focused}"
1982
+ },
1983
+ "ring": {
1984
+ "width": "{form.field.focus.ring.width}",
1985
+ "offset": "{form.field.focus.ring.offset}",
1986
+ "color": "{color.transparent}",
1987
+ "style": "{form.field.focus.ring.style}",
1988
+ "shadow": "{form.field.focus.ring.shadow}"
1989
+ }
1990
+ },
1991
+ "invalid": {
1992
+ "border": {
1993
+ "color": "{color.border.danger}"
1994
+ },
1995
+ "placeholder": {
1996
+ "color": "{color.text.danger}"
1997
+ }
1998
+ },
1999
+ "color": "{color.text.default}",
2000
+ "placeholder": {
2001
+ "color": "{color.text.subtlest}"
2002
+ },
2003
+ "shadow": "{form.field.shadow}",
2004
+ "padding": {
2005
+ "x": "{space.150}",
2006
+ "y": "{space.50}"
2007
+ },
2008
+ "sm": {
2009
+ "padding": {
2010
+ "x": "{space.150}",
2011
+ "y": "{space.50}"
2012
+ },
2013
+ "font": {
2014
+ "size": "{form.field.sm.font.size}"
2015
+ }
2016
+ },
2017
+ "lg": {
2018
+ "padding": {
2019
+ "x": "{space.150}",
2020
+ "y": "{space.50}"
2021
+ },
2022
+ "font": {
2023
+ "size": "{form.field.lg.font.size}"
2024
+ }
2025
+ },
2026
+ "transition": {
2027
+ "duration": "{form.field.transition.duration}"
2028
+ }
2029
+ },
2030
+ "toast": {
2031
+ "width": "{space.1000}",
2032
+ "border": {
2033
+ "radius": "{border-radius.sm}",
2034
+ "width": "{border-width.1}"
2035
+ },
2036
+ "icon": {
2037
+ "size": "{space.250}"
2038
+ },
2039
+ "content": {
2040
+ "padding": "{space.150} {space.200}",
2041
+ "gap": "{space.100}"
2042
+ },
2043
+ "summary": {
2044
+ "font": {
2045
+ "weight": "{font-weight.medium}",
2046
+ "size": "{font-size.md}"
2047
+ }
2048
+ },
2049
+ "detail": {
2050
+ "font": {
2051
+ "weight": "{font-weight.medium}",
2052
+ "size": "{font-size.sm}"
2053
+ }
2054
+ },
2055
+ "close": {
2056
+ "button": {
2057
+ "width": "{space.300}",
2058
+ "height": "{space.300}",
2059
+ "border": {
2060
+ "radius": "{border-radius.lg}"
2061
+ },
2062
+ "focus": {
2063
+ "ring": {
2064
+ "width": "{focus.ring.width}",
2065
+ "style": "{focus.ring.style}",
2066
+ "offset": "{focus.ring.offset}"
2067
+ }
2068
+ }
2069
+ },
2070
+ "icon": {
2071
+ "size": "{space.250}"
2072
+ }
2073
+ },
2074
+ "text": {
2075
+ "gap": "{space.25}"
2076
+ },
2077
+ "transition": {
2078
+ "duration": "{transition.duration}"
2079
+ },
2080
+ "info": {
2081
+ "background": "{blue.500}",
2082
+ "border": {
2083
+ "color": "{blue.700}"
2084
+ },
2085
+ "color": "{blue.500}",
2086
+ "detail": {
2087
+ "color": "{surface.0}"
2088
+ },
2089
+ "shadow": "0 4px 8px 0 rgba(2, 5, 10, 0.04)",
2090
+ "close": {
2091
+ "button": {
2092
+ "hover": {
2093
+ "background": "rgba(255, 255, 255, 0.05)"
2094
+ },
2095
+ "focus": {
2096
+ "ring": {
2097
+ "color": "{blue.500}",
2098
+ "shadow": "none"
2099
+ }
2100
+ }
2101
+ }
2102
+ }
2103
+ },
2104
+ "success": {
2105
+ "background": "{green.500}",
2106
+ "border": {
2107
+ "color": "{green.700}"
2108
+ },
2109
+ "color": "{green.500}",
2110
+ "detail": {
2111
+ "color": "{surface.0}"
2112
+ },
2113
+ "shadow": "0 4px 8px 0 rgba(1, 8, 4, 0.04)",
2114
+ "close": {
2115
+ "button": {
2116
+ "hover": {
2117
+ "background": "rgba(255, 255, 255, 0.05)"
2118
+ },
2119
+ "focus": {
2120
+ "ring": {
2121
+ "color": "{green.500}",
2122
+ "shadow": "none"
2123
+ }
2124
+ }
2125
+ }
2126
+ }
2127
+ },
2128
+ "warn": {
2129
+ "background": "{yellow.500}",
2130
+ "border": {
2131
+ "color": "{yellow.700}"
2132
+ },
2133
+ "color": "{yellow.500}",
2134
+ "detail": {
2135
+ "color": "{surface.0}"
2136
+ },
2137
+ "shadow": "0 4px 8px 0 rgba(9, 7, 0, 0.04)",
2138
+ "close": {
2139
+ "button": {
2140
+ "hover": {
2141
+ "background": "rgba(255, 255, 255, 0.05)"
2142
+ },
2143
+ "focus": {
2144
+ "ring": {
2145
+ "color": "{yellow.500}",
2146
+ "shadow": "none"
2147
+ }
2148
+ }
2149
+ }
2150
+ }
2151
+ },
2152
+ "error": {
2153
+ "background": "{red.500}",
2154
+ "border": {
2155
+ "color": "{red.700}"
2156
+ },
2157
+ "color": "{red.500}",
2158
+ "detail": {
2159
+ "color": "{surface.0}"
2160
+ },
2161
+ "shadow": "0 4px 8px 0 rgba(10, 3, 3, 0.04)",
2162
+ "close": {
2163
+ "button": {
2164
+ "hover": {
2165
+ "background": "rgba(255, 255, 255, 0.05)"
2166
+ },
2167
+ "focus": {
2168
+ "ring": {
2169
+ "color": "{red.500}",
2170
+ "shadow": "none"
2171
+ }
2172
+ }
2173
+ }
2174
+ }
2175
+ },
2176
+ "secondary": {
2177
+ "background": "{surface.800}",
2178
+ "border": {
2179
+ "color": "{surface.700}"
2180
+ },
2181
+ "color": "{surface.300}",
2182
+ "detail": {
2183
+ "color": "{surface.0}"
2184
+ },
2185
+ "shadow": "0 4px 8px 0 rgba(4, 5, 6, 0.04)",
2186
+ "close": {
2187
+ "button": {
2188
+ "hover": {
2189
+ "background": "{surface.700}"
2190
+ },
2191
+ "focus": {
2192
+ "ring": {
2193
+ "color": "{surface.300}",
2194
+ "shadow": "none"
2195
+ }
2196
+ }
2197
+ }
2198
+ }
2199
+ },
2200
+ "contrast": {
2201
+ "background": "{surface.0}",
2202
+ "border": {
2203
+ "color": "{surface.100}"
2204
+ },
2205
+ "color": "{surface.950}",
2206
+ "detail": {
2207
+ "color": "{surface.950}"
2208
+ },
2209
+ "shadow": "0 4px 8px 0 rgba(0, 0, 1, 0.04)",
2210
+ "close": {
2211
+ "button": {
2212
+ "hover": {
2213
+ "background": "{surface.100}"
2214
+ },
2215
+ "focus": {
2216
+ "ring": {
2217
+ "color": "{surface.950}",
2218
+ "shadow": "none"
2219
+ }
2220
+ }
2221
+ }
2222
+ }
2223
+ },
2224
+ "blur": "10"
2225
+ },
2226
+ "togglebutton": {
2227
+ "border": {
2228
+ "radius": "{border-radius.md}",
2229
+ "color": "{surface.950}"
2230
+ },
2231
+ "gap": "{space.100}",
2232
+ "font": {
2233
+ "weight": "{font-weight.medium}"
2234
+ },
2235
+ "disabled": {
2236
+ "background": "{color.background.disabled.default}",
2237
+ "border": {
2238
+ "color": "{color.background.disabled.default}"
2239
+ },
2240
+ "color": "{color.text.disabled}"
2241
+ },
2242
+ "invalid": {
2243
+ "border": {
2244
+ "color": "{color.border.danger}"
2245
+ }
2246
+ },
2247
+ "focus": {
2248
+ "ring": {
2249
+ "width": "{focus.ring.width}",
2250
+ "offset": "{focus.ring.offset}",
2251
+ "style": "{focus.ring.style}",
2252
+ "color": "{color.border.focused}",
2253
+ "shadow": "{focus.ring.shadow}"
2254
+ }
2255
+ },
2256
+ "icon": {
2257
+ "disabled": {
2258
+ "color": "{color.icon.disabled}"
2259
+ },
2260
+ "color": "{surface.400}",
2261
+ "hover": {
2262
+ "color": "{surface.300}"
2263
+ },
2264
+ "checked": {
2265
+ "color": "{surface.0}"
2266
+ }
2267
+ },
2268
+ "content": {
2269
+ "checked": {
2270
+ "shadow": "0 1px 2px 0 rgba(0, 0, 0, 0.02), 0 1px 2px 0 rgba(0, 0, 0, 0.04)",
2271
+ "background": "{surface.800}"
2272
+ },
2273
+ "padding": "{space.50} {space.100}",
2274
+ "border": {
2275
+ "radius": "{border-radius.sm}"
2276
+ },
2277
+ "sm": {
2278
+ "padding": "{space.25} {space.50}"
2279
+ },
2280
+ "lg": {
2281
+ "padding": "{space.75} {space.150}"
2282
+ }
2283
+ },
2284
+ "sm": {
2285
+ "font": {
2286
+ "size": "{font-size.sm}"
2287
+ },
2288
+ "padding": "{space.50}"
2289
+ },
2290
+ "lg": {
2291
+ "font": {
2292
+ "size": "{form.field.lg.font.size}"
2293
+ },
2294
+ "padding": "{space.50}"
2295
+ },
2296
+ "transition": {
2297
+ "duration": "{form.field.transition.duration}"
2298
+ },
2299
+ "padding": "{space.50}",
2300
+ "background": "{surface.950}",
2301
+ "checked": {
2302
+ "background": "{surface.950}",
2303
+ "color": "{surface.0}",
2304
+ "border": {
2305
+ "color": "{surface.950}"
2306
+ }
2307
+ },
2308
+ "hover": {
2309
+ "background": "{surface.950}",
2310
+ "color": "{surface.300}"
2311
+ },
2312
+ "color": "{surface.400}"
2313
+ },
2314
+ "toggleswitch": {
2315
+ "width": "{space.500}",
2316
+ "height": "{space.300}",
2317
+ "border": {
2318
+ "radius": "{border-radius.3xl}",
2319
+ "width": "{border-width.1}",
2320
+ "color": "{color.transparent}"
2321
+ },
2322
+ "gap": "{space.50}",
2323
+ "shadow": "{form.field.shadow}",
2324
+ "hover": {
2325
+ "border": {
2326
+ "color": "{color.transparent}"
2327
+ },
2328
+ "background": "{surface.600}"
2329
+ },
2330
+ "checked": {
2331
+ "border": {
2332
+ "color": "{color.transparent}"
2333
+ },
2334
+ "hover": {
2335
+ "border": {
2336
+ "color": "{color.transparent}"
2337
+ },
2338
+ "background": "{primary.hover.color}"
2339
+ },
2340
+ "background": "{primary.color}"
2341
+ },
2342
+ "invalid": {
2343
+ "border": {
2344
+ "color": "{form.field.invalid.border.color}"
2345
+ }
2346
+ },
2347
+ "handle": {
2348
+ "border": {
2349
+ "radius": "{border-radius.full}"
2350
+ },
2351
+ "size": "{space.200}",
2352
+ "background": "{surface.400}",
2353
+ "hover": {
2354
+ "background": "{surface.300}",
2355
+ "color": "{surface.800}"
2356
+ },
2357
+ "checked": {
2358
+ "background": "{surface.900}",
2359
+ "hover": {
2360
+ "background": "{surface.900}",
2361
+ "color": "{primary.hover.color}"
2362
+ },
2363
+ "color": "{primary.color}"
2364
+ },
2365
+ "color": "{surface.900}",
2366
+ "disabled": {
2367
+ "background": "{surface.900}"
2368
+ }
2369
+ },
2370
+ "focus": {
2371
+ "ring": {
2372
+ "shadow": "{focus.ring.shadow}",
2373
+ "width": "{focus.ring.width}",
2374
+ "style": "{focus.ring.style}",
2375
+ "color": "{focus.ring.color}",
2376
+ "offset": "{focus.ring.offset}"
2377
+ }
2378
+ },
2379
+ "transition": {
2380
+ "duration": "{form.field.transition.duration}"
2381
+ },
2382
+ "slide": {
2383
+ "duration": "0.2s"
2384
+ },
2385
+ "background": "{surface.700}",
2386
+ "disabled": {
2387
+ "background": "{surface.600}"
2388
+ }
2389
+ }
2390
+ };