even without any other code.\n\n### Version\n\nv3.0.0-alpha.5\n\n### Reproduction\n\n`\u003Ctemplate>\n \u003CUContainer>\n \u003CUForm :schema=\"schema\" :state=\"state\" class=\"space-y-4\" @submit=\"onSubmit\">\n \u003CUFormField label=\"Code\" name=\"Code\"\n >\u003CUInput v-model=\"state.code\" />\n \u003C/UFormField>\n \u003C/UForm>\n \u003C/UContainer>\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\nimport { z } from 'zod';\nimport type { FormSubmitEvent } from '#ui/types';\n\nconst supabase = useSupabaseClient();\nconst toast = useToast();\n\n//Form\nconst schema = z.object({\n code: z.string().min(3),\n});\n\ntype Schema = z.output\u003Ctypeof schema>;\n\nconst state = reactive\u003CPartial\u003CSchema>>({\n code: undefined,\n});\n\nasync function onSubmit(event: FormSubmitEvent\u003CSchema>) {\n toast.add({\n title: 'Success',\n description: 'The form has been submitted.',\n color: 'success',\n });\n console.log(event.data);\n}\n\u003C/script>\n`\n\n### Description\n\nUInput causes an error\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3048,3049],{"name":3030,"color":3031},{"name":3050,"color":3051},"v3","49DCB8",2349,"ui","UInput causes error","2024-10-10T14:15:25Z","https://github.com/nuxt/ui/issues/2349",0.67494714,{"description":3059,"labels":3060,"number":3063,"owner":3019,"repository":3053,"state":3040,"title":3064,"updated_at":3065,"url":3066,"score":3067},"### Environment\n\n-\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.16.0\n\n### Reproduction\n\n- \n\n### Description\n\nUpgraded all deps to the latest and bam Nuxt 3.16.0 is added. We get errors now as Nuxt UI 3 still ships with\n\n`'@unhead/vue': 1.11.20(vue@3.5.13(typescript@5.8.2))\n`\n\nAs of Nuxt 3.16.0 ships with @unhead2:\nhttps://nuxt.com/blog/v3-16#unhead-v2\n\nActual error:\n`[@nuxt/scripts 9:42:20 PM] ERROR Nuxt Scripts requires Unhead >= 2, you are using v1.11.20. Please run nuxi upgrade --clean to upgrade...`\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3061,3062],{"name":3030,"color":3031},{"name":3050,"color":3051},3513,"Nuxt 3.16.0 - ships with @unhead2","2025-03-10T08:49:36Z","https://github.com/nuxt/ui/issues/3513",0.68860203,{"description":3069,"labels":3070,"number":3076,"owner":3019,"repository":3053,"state":3040,"title":3077,"updated_at":3078,"url":3079,"score":3080},"### Environment\n\n- Operating System: Linux\n- Node Version: v20.12.0\n- Nuxt Version: 3.16.1\n- CLI Version: 3.24.0\n- Nitro Version: 2.11.8\n- Package Manager: pnpm@8.15.6\n- Builder: -\n- User Config: modules, devtools, compatibilityDate, future, css\n- Runtime Modules: @nuxt/ui@3.0.2\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.2\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/fervent-montalcini-9slyvd\n\n### Description\n\nWhen using reactive elements with arrays as sub-elements passed to UTable, there is no reactivity, despite using push methods, which are reactive in other elements:\n```\nconst nestedArrays = ref({\n array1: [],\n array2: [],\n});\n```\nnestedArrays.value.array1.push('NEW ELEMENT') ==> UTable is not updated\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3071,3072,3075],{"name":3030,"color":3031},{"name":3073,"color":3074},"duplicate","cfd3d7",{"name":3050,"color":3051},3962,"Table nested arrays are not reactive","2025-04-24T10:10:38Z","https://github.com/nuxt/ui/issues/3962",0.69146574,{"description":3082,"labels":3083,"number":3087,"owner":3019,"repository":3053,"state":3040,"title":3088,"updated_at":3089,"url":3090,"score":3091},"### Environment\n\nIt concerns the latest documentation of UModal.\n\n### Version\n\nlatest\n\n### Reproduction\n\nSince it concerns the docu, there is no example needed.\n\n### Description\n\nhttps://ui.nuxt.com/components/modal#control-programmatically\r\n\r\nThe \"Control programmatically\" section first shows the preferred implementation of the `\u003CUModal />` in `app.vue`. But this `app.vue` has different content just below where the tabs are for `app.vue` and `model.vue`. This is confusing, especially for newcomers like me.\r\nAlso, at this particular place, there is a plural version of the component, `\u003CUModals />`. If this is not an error it would certainly deserve some clarifying words.\r\n\r\nFurther remarks:\r\nOther confusing things: The docu does not explain where the `modal.vue` lives, the `import ... from \"#components\"` is unknown at this step.\r\n\r\nAt the moment i personally cannot recreate this example.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3084],{"name":3085,"color":3086},"documentation","0075ca",2166,"Documentation for Modal shows 2 app.vue code samples for the same element, but with different content ","2024-09-23T03:25:50Z","https://github.com/nuxt/ui/issues/2166",0.6939226,{"description":3093,"labels":3094,"number":3099,"owner":3019,"repository":3053,"state":3040,"title":3100,"updated_at":3101,"url":3102,"score":3103},"### Environment\n\n- Operating System: `macos`\n- Node Version: `v18.16.0`\n- Nuxt Version: `3.16.0\"`\n- Vue: \"3.5.0\",\n- Nuxt/ui\": \"3.0.0\",\n- CLI Version: `3.8.4`\n- Package Manager: `pnpm`\n- IDE: VS Code\n\n\n### Version\n\nv3\n\n### Reproduction\n\nin any expample, even in your ui template npx nuxi init -t ui \u003Cmy-app>\n\n\n\n### Description\n\ntailwind IntelliSense works only in attribute class of elements, but not works in :ui={...}. so to write classes in ui i need learn them all, for example. \n\n\n\n\n\n\n\n\ni tried to help tailwind IntelliSense by addnig classregex to vscode setttings, but it did not help\n\n\n\njust for test purpose, i add some classregex for [CVA](https://cva.style/docs/getting-started/installation) for check if it will work. and it work for cva, not for :ui={..}\nscreen for cva\n\n\n### Additional context\n\nmake it work please! for :ui={..} and for app.config.ts\n\n### Logs\n\n```shell-script\n\n```",[3095,3096],{"name":3030,"color":3031},{"name":3097,"color":3098},"triage","ffffff",3570,"Tailwind CSS IntelliSense not works in :ui={} and in app.config.ts","2025-03-17T17:00:40Z","https://github.com/nuxt/ui/issues/3570",0.6955929,{"description":3105,"labels":3106,"number":3111,"owner":3019,"repository":3053,"state":3040,"title":3112,"updated_at":3113,"url":3114,"score":3115},"### For what version of Nuxt UI are you asking this question?\n\nv3.0.0-alpha.x\n\n### Description\n\nIn my Nuxt 3 project (that uses Nuxt UI `v3.0.0-alpha9`), I have a Vue component like this:\n\n```vue\n\u003Cscript setup lang=\"ts\">\n...\n\u003C/script>\n\n\u003Ctemplate>\n \u003CUContainer class=\"section\">\n ...\n \u003C/UContainer>\n\u003C/template>\n\n\u003Cstyle scoped lang=\"scss\">\n@use \"tailwindcss\";\n\n.section + .section {\n @apply mt-8 lg:mt-12;\n}\n\u003C/style>\n```\n\nThe problem is that `@apply mt-8 lg:mt-12;` doesn't work unless I add this to my `nuxt.config.ts`:\n```\npostcss: {\n plugins: {\n \"@tailwindcss/postcss\": {}, // https://tailwindcss.com/docs/v4-beta#using-post-css\n },\n},\n```\n\nHowever, when I do this, the Nuxt UI components stop working properly (e.g., Slideover renders at the bottom of the page and with wrong styling). How can I make the `@apply ...` work without breaking the Nuxt UI components?\n\nThis is my `package.json`:\n```json\n{\n \"name\": \"frontend\",\n \"private\": true,\n \"type\": \"module\",\n \"scripts\": {\n \"postinstall\": \"husky install && nuxt prepare\",\n \"dev\": \"nuxt dev\",\n \"build\": \"nuxt build\",\n \"preview\": \"nuxt preview\"\n },\n \"dependencies\": {\n \"@nuxt/ui\": \"^3.0.0-alpha.9\",\n \"nuxt\": \"latest\",\n \"nuxt-svgo\": \"latest\",\n \"vue\": \"latest\",\n \"vue-router\": \"latest\"\n },\n \"devDependencies\": {\n \"@commitlint/cli\": \"latest\",\n \"@commitlint/config-conventional\": \"latest\",\n \"husky\": \"latest\",\n \"sass\": \"latest\"\n }\n}\n```\n\nThis is my `nuxt.config.ts`:\n```ts\n// https://nuxt.com/docs/api/configuration/nuxt-config\nexport default defineNuxtConfig({\n compatibilityDate: \"2024-04-03\",\n devtools: { enabled: false },\n modules: [\"@nuxt/ui\", \"nuxt-svgo\"],\n css: [\"@/assets/css/main.css\"],\n // postcss: {\n // plugins: {\n // \"@tailwindcss/postcss\": {}, // https://tailwindcss.com/docs/v4-beta#using-post-css\n // },\n // },\n appConfig: {\n // https://ui3.nuxt.dev/getting-started/theme#colors\n ui: {\n colors: {\n primary: \"primary\", // Defined in `assets/css/theme.css`\n secondary: \"secondary\", // Defined in `assets/css/theme.css`\n },\n },\n },\n});\n```\n\nThis is my `assets/main.css`:\n```css\n/* https://ui3.nuxt.dev/getting-started/installation/nuxt#import-tailwind-css-and-nuxt-ui-in-your-css */\n@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n```",[3107,3110],{"name":3108,"color":3109},"question","d876e3",{"name":3050,"color":3051},2772,"@apply Tailwind CSS class in a component's `\u003Cstyle>` tag","2024-12-09T11:14:28Z","https://github.com/nuxt/ui/issues/2772",0.701368,{"description":3117,"labels":3118,"number":3122,"owner":3019,"repository":3053,"state":3040,"title":3123,"updated_at":3124,"url":3125,"score":3126},"### Environment\n\n- Operating System: Windows 10 \n- Node Version: v22.10.0 \n- Nuxt Version: 3.16.0 \n- CLI Version: 3.22.5 \n- Nitro Version: 2.11.5 \n- Package Manager: pnpm@9.15.7 \n- Builder: -\n- User Config: compatibilityDate, devtools, modules, css, meta, ssr, runtimeConfig, ui \n- Runtime Modules: @nuxt/ui@3.0.0-beta.3, @nuxt/icon@1.10.3, @nuxt/fonts@0.11.0, @vueuse/nuxt@12.8.2\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nNuxt UI 3.0\n\n### Reproduction\n\n```\n\u003Ctemplate>\n\u003CUInput\n v-model=\"translation\"\n ref=\"translationField\" \n />\n\u003C/template>\n\n\u003Cscript setup>\nconst translationField = ref(null)\n\nfunction nextCard() {\n translationField.value.focus() // throws: 'focus is not a function'\n \n nextTick(() => {\n translationField.value.focus() // same error\n })\n\n // below works ok\n nextTick(() => {\n const input = translationField.value?.$el?.querySelector('input')\n if (input) {\n input.focus()\n }\n })\n}\n\u003C/script>\n```\n\n\n### Description\nStandard Vue method of using template ref (for setting a focus, here) throws: 'focus() is not a function'\nIn the above code snippet I included workaround (credits to Sonnet 3.5)\nTried it dozen of times and checked this place to see if it has not been solved earlier.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3119,3120,3121],{"name":3030,"color":3031},{"name":3050,"color":3051},{"name":3097,"color":3098},3644,"\u003CUInput> template ref does not work","2025-03-21T13:14:18Z","https://github.com/nuxt/ui/issues/3644",0.7057018,{"description":3128,"labels":3129,"number":3138,"owner":3019,"repository":3019,"state":3040,"title":3139,"updated_at":3140,"url":3141,"score":3142},"### Environment\n\n- Operating System: `Darwin`\r\n- Node Version: `v20.16.0`\r\n- Nuxt Version: `3.12.4`\r\n- CLI Version: `3.12.0`\r\n- Nitro Version: `2.9.7`\r\n- Package Manager: `npm@10.8.1`\r\n- Builder: `-`\r\n- User Config: `compatibilityDate`, `devtools`, `routeRules`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n\n\n### Reproduction\n\nhttps://github.com/iBobik/nuxt-cloudflare-repro\r\n(sorry both Stackblitz and CodeSandbox were broken here)\n\n### Describe the bug\n\nThis generates static html files and _payload.json for each route: \r\n```\r\nnpm run generate\r\n```\r\nBut this does not:\r\n```\r\nNITRO_PRESET=cloudflare_pages npm run generate\r\n```\n\n### Additional context\n\nTried both build and generate commands, this is diff of both results:\r\n```\r\n~/Desktop/nuxt-app $ diff -r dist dist-generate\r\nOnly in dist-generate: 200.html\r\nOnly in dist-generate: 404.html\r\ndiff -r dist/_nuxt/builds/latest.json dist-generate/_nuxt/builds/latest.json\r\n1c1\r\n\u003C {\"id\":\"35074953-fd2a-4597-9372-4723ad5050e2\",\"timestamp\":1723572088390}\r\n\\ No newline at end of file\r\n---\r\n> {\"id\":\"d48c7124-530e-45c4-8dc4-b278138b8636\",\"timestamp\":1723571719063}\r\n\\ No newline at end of file\r\nOnly in dist/_nuxt/builds/meta: 35074953-fd2a-4597-9372-4723ad5050e2.json\r\nOnly in dist-generate/_nuxt/builds/meta: d48c7124-530e-45c4-8dc4-b278138b8636.json\r\ndiff -r dist/_redirects dist-generate/_redirects\r\n0a1\r\n> /* /404.html 404\r\n\\ No newline at end of file\r\ndiff -r dist/_routes.json dist-generate/_routes.json\r\n7a8,9\r\n> \"/200\",\r\n> \"/404\",\r\nOnly in dist: _worker.js\r\ndiff -r dist/nitro.json dist-generate/nitro.json\r\n2c2\r\n\u003C \"date\": \"2024-08-13T18:01:31.792Z\",\r\n---\r\n> \"date\": \"2024-08-13T17:55:21.067Z\",\r\n```\n\n### Logs\n\n```shell-script\n~/Desktop/nuxt-app $ NITRO_PRESET=cloudflare_pages npm run generate\r\n\r\n> generate\r\n> nuxt generate\r\n\r\nNuxt 3.12.4 with Nitro 2.9.7 7:55:18 PM\r\nℹ Using Nitro server preset: static 7:55:18 PM\r\nℹ Building client... 7:55:19 PM\r\nℹ vite v5.4.0 building for production... 7:55:19 PM\r\nℹ ✓ 122 modules transformed. 7:55:20 PM\r\n[7:55:20 PM] ℹ .nuxt/dist/client/manifest.json 1.88 kB │ gzip: 0.40 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/client/_nuxt/error-500.DFBAsgKS.css 1.88 kB │ gzip: 0.72 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/client/_nuxt/error-404.CjGVuf6H.css 3.56 kB │ gzip: 1.11 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/client/_nuxt/DHxqdnyk.js 0.35 kB │ gzip: 0.27 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/client/_nuxt/BeJZzlYd.js 0.36 kB │ gzip: 0.27 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/client/_nuxt/DL1_5Jai.js 0.38 kB │ gzip: 0.26 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/client/_nuxt/CLUXSg-K.js 2.77 kB │ gzip: 1.24 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/client/_nuxt/CWZudPM4.js 3.13 kB │ gzip: 1.41 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/client/_nuxt/BrHYHSrW.js 5.14 kB │ gzip: 2.04 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/client/_nuxt/Cj5YTcLz.js 153.74 kB │ gzip: 58.21 kB\r\nℹ ✓ built in 682ms 7:55:20 PM\r\n✔ Client built in 688ms 7:55:20 PM\r\nℹ Building server... 7:55:20 PM\r\nℹ vite v5.4.0 building SSR bundle for production... 7:55:20 PM\r\nℹ ✓ 59 modules transformed. 7:55:20 PM\r\nℹ .nuxt/dist/server/_nuxt/error-404-styles.CibK9Qn2.mjs 0.08 kB 7:55:20 PM\r\nℹ .nuxt/dist/server/_nuxt/error-500-styles.JhxDD0mW.mjs 0.08 kB 7:55:20 PM\r\nℹ .nuxt/dist/server/_nuxt/error-404-styles.WpyeoFtc.mjs 0.15 kB 7:55:20 PM\r\nℹ .nuxt/dist/server/_nuxt/error-500-styles.BFuVBFDJ.mjs 0.15 kB 7:55:20 PM\r\nℹ .nuxt/dist/server/styles.mjs 0.69 kB 7:55:20 PM\r\n[7:55:20 PM] ℹ .nuxt/dist/server/_nuxt/index-BabADJUJ.js 0.98 kB │ map: 5.87 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/server/_nuxt/about-D-ycmm6F.js 1.44 kB │ map: 0.57 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/server/_nuxt/index-FeDgfKV2.js 1.44 kB │ map: 0.57 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/server/_nuxt/error-500-styles-1.mjs-D_pjx06j.js 2.10 kB │ map: 0.12 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/server/_nuxt/error-404-styles-1.mjs-DaBoFDuU.js 3.80 kB │ map: 0.12 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/server/_nuxt/error-500-C9bPTPhK.js 3.88 kB │ map: 4.59 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/server/_nuxt/error-404-Df2mLGjZ.js 4.78 kB │ map: 6.41 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/server/_nuxt/nuxt-link-2X8I7ISh.js 8.64 kB │ map: 18.05 kB\r\n[7:55:20 PM] ℹ .nuxt/dist/server/server.mjs 43.25 kB │ map: 102.04 kB\r\nℹ ✓ built in 242ms 7:55:20 PM\r\n✔ Server built in 248ms 7:55:20 PM\r\nℹ Initializing prerenderer nitro 7:55:20 PM\r\nℹ Prerendering 2 routes nitro 7:55:21 PM\r\n ├─ /404.html (11ms) nitro 7:55:21 PM\r\n ├─ /200.html (12ms) nitro 7:55:21 PM\r\nℹ Prerendered 2 routes in 0.33 seconds nitro 7:55:21 PM\r\n✔ Generated public dist nitro 7:55:21 PM\r\n✔ You can preview this build using npx wrangler pages dev dist/ nitro 7:55:21 PM\r\n✔ You can deploy this build using npx wrangler pages deploy dist/ nitro 7:55:21 PM\r\n✔ You can now deploy dist to any static hosting! \r\n```\n```\n",[3130,3132,3135],{"name":3036,"color":3131},"E99695",{"name":3133,"color":3134},"nitro","bfd4f2",{"name":3136,"color":3137},"upstream","E8A36D",28526,"cloudflare-pages does not generate static pages","2025-01-31T00:03:52Z","https://github.com/nuxt/nuxt/issues/28526",0.7068293,["Reactive",3144],{},["Set"],["ShallowReactive",3147],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fT129Iks3y-ssGDRNoP88YUlNPlLPiTnniyRuaQWVM6I":-1},"/nuxt/nuxt.com/1769"]