\n \u003C/div>\n\n \u003Cdiv class=\"ml-4 flex flex-1 flex-col\">\n \u003Cdiv>\n \u003Cdiv class=\"flex justify-between text-base font-medium text-gray-900 mb-2\">\n \u003CNuxtLink :to=\"'/product/' + product.id\">{{ product.name }}\u003C/NuxtLink>\n \u003Cp class=\"ml-4\">£{{ product.selectedQuantity?.price }}\u003C/p>\n \u003C/div>\n \u003C/div>\n\n \u003Cdiv class=\"flex flex-1 flex-col md:flex-row items-end justify-between text-sm text-black gap-4\">\n \u003Cdiv class=\"w-full flex flex-col md:flex-row flex-wrap gap-2 \">\n \u003CUSelectMenu v-if=\"hasMultipleSkus(product)\" class=\"max-w-56\" v-model=\"product.selectedSku\"\n :search-input=\"false\" :label-key=\"'name'\" :items=\"product.skus\"\n @update:modelValue=\"changeSku($event as Sku, product)\">\n \u003C/USelectMenu>\n \u003Cpre>{{ product.selectedQuantity }}\u003C/pre>\n \u003CUSelectMenu v-model=\"product.selectedQuantity\" :search-input=\"false\"\n :label-key=\"'quantity'\" class=\"max-w-56\" :items=\"updatePricesWithStock(product)\"\n @update:modelValue=\"changeQuantity($event as QuantityPrice, product)\">\n \u003Ctemplate #item=\"{ item }\">\u003Cspan>{{ item.quantity }}\u003C/span>\u003Cspan\n v-if=\"item.disabled\">Out of\n stock\u003C/span>\u003C/template>\n \u003C/USelectMenu>\n \u003C/div>\n \u003Cdiv class=\"flex\">\n \u003Cbutton type=\"button\" class=\"font-medium text-primary-500 hover:text-primary-600\"\n @click=\"basketStore.remove(product.rid)\">Remove\u003C/button>\n \u003C/div>\n\n \u003C/div>\n\n \u003C/div>\n \u003C/li>\n\n \u003C/ul>\n \u003C/div>\n\u003C/template>\n\u003Cscript setup lang=\"ts\">\nimport type { Product, Sku, QuantityPrice } from '../../types';\n\nfunction changeSku(sku: Sku, item: Product) {\n\n}\n\nfunction hasMultipleSkus(item: Product): boolean {\n\n}\n\n\nfunction changeQuantity(quantity: QuantityPrice, item: Product) {\n\n}\n\n// Helper function to map prices and add \"disabled\" property - see other \nconst updatePricesWithStock = (item: any) => {\n return item.selectedSku?.prices.map((price: QuantityPrice) => ({\n ...price,\n disabled: !item?.onDemand && price.quantity > item.selectedSku?.stock\n }));\n};\n\n\n\u003C/script>\n```\n\n### Description\n\n_(Not sure whether to include this issue in Nuxt or Nuxt UI)_\n\nI have a base component that uses a selectMenu with an array. In Nuxt 3.17.6 with compatibiltyVersion: 4 set, the SelectMenu works as expected. When upgrading to nuxt 4 the label key no longer works. I'll attach screenshots and the code is in the reproduction section.\n**Nuxt 3.17.6**\n\u003Cimg width=\"736\" height=\"216\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/04967fa3-d156-46e2-b74d-f060ec68fcc4\" />\n\n**Nuxt 4**\n\u003Cimg width=\"751\" height=\"220\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/8ccf4caf-12f1-46d0-beda-9ebea3b1eee3\" />\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3198,3199,3200,3201],{"name":3140,"color":3141},{"name":3183,"color":3184},{"name":3143,"color":3144},{"name":3146,"color":3147},4627,"SelectMenu | Label Key not working correctly with Nuxt 4?","2025-07-30T09:17:46Z","https://github.com/nuxt/ui/issues/4627",0.6864312,{"description":3208,"labels":3209,"number":3214,"owner":3149,"repository":3150,"state":3190,"title":3215,"updated_at":3216,"url":3217,"score":3218},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.14.0\n- Nuxt Version: 3.16.1\n- CLI Version: 3.23.1\n- Nitro Version: 2.11.8\n- Package Manager: pnpm@10.7.1\n- Builder: -\n- User Config: modules, plugins, devtools, css, runtimeConfig, compatibilityDate, eslint\n- Runtime Modules: @nuxt/ui@3.0.2, @nuxt/eslint@1.2.0\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://github.com/user-attachments/assets/96d306b8-967d-4d16-841d-bffe9d6b0fa0\n\n### Description\n\nSelect component no longer receives focus properly, which breaks keyboard navigation (e.g. using Tab or arrow keys to open and navigate the options). \n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3210,3211,3212,3213],{"name":3140,"color":3141},{"name":3183,"color":3184},{"name":3143,"color":3144},{"name":3146,"color":3147},3791,"Focus no longer works on Select component","2025-04-30T13:25:54Z","https://github.com/nuxt/ui/issues/3791",0.69463754,{"description":3220,"labels":3221,"number":3225,"owner":3149,"repository":3150,"state":3190,"title":3226,"updated_at":3227,"url":3228,"score":3229},"### Environment\n\n- Operating System: `Darwin`\n- Node Version: `v22.13.0`\n- Nuxt Version: `3.16.2`\n- CLI Version: `3.24.1`\n- Nitro Version: `2.11.9`\n- Package Manager: `pnpm@10.8.1`\n- Builder: `-`\n- User Config: `modules`, `devtools`, `css`, `site`, `future`, `compatibilityDate`, `echarts`, `eslint`, `fonts`, `icon`, `sitemap`\n- Runtime Modules: `@nuxtjs/sitemap@7.2.10`, `@nuxt/content@3.4.0`, `@nuxt/eslint@1.3.0`, `@nuxt/ui-pro@3.0.2`, `@vueuse/nuxt@13.1.0`, `nuxt-echarts@0.3.0`\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/peaceful-elbakyan-3ddsxd\n\n### Description\n\nMy understanding is that the onSelect event of SelectMenu should be consistent with the DropdownMenu component, but in reality, it is not.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3222,3223,3224],{"name":3140,"color":3141},{"name":3143,"color":3144},{"name":3146,"color":3147},3978,"The onSelect event of the SelectMenu component was not triggered","2025-05-05T15:20:55Z","https://github.com/nuxt/ui/issues/3978",0.69640714,{"description":3231,"labels":3232,"number":3235,"owner":3149,"repository":3150,"state":3190,"title":3236,"updated_at":3237,"url":3238,"score":3239},"### Environment\n\n- Operating System: Linux\n- Node Version: v20.12.0\n- Nuxt Version: -\n- CLI Version: 3.27.0\n- Nitro Version: -\n- Package Manager: pnpm@8.15.6\n- Builder: -\n- User Config: -\n- Runtime Modules: -\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nVue, Nuxt probably too\n\n### Version\n\nv3.3.0\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/autumn-fog-8l524s\n\n### Description\n\nWhen nesting `Select` or `InputMenu` inside a `FormField`, clicking the label does not focus/open the input. Interestingly, it does work as expected for `SelectMenu`. See reproduction for examples.\n",[3233,3234],{"name":3140,"color":3141},{"name":3143,"color":3144},4690,"[Select/InputMenu]: Focus via label not working inside FormField","2025-08-14T10:22:07Z","https://github.com/nuxt/ui/issues/4690",0.70488584,{"description":3241,"labels":3242,"number":3249,"owner":3149,"repository":3150,"state":3190,"title":3250,"updated_at":3251,"url":3252,"score":3253},"### 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.9\n- Package Manager: bun@1.2.8\n- Builder: -\n- User Config: compatibilityDate, devtools, modules, css\n- Runtime Modules: @nuxt/eslint@1.3.0, @nuxt/fonts@0.11.1, @nuxt/icon@1.12.0, @nuxt/ui@3.0.2, @pinia/nuxt@0.11.0\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\nI tried running this code from `playground-vue`:\n\n```\n\u003CUModal>\n \u003CUButton>Open\u003C/UButton>\n \u003Ctemplate #body>\n \u003CUSelectMenu :items=\"items\" :search-input=\"{ autofocus: false }\" />\n \u003C/template>\n\u003C/UModal>\n```\n\n\n### Description\n\nselect menu's search input always autofocus inside modal, even when the autofocus is set to false.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3243,3244,3245,3246,3247],{"name":3140,"color":3141},{"name":3143,"color":3144},{"name":3146,"color":3147},{"name":3187,"color":3188},{"name":3248,"color":3188},"stale",3933,"SelectMenu's autofocus doesn't work inside Modal","2025-08-12T02:12:37Z","https://github.com/nuxt/ui/issues/3933",0.7063459,{"description":3255,"labels":3256,"number":3261,"owner":3149,"repository":3150,"state":3190,"title":3262,"updated_at":3263,"url":3264,"score":3265},"### Environment\r\n\r\n- Operating System: Darwin\r\n- Node Version: v20.10.0\r\n- Nuxt Version: 3.12.2\r\n- CLI Version: 3.12.0\r\n- Nitro Version: 2.9.6\r\n- Package Manager: pnpm@9.6.0\r\n- Builder: -\r\n- User Config: devtools, vite, routeRules, app, css, imports, runtimeConfig, modules, auth, i18n, colorMode\r\n- Runtime Modules: @nuxtjs/i18n@8.0.0, @sidebase/nuxt-auth@0.6.4, @vueuse/nuxt@10.11.0\r\n- Build Modules: -\r\n\r\n### Version\r\n\r\n2.18.1\r\n\r\n### Reproduction\r\n\r\n[https://stackblitz.com/edit/nuxt-ui-ubowv1?file=app.vue](https://stackblitz.com/edit/nuxt-ui-ubowv1?file=app.vue)\r\n\r\n### Description\r\n\r\nI'm trying to clear the item selected in a selectmenu using the `#trailling` slot. But it doesn't matter, it opens the menu instead. I've tried applying the `.stop` modifier but it's the same thing.\r\n\r\nIs this a bug or am I doing something wrong?\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[3257,3258,3259,3260],{"name":3140,"color":3141},{"name":3146,"color":3147},{"name":3187,"color":3188},{"name":3248,"color":3188},1987,"[Bug] Select/SelectMenu popper open when clicking #trailing","2025-06-19T02:12:14Z","https://github.com/nuxt/ui/issues/1987",0.7065347,["Reactive",3267],{},["Set"],["ShallowReactive",3270],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$f2B86KXEgGp3Ivxew9gXkTzDeRjiLVintKjN4nb6wJpM":-1},"/nuxt/ui/3583"]