\n\nI believe this is an issue with Nuxt UI and not FormKit because it used to work fine on the previous version.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\nindex.vue:17 [Vue warn]: Unhandled error during execution of mounted hook \n at \u003CDialogTrigger key=0 as-child=\"\" class=\"\" > \n at \u003CDialogRoot modal=true open=true onAfter:leave=fn ... > \n at \u003CUModal close= {onClick: ƒ} title=\"This modal was opened programmatically 0 times\" open=true ... > \n at \u003CModalExample key= Symbol(useOverlay) ref_for=true count=0 ... > \n at \u003CUOverlayProvider > \n at \u003CTooltipProvider > \n at \u003CConfigProvider use-id=fn\u003Cuse-id> dir=undefined locale=undefined > \n at \u003CApp > \n at \u003CApp key=4 > \n at \u003CNuxtRoot>\nwarn$1 @ runtime-core.esm-bundler.js?v=fb91d406:50\nlogError @ runtime-core.esm-bundler.js?v=fb91d406:261\nhandleError @ runtime-core.esm-bundler.js?v=fb91d406:253\ncallWithErrorHandling @ runtime-core.esm-bundler.js?v=fb91d406:199\ncallWithAsyncErrorHandling @ runtime-core.esm-bundler.js?v=fb91d406:204\nhook.__weh.hook.__weh @ runtime-core.esm-bundler.js?v=fb91d406:2842\nflushPostFlushCbs @ runtime-core.esm-bundler.js?v=fb91d406:382\nflushJobs @ runtime-core.esm-bundler.js?v=fb91d406:424\nPromise.then\nqueueFlush @ runtime-core.esm-bundler.js?v=fb91d406:319\nqueueJob @ runtime-core.esm-bundler.js?v=fb91d406:314\neffect2.scheduler @ runtime-core.esm-bundler.js?v=fb91d406:5499\ntrigger @ reactivity.esm-bundler.js?v=fb91d406:235\nendBatch @ reactivity.esm-bundler.js?v=fb91d406:293\ntrigger @ reactivity.esm-bundler.js?v=fb91d406:693\nset @ reactivity.esm-bundler.js?v=fb91d406:974\nopen @ useOverlay.js?v=fb91d406:29\nopen @ useOverlay.js?v=fb91d406:18\nopen @ index.vue:17\n(anonymous) @ Button.vue:80\nonClickWrapper @ Button.vue:80\nonClickWrapper @ LinkBase.vue:30\ncallWithErrorHandling @ runtime-core.esm-bundler.js?v=fb91d406:197\ncallWithAsyncErrorHandling @ runtime-core.esm-bundler.js?v=fb91d406:204\ninvoker @ runtime-dom.esm-bundler.js?v=fb91d406:720\nuseForwardExpose.js?v=fb91d406:8 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'nodeName')\n at ComputedRefImpl.fn (useForwardExpose.js?v=fb91d406:8:64)\n at refreshComputed (reactivity.esm-bundler.js?v=fb91d406:361:29)\n at get value (reactivity.esm-bundler.js?v=fb91d406:1567:5)\n at DialogTrigger.js?v=fb91d406:19:57\n at runtime-core.esm-bundler.js?v=fb91d406:2862:40\n at callWithErrorHandling (runtime-core.esm-bundler.js?v=fb91d406:197:19)\n at callWithAsyncErrorHandling (runtime-core.esm-bundler.js?v=fb91d406:204:17)\n at hook.__weh.hook.__weh (runtime-core.esm-bundler.js?v=fb91d406:2842:19)\n at flushPostFlushCbs (runtime-core.esm-bundler.js?v=fb91d406:382:28)\n at flushJobs (runtime-core.esm-bundler.js?v=fb91d406:424:5)\n```",[3205,3206,3207],{"name":3138,"color":3139},{"name":3141,"color":3142},{"name":3144,"color":3145},4309,"UModal does not work with FormKit","2025-06-07T23:36:34Z","https://github.com/nuxt/ui/issues/4309",0.7078289,{"description":3214,"labels":3215,"number":3219,"owner":3147,"repository":3148,"state":3197,"title":3220,"updated_at":3221,"url":3222,"score":3223},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.18.3\n- Nuxt Version: 3.16.2\n- CLI Version: 3.24.1\n- Nitro Version: 2.11.9\n- Package Manager: bun@1.1.28\n- Builder: -\n- User Config: devtools, modules, css, future, compatibilityDate\n- Runtime Modules: @nuxt/ui@3.0.2, @nuxt/eslint@1.3.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://stackblitz.com/edit/github-s2opq2ko?file=app/pages/index.vue\n\n### Description\n\nGiven this component nesting:\n\n- `UForm`\n - `UModal`\n - `UForm`\n\nThis is rendered as the following html:\n\n- `UForm` -> `form` - ✅\n - `UModal` -> `div` - ✅ (teleported to root)\n - `UForm` -> `div` - ❌ I am expecting `form`.\n\nI couldn't find a mention in the documentation that this is expected behaviour.\n\nTo reproduce:\n1. Run reproduction\n2. Click \"Open modal\" button\n3. Inspect the nested form element. It's a `div`:\n\n\nI am happy to have a crack at a PR, if you're willing to point me in the right direction 😌\n\n\n### Additional context\n\nFor context, this is our use case:\n* User fills out an onboarding form\n* One field in the onboarding form is business details\n* User has option to populate business details via business number (eg. [DUNS](https://www.dnb.com/en-us/smb/duns.html))\n* Business number field open in modal\n* User can enter business number in form in modal\n* User submits form, it populates state in parent form\n\n### Logs\n\n```shell-script\n\n```",[3216,3217,3218],{"name":3138,"color":3139},{"name":3141,"color":3142},{"name":3144,"color":3145},3913,"[Form] Nested `UForm` in `UModal` is not rendered as `form`","2025-04-16T08:34:48Z","https://github.com/nuxt/ui/issues/3913",0.71715724,{"description":3225,"labels":3226,"number":3236,"owner":3147,"repository":3148,"state":3197,"title":3237,"updated_at":3238,"url":3239,"score":3240},"### Description\n\nIf I open one of these 3 (modal, sidebar, dropdown) nuxt ui is adding styles to the body which cause strange layout behaviors.\nI would like to costumize these or modify. Thats what currently gets added when opening a modal and causes problems\n```\n\u003Cbody style=\"padding-right: 9px; margin-right: 0px; --scrollbar-width: 9px; overflow: hidden; pointer-events: none;\">\n```\n\nIs there a way to do that right now?",[3227,3230,3231,3234,3235],{"name":3228,"color":3229},"question","d876e3",{"name":3141,"color":3142},{"name":3232,"color":3233},"reka-ui","56d799",{"name":3192,"color":3193},{"name":3195,"color":3193},3078,"Scrolllock when opening modal, dropdown, sidebar","2025-06-18T09:02:37Z","https://github.com/nuxt/ui/issues/3078",0.7272836,{"description":3242,"labels":3243,"number":3249,"owner":3147,"repository":3148,"state":3197,"title":3250,"updated_at":3251,"url":3252,"score":3253},"### Environment\n\nDevice: iPad Pro 18.1.1\n\n\n\n\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.12\n\n### Reproduction\n\nhttps://ui.nuxt.com/\n\n### Description\n\n## Dropdown-Menu\n\nhttps://ui3.nuxt.dev/components/dropdown-menu#content\n\n- Pen-clicking an item within the dropdown, no matter the level, does not work\n\nOther components, like `ColorModeSelect` and `LocaleSelect` work.\n\n## Modals\n\nhttps://ui3.nuxt.dev/components/modal#title\n\n- Pen-clicking the \"close\" button on the top right does not work.\n\n## Popover\n\nhttps://ui3.nuxt.dev/components/modal#title\n\n- Touch-clicking \"Open\" does not work\n- Pen-clicking \"Open\" does not work\n\n## ColorPicker\n\nhttps://ui3.nuxt.dev/components/color-picker#usage\n\n- Touch-clicking/dragging does scroll the whole window\n- Pen-clicking/dragging on the vertical scrollbar does scroll the whole window\n\nOther componen ts, like `Slider` does actually work fine in vertical mode.\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3244,3245,3246,3247,3248],{"name":3138,"color":3139},{"name":3141,"color":3142},{"name":3144,"color":3145},{"name":3192,"color":3193},{"name":3195,"color":3193},3291,"Defects on various components on iOS devices with pen / touch","2025-08-20T02:09:25Z","https://github.com/nuxt/ui/issues/3291",0.72728676,{"description":3255,"labels":3256,"number":3260,"owner":3147,"repository":3148,"state":3197,"title":3261,"updated_at":3262,"url":3263,"score":3264},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v18.20.3\r\n- Nuxt Version: 3.12.1\r\n- CLI Version: 3.12.0\r\n- Nitro Version: 2.9.6\r\n- Package Manager: pnpm@8.15.6\r\n- Builder: -\r\n- User Config: modules\r\n- Runtime Modules: @nuxt/ui@2.17.0\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Version\r\n\r\nv2.17.0\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/nuxt-ui-5movd8?file=app.vue\r\n(Test on mobile or open Devtools and toggle device mode.)\r\n\r\n### Description\r\n\r\nWhen two or more `UModal` are using `preventClose` prop doesn't allow to interact with the elements of the modal on top when in touch mode.\r\n\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],{"name":3138,"color":3139},{"name":3192,"color":3193},{"name":3195,"color":3193},1932,"`UModal` preventClose doesn't allow to interact with elements","2025-06-19T02:12:17Z","https://github.com/nuxt/ui/issues/1932",0.7279009,["Reactive",3266],{},["Set"],["ShallowReactive",3269],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fve3dzXsB9T4-ZRuddelAbCGMajacIIMoXoxpBcz36Uw":-1},"/nuxt/ui/1346"]