@nuxt/ui 3.0.0-alpha.9 → 3.0.0-beta.1

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 (289) hide show
  1. package/.nuxt/ui/accordion.ts +2 -2
  2. package/.nuxt/ui/alert.ts +122 -95
  3. package/.nuxt/ui/avatar-group.ts +14 -2
  4. package/.nuxt/ui/avatar.ts +16 -4
  5. package/.nuxt/ui/badge.ts +139 -93
  6. package/.nuxt/ui/breadcrumb.ts +5 -5
  7. package/.nuxt/ui/button-group.ts +13 -0
  8. package/.nuxt/ui/button.ts +167 -136
  9. package/.nuxt/ui/calendar.ts +103 -0
  10. package/.nuxt/ui/card.ts +27 -1
  11. package/.nuxt/ui/carousel.ts +7 -5
  12. package/.nuxt/ui/checkbox.ts +45 -27
  13. package/.nuxt/ui/chip.ts +44 -15
  14. package/.nuxt/ui/color-picker.ts +47 -0
  15. package/.nuxt/ui/command-palette.ts +28 -18
  16. package/.nuxt/ui/container.ts +1 -1
  17. package/.nuxt/ui/context-menu.ts +64 -46
  18. package/.nuxt/ui/drawer.ts +83 -15
  19. package/.nuxt/ui/dropdown-menu.ts +65 -47
  20. package/.nuxt/ui/form-field.ts +15 -7
  21. package/.nuxt/ui/index.ts +5 -1
  22. package/.nuxt/ui/input-menu.ts +150 -116
  23. package/.nuxt/ui/input-number.ts +102 -71
  24. package/.nuxt/ui/input.ts +111 -76
  25. package/.nuxt/ui/kbd.ts +18 -6
  26. package/.nuxt/ui/link.ts +3 -3
  27. package/.nuxt/ui/modal.ts +8 -7
  28. package/.nuxt/ui/navigation-menu.ts +244 -131
  29. package/.nuxt/ui/pin-input.ts +77 -51
  30. package/.nuxt/ui/popover.ts +2 -2
  31. package/.nuxt/ui/progress.ts +111 -72
  32. package/.nuxt/ui/radio-group.ts +45 -22
  33. package/.nuxt/ui/select-menu.ts +122 -86
  34. package/.nuxt/ui/select.ts +120 -84
  35. package/.nuxt/ui/separator.ts +60 -31
  36. package/.nuxt/ui/skeleton.ts +1 -1
  37. package/.nuxt/ui/slideover.ts +17 -9
  38. package/.nuxt/ui/slider.ts +61 -38
  39. package/.nuxt/ui/stepper.ts +202 -0
  40. package/.nuxt/ui/switch.ts +40 -22
  41. package/.nuxt/ui/table.ts +48 -31
  42. package/.nuxt/ui/tabs.ts +100 -72
  43. package/.nuxt/ui/textarea.ts +111 -76
  44. package/.nuxt/ui/toast.ts +53 -33
  45. package/.nuxt/ui/toaster.ts +31 -15
  46. package/.nuxt/ui/tooltip.ts +2 -2
  47. package/.nuxt/ui/tree.ts +154 -0
  48. package/.nuxt/ui.css +92 -0
  49. package/README.md +19 -8
  50. package/cli/commands/make/component.mjs +12 -0
  51. package/cli/package.json +2 -2
  52. package/cli/templates.mjs +27 -22
  53. package/dist/module.cjs +9 -171
  54. package/dist/module.d.cts +5 -15
  55. package/dist/module.d.mts +5 -15
  56. package/dist/module.d.ts +5 -15
  57. package/dist/module.json +2 -2
  58. package/dist/module.mjs +12 -168
  59. package/dist/runtime/components/Accordion.vue +8 -39
  60. package/dist/runtime/components/Alert.vue +22 -21
  61. package/dist/runtime/components/App.vue +9 -15
  62. package/dist/runtime/components/Avatar.vue +33 -21
  63. package/dist/runtime/components/AvatarGroup.vue +5 -7
  64. package/dist/runtime/components/Badge.vue +10 -8
  65. package/dist/runtime/components/Breadcrumb.vue +5 -31
  66. package/dist/runtime/components/Button.vue +5 -8
  67. package/dist/runtime/components/ButtonGroup.vue +5 -7
  68. package/dist/runtime/components/Calendar.vue +194 -0
  69. package/dist/runtime/components/Card.vue +10 -9
  70. package/dist/runtime/components/Carousel.vue +15 -10
  71. package/dist/runtime/components/Checkbox.vue +32 -38
  72. package/dist/runtime/components/Chip.vue +6 -8
  73. package/dist/runtime/components/Collapsible.vue +10 -11
  74. package/dist/runtime/components/ColorPicker.vue +297 -0
  75. package/dist/runtime/components/CommandPalette.vue +111 -97
  76. package/dist/runtime/components/Container.vue +4 -7
  77. package/dist/runtime/components/ContextMenu.vue +16 -69
  78. package/dist/runtime/components/ContextMenuContent.vue +12 -10
  79. package/dist/runtime/components/Drawer.vue +23 -12
  80. package/dist/runtime/components/DropdownMenu.vue +18 -59
  81. package/dist/runtime/components/DropdownMenuContent.vue +12 -10
  82. package/dist/runtime/components/Form.vue +65 -34
  83. package/dist/runtime/components/FormField.vue +22 -13
  84. package/dist/runtime/components/Icon.vue +1 -1
  85. package/dist/runtime/components/Input.vue +15 -7
  86. package/dist/runtime/components/InputMenu.vue +95 -104
  87. package/dist/runtime/components/InputNumber.vue +14 -9
  88. package/dist/runtime/components/Kbd.vue +5 -6
  89. package/dist/runtime/components/Link.vue +5 -8
  90. package/dist/runtime/components/LinkBase.vue +1 -1
  91. package/dist/runtime/components/Modal.vue +51 -38
  92. package/dist/runtime/components/NavigationMenu.vue +129 -114
  93. package/dist/runtime/components/OverlayProvider.vue +28 -0
  94. package/dist/runtime/components/Pagination.vue +6 -9
  95. package/dist/runtime/components/PinInput.vue +10 -11
  96. package/dist/runtime/components/Popover.vue +16 -18
  97. package/dist/runtime/components/Progress.vue +28 -12
  98. package/dist/runtime/components/RadioGroup.vue +9 -12
  99. package/dist/runtime/components/Select.vue +60 -34
  100. package/dist/runtime/components/SelectMenu.vue +160 -165
  101. package/dist/runtime/components/Separator.vue +6 -5
  102. package/dist/runtime/components/Skeleton.vue +4 -7
  103. package/dist/runtime/components/Slideover.vue +51 -37
  104. package/dist/runtime/components/Slider.vue +8 -7
  105. package/dist/runtime/components/Stepper.vue +170 -0
  106. package/dist/runtime/components/Switch.vue +19 -23
  107. package/dist/runtime/components/Table.vue +146 -31
  108. package/dist/runtime/components/Tabs.vue +12 -31
  109. package/dist/runtime/components/Textarea.vue +17 -8
  110. package/dist/runtime/components/Toast.vue +36 -25
  111. package/dist/runtime/components/Toaster.vue +10 -11
  112. package/dist/runtime/components/Tooltip.vue +9 -12
  113. package/dist/runtime/components/Tree.vue +196 -0
  114. package/dist/runtime/composables/defineShortcuts.d.ts +1 -1
  115. package/dist/runtime/composables/defineShortcuts.js +2 -2
  116. package/dist/runtime/composables/useFormField.d.ts +7 -3
  117. package/dist/runtime/composables/useFormField.js +18 -8
  118. package/dist/runtime/composables/useLocale.js +1 -1
  119. package/dist/runtime/composables/useOverlay.d.ts +30 -0
  120. package/dist/runtime/composables/useOverlay.js +70 -0
  121. package/dist/runtime/composables/useToast.d.ts +4 -3
  122. package/dist/runtime/composables/useToast.js +20 -6
  123. package/dist/runtime/index.css +1 -1
  124. package/dist/runtime/keyframes.css +1 -1
  125. package/dist/runtime/locale/ar.js +9 -1
  126. package/dist/runtime/locale/az.js +54 -0
  127. package/dist/runtime/locale/bn.js +54 -0
  128. package/dist/runtime/locale/cs.js +9 -1
  129. package/dist/runtime/locale/da.d.ts +2 -0
  130. package/dist/runtime/locale/da.js +54 -0
  131. package/dist/runtime/locale/de.js +11 -3
  132. package/dist/runtime/locale/el.d.ts +2 -0
  133. package/dist/runtime/locale/el.js +54 -0
  134. package/dist/runtime/locale/en.js +9 -1
  135. package/dist/runtime/locale/es.js +9 -1
  136. package/dist/runtime/locale/et.d.ts +2 -0
  137. package/dist/runtime/locale/et.js +54 -0
  138. package/dist/runtime/locale/fa_ir.js +9 -1
  139. package/dist/runtime/locale/fi.d.ts +2 -0
  140. package/dist/runtime/locale/fi.js +54 -0
  141. package/dist/runtime/locale/fr.js +9 -1
  142. package/dist/runtime/locale/he.d.ts +2 -0
  143. package/dist/runtime/locale/he.js +53 -0
  144. package/dist/runtime/locale/hi.d.ts +2 -0
  145. package/dist/runtime/locale/hi.js +54 -0
  146. package/dist/runtime/locale/hu.d.ts +2 -0
  147. package/dist/runtime/locale/hu.js +54 -0
  148. package/dist/runtime/locale/id.d.ts +2 -0
  149. package/dist/runtime/locale/id.js +54 -0
  150. package/dist/runtime/locale/index.d.ts +25 -3
  151. package/dist/runtime/locale/index.js +25 -3
  152. package/dist/runtime/locale/it.js +9 -1
  153. package/dist/runtime/locale/ja.d.ts +2 -0
  154. package/dist/runtime/locale/ja.js +54 -0
  155. package/dist/runtime/locale/km.d.ts +2 -0
  156. package/dist/runtime/locale/km.js +54 -0
  157. package/dist/runtime/locale/ko.d.ts +2 -0
  158. package/dist/runtime/locale/ko.js +54 -0
  159. package/dist/runtime/locale/nb_no.d.ts +2 -0
  160. package/dist/runtime/locale/nb_no.js +54 -0
  161. package/dist/runtime/locale/nl.d.ts +2 -0
  162. package/dist/runtime/locale/nl.js +54 -0
  163. package/dist/runtime/locale/pl.js +9 -1
  164. package/dist/runtime/locale/pt.d.ts +2 -0
  165. package/dist/runtime/locale/pt.js +54 -0
  166. package/dist/runtime/locale/pt_br.d.ts +2 -0
  167. package/dist/runtime/locale/pt_br.js +54 -0
  168. package/dist/runtime/locale/ru.js +9 -1
  169. package/dist/runtime/locale/sk.d.ts +2 -0
  170. package/dist/runtime/locale/sk.js +54 -0
  171. package/dist/runtime/locale/sv.d.ts +2 -0
  172. package/dist/runtime/locale/sv.js +54 -0
  173. package/dist/runtime/locale/th.d.ts +2 -0
  174. package/dist/runtime/locale/th.js +54 -0
  175. package/dist/runtime/locale/tr.d.ts +2 -0
  176. package/dist/runtime/locale/tr.js +54 -0
  177. package/dist/runtime/locale/uk.d.ts +2 -0
  178. package/dist/runtime/locale/uk.js +54 -0
  179. package/dist/runtime/locale/vi.d.ts +2 -0
  180. package/dist/runtime/locale/vi.js +54 -0
  181. package/dist/runtime/locale/zh_cn.d.ts +2 -0
  182. package/dist/runtime/locale/{zh_hans.js → zh_cn.js} +10 -2
  183. package/dist/runtime/locale/zh_tw.d.ts +2 -0
  184. package/dist/runtime/locale/{zh_hant.js → zh_tw.js} +16 -8
  185. package/dist/runtime/plugins/colors.js +8 -5
  186. package/dist/runtime/types/form.d.ts +24 -15
  187. package/dist/runtime/types/form.js +2 -2
  188. package/dist/runtime/types/index.d.ts +5 -0
  189. package/dist/runtime/types/index.js +5 -0
  190. package/dist/runtime/types/locale.d.ts +8 -0
  191. package/dist/runtime/types/utils.d.ts +7 -3
  192. package/dist/runtime/utils/form.d.ts +4 -4
  193. package/dist/runtime/utils/form.js +6 -8
  194. package/dist/runtime/utils/index.d.ts +1 -1
  195. package/dist/runtime/utils/index.js +15 -2
  196. package/dist/runtime/utils/tv.d.ts +1 -0
  197. package/dist/runtime/utils/tv.js +4 -0
  198. package/dist/runtime/vue/components/Icon.vue +2 -2
  199. package/dist/runtime/vue/components/Link.vue +87 -23
  200. package/dist/runtime/vue/composables/useAppConfig.d.ts +1 -0
  201. package/dist/runtime/vue/composables/useAppConfig.js +2 -0
  202. package/dist/runtime/vue/plugins/head.d.ts +1 -1
  203. package/dist/runtime/vue/plugins/head.js +3 -3
  204. package/dist/runtime/vue/stubs.d.ts +19 -0
  205. package/dist/runtime/vue/stubs.js +37 -0
  206. package/dist/shared/{ui.d52SSCwA.mjs → ui.DSPu6Y8j.mjs} +905 -401
  207. package/dist/shared/{ui.BPnAe4QS.cjs → ui.DfK2RX6G.cjs} +908 -401
  208. package/dist/unplugin.cjs +62 -26
  209. package/dist/unplugin.d.cts +13 -1
  210. package/dist/unplugin.d.mts +13 -1
  211. package/dist/unplugin.d.ts +13 -1
  212. package/dist/unplugin.mjs +61 -25
  213. package/dist/vite.cjs +3 -2
  214. package/dist/vite.d.cts +2 -0
  215. package/dist/vite.d.mts +2 -0
  216. package/dist/vite.d.ts +2 -0
  217. package/dist/vite.mjs +3 -2
  218. package/package.json +103 -67
  219. package/dist/chunks/component-meta.cjs +0 -77249
  220. package/dist/chunks/component-meta.mjs +0 -77247
  221. package/dist/client/devtools/200.html +0 -1
  222. package/dist/client/devtools/404.html +0 -1
  223. package/dist/client/devtools/_fonts/rP2Wp2ywxg089UriCZaSExd86J3t9jz86MvyyKK58UfivUw4aw-SK92LTmKP0.woff2 +0 -0
  224. package/dist/client/devtools/_fonts/rP2Wp2ywxg089UriCZaSExd86J3t9jz86MvyyKy58UfivUw-9uYm8d48E4.woff2 +0 -0
  225. package/dist/client/devtools/_fonts/rP2Yp2ywxg089UriI5-g4vlH9VoD8Cmcqbu0-K6z9mXg-VNw7NHvqnp.woff2 +0 -0
  226. package/dist/client/devtools/_fonts/rP2Yp2ywxg089UriI5-g4vlH9VoD8Cmcqbu6-K6z9mXgjU0-EkYdMs3MAX.woff2 +0 -0
  227. package/dist/client/devtools/_fonts/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat-7DW3w-R7n06NbhGy.woff +0 -0
  228. package/dist/client/devtools/_fonts/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat-JDG3w-leGNfkTmsj.woff +0 -0
  229. package/dist/client/devtools/_fonts/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat-JDW3w-ciElMF03ku.woff +0 -0
  230. package/dist/client/devtools/_fonts/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat8JCm3w-sB722Uoa0f.woff +0 -0
  231. package/dist/client/devtools/_fonts/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat8JDW3w-PBDI1JDjwV.woff +0 -0
  232. package/dist/client/devtools/_fonts/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat8gCm3w-0q1hqVn09O.woff +0 -0
  233. package/dist/client/devtools/_fonts/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat9XCm3w-ByvzuLy2fa.woff +0 -0
  234. package/dist/client/devtools/_fonts/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat9uCm3w-5TKCIs6EEw.woff +0 -0
  235. package/dist/client/devtools/_fonts/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat_XDW3w-r2swRDGfn2.woff +0 -0
  236. package/dist/client/devtools/_fonts/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwAC5thTQ-ldB60l5U8r.woff +0 -0
  237. package/dist/client/devtools/_fonts/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwAIpthTQ-wbFKGFDrgo.woff +0 -0
  238. package/dist/client/devtools/_fonts/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwAIpxhTQ-LLUBv5jskj.woff +0 -0
  239. package/dist/client/devtools/_fonts/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwARZthTQ-F71RdTRbNg.woff +0 -0
  240. package/dist/client/devtools/_fonts/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwA_JxhTQ-6nh65gZkc0.woff +0 -0
  241. package/dist/client/devtools/_fonts/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwAfJthTQ-aMoWEJLmTt.woff +0 -0
  242. package/dist/client/devtools/_fonts/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwAkJxhTQ-WMBvmLOgKm.woff +0 -0
  243. package/dist/client/devtools/_fonts/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwAop1hTQ-utGC2hnWq2.woff +0 -0
  244. package/dist/client/devtools/_fonts/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwAopxhTQ-YpyTieVa5B.woff +0 -0
  245. package/dist/client/devtools/_nuxt/BDC8ywlR.js +0 -1
  246. package/dist/client/devtools/_nuxt/BT004Uxp.js +0 -53
  247. package/dist/client/devtools/_nuxt/C1H2Soz3.js +0 -1
  248. package/dist/client/devtools/_nuxt/builds/latest.json +0 -1
  249. package/dist/client/devtools/_nuxt/builds/meta/f98c13ea-d751-4b37-8ce3-94e99708745f.json +0 -1
  250. package/dist/client/devtools/_nuxt/entry.Bx6WJjrx.css +0 -1
  251. package/dist/client/devtools/_nuxt/error-404.Cq4qshcf.css +0 -1
  252. package/dist/client/devtools/_nuxt/error-500.ax1aM34m.css +0 -1
  253. package/dist/client/devtools/favicon.svg +0 -1
  254. package/dist/client/devtools/index.html +0 -1
  255. package/dist/devtools/runtime/DevtoolsRenderer.vue +0 -53
  256. package/dist/devtools/runtime/examples/AvatarGroupExample.vue +0 -7
  257. package/dist/devtools/runtime/examples/ButtonGroupExample.vue +0 -8
  258. package/dist/devtools/runtime/examples/CardExample.vue +0 -13
  259. package/dist/devtools/runtime/examples/CarouselExample.vue +0 -13
  260. package/dist/devtools/runtime/examples/ChipExample.vue +0 -5
  261. package/dist/devtools/runtime/examples/CollapsibleExample.vue +0 -8
  262. package/dist/devtools/runtime/examples/CommandPaletteExample.vue +0 -29
  263. package/dist/devtools/runtime/examples/ContainerExample.vue +0 -5
  264. package/dist/devtools/runtime/examples/ContextMenuExample.vue +0 -5
  265. package/dist/devtools/runtime/examples/DrawerExample.vue +0 -8
  266. package/dist/devtools/runtime/examples/DropdownMenuExample.vue +0 -5
  267. package/dist/devtools/runtime/examples/FormExample.vue +0 -30
  268. package/dist/devtools/runtime/examples/FormFieldExample.vue +0 -5
  269. package/dist/devtools/runtime/examples/LinkExample.vue +0 -5
  270. package/dist/devtools/runtime/examples/ModalExample.vue +0 -8
  271. package/dist/devtools/runtime/examples/PopoverExample.vue +0 -8
  272. package/dist/devtools/runtime/examples/SkeletonExample.vue +0 -3
  273. package/dist/devtools/runtime/examples/SlideoverExample.vue +0 -8
  274. package/dist/devtools/runtime/examples/ToasterExample.vue +0 -11
  275. package/dist/devtools/runtime/examples/TooltipExample.vue +0 -5
  276. package/dist/runtime/components/ModalProvider.vue +0 -12
  277. package/dist/runtime/components/SlideoverProvider.vue +0 -12
  278. package/dist/runtime/composables/extendDevtoolsMeta.d.ts +0 -7
  279. package/dist/runtime/composables/extendDevtoolsMeta.js +0 -2
  280. package/dist/runtime/composables/useModal.d.ts +0 -17
  281. package/dist/runtime/composables/useModal.js +0 -46
  282. package/dist/runtime/composables/useSlideover.d.ts +0 -17
  283. package/dist/runtime/composables/useSlideover.js +0 -46
  284. package/dist/runtime/plugins/modal.d.ts +0 -2
  285. package/dist/runtime/plugins/modal.js +0 -10
  286. package/dist/runtime/plugins/slideover.d.ts +0 -2
  287. package/dist/runtime/plugins/slideover.js +0 -10
  288. /package/dist/runtime/locale/{zh_hans.d.ts → az.d.ts} +0 -0
  289. /package/dist/runtime/locale/{zh_hant.d.ts → bn.d.ts} +0 -0
@@ -1,8 +1,39 @@
1
+ const color = [
2
+ "primary",
3
+ "secondary",
4
+ "success",
5
+ "info",
6
+ "warning",
7
+ "error",
8
+ "neutral"
9
+ ] as const
10
+
11
+ const size = [
12
+ "xs",
13
+ "sm",
14
+ "md",
15
+ "lg",
16
+ "xl"
17
+ ] as const
18
+
19
+ const variant = [
20
+ "outline",
21
+ "soft",
22
+ "subtle",
23
+ "ghost",
24
+ "none"
25
+ ] as const
26
+
27
+ const orientation = [
28
+ "horizontal",
29
+ "vertical"
30
+ ] as const
31
+
1
32
  export default {
2
33
  "slots": {
3
34
  "root": "relative inline-flex items-center",
4
35
  "base": [
5
- "w-full rounded-[calc(var(--ui-radius)*1.5)] border-0 placeholder:text-[var(--ui-text-dimmed)] focus:outline-none disabled:cursor-not-allowed disabled:opacity-75",
36
+ "w-full rounded-[calc(var(--ui-radius)*1.5)] border-0 placeholder:text-(--ui-text-dimmed) focus:outline-none disabled:cursor-not-allowed disabled:opacity-75",
6
37
  "transition-colors"
7
38
  ],
8
39
  "increment": "absolute flex items-center",
@@ -26,11 +57,11 @@ export default {
26
57
  "xl": "px-3 py-2 text-base gap-2"
27
58
  },
28
59
  "variant": {
29
- "outline": "text-[var(--ui-text-highlighted)] bg-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)]",
30
- "soft": "text-[var(--ui-text-highlighted)] bg-[var(--ui-bg-elevated)]/50 hover:bg-[var(--ui-bg-elevated)] focus:bg-[var(--ui-bg-elevated)] disabled:bg-[var(--ui-bg-elevated)]/50",
31
- "subtle": "text-[var(--ui-text-highlighted)] bg-[var(--ui-bg-elevated)] ring ring-inset ring-[var(--ui-border-accented)]",
32
- "ghost": "text-[var(--ui-text-highlighted)] bg-transparent hover:bg-[var(--ui-bg-elevated)] focus:bg-[var(--ui-bg-elevated)] disabled:bg-transparent dark:disabled:bg-transparent",
33
- "none": "text-[var(--ui-text-highlighted)] bg-transparent"
60
+ "outline": "text-(--ui-text-highlighted) bg-(--ui-bg) ring ring-inset ring-(--ui-border-accented)",
61
+ "soft": "text-(--ui-text-highlighted) bg-(--ui-bg-elevated)/50 hover:bg-(--ui-bg-elevated) focus:bg-(--ui-bg-elevated) disabled:bg-(--ui-bg-elevated)/50",
62
+ "subtle": "text-(--ui-text-highlighted) bg-(--ui-bg-elevated) ring ring-inset ring-(--ui-border-accented)",
63
+ "ghost": "text-(--ui-text-highlighted) bg-transparent hover:bg-(--ui-bg-elevated) focus:bg-(--ui-bg-elevated) disabled:bg-transparent dark:disabled:bg-transparent",
64
+ "none": "text-(--ui-text-highlighted) bg-transparent"
34
65
  },
35
66
  "disabled": {
36
67
  "true": {
@@ -55,150 +86,150 @@ export default {
55
86
  },
56
87
  "compoundVariants": [
57
88
  {
58
- "color": "primary" as const,
89
+ "color": "primary" as typeof color[number],
59
90
  "variant": [
60
- "outline" as const,
61
- "subtle" as const
91
+ "outline" as typeof variant[number],
92
+ "subtle" as typeof variant[number]
62
93
  ],
63
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-primary)]"
94
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-primary)"
64
95
  },
65
96
  {
66
- "color": "secondary" as const,
97
+ "color": "secondary" as typeof color[number],
67
98
  "variant": [
68
- "outline" as const,
69
- "subtle" as const
99
+ "outline" as typeof variant[number],
100
+ "subtle" as typeof variant[number]
70
101
  ],
71
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-secondary)]"
102
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-secondary)"
72
103
  },
73
104
  {
74
- "color": "success" as const,
105
+ "color": "success" as typeof color[number],
75
106
  "variant": [
76
- "outline" as const,
77
- "subtle" as const
107
+ "outline" as typeof variant[number],
108
+ "subtle" as typeof variant[number]
78
109
  ],
79
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-success)]"
110
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-success)"
80
111
  },
81
112
  {
82
- "color": "info" as const,
113
+ "color": "info" as typeof color[number],
83
114
  "variant": [
84
- "outline" as const,
85
- "subtle" as const
115
+ "outline" as typeof variant[number],
116
+ "subtle" as typeof variant[number]
86
117
  ],
87
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-info)]"
118
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-info)"
88
119
  },
89
120
  {
90
- "color": "warning" as const,
121
+ "color": "warning" as typeof color[number],
91
122
  "variant": [
92
- "outline" as const,
93
- "subtle" as const
123
+ "outline" as typeof variant[number],
124
+ "subtle" as typeof variant[number]
94
125
  ],
95
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-warning)]"
126
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-warning)"
96
127
  },
97
128
  {
98
- "color": "error" as const,
129
+ "color": "error" as typeof color[number],
99
130
  "variant": [
100
- "outline" as const,
101
- "subtle" as const
131
+ "outline" as typeof variant[number],
132
+ "subtle" as typeof variant[number]
102
133
  ],
103
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-error)]"
134
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-error)"
104
135
  },
105
136
  {
106
- "color": "primary" as const,
137
+ "color": "primary" as typeof color[number],
107
138
  "highlight": true,
108
- "class": "ring ring-inset ring-[var(--ui-primary)]"
139
+ "class": "ring ring-inset ring-(--ui-primary)"
109
140
  },
110
141
  {
111
- "color": "secondary" as const,
142
+ "color": "secondary" as typeof color[number],
112
143
  "highlight": true,
113
- "class": "ring ring-inset ring-[var(--ui-secondary)]"
144
+ "class": "ring ring-inset ring-(--ui-secondary)"
114
145
  },
115
146
  {
116
- "color": "success" as const,
147
+ "color": "success" as typeof color[number],
117
148
  "highlight": true,
118
- "class": "ring ring-inset ring-[var(--ui-success)]"
149
+ "class": "ring ring-inset ring-(--ui-success)"
119
150
  },
120
151
  {
121
- "color": "info" as const,
152
+ "color": "info" as typeof color[number],
122
153
  "highlight": true,
123
- "class": "ring ring-inset ring-[var(--ui-info)]"
154
+ "class": "ring ring-inset ring-(--ui-info)"
124
155
  },
125
156
  {
126
- "color": "warning" as const,
157
+ "color": "warning" as typeof color[number],
127
158
  "highlight": true,
128
- "class": "ring ring-inset ring-[var(--ui-warning)]"
159
+ "class": "ring ring-inset ring-(--ui-warning)"
129
160
  },
130
161
  {
131
- "color": "error" as const,
162
+ "color": "error" as typeof color[number],
132
163
  "highlight": true,
133
- "class": "ring ring-inset ring-[var(--ui-error)]"
164
+ "class": "ring ring-inset ring-(--ui-error)"
134
165
  },
135
166
  {
136
- "color": "neutral" as const,
167
+ "color": "neutral" as typeof color[number],
137
168
  "variant": [
138
- "outline" as const,
139
- "subtle" as const
169
+ "outline" as typeof variant[number],
170
+ "subtle" as typeof variant[number]
140
171
  ],
141
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-border-inverted)]"
172
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-border-inverted)"
142
173
  },
143
174
  {
144
- "color": "neutral" as const,
175
+ "color": "neutral" as typeof color[number],
145
176
  "highlight": true,
146
- "class": "ring ring-inset ring-[var(--ui-border-inverted)]"
177
+ "class": "ring ring-inset ring-(--ui-border-inverted)"
147
178
  },
148
179
  {
149
- "orientation": "horizontal" as const,
150
- "size": "xs" as const,
180
+ "orientation": "horizontal" as typeof orientation[number],
181
+ "size": "xs" as typeof size[number],
151
182
  "class": "px-7"
152
183
  },
153
184
  {
154
- "orientation": "horizontal" as const,
155
- "size": "sm" as const,
185
+ "orientation": "horizontal" as typeof orientation[number],
186
+ "size": "sm" as typeof size[number],
156
187
  "class": "px-8"
157
188
  },
158
189
  {
159
- "orientation": "horizontal" as const,
160
- "size": "md" as const,
190
+ "orientation": "horizontal" as typeof orientation[number],
191
+ "size": "md" as typeof size[number],
161
192
  "class": "px-9"
162
193
  },
163
194
  {
164
- "orientation": "horizontal" as const,
165
- "size": "lg" as const,
195
+ "orientation": "horizontal" as typeof orientation[number],
196
+ "size": "lg" as typeof size[number],
166
197
  "class": "px-10"
167
198
  },
168
199
  {
169
- "orientation": "horizontal" as const,
170
- "size": "xl" as const,
200
+ "orientation": "horizontal" as typeof orientation[number],
201
+ "size": "xl" as typeof size[number],
171
202
  "class": "px-11"
172
203
  },
173
204
  {
174
- "orientation": "vertical" as const,
175
- "size": "xs" as const,
205
+ "orientation": "vertical" as typeof orientation[number],
206
+ "size": "xs" as typeof size[number],
176
207
  "class": "pe-7"
177
208
  },
178
209
  {
179
- "orientation": "vertical" as const,
180
- "size": "sm" as const,
210
+ "orientation": "vertical" as typeof orientation[number],
211
+ "size": "sm" as typeof size[number],
181
212
  "class": "pe-8"
182
213
  },
183
214
  {
184
- "orientation": "vertical" as const,
185
- "size": "md" as const,
215
+ "orientation": "vertical" as typeof orientation[number],
216
+ "size": "md" as typeof size[number],
186
217
  "class": "pe-9"
187
218
  },
188
219
  {
189
- "orientation": "vertical" as const,
190
- "size": "lg" as const,
220
+ "orientation": "vertical" as typeof orientation[number],
221
+ "size": "lg" as typeof size[number],
191
222
  "class": "pe-10"
192
223
  },
193
224
  {
194
- "orientation": "vertical" as const,
195
- "size": "xl" as const,
225
+ "orientation": "vertical" as typeof orientation[number],
226
+ "size": "xl" as typeof size[number],
196
227
  "class": "pe-11"
197
228
  }
198
229
  ],
199
230
  "defaultVariants": {
200
- "size": "md" as const,
201
- "color": "primary" as const,
202
- "variant": "outline" as const
231
+ "size": "md" as typeof size[number],
232
+ "color": "primary" as typeof color[number],
233
+ "variant": "outline" as typeof variant[number]
203
234
  }
204
235
  }
package/.nuxt/ui/input.ts CHANGED
@@ -1,16 +1,51 @@
1
+ const buttonGroup = [
2
+ "horizontal",
3
+ "vertical"
4
+ ] as const
5
+
6
+ const size = [
7
+ "xs",
8
+ "sm",
9
+ "md",
10
+ "lg",
11
+ "xl"
12
+ ] as const
13
+
14
+ const variant = [
15
+ "outline",
16
+ "soft",
17
+ "subtle",
18
+ "ghost",
19
+ "none"
20
+ ] as const
21
+
22
+ const color = [
23
+ "primary",
24
+ "secondary",
25
+ "success",
26
+ "info",
27
+ "warning",
28
+ "error",
29
+ "neutral"
30
+ ] as const
31
+
32
+ const type = [
33
+ "file"
34
+ ] as const
35
+
1
36
  export default {
2
37
  "slots": {
3
38
  "root": "relative inline-flex items-center",
4
39
  "base": [
5
- "w-full rounded-[calc(var(--ui-radius)*1.5)] border-0 placeholder:text-[var(--ui-text-dimmed)] focus:outline-none disabled:cursor-not-allowed disabled:opacity-75",
40
+ "w-full rounded-[calc(var(--ui-radius)*1.5)] border-0 placeholder:text-(--ui-text-dimmed) focus:outline-none disabled:cursor-not-allowed disabled:opacity-75",
6
41
  "transition-colors"
7
42
  ],
8
- "leading": "absolute inset-y-0 start-0 flex items-center" as const,
9
- "leadingIcon": "shrink-0 text-[var(--ui-text-dimmed)]",
43
+ "leading": "absolute inset-y-0 start-0 flex items-center",
44
+ "leadingIcon": "shrink-0 text-(--ui-text-dimmed)",
10
45
  "leadingAvatar": "shrink-0",
11
46
  "leadingAvatarSize": "",
12
- "trailing": "absolute inset-y-0 end-0 flex items-center" as const,
13
- "trailingIcon": "shrink-0 text-[var(--ui-text-dimmed)]"
47
+ "trailing": "absolute inset-y-0 end-0 flex items-center",
48
+ "trailingIcon": "shrink-0 text-(--ui-text-dimmed)"
14
49
  },
15
50
  "variants": {
16
51
  "buttonGroup": {
@@ -26,51 +61,51 @@ export default {
26
61
  "size": {
27
62
  "xs": {
28
63
  "base": "px-2 py-1 text-xs gap-1",
29
- "leading": "ps-2" as const,
30
- "trailing": "pe-2" as const,
64
+ "leading": "ps-2",
65
+ "trailing": "pe-2",
31
66
  "leadingIcon": "size-4",
32
67
  "leadingAvatarSize": "3xs",
33
68
  "trailingIcon": "size-4"
34
69
  },
35
70
  "sm": {
36
71
  "base": "px-2.5 py-1.5 text-xs gap-1.5",
37
- "leading": "ps-2.5" as const,
38
- "trailing": "pe-2.5" as const,
72
+ "leading": "ps-2.5",
73
+ "trailing": "pe-2.5",
39
74
  "leadingIcon": "size-4",
40
75
  "leadingAvatarSize": "3xs",
41
76
  "trailingIcon": "size-4"
42
77
  },
43
78
  "md": {
44
79
  "base": "px-2.5 py-1.5 text-sm gap-1.5",
45
- "leading": "ps-2.5" as const,
46
- "trailing": "pe-2.5" as const,
80
+ "leading": "ps-2.5",
81
+ "trailing": "pe-2.5",
47
82
  "leadingIcon": "size-5",
48
83
  "leadingAvatarSize": "2xs",
49
84
  "trailingIcon": "size-5"
50
85
  },
51
86
  "lg": {
52
87
  "base": "px-3 py-2 text-sm gap-2",
53
- "leading": "ps-3" as const,
54
- "trailing": "pe-3" as const,
88
+ "leading": "ps-3",
89
+ "trailing": "pe-3",
55
90
  "leadingIcon": "size-5",
56
91
  "leadingAvatarSize": "2xs",
57
92
  "trailingIcon": "size-5"
58
93
  },
59
94
  "xl": {
60
95
  "base": "px-3 py-2 text-base gap-2",
61
- "leading": "ps-3" as const,
62
- "trailing": "pe-3" as const,
96
+ "leading": "ps-3",
97
+ "trailing": "pe-3",
63
98
  "leadingIcon": "size-6",
64
99
  "leadingAvatarSize": "xs",
65
100
  "trailingIcon": "size-6"
66
101
  }
67
102
  },
68
103
  "variant": {
69
- "outline": "text-[var(--ui-text-highlighted)] bg-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)]",
70
- "soft": "text-[var(--ui-text-highlighted)] bg-[var(--ui-bg-elevated)]/50 hover:bg-[var(--ui-bg-elevated)] focus:bg-[var(--ui-bg-elevated)] disabled:bg-[var(--ui-bg-elevated)]/50",
71
- "subtle": "text-[var(--ui-text-highlighted)] bg-[var(--ui-bg-elevated)] ring ring-inset ring-[var(--ui-border-accented)]",
72
- "ghost": "text-[var(--ui-text-highlighted)] bg-transparent hover:bg-[var(--ui-bg-elevated)] focus:bg-[var(--ui-bg-elevated)] disabled:bg-transparent dark:disabled:bg-transparent",
73
- "none": "text-[var(--ui-text-highlighted)] bg-transparent"
104
+ "outline": "text-(--ui-text-highlighted) bg-(--ui-bg) ring ring-inset ring-(--ui-border-accented)",
105
+ "soft": "text-(--ui-text-highlighted) bg-(--ui-bg-elevated)/50 hover:bg-(--ui-bg-elevated) focus:bg-(--ui-bg-elevated) disabled:bg-(--ui-bg-elevated)/50",
106
+ "subtle": "text-(--ui-text-highlighted) bg-(--ui-bg-elevated) ring ring-inset ring-(--ui-border-accented)",
107
+ "ghost": "text-(--ui-text-highlighted) bg-transparent hover:bg-(--ui-bg-elevated) focus:bg-(--ui-bg-elevated) disabled:bg-transparent dark:disabled:bg-transparent",
108
+ "none": "text-(--ui-text-highlighted) bg-transparent"
74
109
  },
75
110
  "color": {
76
111
  "primary": "",
@@ -94,149 +129,149 @@ export default {
94
129
  "true": ""
95
130
  },
96
131
  "type": {
97
- "file": "file:me-1.5 file:font-medium file:text-[var(--ui-text-muted)] file:outline-none"
132
+ "file": "file:me-1.5 file:font-medium file:text-(--ui-text-muted) file:outline-none"
98
133
  }
99
134
  },
100
135
  "compoundVariants": [
101
136
  {
102
- "color": "primary" as const,
137
+ "color": "primary" as typeof color[number],
103
138
  "variant": [
104
- "outline" as const,
105
- "subtle" as const
139
+ "outline" as typeof variant[number],
140
+ "subtle" as typeof variant[number]
106
141
  ],
107
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-primary)]"
142
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-primary)"
108
143
  },
109
144
  {
110
- "color": "secondary" as const,
145
+ "color": "secondary" as typeof color[number],
111
146
  "variant": [
112
- "outline" as const,
113
- "subtle" as const
147
+ "outline" as typeof variant[number],
148
+ "subtle" as typeof variant[number]
114
149
  ],
115
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-secondary)]"
150
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-secondary)"
116
151
  },
117
152
  {
118
- "color": "success" as const,
153
+ "color": "success" as typeof color[number],
119
154
  "variant": [
120
- "outline" as const,
121
- "subtle" as const
155
+ "outline" as typeof variant[number],
156
+ "subtle" as typeof variant[number]
122
157
  ],
123
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-success)]"
158
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-success)"
124
159
  },
125
160
  {
126
- "color": "info" as const,
161
+ "color": "info" as typeof color[number],
127
162
  "variant": [
128
- "outline" as const,
129
- "subtle" as const
163
+ "outline" as typeof variant[number],
164
+ "subtle" as typeof variant[number]
130
165
  ],
131
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-info)]"
166
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-info)"
132
167
  },
133
168
  {
134
- "color": "warning" as const,
169
+ "color": "warning" as typeof color[number],
135
170
  "variant": [
136
- "outline" as const,
137
- "subtle" as const
171
+ "outline" as typeof variant[number],
172
+ "subtle" as typeof variant[number]
138
173
  ],
139
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-warning)]"
174
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-warning)"
140
175
  },
141
176
  {
142
- "color": "error" as const,
177
+ "color": "error" as typeof color[number],
143
178
  "variant": [
144
- "outline" as const,
145
- "subtle" as const
179
+ "outline" as typeof variant[number],
180
+ "subtle" as typeof variant[number]
146
181
  ],
147
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-error)]"
182
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-error)"
148
183
  },
149
184
  {
150
- "color": "primary" as const,
185
+ "color": "primary" as typeof color[number],
151
186
  "highlight": true,
152
- "class": "ring ring-inset ring-[var(--ui-primary)]"
187
+ "class": "ring ring-inset ring-(--ui-primary)"
153
188
  },
154
189
  {
155
- "color": "secondary" as const,
190
+ "color": "secondary" as typeof color[number],
156
191
  "highlight": true,
157
- "class": "ring ring-inset ring-[var(--ui-secondary)]"
192
+ "class": "ring ring-inset ring-(--ui-secondary)"
158
193
  },
159
194
  {
160
- "color": "success" as const,
195
+ "color": "success" as typeof color[number],
161
196
  "highlight": true,
162
- "class": "ring ring-inset ring-[var(--ui-success)]"
197
+ "class": "ring ring-inset ring-(--ui-success)"
163
198
  },
164
199
  {
165
- "color": "info" as const,
200
+ "color": "info" as typeof color[number],
166
201
  "highlight": true,
167
- "class": "ring ring-inset ring-[var(--ui-info)]"
202
+ "class": "ring ring-inset ring-(--ui-info)"
168
203
  },
169
204
  {
170
- "color": "warning" as const,
205
+ "color": "warning" as typeof color[number],
171
206
  "highlight": true,
172
- "class": "ring ring-inset ring-[var(--ui-warning)]"
207
+ "class": "ring ring-inset ring-(--ui-warning)"
173
208
  },
174
209
  {
175
- "color": "error" as const,
210
+ "color": "error" as typeof color[number],
176
211
  "highlight": true,
177
- "class": "ring ring-inset ring-[var(--ui-error)]"
212
+ "class": "ring ring-inset ring-(--ui-error)"
178
213
  },
179
214
  {
180
- "color": "neutral" as const,
215
+ "color": "neutral" as typeof color[number],
181
216
  "variant": [
182
- "outline" as const,
183
- "subtle" as const
217
+ "outline" as typeof variant[number],
218
+ "subtle" as typeof variant[number]
184
219
  ],
185
- "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-[var(--ui-border-inverted)]"
220
+ "class": "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--ui-border-inverted)"
186
221
  },
187
222
  {
188
- "color": "neutral" as const,
223
+ "color": "neutral" as typeof color[number],
189
224
  "highlight": true,
190
- "class": "ring ring-inset ring-[var(--ui-border-inverted)]"
225
+ "class": "ring ring-inset ring-(--ui-border-inverted)"
191
226
  },
192
227
  {
193
228
  "leading": true,
194
- "size": "xs" as const,
229
+ "size": "xs" as typeof size[number],
195
230
  "class": "ps-7"
196
231
  },
197
232
  {
198
233
  "leading": true,
199
- "size": "sm" as const,
234
+ "size": "sm" as typeof size[number],
200
235
  "class": "ps-8"
201
236
  },
202
237
  {
203
238
  "leading": true,
204
- "size": "md" as const,
239
+ "size": "md" as typeof size[number],
205
240
  "class": "ps-9"
206
241
  },
207
242
  {
208
243
  "leading": true,
209
- "size": "lg" as const,
244
+ "size": "lg" as typeof size[number],
210
245
  "class": "ps-10"
211
246
  },
212
247
  {
213
248
  "leading": true,
214
- "size": "xl" as const,
249
+ "size": "xl" as typeof size[number],
215
250
  "class": "ps-11"
216
251
  },
217
252
  {
218
253
  "trailing": true,
219
- "size": "xs" as const,
254
+ "size": "xs" as typeof size[number],
220
255
  "class": "pe-7"
221
256
  },
222
257
  {
223
258
  "trailing": true,
224
- "size": "sm" as const,
259
+ "size": "sm" as typeof size[number],
225
260
  "class": "pe-8"
226
261
  },
227
262
  {
228
263
  "trailing": true,
229
- "size": "md" as const,
264
+ "size": "md" as typeof size[number],
230
265
  "class": "pe-9"
231
266
  },
232
267
  {
233
268
  "trailing": true,
234
- "size": "lg" as const,
269
+ "size": "lg" as typeof size[number],
235
270
  "class": "pe-10"
236
271
  },
237
272
  {
238
273
  "trailing": true,
239
- "size": "xl" as const,
274
+ "size": "xl" as typeof size[number],
240
275
  "class": "pe-11"
241
276
  },
242
277
  {
@@ -256,8 +291,8 @@ export default {
256
291
  }
257
292
  ],
258
293
  "defaultVariants": {
259
- "size": "md" as const,
260
- "color": "primary" as const,
261
- "variant": "outline" as const
294
+ "size": "md" as typeof size[number],
295
+ "color": "primary" as typeof color[number],
296
+ "variant": "outline" as typeof variant[number]
262
297
  }
263
298
  }
package/.nuxt/ui/kbd.ts CHANGED
@@ -1,10 +1,22 @@
1
+ const variant = [
2
+ "solid",
3
+ "outline",
4
+ "subtle"
5
+ ] as const
6
+
7
+ const size = [
8
+ "sm",
9
+ "md",
10
+ "lg"
11
+ ] as const
12
+
1
13
  export default {
2
- "base": "inline-flex items-center justify-center px-1 rounded-[var(--ui-radius)] font-medium font-sans",
14
+ "base": "inline-flex items-center justify-center px-1 rounded-(--ui-radius) font-medium font-sans",
3
15
  "variants": {
4
16
  "variant": {
5
- "solid": "bg-[var(--ui-bg-inverted)] text-[var(--ui-bg)]",
6
- "outline": "bg-[var(--ui-bg)] text-[var(--ui-text-highlighted)] ring ring-inset ring-[var(--ui-border-accented)]",
7
- "subtle": "bg-[var(--ui-bg-elevated)] text-[var(--ui-text)] ring ring-inset ring-[var(--ui-border-accented)]"
17
+ "solid": "bg-(--ui-bg-inverted) text-(--ui-bg)",
18
+ "outline": "bg-(--ui-bg) text-(--ui-text-highlighted) ring ring-inset ring-(--ui-border-accented)",
19
+ "subtle": "bg-(--ui-bg-elevated) text-(--ui-text) ring ring-inset ring-(--ui-border-accented)"
8
20
  },
9
21
  "size": {
10
22
  "sm": "h-4 min-w-[16px] text-[10px]",
@@ -13,7 +25,7 @@ export default {
13
25
  }
14
26
  },
15
27
  "defaultVariants": {
16
- "variant": "outline" as const,
17
- "size": "md" as const
28
+ "variant": "outline" as typeof variant[number],
29
+ "size": "md" as typeof size[number]
18
30
  }
19
31
  }