\r\n \u003C/div>\r\n\u003C/template>\r\n```\r\n```shell-script\r\nTS2322: Type 'string | null | undefined' is not assignable to type 'string | number | undefined'.\r\n```\r\n```html\r\n\u003Cscript setup lang=\"ts\">\r\nconst value = ref\u003Cboolean|undefined>();\r\nconst options = [\r\n {\r\n label: 'Yes',\r\n value: true\r\n },\r\n {\r\n label: 'No',\r\n value: false\r\n },\r\n {\r\n label: 'None selected',\r\n value: undefined\r\n }\r\n];\r\n\u003C/script>\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003CUSelectMenu\r\n :options=\"options\"\r\n v-model=\"value\"\r\n value-attribute=\"value\" option-attribute=\"label\"\r\n />\r\n \u003C/div>\r\n\u003C/template>\r\n```\r\n```shell-script\r\nTS2322: Type 'boolean | undefined' is not assignable to type 'string | number | Record\u003Cstring, any> | unknown[] | undefined'.\r\n```\r\n\r\n### Additional context\r\n\r\n\r\n### Logs\r\n\r\n```shell-script\r\napp.vue:14:15 - error TS2322: Type 'string | null | undefined' is not assignable to type 'string | number | undefined'.\r\n\r\n14 \u003CUInput v-model.trim=\"inputValue\" />\r\n ~~~~~~~~~~\r\n\r\n node_modules/@nuxt/ui/dist/runtime/components/forms/Input.vue.d.ts:244:5\r\n 244 modelValue: string | number;\r\n ~~~~~~~~~~\r\n The expected type comes from property 'modelValue' which is declared here on type 'Partial\u003C{ size: InputSize; ui: any; id: string; icon: string; color: any; type: string; class: any; name: string; modelValue: string | number; leading: boolean; variant: InputVariant; ... 12 more ...; modelModifiers: { ...; }; }> & Omit\u003C...> & Record\u003C...>'\r\n\r\n\r\nFound 1 error in app.vue:14\r\n```\r\n",[2936,2937,2940],{"name":2904,"color":2905},{"name":2938,"color":2939},"closed-by-bot","ededed",{"name":2941,"color":2939},"stale","closed","Unable to use boolean values with USelectMenu or null with UInput","2025-06-19T02:12:37Z","https://github.com/nuxt/ui/issues/1710",0.67911124,{"description":2948,"labels":2949,"number":2953,"owner":2913,"repository":2913,"state":2942,"title":2954,"updated_at":2955,"url":2956,"score":2957},"### 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_",[2950],{"name":2951,"color":2952},"pending triage","E99695",28733,"SelectMenu initial object values","2024-08-28T03:27:34Z","https://github.com/nuxt/nuxt/issues/28733",0.6857134,{"description":2959,"labels":2960,"number":2965,"owner":2913,"repository":2914,"state":2942,"title":2966,"updated_at":2967,"url":2968,"score":2969},"### Environment\n\n- Operating System: Linux\n- Node Version: v18.20.3\n- Nuxt Version: 3.15.4\n- CLI Version: 3.22.2\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@8.15.6\n- Builder: -\n- User Config: modules, compatibilityDate\n- Runtime Modules: @nuxt/ui@2.21.0\n- Build Modules: -\n\n### Version\n\nv2.21.0\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-sl6rquvy?file=app.vue\n\n### Description\n\nWhile the issue with passing a `false` value has been resolved in PR #1550, setting a numeric value of `0` still results in a binding problem. Specifically, when `0` is used as the value, the USelectMenu renders as blank and fails to display the intended option.\n\n**Steps to Reproduce:** \n1. Use the following reproduction code:\n\n```ts\n\u003Cscript setup lang=\"ts\">\nconst people = [{\n id: 0,\n name: 'Wade Cooper'\n}, {\n id: 1,\n name: 'Arlene Mccoy'\n}, {\n id: 2,\n name: 'Devon Webb'\n}, {\n id: 3,\n name: 'Tom Cook'\n}]\n\nconst selected = ref(people[0].id)\n\u003C/script>\n\n\u003Ctemplate>\n \u003CUSelectMenu\n v-model=\"selected\"\n :options=\"people\"\n placeholder=\"Select people\"\n value-attribute=\"id\"\n option-attribute=\"name\"\n />\n\u003C/template>\n```\n\n2. Notice that the USelectMenu remains blank despite the initial value being set to `0`.\n\n**Expected Behavior:** \nThe USelectMenu should correctly bind and display the option corresponding to the numeric value `0`.\n\nCould you please consider looking into this issue so that numeric `0` is handled correctly, similar to how `false` is now working?\n\n### Additional context\n\n\n\n### Logs\n\n```shell-script\n\n```",[2961,2962,2963,2964],{"name":2904,"color":2905},{"name":2926,"color":2927},{"name":2938,"color":2939},{"name":2941,"color":2939},3392,"USelectMenu: Numeric value 0 causes binding issue","2025-06-18T09:01:56Z","https://github.com/nuxt/ui/issues/3392",0.69501114,{"description":2971,"labels":2972,"number":2978,"owner":2913,"repository":2914,"state":2942,"title":2979,"updated_at":2980,"url":2981,"score":2982},"### 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.13.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\nHere is my dependencies:\n```json\n \"dependencies\": {\n \"@nuxt/ui\": \"https://pkg.pr.new/@nuxt/ui@59d3375\",\n \"@vueuse/nuxt\": \"^11.3.0\",\n \"nuxt\": \"^3.14.1592\",\n \"nuxt-auth-sanctum\": \"^0.5.2\",\n \"tailwindcss\": \"4.0.0-alpha.34\",\n \"vue\": \"latest\",\n \"vue-router\": \"latest\"\n }\n```\nHere is main template:\n```vue\n\u003Cscript setup lang=\"ts\">\nimport { useDebounceFn } from '@vueuse/core'\n\nconst places = ref([])\nconst placeItems = ref([])\nconst placeOpen = ref(true)\nconst placeLoading = ref(false)\nconst placeSearch = useDebounceFn(async q => {\n if (q.length > 2) {\n placeLoading.value = true\n placeItems.value = await $fetch('http://localhost:85/api/v1/places', { query: { q } })\n placeOpen.value = true\n placeLoading.value = false\n }\n}, 500)\n\u003C/script>\n\n\u003Ctemplate>\n \u003CUFormField label=\"Places\" required>\n \u003CUInputMenu name=\"places\"\n v-model=\"places\"\n v-model:open=\"placeOpen\"\n :items=\"placeItems\"\n :loading=\"placeLoading\"\n :reset-search-term-on-blur=\"false\"\n @focus=\"placeOpen = true\"\n @update:search-term=\"placeSearch\"\n value-key=\"id\"\n label-key=\"name\"\n icon=\"i-lucide-search\"\n placeholder=\"Start typing...\"\n class=\"w-full\"\n multiple\n required />\n \u003C/UFormField>\n\u003C/template>\n```\n[Here](https://skrinshoter.ru/vSpJnffwygq) is video demonstration :)\n\n### Description\n\n`placeOpen.value = true` is not opening dropdown after fetching places.",[2973,2974,2975,2976,2977],{"name":2904,"color":2905},{"name":2910,"color":2911},{"name":2926,"color":2927},{"name":2938,"color":2939},{"name":2941,"color":2939},2724,"UInputMenu property OPEN not working properly","2025-06-18T09:05:39Z","https://github.com/nuxt/ui/issues/2724",0.71428716,{"description":2984,"labels":2985,"number":2988,"owner":2913,"repository":2914,"state":2942,"title":2989,"updated_at":2990,"url":2991,"score":2992},"### Environment\n\n- Operating System: Windows_NT\n- Node Version: v22.14.0\n- Nuxt Version: 3.16.2\n- CLI Version: 3.24.0\n- Nitro Version: 2.11.8\n- Package Manager: pnpm@10.9.0\n- Builder: -\n- User Config: modules, css, build, supabase, content, pinia, devtools, debug, routeRules, future, compatibilityDate, eslint\n- Runtime Modules: @nuxt/eslint@1.3.0, @nuxt/ui-pro@3.1.0, @vueuse/nuxt@13.1.0, @nuxt/content@3.5.1, @nuxt/icon@1.12.0, @nuxt/image@1.10.0, @nuxt/scripts@0.11.6, @nuxt/test-utils@3.17.2, @nuxtjs/supabase@1.5.0, @pinia/nuxt@0.11.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.1.0\n\n### Reproduction\n\n```\n\u003Ctemplate>\n \u003Cdiv class=\"flex\">\n \u003CUForm :state=\"state\" class=\"w-1/2 p-4\">\n \u003CUFormField v-for=\"(item, index) in items\" :key=\"index\" :label=\"index\" :name=\"index\">\n \u003CUColorPicker v-if=\"index == 'color'\" v-model=\"state[index]\" :default-value=\"item\" />\n \u003CUSlider v-if=\"index == 'range' && typeof item == 'number'\" v-model=\"state[index]\" :default-value=\"item\" />\n \u003CUInput v-if=\"typeof state[index] == 'boolean'\" :type=\"index\" :value=\"index\" :checked=\"item\" />\n \u003CUInput v-else :type=\"index\" v-model=\"state[index]\" :default-value=\"item\" />\n \u003C/UFormField>\n \u003C/UForm>\n \u003Cpre class=\"w-1/2 bg-gray-200 p-4 leading-14\"> {{ state }} \u003C/pre>\n \u003C/div>\n\u003C/template>\n\n\u003Cscript lang=\"ts\" setup>\nconst state = ref({}) // ISSUE: Default values are not loaded in the v-model\nconst items = {\n number: 50,\n reset: true, // ISSUE: UInput is not supporting boolean values for v-model\n submit: true, // ISSUE: UInput is not supporting boolean values for v-model\n search: \"search\",\n date: \"2025-04-25\",\n text: \"text\",\n color: \"#ccffcc\",\n button: true, // ISSUE: UInput is not supporting boolean values for v-model\n checkbox: false, // ISSUE: UInput is not supporting boolean values for v-model\n \"datetime-local\": \"2025-04-25T10:49:31\",\n email: \"nobody@gmail.com\",\n file: \"\",\n hidden: \"hidden\",\n image: \"image.svg\",\n month: \"2025-04\",\n password: \"topsecret\",\n radio: true, // ISSUE: UInput is not supporting boolean values for v-model\n range: 50, // Default value is displayed but not loaded in the v-model\n tel: \"0612345678\",\n time: \"10:49:31\",\n url: \"www.chatgpt.com\",\n week: \"2025-W16\"\n}\n// const state = reactive(items) // Workaround for default-value\n\u003C/script>\n```\n\n### Description\n\nI made a small comparison between `UInput` and other components like `UColorPicker` and `USlider` and I stumbled on a couple of issues.\n* `default-value` is not displayed except for `range` and `USlider`\n* `default-value` is never initialized in the `v-model`\n* Booleans are not supported in the `v-model` and I was therefore not able to make them reactive.\n\nWorkaround is to load the default value via the `state`, but that requires an additional step and is therefore not ideal for dynamic forms\n`const state = reactive(items)`\n\nWorkaround for working with booleans, but I am not sure how to apply the `v-model` yet🤔\n`\u003CUInput v-if=\"typeof state[index] == 'boolean'\" :type=\"index\" :value=\"index\" :checked=\"item\" />`\n\n\n### Additional context\n\nDefault values via `default-value`\n\nDefault value via `state`\n\n\n### Logs\n\n```shell-script\n\n```",[2986,2987],{"name":2904,"color":2905},{"name":2910,"color":2911},3983,"Default values are not loaded in the v-model","2025-06-30T13:04:54Z","https://github.com/nuxt/ui/issues/3983",0.72045404,{"description":2994,"labels":2995,"number":2999,"owner":2913,"repository":2914,"state":2942,"title":3000,"updated_at":3001,"url":3002,"score":3003},"### 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```",[2996,2997,2998],{"name":2904,"color":2905},{"name":2910,"color":2911},{"name":2926,"color":2927},3978,"The onSelect event of the SelectMenu component was not triggered","2025-05-05T15:20:55Z","https://github.com/nuxt/ui/issues/3978",0.72091156,{"description":3005,"labels":3006,"number":3009,"owner":2913,"repository":2914,"state":2942,"title":3010,"updated_at":3011,"url":3012,"score":3013},"### Environment\n\n- Operating System: Linux\n- Node Version: v22.14.0\n- Nuxt Version: 3.17.1\n- CLI Version: 3.25.0\n- Nitro Version: 2.11.11\n- Package Manager: npm@10.9.2\n- Builder: -\n- User Config: app, build, colorMode, compatibilityDate, debug, devtools, fonts, future, hooks, i18n, icon, imports, modules, nitro, routeRules, runtimeConfig, security, ssr, sourcemap, css, telemetry, vite\n- Runtime Modules: @nuxt/eslint@1.3.0, @pinia/nuxt@0.11.0, @vueuse/nuxt@13.1.0, @nuxtjs/i18n@9.5.3, nuxt-security@2.2.0, @nuxt/ui@3.1.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.1.0\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/epic-smoke-95wysw?file=%2Fapp%2Fpages%2Findex.vue\n\n### Description\n\nUsing the `@update:model-value` event handler produces type errors with the Select component, starting from nuxt-ui v3.1.0 (v3.0.2 works fine).\n\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\nType 'boolean | AcceptableValue | undefined' is not assignable to type '\"yes\" | \"no\"'.\n Type 'undefined' is not assignable to type '\"yes\" | \"no\"'.ts-plugin(2322)\n```",[3007,3008],{"name":2904,"color":2905},{"name":2910,"color":2911},4019,"Type Issue with Select Component","2025-04-29T15:39:56Z","https://github.com/nuxt/ui/issues/4019",0.7224395,{"description":3015,"labels":3016,"number":3022,"owner":2913,"repository":2914,"state":2942,"title":3023,"updated_at":3024,"url":3025,"score":3026},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.14.0\n- Nuxt Version: 3.17.4\n- CLI Version: 3.25.1\n- Nitro Version: 2.11.12\n- Package Manager: pnpm@10.11.0\n- Builder: -\n- User Config: modules, devtools, css, ui, runtimeConfig, compatibilityDate, dayjs, eslint, image, sanity, supabase\n- Runtime Modules: @nuxt/eslint@1.4.1, @nuxt/ui@3.1.3, @nuxt/image@1.10.0, @nuxtjs/sanity@1.13.3, @nuxtjs/supabase@1.5.1, motion-v/nuxt@0.11.3, dayjs-nuxt@2.1.11, @pinia/nuxt@0.10.1\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.17.4\n\n### Reproduction\n\nHappens also in the Nuxt UI documentation: https://ui.nuxt.com/components/input-menu#items\n\n\n\n### Description\n\nI would expect that all list items appear on the first opening and not on the second one like in following video:\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3017,3018,3021],{"name":2904,"color":2905},{"name":3019,"color":3020},"duplicate","cfd3d7",{"name":2910,"color":2911},4240,"InputMenu shows only seleceted value in the list on first opening","2025-05-28T08:08:48Z","https://github.com/nuxt/ui/issues/4240",0.7231388,["Reactive",3028],{},["Set"],["ShallowReactive",3031],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fdQvUgswHTTGdvSqFsyqUFUCdtCMkeXr_gMX4VNiyf3g":-1},"/nuxt/ui/3132"]