\n {{ selectedTheme }}\n \u003Cbr />\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\n defineProps({\n media: {\n type: Object,\n required: true,\n },\n });\n\n const mediaPresets = useMediaPresets();\n\n const selectedTheme = ref('');\n\n const themeOptions = computed(() => {\n return mediaPresets.themes.map((theme) => ({\n id: theme.id,\n label: `${theme.emoji} ${theme.display}`,\n }));\n });\n\u003C/script>\n\n```\n\n\nWorking / Fix:\n```Vue\n\u003Ctemplate>\n \u003CUSelectMenu v-model=\"themesProxy\" name=\"labels\" :options=\"themeOptions\" searchable creatable placeholder=\"Select labels\" />\n {{ selectedTheme }}\n \u003Cbr />\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\n defineProps({\n media: {\n type: Object,\n required: true,\n },\n });\n const mediaPresets = useMediaPresets();\n\n const selectedTheme = ref('my_value');\n\n const themeOptions = computed(() => {\n return mediaPresets.themes.map((theme) => ({ id: theme.id, label: `${theme.emoji} ${theme.display}` }));\n });\n\n const themesProxy = computed({\n get: () => {\n const existingTheme = themeOptions.value.find((theme) => theme.id === selectedTheme.value);\n if (existingTheme) return existingTheme;\n return { id: selectedTheme.value, label: selectedTheme.value?.replace(/\\s/g, '-')?.toLowerCase() };\n },\n\n set: (newValue: any) => {\n if (newValue.label && !newValue.id) newValue.id = newValue.label.replace(/\\s/g, '-').toLowerCase();\n selectedTheme.value = newValue.id;\n },\n });\n\n\u003C/script>\n\n```\n\n### Description\n\n\n\nWhen using the `creatable` option, the selected value does not show up properly in the input.\n\n\nThe v-model properly changes (`{{ selectedTheme }}` under the input), but it doesn't show up in the input afterward not in the \"create xyz' text \n\nThe issue seems to happens when not using `multiple`\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2980],{"name":2936,"color":2937},2342,"[SelectMenu] `creatable` bugged when not using `multiple`","2024-11-12T17:11:21Z","https://github.com/nuxt/ui/issues/2342",0.7439413,{"description":2987,"labels":2988,"number":2993,"owner":2907,"repository":2927,"state":2955,"title":2994,"updated_at":2995,"url":2996,"score":2997},"### Description\n\nI'm building a UI with Slideover that lets users inspect table rows by clicking on them, and the inspector detail is inside a Slideover. Clicking a row opens a Slideover by setting its `v-model:open` to `true`. With `:overlay=\"false\"` and `:modal=\"false\"` so users can see and interact with content outside the Slideover, clicking on a second row changes the Slideover's content to be the inspector for that second row (so they can inspect a different row with only a single click). However, the Slideover correctly detects the click outside of the Slideover and closes briefly, only to immediately reopen because the click was on another row to be inspected (which sets `v-model:open` to `true` once again).\n\nIs there a way I can make a Slideover not perform its default behavior of automatically closing when a click outside the Slideover _is a certain target or set of targets_? That way the Slideover will not close and immediately reopen, rather, it will stay open and just update to the newly specified content.\n\nThanks so much! I am very much enjoying building with Nuxt UI.",[2989,2992],{"name":2990,"color":2991},"question","d876e3",{"name":2921,"color":2922},4289,"Keep Slideover open when clicking specific targets outside","2025-06-05T16:50:38Z","https://github.com/nuxt/ui/issues/4289",0.76768297,{"description":2999,"labels":3000,"number":3001,"owner":2907,"repository":2908,"state":2955,"title":3002,"updated_at":3003,"url":3004,"score":3005},"- Fetch API from GitHub\n- List files on the left\n- Display selected file on the right (we support syntax highlight on client-side)\n\n```md\n::code-explorer{repo=\"nuxt/framework\" branch=\"main\" path=\"examples/essentials/hello-world\"}\n::\n```\n\nWould be nice to imagine a simple design for it @R-mooon @SarahM19 ",[],1018,"[Examples] Component to display the code from GitHub directory","2023-10-10T14:45:32Z","https://github.com/nuxt/nuxt.com/issues/1018",0.77916557,{"description":3007,"labels":3008,"number":3012,"owner":2907,"repository":2927,"state":2955,"title":3013,"updated_at":3014,"url":3015,"score":3016},"### Description\n\nI came across the fact that I can't use variations of combinations in the \u003CUKbd /> component, e.g. `\u003CUkbd>meta K\u003C/UKbd>`. After researching the code, I realized that composable, in principle, does not support multi-input, only a known value is expected. It would be nice if there was support for entering a combination of words.\n\nI can create an MR if it really seems useful to you.\n\n### Additional context\n\n_No response_",[3009,3010,3011],{"name":2918,"color":2919},{"name":2921,"color":2922},{"name":2924,"color":2925},3697,"Support for combinations in the useKbd() composable","2025-03-26T14:57:19Z","https://github.com/nuxt/ui/issues/3697",0.7793631,["Reactive",3018],{},["Set"],["ShallowReactive",3021],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fffhChm4422OyiPgd4SDIDK8S0iM3hBrqKhTURrYKC3M":-1},"/nuxt/fonts/76"]