\n \u003C/template>\n\n \u003Ccomponent\n v-if=\"resolvedComponent\"\n :is=\"resolvedComponent\"\n :field=\"field\"\n :fieldName=\"fieldName\"\n :state=\"state\"\n />\n\n \u003Ctemplate v-if=\"helpContent\" #help>\n \u003Cspan v-html=\"cleanHTML(helpContent)\" />\n \u003C/template>\n \u003C/UFormField>\n```\n\n ```\n \u003CURadioGroup\n v-model=\"state[fieldName]\"\n :items=\"transformOptions(field['#options'] || {})\"\n orientation=\"horizontal\"\n class=\"w-full\"\n />\n```\n\n```\n \u003CUSelect\n v-model=\"state[fieldName]\"\n placeholder=\"Select\"\n :items=\"transformOptions(field['#options'] || {})\"\n class=\"w-full\"\n />\n\n```\nHowever when using a UCheckbox label and description have to be set here\n\n```\n \u003CUCheckbox\n v-model=\"checkboxValue\"\n :label=\"field['#title']\"\n :description=\"field['#description']\"\n class=\"w-full\"\n @update:model-value=\"props.state[fieldName] = $event\"\n />\n```\n\nSeems like this is a bug or maybe this is by design?\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3039,3042],{"name":3040,"color":3041},"question","d876e3",{"name":3023,"color":3024},3294,"closed","UCheckbox fieldform support","2025-02-12T19:23:36Z","https://github.com/nuxt/ui/issues/3294",0.67213887,{"description":3050,"labels":3051,"number":3059,"owner":3029,"repository":3030,"state":3044,"title":3060,"updated_at":3061,"url":3062,"score":3063},"Related to https://github.com/nuxt/ui/pull/2650\n\nMight be fixed when `vaul-vue` will migrate to `reka-ui`.",[3052,3055,3056],{"name":3053,"color":3054},"bug","d73a4a",{"name":3023,"color":3024},{"name":3057,"color":3058},"reka-ui","56d799",2920,"[Drawer] Closing when clicking on a Toast","2025-03-04T12:46:17Z","https://github.com/nuxt/ui/issues/2920",0.679866,{"description":3065,"labels":3066,"number":3072,"owner":3029,"repository":3030,"state":3044,"title":3073,"updated_at":3074,"url":3075,"score":3076},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.18.0\n- Nuxt Version: 3.14.1592\n- CLI Version: 3.16.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.12.3\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/image@1.8.1, @nuxt/content@2.13.4, @nuxthq/studio@1.1.2, @nuxt/ui-pro@3.0.0-alpha.10, @nuxtjs/plausible@1.2.0, @nuxtjs/seo@2.0.2, @vueuse/nuxt@12.0.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0.alpha10\n\n### Reproduction\n\nhttps://ui3.nuxt.dev/components/button#loading (example with `loading-auto`)\n\n### Description\n\nWhen using a `UIButton` component with an `@click` event, the cursor does not change to `cursor-pointer`, which may confuse users about the button's clickability.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3067,3068,3071],{"name":3053,"color":3054},{"name":3069,"color":3070},"duplicate","cfd3d7",{"name":3023,"color":3024},2940,"`cursor-pointer` is missing on `UButton` with an `@click` event","2025-04-02T09:37:12Z","https://github.com/nuxt/ui/issues/2940",0.6806913,{"description":3078,"labels":3079,"number":3082,"owner":3029,"repository":3030,"state":3044,"title":3083,"updated_at":3084,"url":3085,"score":3086},"### Description\n\ni noticed that NUXT UI / NUXT UI PRO were refactored to use tailwind's new version 3 stuff + radix...\n\ni just went to the tailwind docs today and it looks like they just skipped right past their new version 3 and went to version 4...\n\nany ideas how this effects NUXT UI/PRO? \n\nMy undersanding is that version 3->4 means it was a semver breaking change?",[3080,3081],{"name":3040,"color":3041},{"name":3023,"color":3024},3167,"tailwind version 4..?","2025-01-24T10:17:32Z","https://github.com/nuxt/ui/issues/3167",0.6847212,{"description":3088,"labels":3089,"number":3093,"owner":3029,"repository":3030,"state":3044,"title":3094,"updated_at":3095,"url":3096,"score":3097},"### Description\n\nIf you use the Checkbox like Vue states (https://vuejs.org/guide/essentials/forms#checkbox), you can use multiple checkboxes and have multiple values selected.\n\nBut it only toggles them all to true or false...\n\n\u003Cimg width=\"253\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/754fc93a-b16d-475c-8b29-9896a165b5f9\" />\n\n(true here displays the \"array\" value)\n\nReka has array support\n\nhttps://reka-ui.com/docs/components/checkbox#anatomy\n\nBut it seems not implemented, right?",[3090,3091,3092],{"name":3069,"color":3070},{"name":3040,"color":3041},{"name":3023,"color":3024},3438,"Multiple checkboxes (like Vue form binding states)","2025-03-03T17:02:02Z","https://github.com/nuxt/ui/issues/3438",0.68780196,{"description":3099,"labels":3100,"number":3103,"owner":3029,"repository":3030,"state":3044,"title":3104,"updated_at":3105,"url":3106,"score":3107},"### Environment\n\n- Operating System: Linux\n- Node Version: v23.3.0\n- Nuxt Version: 3.15.1\n- CLI Version: 3.18.2\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.13.2\n- Builder: -\n- User Config: devtools, modules, css, future, compatibilityDate\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.9, @nuxt/eslint@0.7.4\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.15.1\n\n### Reproduction\n\nhttps://github.com/fl5brkv/nuxt-issue\n\n### Description\n\nI installed nuxt ui 3 from the official nuxt ui starter, just wanted to try the calendar, but it doesnt work. Throwing me warnings in console.log.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n[Vue warn]: Failed to resolve component: UCalendar\nIf this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. \n at \u003CIndex onVnodeUnmounted=fn\u003ConVnodeUnmounted> ref=Ref\u003C undefined > > \n at \u003CAnonymous key=\"/\" vnode= Object route= Object ... > \n at \u003CRouterView name=undefined route=undefined > \n at \u003CNuxtPage > \n at \u003CToastProvider swipe-direction=\"right\" duration=5000 > \n at \u003CToaster key=0 > \n at \u003CTooltipProvider > \n at \u003CConfigProvider use-id=fn\u003Cuse-id> dir=\"ltr\" > \n at \u003CApp > \n at \u003CApp key=4 > \n at \u003CNuxtRoot>\n\nruntime-core.esm-bundler.js?v=b66559bc:50 [Vue warn]: Hydration node mismatch:\n- rendered on server: \u003C!----> \n- expected on client: UCalendar \n at \u003CIndex onVnodeUnmounted=fn\u003ConVnodeUnmounted> ref=Ref\u003C undefined > > \n at \u003CAnonymous key=\"/\" vnode= Object route= Object ... > \n at \u003CRouterView name=undefined route=undefined > \n at \u003CNuxtPage > \n at \u003CToastProvider swipe-direction=\"right\" duration=5000 > \n at \u003CToaster key=0 > \n at \u003CTooltipProvider > \n at \u003CConfigProvider use-id=fn\u003Cuse-id> dir=\"ltr\" > \n at \u003CApp > \n at \u003CApp key=4 > \n at \u003CNuxtRoot>\n```",[3101,3102],{"name":3053,"color":3054},{"name":3023,"color":3024},3044,"\u003CUCalendar /> isn't rendering","2025-01-08T09:24:13Z","https://github.com/nuxt/ui/issues/3044",0.6938123,{"description":3109,"labels":3110,"number":3113,"owner":3029,"repository":3030,"state":3044,"title":3114,"updated_at":3115,"url":3116,"score":3117},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.11.1\n- Nuxt Version: 3.13.2\n- CLI Version: 3.14.0\n- Nitro Version: 2.9.7\n- Package Manager: bun@1.1.33\n- Builder: -\n- User Config: -\n- Runtime Modules: -\n- Build Modules: -\n\n### Version\n\nv3.0.0-alpha.7\n\n### Reproduction\n\n```ts\nexport default defineAppConfig({\n ui: {\n colors: {\n neutral: \"zinc\",\n primary: \"rose\",\n },\n button: {\n compoundVariants: [\n {\n color: \"neutral\",\n variant: \"outline\",\n class:\n \"ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] hover:bg-[var(--ui-bg-elevated)] disabled:bg-[var(--ui-bg)] aria-disabled:bg-[var(--ui-bg)] focus-visible:ring-2 focus-visible:ring-[var(--ui-border-inverted)]\",\n },\n ],\n },\n },\n});\n```\n\n```\nType '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]' is not assignable to type 'DeepPartial\u003C({ color: \"primary\"; variant: \"solid\"; class: string; size?: undefined; square?: undefined; loading?: undefined; leading?: undefined; trailing?: undefined; } | { color: \"secondary\"; variant: \"solid\"; ... 5 more ...; trailing?: undefined; } | ... 46 more ... | { ...; })[], string>'.\n Type '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]' is not assignable to type '{ [key: string]: string | TightMap\u003Cstring>; }'.\n Index signature for type 'string' is missing in type '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]'.ts(2322)\n```\n\n### Description\n\nHi :) I am getting type errors when using `compoundVariant`. \n\nFor example, here is my `app.config.ts`:\n\n```ts\nexport default defineAppConfig({\n ui: {\n colors: {\n neutral: \"zinc\",\n primary: \"rose\",\n },\n button: {\n compoundVariants: [\n {\n color: \"neutral\",\n variant: \"outline\",\n class:\n \"ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] hover:bg-[var(--ui-bg-elevated)] disabled:bg-[var(--ui-bg)] aria-disabled:bg-[var(--ui-bg)] focus-visible:ring-2 focus-visible:ring-[var(--ui-border-inverted)]\",\n },\n ],\n },\n },\n});\n```\n\nI am getting the following type error for `compoundVariants`:\n```\nType '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]' is not assignable to type 'DeepPartial\u003C({ color: \"primary\"; variant: \"solid\"; class: string; size?: undefined; square?: undefined; loading?: undefined; leading?: undefined; trailing?: undefined; } | { color: \"secondary\"; variant: \"solid\"; ... 5 more ...; trailing?: undefined; } | ... 46 more ... | { ...; })[], string>'.\n Type '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]' is not assignable to type '{ [key: string]: string | TightMap\u003Cstring>; }'.\n Index signature for type 'string' is missing in type '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]'.ts(2322)\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3111,3112],{"name":3053,"color":3054},{"name":3023,"color":3024},2481,"Type error on `compoundVariants`","2024-10-28T21:43:49Z","https://github.com/nuxt/ui/issues/2481",0.69618845,{"description":3119,"labels":3120,"number":3122,"owner":3029,"repository":3030,"state":3044,"title":3123,"updated_at":3124,"url":3125,"score":3126},"### Description\n\nHi, using the UTable with Expanded feature is it possible to apply a style to the Expand column ??? I can see how to do this for columns I add but not the expanded column.\r\nAlso is it possible to change the default so the expanded is open by default? Or to change this in the script section?\r\n\r\nThanks I was unable to find answers in the docs.",[3121],{"name":3040,"color":3041},2244,"UTable Expandable questions?","2024-11-05T14:52:12Z","https://github.com/nuxt/ui/issues/2244",0.69627476,{"description":3128,"labels":3129,"number":3132,"owner":3029,"repository":3030,"state":3044,"title":3133,"updated_at":3134,"url":3135,"score":3136},"### Description\n\nIt's shorter and can save traffic.\n\n### Additional context\n\n_No response_",[3130,3131],{"name":3020,"color":3021},{"name":3023,"color":3024},3250,"Use `foo-(--bar)` instead of `foo-[var(--bar)]` for tailwindcss classes","2025-02-07T10:24:17Z","https://github.com/nuxt/ui/issues/3250",0.69657475,["Reactive",3138],{},["Set"],["ShallowReactive",3141],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fOPIsjaeOazeOe8RhiqbXh71EasleJtXjiWsp8jwRvPY":-1},"/nuxt/ui/2425"]