\n```\n\n### Will results something like this\n```html\n\u003Cdiv class=\"... root-test base-test\">\n ...\n \u003Cinput class=\"...\" />\n\u003C/div>\n```\n\n### Description\n\nWhen applying themes in `app.config.ts`, both **UInputTags** and **UInputMenu (multiple)** share the same weird behaviour compared with other components, where the class applied to `base` part of the component are applied to `root` part of the component.\n\n### Expected Behaviour\nThe applied class on `base` should be applied to the `\u003Cinput />`, not the `root` part of the component which is the outer `\u003Cdiv />` just like other input components such as **UInput**, **UInputNumber**, or **UTextarea**.\n\nCorrect me if I'm wrong if this are intended, thank you!\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3154,3155,3156],{"name":3135,"color":3136},{"name":3138,"color":3139},{"name":3141,"color":3142},4530,"[UInputTags, UInputMenu] Theming behaviour issues","2025-07-15T17:50:02Z","https://github.com/nuxt/ui/issues/4530",0.7043706,{"description":3163,"labels":3164,"number":3168,"owner":3144,"repository":3145,"state":3146,"title":3169,"updated_at":3170,"url":3171,"score":3172},"### Environment\n\n- Operating System: Windows_NT\n- Node Version: v22.12.0\n- Nuxt Version: 3.17.4\n- CLI Version: 3.25.1\n- Nitro Version: 2.11.12\n- Package Manager: npm@10.9.0\n- User Config: compatibilityDate, devtools, ssr, future, app, css, modules, build, vite, eslint, i18n, runtimeConfig, experimental, imports\n- Runtime Modules: @nuxt/eslint@1.4.1, @nuxt/test-utils@3.19.1, @nuxt/ui@3.2.0, @nuxtjs/i18n@9.5.5\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.2.0\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/nuxt-ui3-n3sxks\n\n### Description\n\nThe UNavigationMenu component doesn't have built-in support for generating localized routes when using @nuxtjs/i18n. When using locale prefixes (e.g., /en/dashboard, /ar/dashboard), the navigation items don't automatically adapt to the current locale.\n\n### Expected behavior:\nThe component should automatically handle locale prefixes when @nuxtjs/i18n is configured, similar to how \u003CNuxtLink> works with localePath().\n\n### Proposed solution:\nAuto-detect @nuxtjs/i18n configuration\nApply localePath() internally to to props\nAdd optional localized prop for explicit control\nMaintain backward compatibility\n\nThis would eliminate boilerplate code and improve DX for internationalized applications using Nuxt UI navigation components.\n\n\n### Additional context\n\n**Current Workaround Required:**\n```vue\n\u003Cscript setup>\nconst { locale } = useI18n()\n\n// Manual helper function needed\nconst getLocalizedRoute = (path) => {\n if (locale.value === 'ar') {\n return `/example/ar${path}`\n }\n return `/example${path}`\n}\n\nconst sidebarItems = computed(() => [\n [{\n label: 'Dashboard',\n icon: 'i-lucide-home',\n to: getLocalizedRoute('/dashboard/'), // Manual localization\n }]\n])\n\u003C/script>\n```\n\n### Logs\n\n```shell-script\n\n```",[3165,3166,3167],{"name":3135,"color":3136},{"name":3138,"color":3139},{"name":3141,"color":3142},4465,"UNavigationMenu lacks built-in support for localized routes (i18n)","2025-07-06T14:40:52Z","https://github.com/nuxt/ui/issues/4465",0.7125268,{"description":3174,"labels":3175,"number":3179,"owner":3144,"repository":3145,"state":3146,"title":3180,"updated_at":3181,"url":3182,"score":3183},"### Environment\n\n- Operating System: Windows_NT\n- Node Version: v22.11.0\n- Nuxt Version: 4.0.3\n- CLI Version: 3.28.0\n- Nitro Version: 2.12.4\n- Package Manager: npm@10.9.0\n- Builder: -\n- User Config: compatibilityDate, devtools, modules, css, ui\n- Runtime Modules: @nuxt/ui@3.3.2, @nuxt/eslint@1.8.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.3.2\n\n### Reproduction\n\nI attempted to reproduce the issue using the official Nuxt UI CodeSandbox template, but it seems that the `class` property is not applied at all in that environment. Therefore, the bug cannot be reproduced there.\n\nHowever, in my local environment (Nuxt v4.0.3 / Nuxt UI v3.3.2), the issue is consistently reproducible. \nPlease refer to the attached screenshot for visual confirmation.\n\nHere is the code I used:\n\n```vue\n\u003CUInputMenu\n :items=\"[\n {\n label: 'Blue',\n class: 'text-blue-500!',\n },\n {\n label: 'Red',\n class: 'text-red-500!',\n },\n {\n label: 'Green',\n class: 'text-green-500!',\n },\n ]\"\n/>\n```\n\n\n### Description\n\nWhen using `UInputMenu`, each item can be assigned a custom class. However, after filtering, the class assignment seems to mismatch. For example, the \"Green\" item may be displayed in red color.\n\n### Additional context\n\n- Initial state (before filtering): \n\u003Cimg width=\"328\" height=\"243\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/f556d5b4-554e-4328-98f1-e3bb037504bf\" />\n\n- After filtering with \"r\": \n\u003Cimg width=\"338\" height=\"206\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/bbed6c9b-2eae-4c55-9d68-2991f64c26ca\" />\n\nIn the filtered state, the \"Green\" item is incorrectly displayed in red.\n\n### Logs\n\n```shell-script\n\n```",[3176,3177,3178],{"name":3135,"color":3136},{"name":3138,"color":3139},{"name":3141,"color":3142},4752,"UInputMenu item class mismatch after filtering","2025-08-15T01:57:20Z","https://github.com/nuxt/ui/issues/4752",0.7160707,{"description":3185,"labels":3186,"number":3189,"owner":3144,"repository":3145,"state":3190,"title":3191,"updated_at":3192,"url":3193,"score":3194},"### Environment\n\n- Operating System: Linux\n- Node Version: v22.4.0\n- Nuxt Version: 3.14.1592\n- CLI Version: 3.15.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.14.2\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.9, nuxt-auth-sanctum@0.5.2, @vueuse/nuxt@11.3.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.14.1592\n\n### Reproduction\n\n```vue\n\u003Cscript setup lang=\"ts\"\nconst placeItems = ref([{ id: 1, name: 'Place 1' }, { id: 2, name: 'Place 2' }])\n\u003C/script>\n\n\u003Ctemplate>\n\u003CUInputMenu :items=\"placeItems\"\n value-key=\"id\"\n label-key=\"name\"\n class=\"w-full mb-4\"\n multiple />\n\n\u003CUInputMenu :items=\"placeItems\"\n value-key=\"id\"\n label-key=\"name\"\n class=\"w-full\"/>\n\u003C/template>\n```\n\n### Description\nIn my opinion, the border, when focusing, should have the same color as when the parameter is absent `multiple`.\nWith white border looks bad :D\nhttps://skr.sh/vSqjqLYGgHO",[3187,3188],{"name":3135,"color":3136},{"name":3138,"color":3139},2742,"closed","UInputMenu has wrong border when focused in multiple mode","2024-12-05T13:48:56Z","https://github.com/nuxt/ui/issues/2742",0.66797525,{"description":3196,"labels":3197,"number":3201,"owner":3144,"repository":3145,"state":3190,"title":3202,"updated_at":3203,"url":3204,"score":3205},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v22.13.1\n- Nuxt Version: 3.17.3\n- CLI Version: 3.25.1\n- Nitro Version: 2.11.12\n- Package Manager: npm@10.9.2\n- Builder: -\n- User Config: hooks, app, runtimeConfig, supabase, routeRules, sitemap, site, compatibilityDate, devtools, modules, css, ui\n- Runtime Modules: @nuxt/ui@3.1.2, @pinia/nuxt@0.11.0, @nuxtjs/supabase@1.5.1, @nuxtjs/seo@3.0.3, @storyblok/nuxt@6.2.4\n- Build Modules: -\n------------------------------\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.1.2\n\n### Reproduction\n\nchange the border color(I assume should be this variable: --ui-border) in your project to red or blue and check if this color is applied when using only the classes: `border` or `border-b` without specifying the color.\n\n### Description\n\nI want to set the default border color, by default is very dark.\n\nI found that `--ui-border` variable is not used in the border style, maybe I could be wrong.\n\n\u003Cimg width=\"374\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/7f25806c-f5ea-43a1-a2a3-095d71448d43\" />\n\nthis is how the borders are styled in my case, no `--ui-border`\n\n\u003Cimg width=\"542\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/6bb3138e-36e5-46cb-9930-92b608811fe0\" />\n\n\u003Cimg width=\"515\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/16ad3bc6-a8a9-4391-a0c5-542ff3f58121\" />\n\nplease help, \n\nthank you\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3198,3199,3200],{"name":3135,"color":3136},{"name":3138,"color":3139},{"name":3141,"color":3142},4218,"Can't set the default border color","2025-05-26T08:34:37Z","https://github.com/nuxt/ui/issues/4218",0.6842973,{"description":3207,"labels":3208,"number":3214,"owner":3144,"repository":3145,"state":3190,"title":3215,"updated_at":3216,"url":3217,"score":3218},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.11.1\n- Nuxt Version: 3.16.2\n- CLI Version: 3.25.1\n- Nitro Version: 2.11.12\n- Package Manager: npm@10.2.4\n- Builder: -\n- User Config: css, compatibilityDate, devtools, future, modules, runtimeConfig, ssr, typescript\n- Runtime Modules: @nuxt/eslint@1.4.0, @nuxt/fonts@0.11.4, @nuxt/ui-pro@3.1.2, @pinia/nuxt@0.5.5, @vueuse/nuxt@10.11.1, nuxt-auth-utils@0.5.20, nuxt-authorization@0.3.4\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.1.2\n\n### Reproduction\n\nJust use the code of https://github.com/nuxt-ui-pro/dashboard/blob/main/app/pages/settings.vue and add a child to one of the links used for the UNavigationMenu. Like :\n````\n{\n label: \"General\",\n icon: \"i-lucide-user\",\n to: \"/settings\",\n children: [\n {\n label: \"Hello\",\n icon: \"i-lucide-book-open\",\n },\n ],\n exact: true,\n },\n````\n\n### Description\n\nIt seems wrapping the UNavigationMenu component in UDashboardToolbar will cause the UNavigationMenu's links children dropdown to not appear or be hidden.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3209,3210,3211],{"name":3135,"color":3136},{"name":3138,"color":3139},{"name":3212,"color":3213},"nuxt/ui-pro","00dc82",4177,"UNavigationMenu item children not visible when wrapped in UDashboardToolbar","2025-05-23T12:23:17Z","https://github.com/nuxt/ui/issues/4177",0.68545437,{"description":3220,"labels":3221,"number":3224,"owner":3144,"repository":3145,"state":3190,"title":3225,"updated_at":3226,"url":3227,"score":3228},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.10.0\n- Nuxt Version: 3.15.4\n- CLI Version: 3.21.1\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.15.0\n- Builder: -\n- User Config: compatibilityDate, future, devtools, modules, css\n- Runtime Modules: @nuxt/ui-pro@3.0.0-alpha.12, @nuxt/content@3.1.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.12\n\n### Reproduction\n\n```vue\n\u003Cscript setup>\nconst links = ref([\n {\n label: 'Components',\n to: '/components',\n active: route.path.startsWith('/components'),\n children: [\n {\n label: 'Sections',\n to: '/components/sections',\n icon: 'i-lucide-lightbulb',\n description:\n 'Sections are used to create a layout for your components.',\n active: route.path.startsWith('/components/sections')\n },\n {\n label: 'Snippets',\n to: '/components/snippets',\n icon: 'i-lucide-lightbulb',\n description:\n 'Snippets are used to create a layout for your components.',\n active: route.path.startsWith('/components/snippets')\n }\n ]\n }\n]);\n\u003C/script>\n\n\u003Ctemplate>\n \u003CUHeader>\n \u003CUNavigationMenu :items=\"links\" />\n \u003C/UHeader>\n\u003C/template>\n```\n\n### Description\n\nThe width of the menu depends on the amount of items it contains. When you have to few items, the width will be to small for the horizontal dropdown.\n\nNormally a dropdown is not related to the width of the menu, but in case of this animation I'm not sure enough to say how that could be fixed if the menu was not the relative parent.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3222,3223],{"name":3135,"color":3136},{"name":3138,"color":3139},3268,"`UNavigationMenu` dropdown has wrong relative parent","2025-05-23T13:02:31Z","https://github.com/nuxt/ui/issues/3268",0.6868339,{"description":3230,"labels":3231,"number":3234,"owner":3144,"repository":3145,"state":3190,"title":3235,"updated_at":3236,"url":3237,"score":3238},"### Environment\n\nOperating System: Windows 11\nNode Version: v22.14.0\nNuxt Version: 3.15.4\nCLI Version: 3.13.2\nNitro Version: 2.10.4\nPackage Manager: npm@11.1.0\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.12\n\n### Reproduction\n\n.\n\n### Description\n\nHi\nWhen we use the arrow in the DropdownMenu component, a border is added to the last item. Apparently, this is because the arrow element is added at the end of the items groups in this component.\n\n\n\n\n\nI hope I was able to tell you what I meant. It's nothing special, but it would be great if it could be fixed. 🙄\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3232,3233],{"name":3135,"color":3136},{"name":3138,"color":3139},3315,"arrow causes appear border in the last item of DropdownMenu","2025-05-23T15:41:53Z","https://github.com/nuxt/ui/issues/3315",0.69286555,{"description":3240,"labels":3241,"number":3245,"owner":3144,"repository":3145,"state":3190,"title":3246,"updated_at":3247,"url":3248,"score":3249},"### Environment\n\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.9\n- Package Manager: bun@1.2.9\n- Builder: -\n- User Config: ssr, imports, devtools, experimental, future, compatibilityDate, alias, runtimeConfig, devServer, app, css, modules, build, hooks, dayjs, ui, typescript\n- Runtime Modules: @nuxt/eslint@1.3.0, @vueuse/nuxt@13.1.0, @nuxt/test-utils/module@3.17.2, dayjs-nuxt@2.1.11, nuxt-svgo@4.0.17, @nuxt/ui-pro@3.1.0, @pinia/nuxt@0.11.0, @pinia/colada-nuxt@0.1.1, @nuxt/image@1.10.0\n- Build Modules: -\n```\n\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.1.0\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/empty-fast-5xtcmy?workspaceId=ws_SD2P6X4ufyWkm2P3aqoQA6\n\n### Description\n\nbetween version 3.0.2 and 3.1.0 the content container for the menu items is no longer filling the width.\n\n### Additional context\n\n__no response__\n\n### Logs\n\n```shell-script\n\n```",[3242,3243,3244],{"name":3135,"color":3136},{"name":3138,"color":3139},{"name":3141,"color":3142},3987,"[NavigationMenu] Regression - Update","2025-05-02T09:52:45Z","https://github.com/nuxt/ui/issues/3987",0.69918096,["Reactive",3251],{},["Set"],["ShallowReactive",3254],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fC3ZUHSFngBH2bvCcnuBhYmN0VibcmLH0GjRgG6hnr1E":-1},"/nuxt/ui/2766"]