\n\u003C/template>\n\n```\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3145,3148],{"name":3146,"color":3147},"bug","d73a4a",{"name":3149,"color":3150},"v3","49DCB8",3069,"nuxt","ui","closed","UNavigationMenu I'm facing an issue with the collapse functionality of my nested navigation menu.","2025-01-25T12:56:13Z","https://github.com/nuxt/ui/issues/3069",0.6959141,{"description":3160,"labels":3161,"number":3165,"owner":3152,"repository":3166,"state":3154,"title":3167,"updated_at":3168,"url":3169,"score":3170},"- [x] `Nuxt`\n- [x] `Studio`\n- [x] logo only",[3162],{"name":3163,"color":3164},"design","00bd6f",780,"nuxt.com","Uniformize logos with same size","2023-09-05T08:18:35Z","https://github.com/nuxt/nuxt.com/issues/780",0.7078221,{"description":3172,"labels":3173,"number":3174,"owner":3152,"repository":3166,"state":3154,"title":3175,"updated_at":3176,"url":3177,"score":3178},"- [x] Colors & Fonts\n- [x] Landing page (Home)\n- [x] Showcase categories/hero\n- [x] Modules categories/hero\n- [x] Blog categories/hero\n- [x] Support hero/content",[],1305,"Marketing Update","2023-07-04T10:00:31Z","https://github.com/nuxt/nuxt.com/issues/1305",0.70980865,{"description":3180,"labels":3181,"number":3184,"owner":3152,"repository":3153,"state":3154,"title":3185,"updated_at":3186,"url":3187,"score":3188},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v20.11.1\n- Nuxt Version: 3.14.159\n- CLI Version: 3.15.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.11.0\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.8, @nuxtjs/html-validator@1.8.2, @nuxt/image@1.8.1, @nuxt/eslint@0.6.1, @nuxtjs/seo@2.0.0-rc.23\n- Build Modules: -\n------------------------------\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n\"@nuxt/ui\": \"3.0.0-alpha.8\",\n\n### Reproduction\n\n\u003C!-- layouts/default.vue -->\n\u003Ctemplate>\n \u003Cdiv class=\"container mx-auto\">\n \u003Cu-breadcrumb :items=\"items \" />\n \u003Cslot>\u003C/slot>\n \u003C/div>\n\u003C/template>\n\n\n\u003Cscript lang=\"ts\" setup>\nimport { useRoute } from 'vue-router';\n\nconst route = useRoute();\nconst items = useBreadcrumbItems({\n schemaOrg: true,\n});\n\u003C/script>\n\n\n### Description\n\nthis will render the breadcrumbs in a \u003Cdiv> with an aria-label, which is a violation of this rule: https://html-validate.org/rules/aria-label-misuse.html\n\n- Rule ID: aria-label-misuse\n- Category: Accessibility\n- Standards: WCAG 2.2 (A)WCAG 2.1 (A)WCAG 2.0 (A)\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n ERROR HTML validation errors found for /song/justice-genesis-1\n\ninline\n 129:21990 error \"aria-label\" cannot be used on this element aria-label-misuse\n\n✖ 1 problem (1 error, 0 warnings)\n\nMore information:\n https://html-validate.org/rules/aria-label-misuse.html\n\n```",[3182,3183],{"name":3146,"color":3147},{"name":3149,"color":3150},2649,"breadcrumb HTML validation errors","2024-11-15T08:53:33Z","https://github.com/nuxt/ui/issues/2649",0.71053696,{"description":3190,"labels":3191,"number":3193,"owner":3152,"repository":3166,"state":3154,"title":3194,"updated_at":3195,"url":3196,"score":3197},"Example: https://www.raycast.com/nhojb/brew",[3192],{"name":3163,"color":3164},673,"[Modules] Details page","2023-09-05T08:18:34Z","https://github.com/nuxt/nuxt.com/issues/673",0.71306986,{"description":3199,"labels":3200,"number":3205,"owner":3152,"repository":3153,"state":3154,"title":3206,"updated_at":3207,"url":3208,"score":3209},"### Description\n\nI am new using Nuxt UI, and I am loving it.\nI personally believe buttons look better when they are wider than taller, therefore I like to add more padding in the x axis, but I don't want to do this for each button.\n\nI am currently doing it like this:\n\n```html\n\u003CUButton\n to=\"/login\"\n size=\"xl\"\n color=\"warning\"\n variant=\"solid\"\n class=\"font-semibold px-4\"\n >\n Iniciar sesión\n \u003C/UButton>\n```\n\nbut I don't know how to add the option for all buttons.\nI tried doing this in the app.config.ts:\n\n```js\nui: {\n button: {\n slots: {\n base: 'px-4 cursor-pointer'\n },\n}\n \n```\n\nand the cursor-pointer worked, but the px-4 didn't work. Any idea on how to make this work?",[3201,3204],{"name":3202,"color":3203},"question","d876e3",{"name":3149,"color":3150},3646,"How do I change the padding of all buttons globally?","2025-03-24T01:29:59Z","https://github.com/nuxt/ui/issues/3646",0.71807766,{"description":3211,"labels":3212,"number":3218,"owner":3152,"repository":3153,"state":3154,"title":3219,"updated_at":3220,"url":3221,"score":3222},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.14.0\n- Nuxt Version: 3.16.2\n- CLI Version: 3.24.1\n- Nitro Version: 2.11.8\n- Package Manager: yarn@1.22.19\n- Builder: -\n- User Config: app, compatibilityDate, devtools, modules, css, runtimeConfig, vuefire\n- Runtime Modules: @nuxt/ui-pro@3.0.2, nuxt-vuefire@1.0.5, @pinia/nuxt@0.10.1\n- Build Modules: -\n------------------------------\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/stupefied-lucy-jmlxr4\n\n### Description\n\nTable component is not reactive. Here's a simple example where items are added and removed. The 'num items' is updating in the view. However, the table does not remove nor add items.\n\n``` vue\n\u003Ctemplate>\n {{ data.length }} num items\n \u003CUTable :data=\"data\" />\n \u003CUButton label=\"Delete\" @click=\"deleteItem\" />\n \u003CUButton label=\"Add\" @click=\"addItem\" />\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\nfunction deleteItem() {\n const randomIndex = Math.floor(Math.random() * data.value.length);\n data.value.splice(randomIndex, 1);\n}\n\nfunction addItem() {\n data.value.push({\n id: Math.floor(Math.random() * 10000).toString(),\n });\n}\n\nconst data = ref([\n {\n id: \"4600\",\n },\n {\n id: \"4599\",\n },\n {\n id: \"4598\",\n },\n {\n id: \"4597\",\n },\n {\n id: \"4596\",\n },\n]);\n\u003C/script>\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3213,3214,3215],{"name":3146,"color":3147},{"name":3149,"color":3150},{"name":3216,"color":3217},"triage","ffffff",3821,"Table is not reactive","2025-04-08T10:36:33Z","https://github.com/nuxt/ui/issues/3821",0.7198625,{"description":3224,"labels":3225,"number":3228,"owner":3152,"repository":3153,"state":3154,"title":3229,"updated_at":3230,"url":3231,"score":3232},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v20.10.0\n- Nuxt Version: 3.15.0\n- CLI Version: 3.17.2\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.15.1\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.9, @nuxt/eslint@0.7.4\n- Build Modules: -\n------------------------------\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.0.0-alpha.10\n\n### Reproduction\n\nRepo: https://github.com/Cyanhall/nuxt-ui-v3-demo/tree/main/demo3\n\nCode: https://github.com/Cyanhall/nuxt-ui-v3-demo/blob/main/demo3/app/components/SearchPalette.vue#L46\n\n### Description\n\nThe placeholder in UInput within UModal does not display.\n\n```vue\n\u003CUInput\n class=\"w-full mb-4\"\n size=\"sm\"\n icon=\"i-lucide-search\"\n placeholder=\"Search...\"\n>\n \u003Ctemplate #trailing>\n \u003CUKbd value=\"shift\" />\n \u003CUKbd value=\"G\" />\n \u003C/template>\n\u003C/UInput>\n```\n\u003Cimg width=\"496\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/be2e8457-b3ac-4b70-838b-2b2b7399c091\" />\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3226,3227],{"name":3146,"color":3147},{"name":3149,"color":3150},2977,"The placeholder in UInput within UModal does not display","2025-03-03T09:06:21Z","https://github.com/nuxt/ui/issues/2977",0.7258268,{"description":3234,"labels":3235,"number":3241,"owner":3152,"repository":3153,"state":3154,"title":3242,"updated_at":3243,"url":3244,"score":3245},"### Description\n\n\n## 🔧 Current Behavior\n\nThe `deferInputValidation` parameter in `useFormField` is currently hardcoded in the `Input` component:\n\n```ts\nconst { emitFormBlur, emitFormInput, /* ... */ } = useFormField\u003CInputProps>(props, { \n deferInputValidation: false // Hardcoded\n})\n```\n\nThis limits flexibility, as consumers of the `Input` component cannot control validation timing behavior (e.g., validate on blur vs. validate on input).\n\n## ✅ Proposed Solution\n\nMake `deferInputValidation` configurable via a component prop:\n\n1. **Pass dynamic value to `useFormField`:**\n\n```ts\nuseFormField\u003CInputProps>(props, {\n deferInputValidation: props.deferInputValidation\n})\n```\n\n2. **Update the component props interface:**\n\n```ts\ndeferInputValidation?: boolean\n```\n\n---\n\n## 💡 Use Cases\n\n- **Delayed validation** for complex, interdependent form fields \n- **Immediate validation** for sensitive or critical fields \n- Flexibility for UX patterns like **\"validate-on-blur\"** or **\"validate-as-you-type\"**\n\n---\n\n## 🔁 Alternatives Considered\n\n- **Wrapper Component**: Adds unnecessary complexity \n- **Global Form-Level Config**: Less flexible than per-field control\n\n---\n\n## 🧪 Testing Impact\n\n- Covered by existing validation tests with both `true` and `false` cases\n\n---\n\n## 📚 Documentation\n\nRequires updates to:\n\n- Component prop API \n- Form validation best practices\n\n---\n\n## ⚙️ Why This Matters\n\nThis change supports **Inversion of Control** — empowering component consumers to control validation timing based on specific UX needs.\n```\n\n### Additional context\n\n_No response_",[3236,3239,3240],{"name":3237,"color":3238},"enhancement","a2eeef",{"name":3149,"color":3150},{"name":3216,"color":3217},3810,"[UForm] Feature Request: Make deferInputValidation Configurable in useFormField","2025-04-20T15:25:42Z","https://github.com/nuxt/ui/issues/3810",0.73190445,{"description":3247,"labels":3248,"number":3252,"owner":3152,"repository":3153,"state":3154,"title":3253,"updated_at":3254,"url":3255,"score":3256},"### Description\n\nThere is currently no easy way to know what state the modal is in. Adding a `toggle` method would make life very much easier.\n\nI'm willing to make a PR\n\n### Additional context\n\n_No response_",[3249,3250,3251],{"name":3237,"color":3238},{"name":3149,"color":3150},{"name":3216,"color":3217},3720,"feat: add toogle for useOverlay","2025-04-09T15:26:14Z","https://github.com/nuxt/ui/issues/3720",0.7349074,["Reactive",3258],{},["Set"],["ShallowReactive",3261],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fdBq_XAs89XgZMBDtQ-q-8GAg9GKV-Ace0yHsGdP1eFc":-1},"/nuxt/nuxt.com/1104"]