@nuxt/ui 3.0.0-alpha.12 → 3.0.0-alpha.13

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 (123) hide show
  1. package/.nuxt/ui/accordion.ts +2 -2
  2. package/.nuxt/ui/alert.ts +46 -36
  3. package/.nuxt/ui/avatar-group.ts +1 -1
  4. package/.nuxt/ui/avatar.ts +3 -3
  5. package/.nuxt/ui/badge.ts +37 -28
  6. package/.nuxt/ui/breadcrumb.ts +5 -5
  7. package/.nuxt/ui/button.ts +42 -42
  8. package/.nuxt/ui/calendar.ts +15 -15
  9. package/.nuxt/ui/card.ts +27 -1
  10. package/.nuxt/ui/carousel.ts +2 -2
  11. package/.nuxt/ui/checkbox.ts +18 -18
  12. package/.nuxt/ui/chip.ts +8 -8
  13. package/.nuxt/ui/color-picker.ts +2 -2
  14. package/.nuxt/ui/command-palette.ts +12 -12
  15. package/.nuxt/ui/container.ts +1 -1
  16. package/.nuxt/ui/context-menu.ts +32 -32
  17. package/.nuxt/ui/drawer.ts +72 -11
  18. package/.nuxt/ui/dropdown-menu.ts +33 -33
  19. package/.nuxt/ui/form-field.ts +6 -6
  20. package/.nuxt/ui/input-menu.ts +41 -41
  21. package/.nuxt/ui/input-number.ts +20 -20
  22. package/.nuxt/ui/input.ts +23 -23
  23. package/.nuxt/ui/kbd.ts +4 -4
  24. package/.nuxt/ui/link.ts +3 -3
  25. package/.nuxt/ui/modal.ts +5 -5
  26. package/.nuxt/ui/navigation-menu.ts +77 -78
  27. package/.nuxt/ui/pin-input.ts +20 -20
  28. package/.nuxt/ui/popover.ts +2 -2
  29. package/.nuxt/ui/progress.ts +17 -17
  30. package/.nuxt/ui/radio-group.ts +20 -20
  31. package/.nuxt/ui/select-menu.ts +33 -32
  32. package/.nuxt/ui/select.ts +31 -31
  33. package/.nuxt/ui/separator.ts +8 -8
  34. package/.nuxt/ui/skeleton.ts +1 -1
  35. package/.nuxt/ui/slideover.ts +4 -4
  36. package/.nuxt/ui/slider.ts +16 -16
  37. package/.nuxt/ui/stepper.ts +18 -18
  38. package/.nuxt/ui/switch.ts +20 -20
  39. package/.nuxt/ui/table.ts +16 -16
  40. package/.nuxt/ui/tabs.ts +33 -33
  41. package/.nuxt/ui/textarea.ts +23 -23
  42. package/.nuxt/ui/toast.ts +42 -32
  43. package/.nuxt/ui/toaster.ts +4 -4
  44. package/.nuxt/ui/tooltip.ts +2 -2
  45. package/.nuxt/ui.css +90 -0
  46. package/README.md +2 -2
  47. package/cli/package.json +1 -1
  48. package/cli/templates.mjs +1 -1
  49. package/dist/client/devtools/200.html +1 -1
  50. package/dist/client/devtools/404.html +1 -1
  51. package/dist/client/devtools/_nuxt/CG6Dc4jp.js +1 -0
  52. package/dist/client/devtools/_nuxt/{DYuJNiSW.js → DrNJgD08.js} +1 -1
  53. package/dist/client/devtools/_nuxt/{DLmPhbaq.js → ElqrUh1r.js} +1 -1
  54. package/dist/client/devtools/_nuxt/builds/latest.json +1 -1
  55. package/dist/client/devtools/_nuxt/builds/meta/255c8d0b-7281-4d74-b4b6-ec96e6721aa0.json +1 -0
  56. package/dist/client/devtools/_nuxt/entry.Hn8drx4g.css +1 -0
  57. package/dist/client/devtools/_nuxt/error-404.Dew7w9Ee.css +1 -0
  58. package/dist/client/devtools/_nuxt/error-500.Dep59i31.css +1 -0
  59. package/dist/client/devtools/_nuxt/mC2e7kOs.js +57 -0
  60. package/dist/client/devtools/index.html +1 -1
  61. package/dist/devtools/runtime/examples/CardExample.vue +3 -3
  62. package/dist/devtools/runtime/examples/CollapsibleExample.vue +1 -1
  63. package/dist/devtools/runtime/examples/ContainerExample.vue +1 -1
  64. package/dist/devtools/runtime/examples/ContextMenuExample.vue +1 -1
  65. package/dist/devtools/runtime/examples/PopoverExample.vue +1 -1
  66. package/dist/devtools/runtime/examples/TooltipExample.vue +1 -1
  67. package/dist/module.cjs +2 -1
  68. package/dist/module.json +1 -1
  69. package/dist/module.mjs +2 -1
  70. package/dist/runtime/components/Alert.vue +13 -10
  71. package/dist/runtime/components/App.vue +3 -3
  72. package/dist/runtime/components/Avatar.vue +1 -1
  73. package/dist/runtime/components/Badge.vue +5 -1
  74. package/dist/runtime/components/Calendar.vue +2 -1
  75. package/dist/runtime/components/Card.vue +6 -2
  76. package/dist/runtime/components/CommandPalette.vue +46 -39
  77. package/dist/runtime/components/ContextMenu.vue +8 -0
  78. package/dist/runtime/components/ContextMenuContent.vue +4 -2
  79. package/dist/runtime/components/Drawer.vue +7 -1
  80. package/dist/runtime/components/DropdownMenu.vue +8 -0
  81. package/dist/runtime/components/DropdownMenuContent.vue +4 -2
  82. package/dist/runtime/components/InputNumber.vue +3 -2
  83. package/dist/runtime/components/Modal.vue +15 -1
  84. package/dist/runtime/components/NavigationMenu.vue +31 -11
  85. package/dist/runtime/components/SelectMenu.vue +62 -60
  86. package/dist/runtime/components/Slideover.vue +15 -1
  87. package/dist/runtime/components/Stepper.vue +1 -1
  88. package/dist/runtime/components/Table.vue +94 -16
  89. package/dist/runtime/components/Textarea.vue +2 -1
  90. package/dist/runtime/components/Toast.vue +26 -14
  91. package/dist/runtime/components/Toaster.vue +2 -2
  92. package/dist/runtime/composables/useToast.d.ts +5 -4
  93. package/dist/runtime/composables/useToast.js +2 -2
  94. package/dist/runtime/index.css +1 -1
  95. package/dist/runtime/locale/az.d.ts +2 -0
  96. package/dist/runtime/locale/az.js +54 -0
  97. package/dist/runtime/locale/bn.d.ts +2 -0
  98. package/dist/runtime/locale/bn.js +54 -0
  99. package/dist/runtime/locale/index.d.ts +3 -0
  100. package/dist/runtime/locale/index.js +3 -0
  101. package/dist/runtime/plugins/colors.js +1 -1
  102. package/dist/runtime/types/index.d.ts +1 -0
  103. package/dist/runtime/types/index.js +1 -0
  104. package/dist/runtime/types/utils.d.ts +5 -0
  105. package/dist/runtime/vue/components/Link.vue +75 -16
  106. package/dist/shared/{ui.ClMXjgLK.cjs → ui.C5FzRWM5.cjs} +471 -364
  107. package/dist/shared/{ui.CENZ17mM.mjs → ui.DCZM2pl8.mjs} +467 -364
  108. package/dist/unplugin.cjs +44 -20
  109. package/dist/unplugin.d.cts +10 -0
  110. package/dist/unplugin.d.mts +10 -0
  111. package/dist/unplugin.d.ts +10 -0
  112. package/dist/unplugin.mjs +43 -19
  113. package/dist/vite.cjs +3 -2
  114. package/dist/vite.d.cts +2 -0
  115. package/dist/vite.d.mts +2 -0
  116. package/dist/vite.d.ts +2 -0
  117. package/dist/vite.mjs +3 -2
  118. package/package.json +60 -33
  119. package/dist/client/devtools/_nuxt/CgoQwOTV.js +0 -57
  120. package/dist/client/devtools/_nuxt/builds/meta/3184ffe2-7577-4441-af98-fe6e81c30e3a.json +0 -1
  121. package/dist/client/devtools/_nuxt/entry.ChJczkiN.css +0 -1
  122. package/dist/client/devtools/_nuxt/error-404.DyY3rYaL.css +0 -1
  123. package/dist/client/devtools/_nuxt/error-500.D_1PCaJh.css +0 -1
@@ -1,9 +1,9 @@
1
1
  export default {
2
2
  "slots": {
3
3
  "root": "w-full",
4
- "item": "border-b border-[var(--ui-border)] last:border-b-0",
4
+ "item": "border-b border-(--ui-border) last:border-b-0",
5
5
  "header": "flex",
6
- "trigger": "group flex-1 flex items-center gap-1.5 font-medium text-sm py-3.5 focus-visible:outline-[var(--ui-primary)] min-w-0",
6
+ "trigger": "group flex-1 flex items-center gap-1.5 font-medium text-sm py-3.5 focus-visible:outline-(--ui-primary) min-w-0",
7
7
  "content": "data-[state=open]:animate-[accordion-down_200ms_ease-out] data-[state=closed]:animate-[accordion-up_200ms_ease-out] overflow-hidden focus:outline-none",
8
8
  "body": "text-sm pb-3.5",
9
9
  "leadingIcon": "shrink-0 size-5",
package/.nuxt/ui/alert.ts CHANGED
@@ -15,17 +15,22 @@ const variant = [
15
15
  "subtle"
16
16
  ] as const
17
17
 
18
+ const orientation = [
19
+ "horizontal",
20
+ "vertical"
21
+ ] as const
22
+
18
23
  export default {
19
24
  "slots": {
20
25
  "root": "relative overflow-hidden w-full rounded-[calc(var(--ui-radius)*2)] p-4 flex gap-2.5",
21
- "wrapper": "min-w-0 flex-1 flex flex-col gap-1",
26
+ "wrapper": "min-w-0 flex-1 flex flex-col",
22
27
  "title": "text-sm font-medium",
23
28
  "description": "text-sm opacity-90",
24
29
  "icon": "shrink-0 size-5",
25
30
  "avatar": "shrink-0",
26
31
  "avatarSize": "2xl",
27
32
  "actions": "flex flex-wrap gap-1.5 shrink-0",
28
- "close": "p-0.5"
33
+ "close": "p-0"
29
34
  },
30
35
  "variants": {
31
36
  "color": {
@@ -43,14 +48,19 @@ export default {
43
48
  "soft": "",
44
49
  "subtle": ""
45
50
  },
46
- "multiline": {
47
- "true": {
48
- "root": "items-start",
49
- "actions": "items-start mt-1"
50
- },
51
- "false": {
51
+ "orientation": {
52
+ "horizontal": {
52
53
  "root": "items-center",
53
54
  "actions": "items-center"
55
+ },
56
+ "vertical": {
57
+ "root": "items-start",
58
+ "actions": "items-start mt-2.5"
59
+ }
60
+ },
61
+ "title": {
62
+ "true": {
63
+ "description": "mt-1"
54
64
  }
55
65
  }
56
66
  },
@@ -59,196 +69,196 @@ export default {
59
69
  "color": "primary" as typeof color[number],
60
70
  "variant": "solid" as typeof variant[number],
61
71
  "class": {
62
- "root": "bg-[var(--ui-primary)] text-[var(--ui-bg)]"
72
+ "root": "bg-(--ui-primary) text-(--ui-bg)"
63
73
  }
64
74
  },
65
75
  {
66
76
  "color": "secondary" as typeof color[number],
67
77
  "variant": "solid" as typeof variant[number],
68
78
  "class": {
69
- "root": "bg-[var(--ui-secondary)] text-[var(--ui-bg)]"
79
+ "root": "bg-(--ui-secondary) text-(--ui-bg)"
70
80
  }
71
81
  },
72
82
  {
73
83
  "color": "success" as typeof color[number],
74
84
  "variant": "solid" as typeof variant[number],
75
85
  "class": {
76
- "root": "bg-[var(--ui-success)] text-[var(--ui-bg)]"
86
+ "root": "bg-(--ui-success) text-(--ui-bg)"
77
87
  }
78
88
  },
79
89
  {
80
90
  "color": "info" as typeof color[number],
81
91
  "variant": "solid" as typeof variant[number],
82
92
  "class": {
83
- "root": "bg-[var(--ui-info)] text-[var(--ui-bg)]"
93
+ "root": "bg-(--ui-info) text-(--ui-bg)"
84
94
  }
85
95
  },
86
96
  {
87
97
  "color": "warning" as typeof color[number],
88
98
  "variant": "solid" as typeof variant[number],
89
99
  "class": {
90
- "root": "bg-[var(--ui-warning)] text-[var(--ui-bg)]"
100
+ "root": "bg-(--ui-warning) text-(--ui-bg)"
91
101
  }
92
102
  },
93
103
  {
94
104
  "color": "error" as typeof color[number],
95
105
  "variant": "solid" as typeof variant[number],
96
106
  "class": {
97
- "root": "bg-[var(--ui-error)] text-[var(--ui-bg)]"
107
+ "root": "bg-(--ui-error) text-(--ui-bg)"
98
108
  }
99
109
  },
100
110
  {
101
111
  "color": "primary" as typeof color[number],
102
112
  "variant": "outline" as typeof variant[number],
103
113
  "class": {
104
- "root": "text-[var(--ui-primary)] ring ring-inset ring-[var(--ui-primary)]/25"
114
+ "root": "text-(--ui-primary) ring ring-inset ring-(--ui-primary)/25"
105
115
  }
106
116
  },
107
117
  {
108
118
  "color": "secondary" as typeof color[number],
109
119
  "variant": "outline" as typeof variant[number],
110
120
  "class": {
111
- "root": "text-[var(--ui-secondary)] ring ring-inset ring-[var(--ui-secondary)]/25"
121
+ "root": "text-(--ui-secondary) ring ring-inset ring-(--ui-secondary)/25"
112
122
  }
113
123
  },
114
124
  {
115
125
  "color": "success" as typeof color[number],
116
126
  "variant": "outline" as typeof variant[number],
117
127
  "class": {
118
- "root": "text-[var(--ui-success)] ring ring-inset ring-[var(--ui-success)]/25"
128
+ "root": "text-(--ui-success) ring ring-inset ring-(--ui-success)/25"
119
129
  }
120
130
  },
121
131
  {
122
132
  "color": "info" as typeof color[number],
123
133
  "variant": "outline" as typeof variant[number],
124
134
  "class": {
125
- "root": "text-[var(--ui-info)] ring ring-inset ring-[var(--ui-info)]/25"
135
+ "root": "text-(--ui-info) ring ring-inset ring-(--ui-info)/25"
126
136
  }
127
137
  },
128
138
  {
129
139
  "color": "warning" as typeof color[number],
130
140
  "variant": "outline" as typeof variant[number],
131
141
  "class": {
132
- "root": "text-[var(--ui-warning)] ring ring-inset ring-[var(--ui-warning)]/25"
142
+ "root": "text-(--ui-warning) ring ring-inset ring-(--ui-warning)/25"
133
143
  }
134
144
  },
135
145
  {
136
146
  "color": "error" as typeof color[number],
137
147
  "variant": "outline" as typeof variant[number],
138
148
  "class": {
139
- "root": "text-[var(--ui-error)] ring ring-inset ring-[var(--ui-error)]/25"
149
+ "root": "text-(--ui-error) ring ring-inset ring-(--ui-error)/25"
140
150
  }
141
151
  },
142
152
  {
143
153
  "color": "primary" as typeof color[number],
144
154
  "variant": "soft" as typeof variant[number],
145
155
  "class": {
146
- "root": "bg-[var(--ui-primary)]/10 text-[var(--ui-primary)]"
156
+ "root": "bg-(--ui-primary)/10 text-(--ui-primary)"
147
157
  }
148
158
  },
149
159
  {
150
160
  "color": "secondary" as typeof color[number],
151
161
  "variant": "soft" as typeof variant[number],
152
162
  "class": {
153
- "root": "bg-[var(--ui-secondary)]/10 text-[var(--ui-secondary)]"
163
+ "root": "bg-(--ui-secondary)/10 text-(--ui-secondary)"
154
164
  }
155
165
  },
156
166
  {
157
167
  "color": "success" as typeof color[number],
158
168
  "variant": "soft" as typeof variant[number],
159
169
  "class": {
160
- "root": "bg-[var(--ui-success)]/10 text-[var(--ui-success)]"
170
+ "root": "bg-(--ui-success)/10 text-(--ui-success)"
161
171
  }
162
172
  },
163
173
  {
164
174
  "color": "info" as typeof color[number],
165
175
  "variant": "soft" as typeof variant[number],
166
176
  "class": {
167
- "root": "bg-[var(--ui-info)]/10 text-[var(--ui-info)]"
177
+ "root": "bg-(--ui-info)/10 text-(--ui-info)"
168
178
  }
169
179
  },
170
180
  {
171
181
  "color": "warning" as typeof color[number],
172
182
  "variant": "soft" as typeof variant[number],
173
183
  "class": {
174
- "root": "bg-[var(--ui-warning)]/10 text-[var(--ui-warning)]"
184
+ "root": "bg-(--ui-warning)/10 text-(--ui-warning)"
175
185
  }
176
186
  },
177
187
  {
178
188
  "color": "error" as typeof color[number],
179
189
  "variant": "soft" as typeof variant[number],
180
190
  "class": {
181
- "root": "bg-[var(--ui-error)]/10 text-[var(--ui-error)]"
191
+ "root": "bg-(--ui-error)/10 text-(--ui-error)"
182
192
  }
183
193
  },
184
194
  {
185
195
  "color": "primary" as typeof color[number],
186
196
  "variant": "subtle" as typeof variant[number],
187
197
  "class": {
188
- "root": "bg-[var(--ui-primary)]/10 text-[var(--ui-primary)] ring ring-inset ring-[var(--ui-primary)]/25"
198
+ "root": "bg-(--ui-primary)/10 text-(--ui-primary) ring ring-inset ring-(--ui-primary)/25"
189
199
  }
190
200
  },
191
201
  {
192
202
  "color": "secondary" as typeof color[number],
193
203
  "variant": "subtle" as typeof variant[number],
194
204
  "class": {
195
- "root": "bg-[var(--ui-secondary)]/10 text-[var(--ui-secondary)] ring ring-inset ring-[var(--ui-secondary)]/25"
205
+ "root": "bg-(--ui-secondary)/10 text-(--ui-secondary) ring ring-inset ring-(--ui-secondary)/25"
196
206
  }
197
207
  },
198
208
  {
199
209
  "color": "success" as typeof color[number],
200
210
  "variant": "subtle" as typeof variant[number],
201
211
  "class": {
202
- "root": "bg-[var(--ui-success)]/10 text-[var(--ui-success)] ring ring-inset ring-[var(--ui-success)]/25"
212
+ "root": "bg-(--ui-success)/10 text-(--ui-success) ring ring-inset ring-(--ui-success)/25"
203
213
  }
204
214
  },
205
215
  {
206
216
  "color": "info" as typeof color[number],
207
217
  "variant": "subtle" as typeof variant[number],
208
218
  "class": {
209
- "root": "bg-[var(--ui-info)]/10 text-[var(--ui-info)] ring ring-inset ring-[var(--ui-info)]/25"
219
+ "root": "bg-(--ui-info)/10 text-(--ui-info) ring ring-inset ring-(--ui-info)/25"
210
220
  }
211
221
  },
212
222
  {
213
223
  "color": "warning" as typeof color[number],
214
224
  "variant": "subtle" as typeof variant[number],
215
225
  "class": {
216
- "root": "bg-[var(--ui-warning)]/10 text-[var(--ui-warning)] ring ring-inset ring-[var(--ui-warning)]/25"
226
+ "root": "bg-(--ui-warning)/10 text-(--ui-warning) ring ring-inset ring-(--ui-warning)/25"
217
227
  }
218
228
  },
219
229
  {
220
230
  "color": "error" as typeof color[number],
221
231
  "variant": "subtle" as typeof variant[number],
222
232
  "class": {
223
- "root": "bg-[var(--ui-error)]/10 text-[var(--ui-error)] ring ring-inset ring-[var(--ui-error)]/25"
233
+ "root": "bg-(--ui-error)/10 text-(--ui-error) ring ring-inset ring-(--ui-error)/25"
224
234
  }
225
235
  },
226
236
  {
227
237
  "color": "neutral" as typeof color[number],
228
238
  "variant": "solid" as typeof variant[number],
229
239
  "class": {
230
- "root": "text-[var(--ui-bg)] bg-[var(--ui-bg-inverted)]"
240
+ "root": "text-(--ui-bg) bg-(--ui-bg-inverted)"
231
241
  }
232
242
  },
233
243
  {
234
244
  "color": "neutral" as typeof color[number],
235
245
  "variant": "outline" as typeof variant[number],
236
246
  "class": {
237
- "root": "text-[var(--ui-text-highlighted)] bg-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border)]"
247
+ "root": "text-(--ui-text-highlighted) bg-(--ui-bg) ring ring-inset ring-(--ui-border)"
238
248
  }
239
249
  },
240
250
  {
241
251
  "color": "neutral" as typeof color[number],
242
252
  "variant": "soft" as typeof variant[number],
243
253
  "class": {
244
- "root": "text-[var(--ui-text-highlighted)] bg-[var(--ui-bg-elevated)]/50"
254
+ "root": "text-(--ui-text-highlighted) bg-(--ui-bg-elevated)/50"
245
255
  }
246
256
  },
247
257
  {
248
258
  "color": "neutral" as typeof color[number],
249
259
  "variant": "subtle" as typeof variant[number],
250
260
  "class": {
251
- "root": "text-[var(--ui-text-highlighted)] bg-[var(--ui-bg-elevated)]/50 ring ring-inset ring-[var(--ui-border-accented)]"
261
+ "root": "text-(--ui-text-highlighted) bg-(--ui-bg-elevated)/50 ring ring-inset ring-(--ui-border-accented)"
252
262
  }
253
263
  }
254
264
  ],
@@ -13,7 +13,7 @@ const size = [
13
13
  export default {
14
14
  "slots": {
15
15
  "root": "inline-flex flex-row-reverse justify-end",
16
- "base": "relative rounded-full ring-[var(--ui-bg)] first:me-0"
16
+ "base": "relative rounded-full ring-(--ui-bg) first:me-0"
17
17
  },
18
18
  "variants": {
19
19
  "size": {
@@ -12,10 +12,10 @@ const size = [
12
12
 
13
13
  export default {
14
14
  "slots": {
15
- "root": "inline-flex items-center justify-center shrink-0 select-none overflow-hidden rounded-full align-middle bg-[var(--ui-bg-elevated)]",
15
+ "root": "inline-flex items-center justify-center shrink-0 select-none overflow-hidden rounded-full align-middle bg-(--ui-bg-elevated)",
16
16
  "image": "h-full w-full rounded-[inherit] object-cover data-[error]:hidden",
17
- "fallback": "font-medium leading-none text-[var(--ui-text-muted)] truncate",
18
- "icon": "text-[var(--ui-text-muted)] shrink-0"
17
+ "fallback": "font-medium leading-none text-(--ui-text-muted) truncate",
18
+ "icon": "text-(--ui-text-muted) shrink-0"
19
19
  },
20
20
  "variants": {
21
21
  "size": {
package/.nuxt/ui/badge.ts CHANGED
@@ -1,3 +1,8 @@
1
+ const buttonGroup = [
2
+ "horizontal",
3
+ "vertical"
4
+ ] as const
5
+
1
6
  const color = [
2
7
  "primary",
3
8
  "secondary",
@@ -33,6 +38,10 @@ export default {
33
38
  "trailingIcon": "shrink-0"
34
39
  },
35
40
  "variants": {
41
+ "buttonGroup": {
42
+ "horizontal": "not-only:first:rounded-e-none not-only:last:rounded-s-none not-last:not-first:rounded-none",
43
+ "vertical": "not-only:first:rounded-b-none not-only:last:rounded-t-none not-last:not-first:rounded-none"
44
+ },
36
45
  "color": {
37
46
  "primary": "",
38
47
  "secondary": "",
@@ -85,142 +94,142 @@ export default {
85
94
  {
86
95
  "color": "primary" as typeof color[number],
87
96
  "variant": "solid" as typeof variant[number],
88
- "class": "bg-[var(--ui-primary)] text-[var(--ui-bg)]"
97
+ "class": "bg-(--ui-primary) text-(--ui-bg)"
89
98
  },
90
99
  {
91
100
  "color": "secondary" as typeof color[number],
92
101
  "variant": "solid" as typeof variant[number],
93
- "class": "bg-[var(--ui-secondary)] text-[var(--ui-bg)]"
102
+ "class": "bg-(--ui-secondary) text-(--ui-bg)"
94
103
  },
95
104
  {
96
105
  "color": "success" as typeof color[number],
97
106
  "variant": "solid" as typeof variant[number],
98
- "class": "bg-[var(--ui-success)] text-[var(--ui-bg)]"
107
+ "class": "bg-(--ui-success) text-(--ui-bg)"
99
108
  },
100
109
  {
101
110
  "color": "info" as typeof color[number],
102
111
  "variant": "solid" as typeof variant[number],
103
- "class": "bg-[var(--ui-info)] text-[var(--ui-bg)]"
112
+ "class": "bg-(--ui-info) text-(--ui-bg)"
104
113
  },
105
114
  {
106
115
  "color": "warning" as typeof color[number],
107
116
  "variant": "solid" as typeof variant[number],
108
- "class": "bg-[var(--ui-warning)] text-[var(--ui-bg)]"
117
+ "class": "bg-(--ui-warning) text-(--ui-bg)"
109
118
  },
110
119
  {
111
120
  "color": "error" as typeof color[number],
112
121
  "variant": "solid" as typeof variant[number],
113
- "class": "bg-[var(--ui-error)] text-[var(--ui-bg)]"
122
+ "class": "bg-(--ui-error) text-(--ui-bg)"
114
123
  },
115
124
  {
116
125
  "color": "primary" as typeof color[number],
117
126
  "variant": "outline" as typeof variant[number],
118
- "class": "text-[var(--ui-primary)] ring ring-inset ring-[var(--ui-primary)]/50"
127
+ "class": "text-(--ui-primary) ring ring-inset ring-(--ui-primary)/50"
119
128
  },
120
129
  {
121
130
  "color": "secondary" as typeof color[number],
122
131
  "variant": "outline" as typeof variant[number],
123
- "class": "text-[var(--ui-secondary)] ring ring-inset ring-[var(--ui-secondary)]/50"
132
+ "class": "text-(--ui-secondary) ring ring-inset ring-(--ui-secondary)/50"
124
133
  },
125
134
  {
126
135
  "color": "success" as typeof color[number],
127
136
  "variant": "outline" as typeof variant[number],
128
- "class": "text-[var(--ui-success)] ring ring-inset ring-[var(--ui-success)]/50"
137
+ "class": "text-(--ui-success) ring ring-inset ring-(--ui-success)/50"
129
138
  },
130
139
  {
131
140
  "color": "info" as typeof color[number],
132
141
  "variant": "outline" as typeof variant[number],
133
- "class": "text-[var(--ui-info)] ring ring-inset ring-[var(--ui-info)]/50"
142
+ "class": "text-(--ui-info) ring ring-inset ring-(--ui-info)/50"
134
143
  },
135
144
  {
136
145
  "color": "warning" as typeof color[number],
137
146
  "variant": "outline" as typeof variant[number],
138
- "class": "text-[var(--ui-warning)] ring ring-inset ring-[var(--ui-warning)]/50"
147
+ "class": "text-(--ui-warning) ring ring-inset ring-(--ui-warning)/50"
139
148
  },
140
149
  {
141
150
  "color": "error" as typeof color[number],
142
151
  "variant": "outline" as typeof variant[number],
143
- "class": "text-[var(--ui-error)] ring ring-inset ring-[var(--ui-error)]/50"
152
+ "class": "text-(--ui-error) ring ring-inset ring-(--ui-error)/50"
144
153
  },
145
154
  {
146
155
  "color": "primary" as typeof color[number],
147
156
  "variant": "soft" as typeof variant[number],
148
- "class": "bg-[var(--ui-primary)]/10 text-[var(--ui-primary)]"
157
+ "class": "bg-(--ui-primary)/10 text-(--ui-primary)"
149
158
  },
150
159
  {
151
160
  "color": "secondary" as typeof color[number],
152
161
  "variant": "soft" as typeof variant[number],
153
- "class": "bg-[var(--ui-secondary)]/10 text-[var(--ui-secondary)]"
162
+ "class": "bg-(--ui-secondary)/10 text-(--ui-secondary)"
154
163
  },
155
164
  {
156
165
  "color": "success" as typeof color[number],
157
166
  "variant": "soft" as typeof variant[number],
158
- "class": "bg-[var(--ui-success)]/10 text-[var(--ui-success)]"
167
+ "class": "bg-(--ui-success)/10 text-(--ui-success)"
159
168
  },
160
169
  {
161
170
  "color": "info" as typeof color[number],
162
171
  "variant": "soft" as typeof variant[number],
163
- "class": "bg-[var(--ui-info)]/10 text-[var(--ui-info)]"
172
+ "class": "bg-(--ui-info)/10 text-(--ui-info)"
164
173
  },
165
174
  {
166
175
  "color": "warning" as typeof color[number],
167
176
  "variant": "soft" as typeof variant[number],
168
- "class": "bg-[var(--ui-warning)]/10 text-[var(--ui-warning)]"
177
+ "class": "bg-(--ui-warning)/10 text-(--ui-warning)"
169
178
  },
170
179
  {
171
180
  "color": "error" as typeof color[number],
172
181
  "variant": "soft" as typeof variant[number],
173
- "class": "bg-[var(--ui-error)]/10 text-[var(--ui-error)]"
182
+ "class": "bg-(--ui-error)/10 text-(--ui-error)"
174
183
  },
175
184
  {
176
185
  "color": "primary" as typeof color[number],
177
186
  "variant": "subtle" as typeof variant[number],
178
- "class": "bg-[var(--ui-primary)]/10 text-[var(--ui-primary)] ring ring-inset ring-[var(--ui-primary)]/25"
187
+ "class": "bg-(--ui-primary)/10 text-(--ui-primary) ring ring-inset ring-(--ui-primary)/25"
179
188
  },
180
189
  {
181
190
  "color": "secondary" as typeof color[number],
182
191
  "variant": "subtle" as typeof variant[number],
183
- "class": "bg-[var(--ui-secondary)]/10 text-[var(--ui-secondary)] ring ring-inset ring-[var(--ui-secondary)]/25"
192
+ "class": "bg-(--ui-secondary)/10 text-(--ui-secondary) ring ring-inset ring-(--ui-secondary)/25"
184
193
  },
185
194
  {
186
195
  "color": "success" as typeof color[number],
187
196
  "variant": "subtle" as typeof variant[number],
188
- "class": "bg-[var(--ui-success)]/10 text-[var(--ui-success)] ring ring-inset ring-[var(--ui-success)]/25"
197
+ "class": "bg-(--ui-success)/10 text-(--ui-success) ring ring-inset ring-(--ui-success)/25"
189
198
  },
190
199
  {
191
200
  "color": "info" as typeof color[number],
192
201
  "variant": "subtle" as typeof variant[number],
193
- "class": "bg-[var(--ui-info)]/10 text-[var(--ui-info)] ring ring-inset ring-[var(--ui-info)]/25"
202
+ "class": "bg-(--ui-info)/10 text-(--ui-info) ring ring-inset ring-(--ui-info)/25"
194
203
  },
195
204
  {
196
205
  "color": "warning" as typeof color[number],
197
206
  "variant": "subtle" as typeof variant[number],
198
- "class": "bg-[var(--ui-warning)]/10 text-[var(--ui-warning)] ring ring-inset ring-[var(--ui-warning)]/25"
207
+ "class": "bg-(--ui-warning)/10 text-(--ui-warning) ring ring-inset ring-(--ui-warning)/25"
199
208
  },
200
209
  {
201
210
  "color": "error" as typeof color[number],
202
211
  "variant": "subtle" as typeof variant[number],
203
- "class": "bg-[var(--ui-error)]/10 text-[var(--ui-error)] ring ring-inset ring-[var(--ui-error)]/25"
212
+ "class": "bg-(--ui-error)/10 text-(--ui-error) ring ring-inset ring-(--ui-error)/25"
204
213
  },
205
214
  {
206
215
  "color": "neutral" as typeof color[number],
207
216
  "variant": "solid" as typeof variant[number],
208
- "class": "text-[var(--ui-bg)] bg-[var(--ui-bg-inverted)]"
217
+ "class": "text-(--ui-bg) bg-(--ui-bg-inverted)"
209
218
  },
210
219
  {
211
220
  "color": "neutral" as typeof color[number],
212
221
  "variant": "outline" as typeof variant[number],
213
- "class": "ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)]"
222
+ "class": "ring ring-inset ring-(--ui-border-accented) text-(--ui-text) bg-(--ui-bg)"
214
223
  },
215
224
  {
216
225
  "color": "neutral" as typeof color[number],
217
226
  "variant": "soft" as typeof variant[number],
218
- "class": "text-[var(--ui-text)] bg-[var(--ui-bg-elevated)]"
227
+ "class": "text-(--ui-text) bg-(--ui-bg-elevated)"
219
228
  },
220
229
  {
221
230
  "color": "neutral" as typeof color[number],
222
231
  "variant": "subtle" as typeof variant[number],
223
- "class": "ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg-elevated)]"
232
+ "class": "ring ring-inset ring-(--ui-border-accented) text-(--ui-text) bg-(--ui-bg-elevated)"
224
233
  }
225
234
  ],
226
235
  "defaultVariants": {
@@ -3,21 +3,21 @@ export default {
3
3
  "root": "relative min-w-0",
4
4
  "list": "flex items-center gap-1.5",
5
5
  "item": "flex min-w-0",
6
- "link": "group relative flex items-center gap-1.5 text-sm min-w-0 focus-visible:outline-[var(--ui-primary)]",
6
+ "link": "group relative flex items-center gap-1.5 text-sm min-w-0 focus-visible:outline-(--ui-primary)",
7
7
  "linkLeadingIcon": "shrink-0 size-5",
8
8
  "linkLeadingAvatar": "shrink-0",
9
9
  "linkLeadingAvatarSize": "2xs",
10
10
  "linkLabel": "truncate",
11
11
  "separator": "flex",
12
- "separatorIcon": "shrink-0 size-5 text-[var(--ui-text-muted)]"
12
+ "separatorIcon": "shrink-0 size-5 text-(--ui-text-muted)"
13
13
  },
14
14
  "variants": {
15
15
  "active": {
16
16
  "true": {
17
- "link": "text-[var(--ui-primary)] font-semibold"
17
+ "link": "text-(--ui-primary) font-semibold"
18
18
  },
19
19
  "false": {
20
- "link": "text-[var(--ui-text-muted)] font-medium"
20
+ "link": "text-(--ui-text-muted) font-medium"
21
21
  }
22
22
  },
23
23
  "disabled": {
@@ -36,7 +36,7 @@ export default {
36
36
  "to": true,
37
37
  "class": {
38
38
  "link": [
39
- "hover:text-[var(--ui-text)]",
39
+ "hover:text-(--ui-text)",
40
40
  "transition-colors"
41
41
  ]
42
42
  }