\u003Cbr />\n \u003CUButton @click=\"fnOpenModal\">Open FooModal from code\u003C/UButton>\n \u003C/UContainer>\n\u003C/template>\n\n\u003Cscript lang=\"ts\" setup>\n import { FooModal } from '#components';\n\n const overlay = useOverlay();\n\n const foo = overlay.create(FooModal);\n\n const fnOpenModal = async () => {\n foo.open();\n };\n\n const fnHandleAction = (action) => {\n console.log(\"Handle FooModal action: \", action);\n };\n\u003C/script>\n```\n\n**FooModal**\n```\n\u003Ctemplate>\n \u003CUModal v-model:open=\"open\" title=\"Foobar\">\n \u003CUButton label=\"Open FooModal from modal\" color=\"neutral\" variant=\"subtle\" />\n\n \u003Ctemplate #body>\n \u003CUButton @click=\"click()\" >Submit\u003C/UButton>\n \u003C/template>\n \u003C/UModal>\n\u003C/template>\n\n\u003Cscript lang=\"ts\" setup>\n const open = ref(false);\n\n const emits = defineEmits(['some-action']);\n\n const click = () => {\n console.log(\"clicked from inside the modal\");\n emits('some-action', 'closing'); //emits does not work if Modal opened using useOverlay.\n open.value = false; //closing modal does not work if Modal opened using useOverlay.\n };\n\u003C/script>\n```\n\n### Description\n\nHello Nuxt UI team,\n\nThank you for providing a high-quality UI library. I truly appreciate the effort you put into creating and maintaining it.\n\nI have encountered an issue while using `UModal` in my application. The modal is used to create and/or update database entries, and it needs to be opened in two different ways:\n\n1. Via a `UButton` that is always present on the screen (provided by the modal itself).\n2. Programmatically, through a link in a dropdown menu, using `useOverlay`.\n\nWhen the modal is opened using the first method, everything works as expected. However, when it is opened programmatically using the second method, the modal does not behave the same way. Specifically:\n\n- I am unable to trigger an `emit` to notify the parent component that the update was successful.\n- The modal does not close properly using the `open.value = false` technique.\n\nI am unsure if this behavior is intentional or a bug. I was under the impression that `UModal` and `useOverlay` should work seamlessly together and exhibit consistent behavior. Could you please confirm whether this is a valid concern?\n\nThank you for your time and attention to this matter. I look forward to your guidance.\n\n**Note**: You'll also notice that the button within the modal appears on the screen when opened using `useOverlay`. It would be helpful if it could be hidden automatically, but I believe this is something I can control easily. As such, I do not consider this to be a bug.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2982,2983,2984],{"name":2933,"color":2934},{"name":2921,"color":2922},{"name":2937,"color":2938},3432,"UModal and useOverlay compatibility Issue","2025-03-11T13:57:03Z","https://github.com/nuxt/ui/issues/3432",0.75829154,{"description":2991,"labels":2992,"number":2999,"owner":2907,"repository":2907,"state":2940,"title":3000,"updated_at":3001,"url":3002,"score":3003},"### Environment\r\n\r\n- Operating System: `Darwin`\r\n- Node Version: `v18.18.2`\r\n- Nuxt Version: `3.6.1`\r\n- Nitro Version: `2.5.2`\r\n- Package Manager: `npm@9.8.1`\r\n- Builder: `vite`\r\n- User Config: `ssr`, `nitro`, `app`, `modules`, `security`, `vite`\r\n- Runtime Modules: `nuxt-security@1.0.0-rc.2`, `nuxt-vitest@0.10.2`\r\n- Build Modules: `-`\r\n\r\n\r\nAlthough we are pinned at Nuxt v3.6.1 'for reasons' the bug can be observed in StackBlitz repro on Nuxt v3.8.2\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-6rrfcj?file=pages%2Findex.vue\r\n\r\nNote: Issue relates to keyboard navigation! - not mouse.\r\n\r\n- Open `index` page and tab bring focus to button labelled `Goto Two`. \r\n- Hit enter key to effectively `click` button. (remember, keyboard - not mouse!)\r\n- Browser navigates to page `two`\r\n\r\nNotice the header suggests that the function `handleNext` has been called. This suggest that the `@keyup` event has fired on the `input` control on page `two` as `handleNext` is the function handling of that event. I can't think why this should be expected behaviour. Almost as if the `keyup` event from pressing the button on the `index` page is being seen by page `two` when the `focus()` call is made?! \r\n\r\nOpen the browser devtools to see console.log messages also indicating that `handleNext` has been called.\r\n\r\nAlso, to add additional context/relevant to help diagnose the error. In the script for `two.vue` there is another option (2) that can be uncommented and option (1) commented out. This only calls `focus()` after a delay. With this in place the potential bug doesn't happen.\r\n\r\n### Describe the bug\r\n\r\nI'm seeing what I think maybe a bug when navigating to a page that combines and `input` control with an associated `@keyup` handler that is also focused on page load via `onMounted` lifecycle event.\r\n\r\nFollow the reproduction above and also the effect of delaying the call to `focus()` on the `input` control.\r\n\r\n\r\n### Additional context\r\n\r\nChanging the event type on the `input` field from `@keyup` to `@keydown` also avoids the issue.\r\n\r\n### Logs\r\n\r\n_No response_",[2993,2996],{"name":2994,"color":2995},"3.x","29bc7f",{"name":2997,"color":2998},"pending triage","E99695",24434,"Unexpected @keyup triggering on focused input field when navigated to via keyboard \"click\"","2023-11-28T14:35:12Z","https://github.com/nuxt/nuxt/issues/24434",0.759427,{"description":3005,"labels":3006,"number":3008,"owner":2907,"repository":2907,"state":2940,"title":3009,"updated_at":3010,"url":3011,"score":3012},"\u003C!--\r\n🚨 IMPORTANT 🚨\r\n\r\nPlease use the following link to create a new issue:\r\n\r\n- 🚨 Bug report - https://bug.nuxtjs.org/ \r\n- 🙋 Feature request - https://feature.nuxtjs.org/ \r\n- 🤔 Help wanted - https://otechie.com/nuxt \r\n- ❗️ All other issues - https://cmty.nuxtjs.org/ \r\n\r\nIf your issue was not created using the app above, **it will be closed immediately**.\r\n\r\n🚨 注意事项 🚨\r\n\r\n请务必使用下述链接来创建 issue:\r\n\r\n- 🚨 Bug 提交 - https://bug.nuxtjs.org/ \r\n- 🙋 新功能提案 - https://feature.nuxtjs.org/ \r\n- 🤔 寻求帮助 - https://otechie.com/nuxt \r\n- ❗️ 其他问题 - https://cmty.nuxtjs.org/ \r\n\r\n如果 issue 不是通过上述链接进行创建, **该 issue 会被系统自动关闭**\r\n-->\r\n\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c9222\">#c9222\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3007],{"name":2960,"color":2961},5737,"N-link forwarding is not executing page load scripts.","2023-01-18T20:13:03Z","https://github.com/nuxt/nuxt/issues/5737",0.7614494,{"description":3014,"labels":3015,"number":3021,"owner":2907,"repository":2924,"state":2940,"title":3022,"updated_at":3023,"url":3024,"score":3025},"### For what version of Nuxt UI are you asking this question?\n\nv3.0.0-alpha.x\n\n### Description\n\nHow can I add more colors to the selection? Cause I am getting a type error when using a new color.\n\n\n\n",[3016,3019,3020],{"name":3017,"color":3018},"duplicate","cfd3d7",{"name":2918,"color":2919},{"name":2921,"color":2922},2931,"Define more tailwind colors in ui colors","2024-12-18T08:48:36Z","https://github.com/nuxt/ui/issues/2931",0.7617582,["Reactive",3027],{},["Set"],["ShallowReactive",3030],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$frD2-HUVDHaikV8p6iqwgzcvEuZg2ZhEzvkusOeHGSTM":-1},"/nuxt/scripts/467"]