@mekari/pixel3-theme 0.2.1 → 0.2.2-dev.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (84) hide show
  1. package/dist/conditions.d.mts +4 -1
  2. package/dist/conditions.d.ts +4 -1
  3. package/dist/index.js +2889 -409
  4. package/dist/index.mjs +2888 -408
  5. package/dist/semanticTokens/colors.d.mts +892 -0
  6. package/dist/semanticTokens/colors.d.ts +892 -0
  7. package/dist/semanticTokens/index.d.mts +951 -0
  8. package/dist/semanticTokens/index.d.ts +951 -0
  9. package/dist/semanticTokens/spacing.d.mts +59 -0
  10. package/dist/semanticTokens/spacing.d.ts +59 -0
  11. package/dist/tokens/borders.d.mts +2 -2
  12. package/dist/tokens/borders.d.ts +2 -2
  13. package/dist/tokens/colors.d.mts +37 -34
  14. package/dist/tokens/colors.d.ts +37 -34
  15. package/dist/tokens/index.d.mts +59 -35
  16. package/dist/tokens/index.d.ts +59 -35
  17. package/dist/tokens/radii.d.mts +5 -0
  18. package/dist/tokens/radii.d.ts +5 -0
  19. package/dist/tokens/spacing.d.mts +16 -0
  20. package/dist/tokens/spacing.d.ts +16 -0
  21. package/dist/tokens-next/borders.d.mts +22 -0
  22. package/dist/tokens-next/borders.d.ts +22 -0
  23. package/dist/tokens-next/colors.d.mts +441 -0
  24. package/dist/tokens-next/colors.d.ts +441 -0
  25. package/dist/tokens-next/index.d.mts +772 -0
  26. package/dist/tokens-next/index.d.ts +772 -0
  27. package/dist/tokens-next/radii.d.mts +26 -0
  28. package/dist/tokens-next/radii.d.ts +26 -0
  29. package/dist/tokens-next/shadows.d.mts +28 -0
  30. package/dist/tokens-next/shadows.d.ts +28 -0
  31. package/dist/tokens-next/spacing.d.mts +51 -0
  32. package/dist/tokens-next/spacing.d.ts +51 -0
  33. package/package.json +1 -1
  34. package/src/conditions.ts +6 -4
  35. package/src/global-css.ts +4 -0
  36. package/src/index.ts +15 -2
  37. package/src/recipes/accordion.ts +12 -2
  38. package/src/recipes/autocomplete.ts +6 -1
  39. package/src/recipes/avatar.ts +68 -11
  40. package/src/recipes/badge.ts +174 -50
  41. package/src/recipes/banner.ts +36 -11
  42. package/src/recipes/broadcast.ts +78 -12
  43. package/src/recipes/button.ts +132 -9
  44. package/src/recipes/carousel.ts +5 -0
  45. package/src/recipes/chart.ts +10 -5
  46. package/src/recipes/checkbox.ts +68 -13
  47. package/src/recipes/color-picker.ts +74 -23
  48. package/src/recipes/date-picker.ts +165 -31
  49. package/src/recipes/divider.ts +5 -1
  50. package/src/recipes/dropzone.ts +80 -8
  51. package/src/recipes/form-control.ts +12 -3
  52. package/src/recipes/input-tag.ts +48 -8
  53. package/src/recipes/input.ts +75 -8
  54. package/src/recipes/modal.ts +30 -9
  55. package/src/recipes/popover.ts +28 -9
  56. package/src/recipes/progress.ts +9 -2
  57. package/src/recipes/radio.ts +52 -21
  58. package/src/recipes/rich-text-editor.ts +32 -6
  59. package/src/recipes/segmented-control.ts +47 -7
  60. package/src/recipes/select.ts +42 -0
  61. package/src/recipes/slider.ts +46 -6
  62. package/src/recipes/table.ts +26 -11
  63. package/src/recipes/tabs.ts +35 -3
  64. package/src/recipes/tag.ts +43 -13
  65. package/src/recipes/textarea.ts +0 -46
  66. package/src/recipes/timeline.ts +36 -8
  67. package/src/recipes/toast.ts +21 -4
  68. package/src/recipes/toggle.ts +59 -11
  69. package/src/recipes/tooltip.ts +5 -1
  70. package/src/recipes/upload.ts +51 -16
  71. package/src/semanticTokens/colors.ts +893 -0
  72. package/src/semanticTokens/index.ts +8 -0
  73. package/src/semanticTokens/spacing.ts +59 -0
  74. package/src/tokens/borders.ts +1 -1
  75. package/src/tokens/colors.ts +18 -23
  76. package/src/tokens/index.ts +2 -2
  77. package/src/tokens/radii.ts +5 -5
  78. package/src/tokens/spacing.ts +17 -17
  79. package/src/tokens-next/borders.ts +10 -0
  80. package/src/tokens-next/colors.ts +171 -0
  81. package/src/tokens-next/index.ts +32 -0
  82. package/src/tokens-next/radii.ts +10 -0
  83. package/src/tokens-next/shadows.ts +28 -0
  84. package/src/tokens-next/spacing.ts +16 -0
package/src/semanticTokens/colors.ts ADDED
@@ -0,0 +1,893 @@
1
+ import { defineSemanticTokens } from '@pandacss/dev'
2
+
3
+ export const colors = defineSemanticTokens.colors({
4
+ background: {
5
+ surface: {
6
+ value: {
7
+ base: '#F1F5F9', // Doens't have raw token
8
+ _light: '#F1F5F9', // Doesn't have raw token
9
+ _dark: '{colors.dark}'
10
+ }
11
+ },
12
+ stage: {
13
+ value: {
14
+ base: '{colors.white}',
15
+ _light: '{colors.white}',
16
+ _dark: '{colors.dark.100}'
17
+ }
18
+ },
19
+ overlay: {
20
+ value: {
21
+ base: 'rgba(35, 41, 51, 0.80)', // Doens't have raw token
22
+ _light: 'rgba(35, 41, 51, 0.80)', // Doesn't have raw token
23
+ _dark: 'rgba(101, 127, 153, 0.8)' // Doesn't have raw token
24
+ }
25
+ },
26
+ disabled: {
27
+ value: {
28
+ base: 'rgba(29, 31, 36, 0.04)', // Doesn't have raw token
29
+ _light: 'rgba(29, 31, 36, 0.04)', // Doesn't have raw token
30
+ _dark: 'rgba(188, 214, 240, 0.04)' // Doesn't have raw token
31
+ }
32
+ },
33
+ inverse: {
34
+ value: {
35
+ base: '{colors.dark.100}',
36
+ _light: '{colors.dark.100}',
37
+ _dark: '{colors.white}'
38
+ }
39
+ },
40
+ shadow: {
41
+ value: {
42
+ base: 'rgba(29, 31, 36, 0.16)', // Doesn't have raw token
43
+ _light: 'rgba(29, 31, 36, 0.16)', // Doesn't have raw token
44
+ _dark: 'rgba(22, 26, 29, 1)' // Doesn't have raw token
45
+ }
46
+ },
47
+ neutral: {
48
+ DEFAULT: {
49
+ value: {
50
+ base: '{colors.white}',
51
+ _light: '{colors.white}',
52
+ _dark: '{colors.dark.200}'
53
+ }
54
+ },
55
+ hovered: {
56
+ value: {
57
+ base: '{colors.neutral.100}',
58
+ _light: '{colors.neutral.100}',
59
+ _dark: '{colors.dark.250}'
60
+ }
61
+ },
62
+ pressed: {
63
+ value: {
64
+ base: '{colors.neutral.200}',
65
+ _light: '{colors.neutral.200}',
66
+ _dark: '{colors.dark.300}'
67
+ }
68
+ },
69
+ subtle: {
70
+ DEFAULT: {
71
+ value: {
72
+ base: '{colors.neutral.200}',
73
+ _light: '{colors.neutral.200}',
74
+ _dark: '{colors.dark.300}'
75
+ }
76
+ },
77
+ hovered: {
78
+ value: {
79
+ base: '{colors.neutral.300}',
80
+ _light: '{colors.neutral.300}',
81
+ _dark: '{colors.dark.350}'
82
+ }
83
+ },
84
+ pressed: {
85
+ value: {
86
+ base: '{colors.neutral.400}',
87
+ _light: '{colors.neutral.400}',
88
+ _dark: '{colors.dark.400}'
89
+ }
90
+ }
91
+ },
92
+ bold: {
93
+ DEFAULT: {
94
+ value: {
95
+ base: '{colors.neutral.800}',
96
+ _light: '{colors.neutral.800}',
97
+ _dark: '{colors.dark.800}'
98
+ }
99
+ },
100
+ hovered: {
101
+ value: {
102
+ base: '{colors.neutral.900}',
103
+ _light: '{colors.neutral.900}',
104
+ _dark: '{colors.dark.900}'
105
+ }
106
+ },
107
+ pressed: {
108
+ value: {
109
+ base: '{colors.neutral.1000}',
110
+ _light: '{colors.neutral.1000}',
111
+ _dark: '{colors.dark.1000}'
112
+ }
113
+ }
114
+ },
115
+ },
116
+ brand: {
117
+ DEFAULT: {
118
+ value: {
119
+ base: '{colors.indigo.100}',
120
+ _light: '{colors.indigo.100}',
121
+ _dark: '{colors.indigo.1000}'
122
+ }
123
+ },
124
+ hovered: {
125
+ value: {
126
+ base: '{colors.indigo.200}',
127
+ _light: '{colors.indigo.200}',
128
+ _dark: '{colors.indigo.900}'
129
+ }
130
+ },
131
+ pressed: {
132
+ value: {
133
+ base: '{colors.indigo.300}',
134
+ _light: '{colors.indigo.300}',
135
+ _dark: '{colors.indigo.800}'
136
+ }
137
+ },
138
+ selected: {
139
+ value: {
140
+ base: '{colors.indigo.200}',
141
+ _light: '{colors.indigo.200}',
142
+ _dark: '{colors.indigo.900}'
143
+ }
144
+ },
145
+ bold: {
146
+ DEFAULT: {
147
+ value: {
148
+ base: '{colors.indigo.700}',
149
+ _light: '{colors.indigo.700}',
150
+ _dark: '{colors.indigo.400}'
151
+ }
152
+ },
153
+ hovered: {
154
+ value: {
155
+ base: '{colors.indigo.800}',
156
+ _light: '{colors.indigo.800}',
157
+ _dark: '{colors.indigo.300}'
158
+ }
159
+ },
160
+ pressed: {
161
+ value: {
162
+ base: '{colors.indigo.900}',
163
+ _liht: '{colors.indigo.900}',
164
+ _dark: '{colors.indigo.200}'
165
+ }
166
+ },
167
+ selected: {
168
+ value: {
169
+ base: '{colors.indigo.700}',
170
+ _liht: '{colors.indigo.700}',
171
+ _dark: '{colors.indigo.400}'
172
+ }
173
+ }
174
+ }
175
+ },
176
+ tertiary: {
177
+ DEFAULT: {
178
+ value: {
179
+ base: '{colors.dark.200}',
180
+ _light: '{colors.dark.200}',
181
+ _dark: '{colors.dark.200}'
182
+ }
183
+ },
184
+ hovered: {
185
+ value: {
186
+ base: '{colors.dark.300}',
187
+ _light: '{colors.dark.300}',
188
+ _dark: '{colors.dark.300}'
189
+ }
190
+ },
191
+ pressed: {
192
+ value: {
193
+ base: '{colors.dark.400}',
194
+ _light: '{colors.dark.400}',
195
+ _dark: '{colors.dark.400}'
196
+ }
197
+ }
198
+ },
199
+ danger: {
200
+ DEFAULT: {
201
+ value: {
202
+ base: '{colors.red.100}',
203
+ _light: '{colors.red.100}',
204
+ _dark: '{colors.red.1000}'
205
+ }
206
+ },
207
+ hovered: {
208
+ value: {
209
+ base: '{colors.red.200}',
210
+ _light: '{colors.red.200}',
211
+ _dark: '{colors.red.900}'
212
+ }
213
+ },
214
+ pressed: {
215
+ value: {
216
+ base: '{colors.red.300}',
217
+ _light: '{colors.red.300}',
218
+ _dark: '{colors.red.800}'
219
+ }
220
+ },
221
+ bold: {
222
+ DEFAULT: {
223
+ value: {
224
+ base: '{colors.red.700}',
225
+ _light: '{colors.red.700}',
226
+ _dark: '{colors.red.400}'
227
+ }
228
+ },
229
+ hovered: {
230
+ value: {
231
+ base: '{colors.red.800}',
232
+ _light: '{colors.red.800}',
233
+ _dark: '{colors.red.300}'
234
+ }
235
+ },
236
+ pressed: {
237
+ value: {
238
+ base: '{colors.red.900}',
239
+ _liht: '{colors.red.900}',
240
+ _dark: '{colors.red.200}'
241
+ }
242
+ },
243
+ }
244
+ },
245
+ warning: {
246
+ DEFAULT: {
247
+ value: {
248
+ base: '{colors.yellow.100}',
249
+ _light: '{colors.yellow.100}',
250
+ _dark: '{colors.yellow.1000}'
251
+ }
252
+ },
253
+ hovered: {
254
+ value: {
255
+ base: '{colors.yellow.200}',
256
+ _light: '{colors.yellow.200}',
257
+ _dark: '{colors.yellow.900}'
258
+ }
259
+ },
260
+ pressed: {
261
+ value: {
262
+ base: '{colors.yellow.300}',
263
+ _light: '{colors.yellow.300}',
264
+ _dark: '{colors.yellow.800}'
265
+ }
266
+ },
267
+ bold: {
268
+ DEFAULT: {
269
+ value: {
270
+ base: '{colors.yellow.300}',
271
+ _light: '{colors.yellow.300}',
272
+ _dark: '{colors.yellow.300}'
273
+ }
274
+ },
275
+ hovered: {
276
+ value: {
277
+ base: '{colors.yellow.400}',
278
+ _light: '{colors.yellow.400}',
279
+ _dark: '{colors.yellow.400}'
280
+ }
281
+ },
282
+ pressed: {
283
+ value: {
284
+ base: '{colors.yellow.500}',
285
+ _liht: '{colors.yellow.500}',
286
+ _dark: '{colors.yellow.500}'
287
+ }
288
+ },
289
+ }
290
+ },
291
+ success: {
292
+ DEFAULT: {
293
+ value: {
294
+ base: '{colors.green.100}',
295
+ _light: '{colors.green.100}',
296
+ _dark: '{colors.green.1000}'
297
+ }
298
+ },
299
+ hovered: {
300
+ value: {
301
+ base: '{colors.green.200}',
302
+ _light: '{colors.green.200}',
303
+ _dark: '{colors.green.900}'
304
+ }
305
+ },
306
+ pressed: {
307
+ value: {
308
+ base: '{colors.green.300}',
309
+ _light: '{colors.green.300}',
310
+ _dark: '{colors.green.800}'
311
+ }
312
+ },
313
+ bold: {
314
+ DEFAULT: {
315
+ value: {
316
+ base: '{colors.green.700}',
317
+ _light: '{colors.green.700}',
318
+ _dark: '{colors.green.400}'
319
+ }
320
+ },
321
+ hovered: {
322
+ value: {
323
+ base: '{colors.green.800}',
324
+ _light: '{colors.green.800}',
325
+ _dark: '{colors.green.300}'
326
+ }
327
+ },
328
+ pressed: {
329
+ value: {
330
+ base: '{colors.green.900}',
331
+ _liht: '{colors.green.900}',
332
+ _dark: '{colors.green.200}'
333
+ }
334
+ },
335
+ }
336
+ },
337
+ highlight: {
338
+ DEFAULT: {
339
+ value: {
340
+ base: '{colors.violet.100}',
341
+ _light: '{colors.violet.100}',
342
+ _dark: '{colors.violet.1000}'
343
+ }
344
+ },
345
+ hovered: {
346
+ value: {
347
+ base: '{colors.violet.200}',
348
+ _light: '{colors.violet.200}',
349
+ _dark: '{colors.violet.900}'
350
+ }
351
+ },
352
+ pressed: {
353
+ value: {
354
+ base: '{colors.violet.300}',
355
+ _light: '{colors.violet.300}',
356
+ _dark: '{colors.violet.800}'
357
+ }
358
+ },
359
+ bold: {
360
+ DEFAULT: {
361
+ value: {
362
+ base: '{colors.violet.700}',
363
+ _light: '{colors.violet.700}',
364
+ _dark: '{colors.violet.400}'
365
+ }
366
+ },
367
+ hovered: {
368
+ value: {
369
+ base: '{colors.violet.800}',
370
+ _light: '{colors.violet.800}',
371
+ _dark: '{colors.violet.300}'
372
+ }
373
+ },
374
+ pressed: {
375
+ value: {
376
+ base: '{colors.violet.900}',
377
+ _liht: '{colors.violet.900}',
378
+ _dark: '{colors.violet.200}'
379
+ }
380
+ },
381
+ }
382
+ },
383
+ },
384
+ nav: {
385
+ parent: {
386
+ value: {
387
+ base: '#E7EDF5', // Doesn't have raw token
388
+ _light: '#E7EDF5', // Doesn't have raw token
389
+ _dark: '{colors.dark.100}'
390
+ }
391
+ },
392
+ stack: {
393
+ DEFAULT: {
394
+ value: {
395
+ base: '{colors.neutral.100}',
396
+ _light: '{colors.neutral.100}',
397
+ _dark: '{colors.dark}'
398
+ }
399
+ },
400
+ hovered: {
401
+ value: {
402
+ base: '#E7EDF5', // Doesn't have raw token
403
+ _light: '#E7EDF5', // Doesn't have raw token
404
+ _dark: '{colors.dark.100}'
405
+ }
406
+ }
407
+ },
408
+ },
409
+ text: {
410
+ default: {
411
+ DEFAULT: {
412
+ value: {
413
+ base: '{colors.neutral.1000}',
414
+ _light: '{colors.neutral.1000}',
415
+ _dark: '{colors.dark.900}'
416
+ }
417
+ },
418
+ static: {
419
+ value: {
420
+ base: '{colors.neutral.1000}',
421
+ _light: '{colors.neutral.1000}',
422
+ _dark: '{colors.neutral.1000}'
423
+ }
424
+ }
425
+ },
426
+ secondary: {
427
+ DEFAULT: {
428
+ value: {
429
+ base: '{colors.neutral.700}',
430
+ _light: '{colors.neutral.700}',
431
+ _dark: '{colors.dark.700}'
432
+ }
433
+ },
434
+ pressed: {
435
+ value: {
436
+ base: '{colors.neutral.800}',
437
+ _light: '{colors.neutral.800}',
438
+ _dark: '{colors.dark.800}'
439
+ }
440
+ },
441
+ },
442
+ placeholder: {
443
+ value: {
444
+ base: '{colors.neutral.600}',
445
+ _light: '{colors.neutral.600}',
446
+ _dark: '{colors.dark.600}'
447
+ }
448
+ },
449
+ disabled: {
450
+ value: {
451
+ base: 'rgba(29, 31, 36, 0.32)', // Doesn't have raw token
452
+ _light: 'rgba(29, 31, 36, 0.32)', // Doesn't have raw token
453
+ _dark: 'rgba(191, 219, 248, 0.28)' // Doesn't have raw token
454
+ }
455
+ },
456
+ inverse: {
457
+ DEFAULT: {
458
+ value: {
459
+ base: '{colors.white}',
460
+ _light: '{colors.white}',
461
+ _dark: '{colors.dark.100}'
462
+ }
463
+ },
464
+ static: {
465
+ value: {
466
+ base: '{colors.white}',
467
+ _light: '{colors.white}',
468
+ _dark: '{colors.white}'
469
+ }
470
+ }
471
+ },
472
+ selected: {
473
+ value: {
474
+ base: '{colors.indigo.700}',
475
+ _light: '{colors.indigo.700}',
476
+ _dark: '{colors.indigo.400}'
477
+ }
478
+ },
479
+ danger: {
480
+ DEFAULT: {
481
+ value: {
482
+ base: '{colors.red.800}',
483
+ _light: '{colors.red.800}',
484
+ _dark: '{colors.red.300}'
485
+ }
486
+ },
487
+ pressed: {
488
+ value: {
489
+ base: '{colors.red.900}',
490
+ _light: '{colors.red.900}',
491
+ _dark: '{colors.red.200}'
492
+ }
493
+ }
494
+ },
495
+ warning: {
496
+ DEFAULT: {
497
+ value: {
498
+ base: '{colors.orange.800}',
499
+ _light: '{colors.orange.800}',
500
+ _dark: '{colors.yellow.300}'
501
+ }
502
+ },
503
+
504
+ inverse: {
505
+ value: {
506
+ base: '{colors.neutral.1000}',
507
+ _light: '{colors.neutral.1000}',
508
+ _dark: '{colors.neutral.1000}'
509
+ }
510
+ }
511
+ },
512
+ success: {
513
+ value: {
514
+ base: '{colors.green.800}',
515
+ _light: '{colors.green.800}',
516
+ _dark: '{colors.green.300}'
517
+ }
518
+ },
519
+ highlight: {
520
+ value: {
521
+ base: '{colors.violet.800}',
522
+ _light: '{colors.violet.800}',
523
+ _dark: '{colors.violet.300}'
524
+ }
525
+ },
526
+ information: {
527
+ value: {
528
+ base: '{colors.indigo.800}',
529
+ _light: '{colors.indigo.800}',
530
+ _dark: '{colors.indigo.300}'
531
+ }
532
+ },
533
+ link: {
534
+ DEFAULT: {
535
+ value: {
536
+ base: '{colors.indigo.700}',
537
+ _light: '{colors.indigo.700}',
538
+ _dark: '{colors.indigo.400}'
539
+ }
540
+ },
541
+ pressed: {
542
+ value: {
543
+ base: '{colors.indigo.800}',
544
+ _light: '{colors.indigo.800}',
545
+ _dark: '{colors.indigo.300}'
546
+ }
547
+ }
548
+ }
549
+ },
550
+ icon: {
551
+ default: {
552
+ value: {
553
+ base: '{colors.neutral.600}',
554
+ _light: '{colors.neutral.600}',
555
+ _dark: '{colors.dark.600}'
556
+ }
557
+ },
558
+ disabled: {
559
+ value: {
560
+ base: '{colors.neutral.400}',
561
+ _light: '{colors.neutral.400}',
562
+ _dark: '{colors.dark.400}'
563
+ }
564
+ },
565
+ inverse: {
566
+ DEFAULT: {
567
+ value: {
568
+ base: '{colors.white}',
569
+ _light: '{colors.white}',
570
+ _dark: '{colors.dark.100}'
571
+ }
572
+ },
573
+ static: {
574
+ value: {
575
+ base: '{colors.white}',
576
+ _light: '{colors.white}',
577
+ _dark: '{colors.white}'
578
+ }
579
+ }
580
+ },
581
+ selected: {
582
+ value: {
583
+ base: '{colors.indigo.700}',
584
+ _light: '{colors.indigo.700}',
585
+ _dark: '{colors.indigo.400}'
586
+ }
587
+ },
588
+ brand: {
589
+ value: {
590
+ base: '{colors.indigo.700}',
591
+ _light: '{colors.indigo.700}',
592
+ _dark: '{colors.indigo.400}'
593
+ }
594
+ },
595
+ danger: {
596
+ value: {
597
+ base: '{colors.red.700}',
598
+ _light: '{colors.red.700}',
599
+ _dark: '{colors.red.400}'
600
+ }
601
+ },
602
+ warning: {
603
+ DEFAULT: {
604
+ value: {
605
+ base: '{colors.orange.700}',
606
+ _light: '{colors.orange.700}',
607
+ _dark: '{colors.yellow.300}'
608
+ }
609
+ },
610
+ inverse: {
611
+ value: {
612
+ base: '{colors.neutral.1000}',
613
+ _light: '{colors.neutral.1000}',
614
+ _dark: '{colors.dark.100}'
615
+ }
616
+ }
617
+ },
618
+ success: {
619
+ value: {
620
+ base: '{colors.green.700}',
621
+ _light: '{colors.green.700}',
622
+ _dark: '{colors.green.400}'
623
+ }
624
+ },
625
+ highlight: {
626
+ value: {
627
+ base: '{colors.violet.700}',
628
+ _light: '{colors.violet.700}',
629
+ _dark: '{colors.violet.400}'
630
+ }
631
+ },
632
+ information: {
633
+ value: {
634
+ base: '{colors.indigo.700}',
635
+ _light: '{colors.indigo.700}',
636
+ _dark: '{colors.indigo.400}'
637
+ }
638
+ },
639
+ subtle: {
640
+ value: {
641
+ base: '{colors.neutral.300}',
642
+ _light: '{colors.neutral.300}',
643
+ _dark: '{colors.dark.300}'
644
+ }
645
+ },
646
+ logo: {
647
+ value: {
648
+ base: '{colors.neutral.1000}',
649
+ _light: '{colors.neutral.1000}',
650
+ _dark: '{colors.neutral.100}'
651
+ }
652
+ },
653
+ },
654
+ border: {
655
+ default: {
656
+ value: {
657
+ base: '{colors.neutral.300}',
658
+ _light: '{colors.neutral.300}',
659
+ _dark: '{colors.dark.300}'
660
+ }
661
+ },
662
+ bold: {
663
+ value: {
664
+ base: '{colors.neutral.600}',
665
+ _light: '{colors.neutral.600}',
666
+ _dark: '{colors.dark.600}'
667
+ }
668
+ },
669
+ disabled: {
670
+ value: {
671
+ base: 'rgba(29, 31, 36, 0.08)', // Doens't have raw token
672
+ _light: 'rgba(29, 31, 36, 0.08)', // Doens't have raw token
673
+ _dark: 'rgba(161, 189, 217, 0.08)' // Doens't have raw token
674
+ }
675
+ },
676
+ form: {
677
+ value: {
678
+ base: 'rgba(29, 31, 36, 0.16)', // Doens't have raw token
679
+ _light: 'rgba(29, 31, 36, 0.16)', // Doens't have raw token
680
+ _dark: 'rgba(166, 197, 226, 0.16)' // Doens't have raw token
681
+ }
682
+ },
683
+ focused: {
684
+ value: {
685
+ base: '{colors.indigo.500}',
686
+ _light: '{colors.indigo.500}',
687
+ _dark: '{colors.indigo.300}'
688
+ }
689
+ },
690
+ inverse: {
691
+ value: {
692
+ base: '{colors.white}',
693
+ _light: '{colors.white}',
694
+ _dark: '{colors.dark.100}'
695
+ }
696
+ },
697
+ selected: {
698
+ DEFAULT: {
699
+ value: {
700
+ base: '{colors.indigo.700}',
701
+ _light: '{colors.indigo.700}',
702
+ _dark: '{colors.indigo.400}'
703
+ }
704
+ },
705
+ hovered: {
706
+ value: {
707
+ base: '{colors.indigo.800}',
708
+ _light: '{colors.indigo.800}',
709
+ _dark: '{colors.indigo.300}'
710
+ }
711
+ },
712
+ disabled: {
713
+ value: {
714
+ base: '{colors.indigo.200}',
715
+ _light: '{colors.indigo.200}',
716
+ _dark: '{colors.indigo.900}'
717
+ }
718
+ }
719
+ },
720
+ brand: {
721
+ value: {
722
+ base: '{colors.indigo.700}',
723
+ _light: '{colors.indigo.700}',
724
+ _dark: '{colors.indigo.400}'
725
+ }
726
+ },
727
+ danger: {
728
+ value: {
729
+ base: '{colors.red.700}',
730
+ _light: '{colors.red.700}',
731
+ _dark: '{colors.red.400}'
732
+ }
733
+ },
734
+ warning: {
735
+ value: {
736
+ base: '{colors.yellow.300}',
737
+ _light: '{colors.yellow.300}',
738
+ _dark: '{colors.yellow.300}'
739
+ }
740
+ },
741
+ success: {
742
+ value: {
743
+ base: '{colors.green.700}',
744
+ _light: '{colors.green.700}',
745
+ _dark: '{colors.green.400}'
746
+ }
747
+ },
748
+ highlight: {
749
+ value: {
750
+ base: '{colors.violet.700}',
751
+ _light: '{colors.violet.700}',
752
+ _dark: '{colors.violet.400}'
753
+ }
754
+ },
755
+ information: {
756
+ value: {
757
+ base: '{colors.indigo.700}',
758
+ _light: '{colors.indigo.700}',
759
+ _dark: '{colors.indigo.400}'
760
+ }
761
+ },
762
+ },
763
+ chart: {
764
+ cat01: {
765
+ DEFAULT: {
766
+ value: {
767
+ base: '{colors.blue.400}',
768
+ _light: '{colors.blue.400}',
769
+ _dark: '{colors.blue.300}'
770
+ }
771
+ },
772
+ bold: {
773
+ value: {
774
+ base: '{colors.blue.600}',
775
+ _light: '{colors.blue.600}',
776
+ _dark: '{colors.blue.500}'
777
+ }
778
+ }
779
+ },
780
+ cat02: {
781
+ DEFAULT: {
782
+ value: {
783
+ base: '{colors.teal.400}',
784
+ _light: '{colors.teal.400}',
785
+ _dark: '{colors.teal.300}'
786
+ }
787
+ },
788
+ bold: {
789
+ value: {
790
+ base: '{colors.teal.600}',
791
+ _light: '{colors.teal.600}',
792
+ _dark: '{colors.teal.500}'
793
+ }
794
+ }
795
+ },
796
+ cat03: {
797
+ DEFAULT: {
798
+ value: {
799
+ base: '{colors.violet.400}',
800
+ _light: '{colors.violet.400}',
801
+ _dark: '{colors.violet.300}'
802
+ }
803
+ },
804
+ bold: {
805
+ value: {
806
+ base: '{colors.violet.600}',
807
+ _light: '{colors.violet.600}',
808
+ _dark: '{colors.violet.500}'
809
+ }
810
+ }
811
+ },
812
+ cat04: {
813
+ DEFAULT: {
814
+ value: {
815
+ base: '{colors.orange.400}',
816
+ _light: '{colors.orange.400}',
817
+ _dark: '{colors.orange.300}'
818
+ }
819
+ },
820
+ bold: {
821
+ value: {
822
+ base: '{colors.orange.600}',
823
+ _light: '{colors.orange.600}',
824
+ _dark: '{colors.orange.500}'
825
+ }
826
+ }
827
+ },
828
+ cat05: {
829
+ DEFAULT: {
830
+ value: {
831
+ base: '{colors.neutral.400}',
832
+ _light: '{colors.neutral.400}',
833
+ _dark: '{colors.neutral.300}'
834
+ }
835
+ },
836
+ bold: {
837
+ value: {
838
+ base: '{colors.neutral.600}',
839
+ _light: '{colors.neutral.600}',
840
+ _dark: '{colors.neutral.500}'
841
+ }
842
+ }
843
+ },
844
+ cat06: {
845
+ DEFAULT: {
846
+ value: {
847
+ base: '{colors.red.400}',
848
+ _light: '{colors.red.400}',
849
+ _dark: '{colors.red.300}'
850
+ }
851
+ },
852
+ bold: {
853
+ value: {
854
+ base: '{colors.red.600}',
855
+ _light: '{colors.red.600}',
856
+ _dark: '{colors.red.500}'
857
+ }
858
+ }
859
+ },
860
+ cat07: {
861
+ DEFAULT: {
862
+ value: {
863
+ base: '{colors.lime.400}',
864
+ _light: '{colors.lime.400}',
865
+ _dark: '{colors.lime.300}'
866
+ }
867
+ },
868
+ bold: {
869
+ value: {
870
+ base: '{colors.lime.600}',
871
+ _light: '{colors.lime.600}',
872
+ _dark: '{colors.lime.500}'
873
+ }
874
+ }
875
+ },
876
+ cat08: {
877
+ DEFAULT: {
878
+ value: {
879
+ base: '{colors.fuchsia.400}',
880
+ _light: '{colors.fuchsia.400}',
881
+ _dark: '{colors.fuchsia.300}'
882
+ }
883
+ },
884
+ bold: {
885
+ value: {
886
+ base: '{colors.fuchsia.600}',
887
+ _light: '{colors.fuchsia.600}',
888
+ _dark: '{colors.fuchsia.500}'
889
+ }
890
+ }
891
+ },
892
+ }
893
+ })