\n```\n\n**Possible solutions:**\n\n1. Make a new label prop that accepts a function, so values can be compound:\n\n```ts\n\u003CUSelectMenu :label=\"(item) => item.firstName + ' ' + item.lastName\"\n```\n\n2. Optionally make a slot to customize the labels: \n```vue\n\u003CUSelectMenu>\n \u003Ctemplate #label=\"{ item }\">\n {{ item.firstName }} \u003Cspan class=\"text-highlighted\">{{ item.lastName}}\u003C/span>\n \u003Cspan class=\"text-xs text-muted\">#{{ item.customerId }}\u003C/span>\n \u003C/template>\n\u003C/USelectMenu>\n```\n\nP.S. the prop `labelKey` is not documented https://ui.nuxt.com/components/select-menu#props\n",[3018,3021,3024],{"name":3019,"color":3020},"enhancement","a2eeef",{"name":3022,"color":3023},"v3","49DCB8",{"name":3025,"color":3026},"triage","ffffff",4581,"nuxt","ui","open","SelectMenu: Compound label","2025-07-23T16:38:06Z","https://github.com/nuxt/ui/issues/4581",0.7572035,{"description":3036,"labels":3037,"number":2026,"owner":3028,"repository":3039,"state":3030,"title":3040,"updated_at":3041,"url":3042,"score":3043},"fontshare, for example, exposes this metadata which we can use to create font fallback metrics",[3038],{"name":3019,"color":3020},"fonts","allow providers to provide font metrics","2024-05-01T17:17:44Z","https://github.com/nuxt/fonts/issues/9",0.7748122,{"description":3045,"labels":3046,"number":3050,"owner":3028,"repository":3029,"state":3030,"title":3051,"updated_at":3052,"url":3053,"score":3054},"### Description\n\nThis feature request proposes that the InputNumber component be enhanced with leading and trailing slot support. \n\nCurrently, components such as **Input**, **InputMenu**, **Select**, and **SelectMenu** already offer these slots for inserting custom content. For consistency across the UI library and to provide developers with a uniform customization experience, it is imperative that InputNumber is updated to include both leading and trailing slots. \n\n### Additional context\n\n_No response_",[3047,3048,3049],{"name":3019,"color":3020},{"name":3022,"color":3023},{"name":3025,"color":3026},4201,"[InputNumber] Add support for leading & trailing slots","2025-05-21T13:07:28Z","https://github.com/nuxt/ui/issues/4201",0.77853525,{"description":3056,"labels":3057,"number":3061,"owner":3028,"repository":3029,"state":3062,"title":3063,"updated_at":3064,"url":3065,"score":3066},"### Description\n\nVisually equal `UNavigationMenu` has a `badge` prop but `UTabs` is missing this feature\n\n\u003Cimg width=\"685\" height=\"55\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/889b4d58-fecf-4358-9501-8adfa8609133\" />\n\n### Additional context\n\nOriginally implemented within #2627 but missing in v3\n\nYes it can be done be using a slot, but it would provide great DX to have the prop. ",[3058,3059,3060],{"name":3019,"color":3020},{"name":3022,"color":3023},{"name":3025,"color":3026},4548,"closed","Add badge option to UTabs","2025-07-21T14:55:28Z","https://github.com/nuxt/ui/issues/4548",0.71928257,{"description":3068,"labels":3069,"number":3079,"owner":3028,"repository":3029,"state":3062,"title":3080,"updated_at":3081,"url":3082,"score":3083},"### Environment\n\n- Operating System: Windows_NT\n- Node Version: v22.8.0\n- Nuxt Version: 3.13.2\n- CLI Version: 3.13.2\n- Nitro Version: 2.9.7\n- Package Manager: yarn@1.22.22\n- Builder: -\n- User Config: modules, plugins, css, colorMode, tiptap, runtimeConfig, nitro, routeRules, compatibilityDate\n- Runtime Modules: @nuxt/ui@2.20.0, @pinia/nuxt@0.5.4, @vueuse/nuxt@11.1.0, nuxt-tiptap-editor@2.0.0\n- Build Modules: -\n\n### Version\n\nv2.20.0\n\n### Reproduction\n\n```\n\u003Cscript setup lang=\"ts\">\nenum DiscountType {\n Fixed = 0,\n Percentage = 1\n}\n\nconst types = [\n {\n label: \"€\",\n value: DiscountType.Fixed\n },\n {\n label: \"%\",\n value: DiscountType.Percentage\n }\n]\nconst type = ref\u003CDiscountType>(DiscountType.Fixed)\n\u003C/script>\n\n\u003Ctemplate>\n \u003CUSelectMenu v-model=\"type\" :options=\"types\" value-attribute=\"value\" />\n\u003C/template>\n```\n\nSelectMenu does not display the label associated to the falsy value \"0\":\n\n\nThe list is populated with both values:\n\n\nThe label associated to the truthy value \"1\" is displayed as expected:\n\n\n### Description\n\nAll falsy values are not displayed anymore since v2.20.0 due to the rework of the computed `label` in the SelectMenu component.\n\nHere is the definition of this computed in `/src/runtime/components/form/SelectMenu.vue`:\n```\nconst label = computed(() => {\n if (!props.modelValue) return null\n\n if (Array.isArray(props.modelValue) && props.modelValue.length) {\n return `${props.modelValue.length} selected`\n } else if (['string', 'number'].includes(typeof props.modelValue)) {\n return props.valueAttribute ? accessor(selected.value, props.optionAttribute) : props.modelValue\n }\n\n return accessor(props.modelValue as Record\u003Cstring, any>, props.optionAttribute)\n})\n```\n\n**The component should treat `0`, `\"\"` and `false` as \"acceptable\" labelled values.**\n\nI believe the first condition should be either :\n`if(props.modelValue == null) return null` \nOr:\n`if(props.modelValue === null || props.modelValue === undefined) return null` \n\n### Additional context\n\nI will try to find some time to create a pull request if this is accepted as an issue. Not sure I can manage to do it short-term though.\n\n### Logs\n\n```shell-script\n\n```",[3070,3073,3074,3077],{"name":3071,"color":3072},"bug","d73a4a",{"name":3025,"color":3026},{"name":3075,"color":3076},"closed-by-bot","ededed",{"name":3078,"color":3076},"stale",3132,"SelectMenu label not displayed for falsy values","2025-06-18T09:02:30Z","https://github.com/nuxt/ui/issues/3132",0.74568456,{"description":3085,"labels":3086,"number":3090,"owner":3028,"repository":3029,"state":3062,"title":3091,"updated_at":3092,"url":3093,"score":3094},"### Description\n\nAs the title says, I think it would be nice to introduce a prop named `square` (like the one for the `Button` component) to be able to have a squared badge for those times where you have only the `icon` and not a label.\n\nCan I get this assigned? I would like to open a PR about this :)\n\n### Additional context\n\n_No response_",[3087,3088,3089],{"name":3019,"color":3020},{"name":3022,"color":3023},{"name":3025,"color":3026},4006,"[Badge] introduce prop `square`","2025-05-13T12:44:24Z","https://github.com/nuxt/ui/issues/4006",0.75231,{"description":3096,"labels":3097,"number":3100,"owner":3028,"repository":3029,"state":3062,"title":3101,"updated_at":3102,"url":3103,"score":3104},"### Description\n\nUSelect displays the label of the selected value. It might be interesting to add a slot to display another key when item is an object instead of the chosen label for some use case.\n\nMy own use case is picking the language :\n\n```\nconst items = [\n { value: 'en', label: 'English' },\n { value: 'fr', label: 'Français' },\n (...)\n]\n```\n\nMy open selection would display flags and labels, but once selected, the component would only display the value ('en' or 'fr' or ...). Could be the icon as well.\n\nProposal :\n\nselectLabelKey : When items is an array of objects, select the field to use as the label for the picked value on the base component (instead of labelKey)\n\n### Additional context\n\n_No response_",[3098,3099],{"name":3019,"color":3020},{"name":3022,"color":3023},4157,"USelect base text display","2025-05-23T12:25:54Z","https://github.com/nuxt/ui/issues/4157",0.75411755,{"description":3106,"labels":3107,"number":3113,"owner":3028,"repository":3114,"state":3062,"title":3115,"updated_at":3116,"url":3117,"score":3118},"Update [Webreinvent partner page](https://nuxt.com/support/agencies/webreinvent) with content below :\n\nWebReinvent has 12+ years of experience building software and a team of 50+ software professionals including software developers, UI/UX designers, testers, DevOps, project managers, etc. The team is well-versed in the Nuxt ecosystem and has delivered multiple high-performance web apps, dashboards, real-time apps, multi-tenant SaaS applications, etc.\n\nWe are one of the most process-driven companies and we love to follow industry standards. Some of them are managing git repo, code review/audits, deploying new releases via CI/CD, automated software testing, maintaining detailed technical documentation, application performance monitoring, etc. We have been delivering MVP to enterprise-level software products from startup to MSME.\n\nContact us to build your MVP fast or migrate your legacy software to Nuxt or maintain your existing software or scale your software to the enterprise level. We're here to help.\n",[3108,3110],{"name":3019,"color":3109},"1ad6ff",{"name":3111,"color":3112},"marketing","f5c828",1156,"nuxt.com","Update Webreinvent partner page","2023-06-06T12:14:42Z","https://github.com/nuxt/nuxt.com/issues/1156",0.7553566,{"description":3120,"labels":3121,"number":3125,"owner":3028,"repository":3028,"state":3062,"title":3126,"updated_at":3127,"url":3128,"score":3129},"### Environment\n\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v20.14.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: pnpm@9.7.1\r\n- Builder: -\r\n- User Config: runtimeConfig, extends, modules, ui, colorMode, routeRules, devtools, typescript, future, eslint, nitro, i18n, compatibilityDate\r\n- Runtime Modules: @nuxt/eslint@0.5.0, @nuxt/fonts@0.7.1, @nuxt/ui@2.18.4, @vueuse/nuxt@10.11.0, @nuxtjs/i18n@8.5.0\r\n- Build Modules: -\r\n------------------------------\r\n\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-u6tm1b?file=app.vue\n\n### Describe the bug\n\nWhen using a `v-model` prop with some initial object values (such as fetched already selected data from backend), the `\u003CUSelectMenu>` component doesn't show these as selected and seems to ignore them completely.\r\n\r\nEven when selecting the same objects again, it just seems to add them to the array and disregard anything, that was there previously.\n\n### Additional context\n\nThe behaviour changes when setting the `by` prop. In my case, I set it to `id`, after which I can see the object as selected, **but only** in the dropdown.\r\nThe button itself still shows `0 selected`.\n\n### Logs\n\n_No response_",[3122],{"name":3123,"color":3124},"pending triage","E99695",28733,"SelectMenu initial object values","2024-08-28T03:27:34Z","https://github.com/nuxt/nuxt/issues/28733",0.75607437,{"description":3131,"labels":3132,"number":3136,"owner":3028,"repository":3029,"state":3062,"title":3137,"updated_at":3138,"url":3139,"score":3140},"### Description\n\nI’ve been trying to display an avatar with a chip inside a `UCommandPalette` item (and `UButton`, …), but it looks like this use case isn't currently supported. \n\n### Additional context\n\n_No response_",[3133,3134,3135],{"name":3019,"color":3020},{"name":3022,"color":3023},{"name":3025,"color":3026},3827,"[UCommandPalette] Support for avatars with chips in `UCommandPalette` items (and `UButton`, …)","2025-05-28T10:46:31Z","https://github.com/nuxt/ui/issues/3827",0.75711036,["Reactive",3142],{},["Set"],["ShallowReactive",3145],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fcA0050hTEexACJYF2LvvVBYxKZCcIwHg6OGPfOwqDGk":-1},"/nuxt/ui/1088"]