@vegastack/design-tokens 0.2.0 → 0.4.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 (9) hide show
  1. package/dist/base.css +37 -8
  2. package/dist/theme.css +108 -67
  3. package/dist/tokens.cjs +77 -45
  4. package/dist/tokens.d.cts +75 -43
  5. package/dist/tokens.d.ts +75 -43
  6. package/dist/tokens.js +77 -45
  7. package/dist/tokens.json +77 -45
  8. package/dist/utilities.css +80 -0
  9. package/package.json +10 -10
package/dist/tokens.d.ts CHANGED
@@ -2,42 +2,46 @@ declare const tokens: {
2
2
  readonly light: {
3
3
  readonly background: "oklch(0.994 0.002 75)";
4
4
  readonly foreground: "oklch(0.145 0.003 75)";
5
- readonly card: "oklch(0.985 0.003 75)";
5
+ readonly card: "oklch(0.994 0.002 75)";
6
6
  readonly "card-foreground": "oklch(0.145 0.003 75)";
7
7
  readonly popover: "oklch(0.994 0.002 75)";
8
8
  readonly "popover-foreground": "oklch(0.145 0.003 75)";
9
+ readonly "surface-1": "oklch(0.97 0.003 75)";
10
+ readonly "surface-2": "oklch(0.945 0.003 75)";
11
+ readonly "surface-3": "oklch(0.922 0.003 75)";
9
12
  readonly primary: "oklch(0.353 0.003 75)";
10
13
  readonly "primary-foreground": "oklch(0.985 0.003 75)";
11
14
  readonly "primary-hover": "oklch(0.269 0.003 75)";
12
15
  readonly "primary-active": "oklch(0.236 0.003 75)";
13
- readonly track: "oklch(0.87 0.003 75)";
14
16
  readonly secondary: "oklch(0.97 0.003 75)";
15
- readonly "secondary-foreground": "oklch(0.205 0.003 75)";
17
+ readonly "secondary-foreground": "oklch(0.145 0.003 75)";
16
18
  readonly muted: "oklch(0.97 0.003 75)";
17
19
  readonly "muted-foreground": "oklch(0.439 0.003 75)";
18
20
  readonly "muted-foreground-faint": "oklch(0.63 0.003 75)";
19
- readonly accent: "oklch(0.97 0.003 75)";
20
- readonly "accent-foreground": "oklch(0.205 0.003 75)";
21
+ readonly accent: "oklch(0.945 0.003 75)";
22
+ readonly "accent-foreground": "oklch(0.145 0.003 75)";
21
23
  readonly destructive: "oklch(0.505 0.213 27.52)";
22
24
  readonly "destructive-foreground": "oklch(0.985 0.003 75)";
23
25
  readonly "destructive-subtle": "oklch(0.949 0.022 24)";
24
- readonly "destructive-text": "oklch(0.521 0.2 25)";
26
+ readonly "destructive-text": "oklch(0.496 0.2 25)";
25
27
  readonly "destructive-border": "oklch(0.505 0.213 27.52)";
26
28
  readonly success: "oklch(0.5 0.16 150)";
27
29
  readonly "success-foreground": "oklch(0.985 0.003 75)";
28
30
  readonly "success-subtle": "oklch(0.951 0.051 150)";
29
- readonly "success-text": "oklch(0.5 0.13 150)";
31
+ readonly "success-text": "oklch(0.48 0.13 150)";
30
32
  readonly warning: "oklch(0.52 0.145 52)";
31
33
  readonly "warning-foreground": "oklch(0.985 0.003 75)";
32
34
  readonly "warning-subtle": "oklch(0.96 0.019 42)";
33
- readonly "warning-text": "oklch(0.52 0.139 42)";
35
+ readonly "warning-text": "oklch(0.505 0.139 42)";
34
36
  readonly info: "oklch(0.531 0.182 256)";
35
37
  readonly "info-foreground": "oklch(0.985 0.003 75)";
36
38
  readonly "info-subtle": "oklch(0.961 0.018 253)";
37
- readonly "info-text": "oklch(0.52 0.171 256)";
39
+ readonly "info-text": "oklch(0.5 0.171 256)";
38
40
  readonly overlay: "oklch(0.13 0.002 75 / 0.28)";
39
- readonly border: "oklch(0.922 0.003 75)";
40
- readonly input: "oklch(0.922 0.003 75)";
41
+ readonly "media-scrim": "oklch(0.13 0.002 75 / 0.6)";
42
+ readonly "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)";
43
+ readonly "media-foreground": "oklch(0.985 0.003 75)";
44
+ readonly input: "oklch(0.145 0.003 75 / 0.08)";
41
45
  readonly ring: "oklch(0.353 0.003 75)";
42
46
  readonly "chart-1": "oklch(0.546 0.245 262.88)";
43
47
  readonly "chart-2": "oklch(0.6 0.118 184.7)";
@@ -47,7 +51,9 @@ declare const tokens: {
47
51
  readonly "chart-6": "oklch(0.505 0.213 27.52)";
48
52
  readonly "chart-7": "oklch(0.6 0.127 104.2)";
49
53
  readonly "chart-8": "oklch(0.531 0.182 256)";
54
+ readonly "chart-single": "oklch(0.145 0.003 75)";
50
55
  readonly brand: "oklch(0.6 0.17 148)";
56
+ readonly "brand-text": "oklch(0.46 0.17 148)";
51
57
  readonly "tag-blue": "oklch(0.6 0.16 256)";
52
58
  readonly "tag-blue-subtle": "oklch(0.955 0.02 256)";
53
59
  readonly "tag-blue-text": "oklch(0.51 0.15 256)";
@@ -78,13 +84,13 @@ declare const tokens: {
78
84
  readonly "tag-purple": "oklch(0.6 0.16 295)";
79
85
  readonly "tag-purple-subtle": "oklch(0.955 0.02 295)";
80
86
  readonly "tag-purple-text": "oklch(0.51 0.15 295)";
81
- readonly sidebar: "oklch(0.985 0.003 75)";
82
- readonly "sidebar-foreground": "oklch(0.269 0.003 75)";
83
- readonly "sidebar-primary": "oklch(0.145 0.003 75)";
87
+ readonly sidebar: "oklch(0.994 0.002 75)";
88
+ readonly "sidebar-foreground": "oklch(0.145 0.003 75)";
89
+ readonly "sidebar-primary": "oklch(0.353 0.003 75)";
84
90
  readonly "sidebar-primary-foreground": "oklch(0.985 0.003 75)";
85
- readonly "sidebar-accent": "oklch(0.955 0.003 75)";
91
+ readonly "sidebar-accent": "oklch(0.945 0.003 75)";
86
92
  readonly "sidebar-accent-foreground": "oklch(0.145 0.003 75)";
87
- readonly "sidebar-border": "oklch(0.922 0.003 75)";
93
+ readonly "sidebar-border": "oklch(0.145 0.003 75 / 0.08)";
88
94
  readonly "sidebar-ring": "oklch(0.353 0.003 75)";
89
95
  readonly radius: "0.75rem";
90
96
  readonly "radius-xs": "0.125rem";
@@ -103,35 +109,39 @@ declare const tokens: {
103
109
  readonly "icon-feature": "1.5rem";
104
110
  readonly "sidebar-width": "15rem";
105
111
  readonly "sidebar-width-icon": "3rem";
112
+ readonly "sidebar-width-mobile": "18rem";
113
+ readonly "layout-header-height": "3.5rem";
114
+ readonly "layout-overlay-max-height": "calc(100dvh - 16rem)";
115
+ readonly "panel-width-sm": "14rem";
116
+ readonly "panel-width-md": "18rem";
117
+ readonly "panel-width-lg": "20rem";
106
118
  readonly "shadow-overlay": "0 4px 14px -4px oklch(0.13 0.002 75 / 0.1), 0 2px 4px -2px oklch(0.13 0.002 75 / 0.06)";
107
- readonly "shadow-lit": "inset 0 1px 0 0 oklch(1 0 0 / 0.12), 0 1px 2px 0 oklch(0.13 0.002 75 / 0.18), 0 2px 6px -2px oklch(0.13 0.002 75 / 0.14)";
108
119
  readonly "effect-blur-glass": "8px";
109
120
  readonly "z-raised": 10;
110
121
  readonly "z-overlay": 50;
122
+ readonly "z-toast": 60;
111
123
  readonly "opacity-dim": "50%";
112
124
  readonly "opacity-hint-soft": "60%";
113
125
  readonly "opacity-hint": "70%";
114
126
  readonly "opacity-track": "25%";
127
+ readonly "alpha-hover": "7%";
128
+ readonly "alpha-pressed": "10%";
129
+ readonly "alpha-border": "8%";
115
130
  readonly "alpha-tint-border": "70%";
116
131
  readonly "alpha-outline-border": "50%";
117
132
  readonly "alpha-border-subtle": "20%";
118
133
  readonly "alpha-border-soft": "30%";
119
134
  readonly "alpha-surface-faint": "5%";
120
- readonly "alpha-surface-subtle": "10%";
121
135
  readonly "alpha-ink-tint": "10%";
122
136
  readonly "alpha-ink-tint-strong": "15%";
123
- readonly "alpha-soft-hover": "20%";
124
- readonly "alpha-soft-surface": "10%";
125
137
  readonly "alpha-input": "30%";
126
- readonly "alpha-input-hover": "50%";
127
- readonly "alpha-fill-hover": "80%";
128
138
  readonly "alpha-wash-faint": "40%";
129
139
  readonly "alpha-wash": "50%";
130
140
  readonly "alpha-wash-strong": "60%";
131
141
  readonly "alpha-backdrop-soft": "60%";
132
142
  readonly "alpha-glass": "90%";
133
143
  readonly "alpha-glass-hover": "95%";
134
- readonly "alpha-link-hover": "80%";
144
+ readonly "alpha-link-hover": "88%";
135
145
  readonly "alpha-outline-soft": "50%";
136
146
  readonly "type-product-xs": {
137
147
  readonly fontSize: "0.6875rem";
@@ -281,23 +291,29 @@ declare const tokens: {
281
291
  readonly "duration-fast": "150ms";
282
292
  readonly "duration-base": "200ms";
283
293
  readonly "duration-slow": "300ms";
294
+ readonly "duration-indeterminate": "1200ms";
284
295
  readonly "motion-ease-standard": "cubic-bezier(0.2, 0, 0, 1)";
285
296
  readonly "motion-ease-emphasized": "cubic-bezier(0.3, 0, 0, 1)";
286
297
  readonly "motion-ease-exit": "cubic-bezier(0.4, 0, 1, 1)";
287
298
  readonly "motion-ease-spring": "linear(0, 0.5 60%, 1.05 80%, 0.98 90%, 1)";
288
299
  readonly "motion-blur": "2px";
300
+ readonly border: "oklch(0.145 0.003 75 / 0.08)";
289
301
  readonly "destructive-hover": "oklch(0.455 0.213 27.52)";
290
302
  readonly "destructive-active": "oklch(0.415 0.213 27.52)";
291
303
  readonly "destructive-subtle-hover": "oklch(0.91 0.036 20.4)";
304
+ readonly "destructive-subtle-active": "oklch(0.883 0.046 19.3)";
292
305
  readonly "success-hover": "oklch(0.45 0.16 150)";
293
306
  readonly "success-active": "oklch(0.41 0.16 150)";
294
307
  readonly "success-subtle-hover": "oklch(0.919 0.059 151.1)";
308
+ readonly "success-subtle-active": "oklch(0.896 0.065 151.7)";
295
309
  readonly "warning-hover": "oklch(0.47 0.145 52)";
296
310
  readonly "warning-active": "oklch(0.43 0.145 52)";
297
311
  readonly "warning-subtle-hover": "oklch(0.929 0.027 48.8)";
312
+ readonly "warning-subtle-active": "oklch(0.906 0.034 51.5)";
298
313
  readonly "info-hover": "oklch(0.481 0.182 256)";
299
314
  readonly "info-active": "oklch(0.441 0.182 256)";
300
315
  readonly "info-subtle-hover": "oklch(0.929 0.03 251.1)";
316
+ readonly "info-subtle-active": "oklch(0.906 0.038 250.5)";
301
317
  };
302
318
  readonly dark: {
303
319
  readonly background: "oklch(0.175 0.003 75)";
@@ -306,27 +322,29 @@ declare const tokens: {
306
322
  readonly "card-foreground": "oklch(0.922 0.003 75)";
307
323
  readonly popover: "oklch(0.205 0.003 75)";
308
324
  readonly "popover-foreground": "oklch(0.922 0.003 75)";
325
+ readonly "surface-1": "oklch(0.236 0.003 75)";
326
+ readonly "surface-2": "oklch(0.269 0.003 75)";
327
+ readonly "surface-3": "oklch(0.29 0.003 75)";
309
328
  readonly primary: "oklch(0.922 0.003 75)";
310
329
  readonly "primary-foreground": "oklch(0.145 0.003 75)";
311
330
  readonly "primary-hover": "oklch(0.97 0.003 75)";
312
331
  readonly "primary-active": "oklch(0.994 0.002 75)";
313
- readonly track: "oklch(0.439 0.003 75)";
314
- readonly secondary: "oklch(0.269 0.003 75)";
332
+ readonly secondary: "oklch(0.236 0.003 75)";
315
333
  readonly "secondary-foreground": "oklch(0.922 0.003 75)";
316
- readonly muted: "oklch(0.269 0.003 75)";
334
+ readonly muted: "oklch(0.236 0.003 75)";
317
335
  readonly "muted-foreground": "oklch(0.66 0.003 75)";
318
336
  readonly "muted-foreground-faint": "oklch(0.559 0.003 75)";
319
337
  readonly accent: "oklch(0.269 0.003 75)";
320
- readonly "accent-foreground": "oklch(0.967 0.003 75)";
338
+ readonly "accent-foreground": "oklch(0.922 0.003 75)";
321
339
  readonly destructive: "oklch(0.505 0.213 27.52)";
322
340
  readonly "destructive-foreground": "oklch(0.985 0.003 75)";
323
341
  readonly "destructive-subtle": "oklch(0.275 0.07 25)";
324
- readonly "destructive-text": "oklch(0.72 0.16 25)";
342
+ readonly "destructive-text": "oklch(0.74 0.16 25)";
325
343
  readonly "destructive-border": "oklch(0.72 0.16 25)";
326
344
  readonly success: "oklch(0.5 0.16 150)";
327
345
  readonly "success-foreground": "oklch(0.985 0.003 75)";
328
346
  readonly "success-subtle": "oklch(0.276 0.061 150)";
329
- readonly "success-text": "oklch(0.72 0.17 150)";
347
+ readonly "success-text": "oklch(0.74 0.17 150)";
330
348
  readonly warning: "oklch(0.52 0.145 52)";
331
349
  readonly "warning-foreground": "oklch(0.985 0.003 75)";
332
350
  readonly "warning-subtle": "oklch(0.28 0.069 42)";
@@ -334,10 +352,12 @@ declare const tokens: {
334
352
  readonly info: "oklch(0.531 0.182 256)";
335
353
  readonly "info-foreground": "oklch(0.985 0.003 75)";
336
354
  readonly "info-subtle": "oklch(0.275 0.059 255)";
337
- readonly "info-text": "oklch(0.72 0.13 256)";
355
+ readonly "info-text": "oklch(0.76 0.13 256)";
338
356
  readonly overlay: "oklch(0 0 0 / 0.55)";
339
- readonly border: "oklch(0.269 0.003 75)";
340
- readonly input: "oklch(0.269 0.003 75)";
357
+ readonly "media-scrim": "oklch(0.13 0.002 75 / 0.6)";
358
+ readonly "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)";
359
+ readonly "media-foreground": "oklch(0.985 0.003 75)";
360
+ readonly input: "oklch(0.922 0.003 75 / 0.14)";
341
361
  readonly ring: "oklch(0.922 0.003 75)";
342
362
  readonly "chart-1": "oklch(0.623 0.214 259.81)";
343
363
  readonly "chart-2": "oklch(0.696 0.17 162.48)";
@@ -347,7 +367,9 @@ declare const tokens: {
347
367
  readonly "chart-6": "oklch(0.69 0.21 25)";
348
368
  readonly "chart-7": "oklch(0.72 0.15 103.9)";
349
369
  readonly "chart-8": "oklch(0.72 0.13 256)";
370
+ readonly "chart-single": "oklch(0.922 0.003 75)";
350
371
  readonly brand: "oklch(0.86 0.21 148)";
372
+ readonly "brand-text": "oklch(0.86 0.21 148)";
351
373
  readonly "tag-blue": "oklch(0.72 0.14 256)";
352
374
  readonly "tag-blue-subtle": "oklch(0.275 0.05 256)";
353
375
  readonly "tag-blue-text": "oklch(0.75 0.13 256)";
@@ -378,13 +400,13 @@ declare const tokens: {
378
400
  readonly "tag-purple": "oklch(0.72 0.15 295)";
379
401
  readonly "tag-purple-subtle": "oklch(0.275 0.05 295)";
380
402
  readonly "tag-purple-text": "oklch(0.75 0.13 295)";
381
- readonly sidebar: "oklch(0.145 0.003 75)";
382
- readonly "sidebar-foreground": "oklch(0.87 0.003 75)";
403
+ readonly sidebar: "oklch(0.205 0.003 75)";
404
+ readonly "sidebar-foreground": "oklch(0.922 0.003 75)";
383
405
  readonly "sidebar-primary": "oklch(0.922 0.003 75)";
384
406
  readonly "sidebar-primary-foreground": "oklch(0.145 0.003 75)";
385
- readonly "sidebar-accent": "oklch(0.205 0.003 75)";
407
+ readonly "sidebar-accent": "oklch(0.269 0.003 75)";
386
408
  readonly "sidebar-accent-foreground": "oklch(0.922 0.003 75)";
387
- readonly "sidebar-border": "oklch(0.269 0.003 75)";
409
+ readonly "sidebar-border": "oklch(0.922 0.003 75 / 0.14)";
388
410
  readonly "sidebar-ring": "oklch(0.922 0.003 75)";
389
411
  readonly radius: "0.75rem";
390
412
  readonly "radius-xs": "0.125rem";
@@ -403,35 +425,39 @@ declare const tokens: {
403
425
  readonly "icon-feature": "1.5rem";
404
426
  readonly "sidebar-width": "15rem";
405
427
  readonly "sidebar-width-icon": "3rem";
428
+ readonly "sidebar-width-mobile": "18rem";
429
+ readonly "layout-header-height": "3.5rem";
430
+ readonly "layout-overlay-max-height": "calc(100dvh - 16rem)";
431
+ readonly "panel-width-sm": "14rem";
432
+ readonly "panel-width-md": "18rem";
433
+ readonly "panel-width-lg": "20rem";
406
434
  readonly "shadow-overlay": "0 8px 28px -6px oklch(0 0 0 / 0.48), 0 2px 8px -2px oklch(0 0 0 / 0.4)";
407
- readonly "shadow-lit": "inset 0 1px 0 0 oklch(1 0 0 / 0.35), 0 2px 6px -2px oklch(0 0 0 / 0.5)";
408
435
  readonly "effect-blur-glass": "8px";
409
436
  readonly "z-raised": 10;
410
437
  readonly "z-overlay": 50;
438
+ readonly "z-toast": 60;
411
439
  readonly "opacity-dim": "50%";
412
440
  readonly "opacity-hint-soft": "60%";
413
441
  readonly "opacity-hint": "70%";
414
442
  readonly "opacity-track": "25%";
443
+ readonly "alpha-hover": "7%";
444
+ readonly "alpha-pressed": "10%";
445
+ readonly "alpha-border": "14%";
415
446
  readonly "alpha-tint-border": "70%";
416
447
  readonly "alpha-outline-border": "50%";
417
448
  readonly "alpha-border-subtle": "20%";
418
449
  readonly "alpha-border-soft": "30%";
419
450
  readonly "alpha-surface-faint": "5%";
420
- readonly "alpha-surface-subtle": "10%";
421
451
  readonly "alpha-ink-tint": "10%";
422
452
  readonly "alpha-ink-tint-strong": "15%";
423
- readonly "alpha-soft-hover": "30%";
424
- readonly "alpha-soft-surface": "20%";
425
453
  readonly "alpha-input": "30%";
426
- readonly "alpha-input-hover": "50%";
427
- readonly "alpha-fill-hover": "80%";
428
454
  readonly "alpha-wash-faint": "40%";
429
455
  readonly "alpha-wash": "50%";
430
456
  readonly "alpha-wash-strong": "60%";
431
457
  readonly "alpha-backdrop-soft": "60%";
432
458
  readonly "alpha-glass": "90%";
433
459
  readonly "alpha-glass-hover": "95%";
434
- readonly "alpha-link-hover": "80%";
460
+ readonly "alpha-link-hover": "88%";
435
461
  readonly "alpha-outline-soft": "50%";
436
462
  readonly "type-product-xs": {
437
463
  readonly fontSize: "0.6875rem";
@@ -581,23 +607,29 @@ declare const tokens: {
581
607
  readonly "duration-fast": "150ms";
582
608
  readonly "duration-base": "200ms";
583
609
  readonly "duration-slow": "300ms";
610
+ readonly "duration-indeterminate": "1200ms";
584
611
  readonly "motion-ease-standard": "cubic-bezier(0.2, 0, 0, 1)";
585
612
  readonly "motion-ease-emphasized": "cubic-bezier(0.3, 0, 0, 1)";
586
613
  readonly "motion-ease-exit": "cubic-bezier(0.4, 0, 1, 1)";
587
614
  readonly "motion-ease-spring": "linear(0, 0.5 60%, 1.05 80%, 0.98 90%, 1)";
588
615
  readonly "motion-blur": "2px";
616
+ readonly border: "oklch(0.922 0.003 75 / 0.14)";
589
617
  readonly "destructive-hover": "oklch(0.455 0.213 27.52)";
590
618
  readonly "destructive-active": "oklch(0.415 0.213 27.52)";
591
619
  readonly "destructive-subtle-hover": "oklch(0.34 0.123 26.3)";
620
+ readonly "destructive-subtle-active": "oklch(0.364 0.137 26.9)";
592
621
  readonly "success-hover": "oklch(0.45 0.16 150)";
593
622
  readonly "success-active": "oklch(0.41 0.16 150)";
594
623
  readonly "success-subtle-hover": "oklch(0.348 0.092 148.9)";
624
+ readonly "success-subtle-active": "oklch(0.371 0.101 148.5)";
595
625
  readonly "warning-hover": "oklch(0.47 0.145 52)";
596
626
  readonly "warning-active": "oklch(0.43 0.145 52)";
597
627
  readonly "warning-subtle-hover": "oklch(0.356 0.093 46.6)";
628
+ readonly "warning-subtle-active": "oklch(0.381 0.1 47.3)";
598
629
  readonly "info-hover": "oklch(0.481 0.182 256)";
599
630
  readonly "info-active": "oklch(0.441 0.182 256)";
600
631
  readonly "info-subtle-hover": "oklch(0.354 0.101 254.3)";
632
+ readonly "info-subtle-active": "oklch(0.38 0.114 254.5)";
601
633
  };
602
634
  };
603
635
  type Theme = keyof typeof tokens;
package/dist/tokens.js CHANGED
@@ -3,42 +3,46 @@ var tokens = {
3
3
  "light": {
4
4
  "background": "oklch(0.994 0.002 75)",
5
5
  "foreground": "oklch(0.145 0.003 75)",
6
- "card": "oklch(0.985 0.003 75)",
6
+ "card": "oklch(0.994 0.002 75)",
7
7
  "card-foreground": "oklch(0.145 0.003 75)",
8
8
  "popover": "oklch(0.994 0.002 75)",
9
9
  "popover-foreground": "oklch(0.145 0.003 75)",
10
+ "surface-1": "oklch(0.97 0.003 75)",
11
+ "surface-2": "oklch(0.945 0.003 75)",
12
+ "surface-3": "oklch(0.922 0.003 75)",
10
13
  "primary": "oklch(0.353 0.003 75)",
11
14
  "primary-foreground": "oklch(0.985 0.003 75)",
12
15
  "primary-hover": "oklch(0.269 0.003 75)",
13
16
  "primary-active": "oklch(0.236 0.003 75)",
14
- "track": "oklch(0.87 0.003 75)",
15
17
  "secondary": "oklch(0.97 0.003 75)",
16
- "secondary-foreground": "oklch(0.205 0.003 75)",
18
+ "secondary-foreground": "oklch(0.145 0.003 75)",
17
19
  "muted": "oklch(0.97 0.003 75)",
18
20
  "muted-foreground": "oklch(0.439 0.003 75)",
19
21
  "muted-foreground-faint": "oklch(0.63 0.003 75)",
20
- "accent": "oklch(0.97 0.003 75)",
21
- "accent-foreground": "oklch(0.205 0.003 75)",
22
+ "accent": "oklch(0.945 0.003 75)",
23
+ "accent-foreground": "oklch(0.145 0.003 75)",
22
24
  "destructive": "oklch(0.505 0.213 27.52)",
23
25
  "destructive-foreground": "oklch(0.985 0.003 75)",
24
26
  "destructive-subtle": "oklch(0.949 0.022 24)",
25
- "destructive-text": "oklch(0.521 0.2 25)",
27
+ "destructive-text": "oklch(0.496 0.2 25)",
26
28
  "destructive-border": "oklch(0.505 0.213 27.52)",
27
29
  "success": "oklch(0.5 0.16 150)",
28
30
  "success-foreground": "oklch(0.985 0.003 75)",
29
31
  "success-subtle": "oklch(0.951 0.051 150)",
30
- "success-text": "oklch(0.5 0.13 150)",
32
+ "success-text": "oklch(0.48 0.13 150)",
31
33
  "warning": "oklch(0.52 0.145 52)",
32
34
  "warning-foreground": "oklch(0.985 0.003 75)",
33
35
  "warning-subtle": "oklch(0.96 0.019 42)",
34
- "warning-text": "oklch(0.52 0.139 42)",
36
+ "warning-text": "oklch(0.505 0.139 42)",
35
37
  "info": "oklch(0.531 0.182 256)",
36
38
  "info-foreground": "oklch(0.985 0.003 75)",
37
39
  "info-subtle": "oklch(0.961 0.018 253)",
38
- "info-text": "oklch(0.52 0.171 256)",
40
+ "info-text": "oklch(0.5 0.171 256)",
39
41
  "overlay": "oklch(0.13 0.002 75 / 0.28)",
40
- "border": "oklch(0.922 0.003 75)",
41
- "input": "oklch(0.922 0.003 75)",
42
+ "media-scrim": "oklch(0.13 0.002 75 / 0.6)",
43
+ "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)",
44
+ "media-foreground": "oklch(0.985 0.003 75)",
45
+ "input": "oklch(0.145 0.003 75 / 0.08)",
42
46
  "ring": "oklch(0.353 0.003 75)",
43
47
  "chart-1": "oklch(0.546 0.245 262.88)",
44
48
  "chart-2": "oklch(0.6 0.118 184.7)",
@@ -48,7 +52,9 @@ var tokens = {
48
52
  "chart-6": "oklch(0.505 0.213 27.52)",
49
53
  "chart-7": "oklch(0.6 0.127 104.2)",
50
54
  "chart-8": "oklch(0.531 0.182 256)",
55
+ "chart-single": "oklch(0.145 0.003 75)",
51
56
  "brand": "oklch(0.6 0.17 148)",
57
+ "brand-text": "oklch(0.46 0.17 148)",
52
58
  "tag-blue": "oklch(0.6 0.16 256)",
53
59
  "tag-blue-subtle": "oklch(0.955 0.02 256)",
54
60
  "tag-blue-text": "oklch(0.51 0.15 256)",
@@ -79,13 +85,13 @@ var tokens = {
79
85
  "tag-purple": "oklch(0.6 0.16 295)",
80
86
  "tag-purple-subtle": "oklch(0.955 0.02 295)",
81
87
  "tag-purple-text": "oklch(0.51 0.15 295)",
82
- "sidebar": "oklch(0.985 0.003 75)",
83
- "sidebar-foreground": "oklch(0.269 0.003 75)",
84
- "sidebar-primary": "oklch(0.145 0.003 75)",
88
+ "sidebar": "oklch(0.994 0.002 75)",
89
+ "sidebar-foreground": "oklch(0.145 0.003 75)",
90
+ "sidebar-primary": "oklch(0.353 0.003 75)",
85
91
  "sidebar-primary-foreground": "oklch(0.985 0.003 75)",
86
- "sidebar-accent": "oklch(0.955 0.003 75)",
92
+ "sidebar-accent": "oklch(0.945 0.003 75)",
87
93
  "sidebar-accent-foreground": "oklch(0.145 0.003 75)",
88
- "sidebar-border": "oklch(0.922 0.003 75)",
94
+ "sidebar-border": "oklch(0.145 0.003 75 / 0.08)",
89
95
  "sidebar-ring": "oklch(0.353 0.003 75)",
90
96
  "radius": "0.75rem",
91
97
  "radius-xs": "0.125rem",
@@ -104,35 +110,39 @@ var tokens = {
104
110
  "icon-feature": "1.5rem",
105
111
  "sidebar-width": "15rem",
106
112
  "sidebar-width-icon": "3rem",
113
+ "sidebar-width-mobile": "18rem",
114
+ "layout-header-height": "3.5rem",
115
+ "layout-overlay-max-height": "calc(100dvh - 16rem)",
116
+ "panel-width-sm": "14rem",
117
+ "panel-width-md": "18rem",
118
+ "panel-width-lg": "20rem",
107
119
  "shadow-overlay": "0 4px 14px -4px oklch(0.13 0.002 75 / 0.1), 0 2px 4px -2px oklch(0.13 0.002 75 / 0.06)",
108
- "shadow-lit": "inset 0 1px 0 0 oklch(1 0 0 / 0.12), 0 1px 2px 0 oklch(0.13 0.002 75 / 0.18), 0 2px 6px -2px oklch(0.13 0.002 75 / 0.14)",
109
120
  "effect-blur-glass": "8px",
110
121
  "z-raised": 10,
111
122
  "z-overlay": 50,
123
+ "z-toast": 60,
112
124
  "opacity-dim": "50%",
113
125
  "opacity-hint-soft": "60%",
114
126
  "opacity-hint": "70%",
115
127
  "opacity-track": "25%",
128
+ "alpha-hover": "7%",
129
+ "alpha-pressed": "10%",
130
+ "alpha-border": "8%",
116
131
  "alpha-tint-border": "70%",
117
132
  "alpha-outline-border": "50%",
118
133
  "alpha-border-subtle": "20%",
119
134
  "alpha-border-soft": "30%",
120
135
  "alpha-surface-faint": "5%",
121
- "alpha-surface-subtle": "10%",
122
136
  "alpha-ink-tint": "10%",
123
137
  "alpha-ink-tint-strong": "15%",
124
- "alpha-soft-hover": "20%",
125
- "alpha-soft-surface": "10%",
126
138
  "alpha-input": "30%",
127
- "alpha-input-hover": "50%",
128
- "alpha-fill-hover": "80%",
129
139
  "alpha-wash-faint": "40%",
130
140
  "alpha-wash": "50%",
131
141
  "alpha-wash-strong": "60%",
132
142
  "alpha-backdrop-soft": "60%",
133
143
  "alpha-glass": "90%",
134
144
  "alpha-glass-hover": "95%",
135
- "alpha-link-hover": "80%",
145
+ "alpha-link-hover": "88%",
136
146
  "alpha-outline-soft": "50%",
137
147
  "type-product-xs": {
138
148
  "fontSize": "0.6875rem",
@@ -282,23 +292,29 @@ var tokens = {
282
292
  "duration-fast": "150ms",
283
293
  "duration-base": "200ms",
284
294
  "duration-slow": "300ms",
295
+ "duration-indeterminate": "1200ms",
285
296
  "motion-ease-standard": "cubic-bezier(0.2, 0, 0, 1)",
286
297
  "motion-ease-emphasized": "cubic-bezier(0.3, 0, 0, 1)",
287
298
  "motion-ease-exit": "cubic-bezier(0.4, 0, 1, 1)",
288
299
  "motion-ease-spring": "linear(0, 0.5 60%, 1.05 80%, 0.98 90%, 1)",
289
300
  "motion-blur": "2px",
301
+ "border": "oklch(0.145 0.003 75 / 0.08)",
290
302
  "destructive-hover": "oklch(0.455 0.213 27.52)",
291
303
  "destructive-active": "oklch(0.415 0.213 27.52)",
292
304
  "destructive-subtle-hover": "oklch(0.91 0.036 20.4)",
305
+ "destructive-subtle-active": "oklch(0.883 0.046 19.3)",
293
306
  "success-hover": "oklch(0.45 0.16 150)",
294
307
  "success-active": "oklch(0.41 0.16 150)",
295
308
  "success-subtle-hover": "oklch(0.919 0.059 151.1)",
309
+ "success-subtle-active": "oklch(0.896 0.065 151.7)",
296
310
  "warning-hover": "oklch(0.47 0.145 52)",
297
311
  "warning-active": "oklch(0.43 0.145 52)",
298
312
  "warning-subtle-hover": "oklch(0.929 0.027 48.8)",
313
+ "warning-subtle-active": "oklch(0.906 0.034 51.5)",
299
314
  "info-hover": "oklch(0.481 0.182 256)",
300
315
  "info-active": "oklch(0.441 0.182 256)",
301
- "info-subtle-hover": "oklch(0.929 0.03 251.1)"
316
+ "info-subtle-hover": "oklch(0.929 0.03 251.1)",
317
+ "info-subtle-active": "oklch(0.906 0.038 250.5)"
302
318
  },
303
319
  "dark": {
304
320
  "background": "oklch(0.175 0.003 75)",
@@ -307,27 +323,29 @@ var tokens = {
307
323
  "card-foreground": "oklch(0.922 0.003 75)",
308
324
  "popover": "oklch(0.205 0.003 75)",
309
325
  "popover-foreground": "oklch(0.922 0.003 75)",
326
+ "surface-1": "oklch(0.236 0.003 75)",
327
+ "surface-2": "oklch(0.269 0.003 75)",
328
+ "surface-3": "oklch(0.29 0.003 75)",
310
329
  "primary": "oklch(0.922 0.003 75)",
311
330
  "primary-foreground": "oklch(0.145 0.003 75)",
312
331
  "primary-hover": "oklch(0.97 0.003 75)",
313
332
  "primary-active": "oklch(0.994 0.002 75)",
314
- "track": "oklch(0.439 0.003 75)",
315
- "secondary": "oklch(0.269 0.003 75)",
333
+ "secondary": "oklch(0.236 0.003 75)",
316
334
  "secondary-foreground": "oklch(0.922 0.003 75)",
317
- "muted": "oklch(0.269 0.003 75)",
335
+ "muted": "oklch(0.236 0.003 75)",
318
336
  "muted-foreground": "oklch(0.66 0.003 75)",
319
337
  "muted-foreground-faint": "oklch(0.559 0.003 75)",
320
338
  "accent": "oklch(0.269 0.003 75)",
321
- "accent-foreground": "oklch(0.967 0.003 75)",
339
+ "accent-foreground": "oklch(0.922 0.003 75)",
322
340
  "destructive": "oklch(0.505 0.213 27.52)",
323
341
  "destructive-foreground": "oklch(0.985 0.003 75)",
324
342
  "destructive-subtle": "oklch(0.275 0.07 25)",
325
- "destructive-text": "oklch(0.72 0.16 25)",
343
+ "destructive-text": "oklch(0.74 0.16 25)",
326
344
  "destructive-border": "oklch(0.72 0.16 25)",
327
345
  "success": "oklch(0.5 0.16 150)",
328
346
  "success-foreground": "oklch(0.985 0.003 75)",
329
347
  "success-subtle": "oklch(0.276 0.061 150)",
330
- "success-text": "oklch(0.72 0.17 150)",
348
+ "success-text": "oklch(0.74 0.17 150)",
331
349
  "warning": "oklch(0.52 0.145 52)",
332
350
  "warning-foreground": "oklch(0.985 0.003 75)",
333
351
  "warning-subtle": "oklch(0.28 0.069 42)",
@@ -335,10 +353,12 @@ var tokens = {
335
353
  "info": "oklch(0.531 0.182 256)",
336
354
  "info-foreground": "oklch(0.985 0.003 75)",
337
355
  "info-subtle": "oklch(0.275 0.059 255)",
338
- "info-text": "oklch(0.72 0.13 256)",
356
+ "info-text": "oklch(0.76 0.13 256)",
339
357
  "overlay": "oklch(0 0 0 / 0.55)",
340
- "border": "oklch(0.269 0.003 75)",
341
- "input": "oklch(0.269 0.003 75)",
358
+ "media-scrim": "oklch(0.13 0.002 75 / 0.6)",
359
+ "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)",
360
+ "media-foreground": "oklch(0.985 0.003 75)",
361
+ "input": "oklch(0.922 0.003 75 / 0.14)",
342
362
  "ring": "oklch(0.922 0.003 75)",
343
363
  "chart-1": "oklch(0.623 0.214 259.81)",
344
364
  "chart-2": "oklch(0.696 0.17 162.48)",
@@ -348,7 +368,9 @@ var tokens = {
348
368
  "chart-6": "oklch(0.69 0.21 25)",
349
369
  "chart-7": "oklch(0.72 0.15 103.9)",
350
370
  "chart-8": "oklch(0.72 0.13 256)",
371
+ "chart-single": "oklch(0.922 0.003 75)",
351
372
  "brand": "oklch(0.86 0.21 148)",
373
+ "brand-text": "oklch(0.86 0.21 148)",
352
374
  "tag-blue": "oklch(0.72 0.14 256)",
353
375
  "tag-blue-subtle": "oklch(0.275 0.05 256)",
354
376
  "tag-blue-text": "oklch(0.75 0.13 256)",
@@ -379,13 +401,13 @@ var tokens = {
379
401
  "tag-purple": "oklch(0.72 0.15 295)",
380
402
  "tag-purple-subtle": "oklch(0.275 0.05 295)",
381
403
  "tag-purple-text": "oklch(0.75 0.13 295)",
382
- "sidebar": "oklch(0.145 0.003 75)",
383
- "sidebar-foreground": "oklch(0.87 0.003 75)",
404
+ "sidebar": "oklch(0.205 0.003 75)",
405
+ "sidebar-foreground": "oklch(0.922 0.003 75)",
384
406
  "sidebar-primary": "oklch(0.922 0.003 75)",
385
407
  "sidebar-primary-foreground": "oklch(0.145 0.003 75)",
386
- "sidebar-accent": "oklch(0.205 0.003 75)",
408
+ "sidebar-accent": "oklch(0.269 0.003 75)",
387
409
  "sidebar-accent-foreground": "oklch(0.922 0.003 75)",
388
- "sidebar-border": "oklch(0.269 0.003 75)",
410
+ "sidebar-border": "oklch(0.922 0.003 75 / 0.14)",
389
411
  "sidebar-ring": "oklch(0.922 0.003 75)",
390
412
  "radius": "0.75rem",
391
413
  "radius-xs": "0.125rem",
@@ -404,35 +426,39 @@ var tokens = {
404
426
  "icon-feature": "1.5rem",
405
427
  "sidebar-width": "15rem",
406
428
  "sidebar-width-icon": "3rem",
429
+ "sidebar-width-mobile": "18rem",
430
+ "layout-header-height": "3.5rem",
431
+ "layout-overlay-max-height": "calc(100dvh - 16rem)",
432
+ "panel-width-sm": "14rem",
433
+ "panel-width-md": "18rem",
434
+ "panel-width-lg": "20rem",
407
435
  "shadow-overlay": "0 8px 28px -6px oklch(0 0 0 / 0.48), 0 2px 8px -2px oklch(0 0 0 / 0.4)",
408
- "shadow-lit": "inset 0 1px 0 0 oklch(1 0 0 / 0.35), 0 2px 6px -2px oklch(0 0 0 / 0.5)",
409
436
  "effect-blur-glass": "8px",
410
437
  "z-raised": 10,
411
438
  "z-overlay": 50,
439
+ "z-toast": 60,
412
440
  "opacity-dim": "50%",
413
441
  "opacity-hint-soft": "60%",
414
442
  "opacity-hint": "70%",
415
443
  "opacity-track": "25%",
444
+ "alpha-hover": "7%",
445
+ "alpha-pressed": "10%",
446
+ "alpha-border": "14%",
416
447
  "alpha-tint-border": "70%",
417
448
  "alpha-outline-border": "50%",
418
449
  "alpha-border-subtle": "20%",
419
450
  "alpha-border-soft": "30%",
420
451
  "alpha-surface-faint": "5%",
421
- "alpha-surface-subtle": "10%",
422
452
  "alpha-ink-tint": "10%",
423
453
  "alpha-ink-tint-strong": "15%",
424
- "alpha-soft-hover": "30%",
425
- "alpha-soft-surface": "20%",
426
454
  "alpha-input": "30%",
427
- "alpha-input-hover": "50%",
428
- "alpha-fill-hover": "80%",
429
455
  "alpha-wash-faint": "40%",
430
456
  "alpha-wash": "50%",
431
457
  "alpha-wash-strong": "60%",
432
458
  "alpha-backdrop-soft": "60%",
433
459
  "alpha-glass": "90%",
434
460
  "alpha-glass-hover": "95%",
435
- "alpha-link-hover": "80%",
461
+ "alpha-link-hover": "88%",
436
462
  "alpha-outline-soft": "50%",
437
463
  "type-product-xs": {
438
464
  "fontSize": "0.6875rem",
@@ -582,23 +608,29 @@ var tokens = {
582
608
  "duration-fast": "150ms",
583
609
  "duration-base": "200ms",
584
610
  "duration-slow": "300ms",
611
+ "duration-indeterminate": "1200ms",
585
612
  "motion-ease-standard": "cubic-bezier(0.2, 0, 0, 1)",
586
613
  "motion-ease-emphasized": "cubic-bezier(0.3, 0, 0, 1)",
587
614
  "motion-ease-exit": "cubic-bezier(0.4, 0, 1, 1)",
588
615
  "motion-ease-spring": "linear(0, 0.5 60%, 1.05 80%, 0.98 90%, 1)",
589
616
  "motion-blur": "2px",
617
+ "border": "oklch(0.922 0.003 75 / 0.14)",
590
618
  "destructive-hover": "oklch(0.455 0.213 27.52)",
591
619
  "destructive-active": "oklch(0.415 0.213 27.52)",
592
620
  "destructive-subtle-hover": "oklch(0.34 0.123 26.3)",
621
+ "destructive-subtle-active": "oklch(0.364 0.137 26.9)",
593
622
  "success-hover": "oklch(0.45 0.16 150)",
594
623
  "success-active": "oklch(0.41 0.16 150)",
595
624
  "success-subtle-hover": "oklch(0.348 0.092 148.9)",
625
+ "success-subtle-active": "oklch(0.371 0.101 148.5)",
596
626
  "warning-hover": "oklch(0.47 0.145 52)",
597
627
  "warning-active": "oklch(0.43 0.145 52)",
598
628
  "warning-subtle-hover": "oklch(0.356 0.093 46.6)",
629
+ "warning-subtle-active": "oklch(0.381 0.1 47.3)",
599
630
  "info-hover": "oklch(0.481 0.182 256)",
600
631
  "info-active": "oklch(0.441 0.182 256)",
601
- "info-subtle-hover": "oklch(0.354 0.101 254.3)"
632
+ "info-subtle-hover": "oklch(0.354 0.101 254.3)",
633
+ "info-subtle-active": "oklch(0.38 0.114 254.5)"
602
634
  }
603
635
  };
604
636
  export {