",[3165,3166,3167],{"name":3146,"color":3147},{"name":3149,"color":3150},{"name":3168,"color":3169},"reka-ui","56d799",3947,"Unexpected drawer behavior when dragging content area (jumpy collapse & horizontal scroll flickering)","2025-06-05T10:38:05Z","https://github.com/nuxt/ui/issues/3947",0.72696763,{"description":3176,"labels":3177,"number":3181,"owner":3155,"repository":3156,"state":3157,"title":3182,"updated_at":3183,"url":3184,"score":3185},"### 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: compatibilityDate, devtools, ssr, future, runtimeConfig, modules, css\n- Runtime Modules: @nuxt/eslint@1.3.1, @nuxt/image@1.10.0, @nuxt/ui@3.1.1, @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.3\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/modest-shaw-dwjzc5\n\n### Description\n\n**What I'm trying to do:**\n\nI'm using the `UTooltip` component to show helpful text for buttons that only have icons (no text labels). These tooltips help users understand what each button does.\n\n**The issue:**\n\nI noticed that when a button with a tooltip is also used to open a `UModal`, the tooltip stops working after the modal is opened once. Specifically:\n\n- The tooltip works fine initially.\n- After I click the button (which has the tooltip) and the modal opens, the tooltip no longer appears when hovering over the button.\n- This only happens when the tooltip is on the same button that opens its own modal.\n\n**What I tried:**\n\n- Wrapping the button in `UTooltip`, both inside and outside the `UModal`, but the result is the same.\n- Setting `disableClosingTrigger` to `true` in the tooltip options\n- I added a second modal opened by another button without a tooltip, and that one does not break tooltips elsewhere. So the issue seems to be tied specifically to tooltips on buttons that open their own modal.",[3178,3179,3180],{"name":3146,"color":3147},{"name":3149,"color":3150},{"name":3152,"color":3153},4274,"UTooltip breaks when attached to button that opens a UModal","2025-06-02T04:23:45Z","https://github.com/nuxt/ui/issues/4274",0.7354862,{"description":3187,"labels":3188,"number":3194,"owner":3155,"repository":3156,"state":3195,"title":3196,"updated_at":3197,"url":3198,"score":3199},"### Environment\n\n------------------------------\n- Operating System: Windows_NT\n- Node Version: v20.17.0\n- Nuxt Version: 3.16.1\n- CLI Version: 3.23.1\n- Nitro Version: 2.11.7\n- Package Manager: npm@10.8.2\n- Builder: -\n- User Config: devtools, modules, css, future, compatibilityDate\n- Runtime Modules: @nuxt/ui@3.0.2, @nuxt/eslint@1.2.0, @nuxt/content@3.4.0, @vueuse/nuxt@13.0.0, @nuxt/image@1.10.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\nTried to setup repo, but codesandbox was giving errors and stalling out.\n\n\n\n### Description\n\nWhen using the UDrawer component with `:dismissible=\"false\"` and `:modal=\"false\"`, the drawer still closes when users interact with elements outside the drawer. This prevents users from interacting with the form or other page elements while the drawer is open.\n\n**Steps to Reproduce**\nCreate a UDrawer component with :dismissible=\"false\"\nSet the drawer to be open\nTry to interact with form elements or other content outside the drawer\n\n### Additional context\n\nExpected Behavior\nAccording to the documentation at https://ui.nuxt.com/components/drawer#prevent-closing, setting dismissible=\"false\" should prevent the drawer from closing when clicking outside or pressing escape.\nActual Behavior\nThe drawer still closes when clicking outside, making it impossible to interact with form elements on the page while the drawer is open.\n\n```\n\u003CUDrawer\n v-model:open=\"showMobileResults\"\n direction=\"bottom\"\n :modal=\"false\"\n :handle=\"false\"\n :overlay=\"false\"\n dismissible=\"false\"\n title=\"Biological Age Results\"\n description=\"View your biological age and longevity estimates\"\n>\n \u003C!-- Drawer content here -->\n\u003C/UDrawer>\n```\n\n### Logs\n\n```shell-script\n\n```",[3189,3190,3193],{"name":3146,"color":3147},{"name":3191,"color":3192},"needs reproduction","CB47CF",{"name":3149,"color":3150},3727,"closed","UDrawer ignores :dismissible=\"false\" prop and still closes when interacting outside","2025-06-12T15:30:30Z","https://github.com/nuxt/ui/issues/3727",0.6262944,{"description":3201,"labels":3202,"number":3211,"owner":3155,"repository":3156,"state":3195,"title":3212,"updated_at":3213,"url":3214,"score":3215},"### Environment\n\nnode22, nuxtui300-b3 and nuxt3\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv.3.0.0-beta3\n\n### Reproduction\n\nYou can reproduce from the components page for modal and drawer. Open the drawer, the bottom drawer appears, and rest of page shifts from removal of scrollbar. Same does not occur on the modal component.\n\n### Description\n\nThe modal component properly handles overflow and prevents shifting of the main page layout when open. The drawer component does not. Would like to see the drawer prevent layout shift from the scroll bar removal, like is done on the modals. \n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3203,3204,3205,3206,3209],{"name":3146,"color":3147},{"name":3149,"color":3150},{"name":3152,"color":3153},{"name":3207,"color":3208},"closed-by-bot","ededed",{"name":3210,"color":3208},"stale",3523,"Drawer shifts layout unlike modal","2025-06-18T09:01:40Z","https://github.com/nuxt/ui/issues/3523",0.6945133,{"description":3217,"labels":3218,"number":3221,"owner":3155,"repository":3156,"state":3195,"title":3222,"updated_at":3223,"url":3224,"score":3225},"### Environment\n\n- Operating System: Darwin\n- Node Version: v18.20.6\n- Nuxt Version: 3.15.4\n- CLI Version: 3.21.1\n- Nitro Version: 2.10.4\n- Package Manager: yarn@1.22.22\n- Builder: -\n- User Config: -\n- Runtime Modules: -\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.13\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/modest-agnesi-drlrh4?file=%2Fapp%2Fpages%2Findex.vue%3A24%2C24\n\n### Description\n\nWhen I close a `UDrawer` that I opened via an action from a `UDropdownMenu`, the style on my \u003Cbody> tag still contains `overflow: hidden` and `user-select: none`, which prevents interaction with the page.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3219,3220],{"name":3146,"color":3147},{"name":3149,"color":3150},3406,"User interaction lock after a Drawer/DropdownMenu","2025-02-27T20:57:27Z","https://github.com/nuxt/ui/issues/3406",0.6953708,{"description":3227,"labels":3228,"number":3233,"owner":3155,"repository":3156,"state":3195,"title":3234,"updated_at":3235,"url":3236,"score":3237},"### 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.",[3229,3232],{"name":3230,"color":3231},"question","d876e3",{"name":3149,"color":3150},4289,"Keep Slideover open when clicking specific targets outside","2025-06-05T16:50:38Z","https://github.com/nuxt/ui/issues/4289",0.70570856,{"description":3239,"labels":3240,"number":3244,"owner":3155,"repository":3156,"state":3195,"title":3245,"updated_at":3246,"url":3247,"score":3248},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.15.0\n- Nuxt Version: 3.16.2\n- CLI Version: 3.25.0\n- Nitro Version: 2.11.9\n- Package Manager: pnpm@9.15.5\n- Builder: -\n- User Config: modules, security, routeRules, ui, colorMode, icon, app, devtools, css, vite, content, image, ssr, future, compatibilityDate, components\n- Runtime Modules: @nuxt/content@3.5.1, @nuxt/ui@3.1.0, @nuxt/image@1.10.0, @pinia/nuxt@0.10.1, nuxt-security@2.2.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\nNuxt UI\n\n### Version\n\nv3.1.0\n\n### Reproduction\n\nYou can actually see the issue right on Nuxt UI's demo page:\nhttps://ui.nuxt.com/components/drawer#inset\n\nAs an inset drawer closes, watch the viewport edge and notice the drawer doesn't fully animate offscreen.\n\nAfter the drawer close animation completes, the drawer is still actually visible for a moment before finally disappearing. It animated fully, yes, but the animation doesn't take into account the extra distance needed because of `inset`. I think it's easy to miss this subtle thing on the demos page, however in my custom theme, the background and drawer have high-contrast, so the jankyness is noticeable.\n\n### Description\n\nGiven a Nuxt UI drawer instance with the `inset` option...\n\n**Issue:** \nWhen closing an inset drawer, the drawer does not animate fully off the screen. Instead, the drawer animates to zero **but is still visible for a moment before ultimately disappearing**.\n\n```\n\u003CUDrawer id=\"myDrawer\"\nv-model:open=\"store.myDrawer\"\ndirection=\"top\"\ninset\nclass=\"myDrawer\">\n \u003Ctemplate #content>\n \u003Cdiv class=\"p-4 min-h-32 flex flex-col gap-4 overflow-hidden\">\n \u003CSomeComponent />\n \u003C/div>\n \u003C/template>\n\u003C/UDrawer>\n```\n\n**Current workaround:**\n\nThis solves it for me, however doesn't take into account other cases.\n\nFor the closed state of my drawer-with-inset, I force `top` to `0`.\n```\n.myDrawer[data-state='closed'] {\n top: calc(var(--spacing) * 0);\n}\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3241,3242,3243],{"name":3146,"color":3147},{"name":3149,"color":3150},{"name":3152,"color":3153},3985,"Drawer-with-inset doesn't fully animate to edge of viewport","2025-08-11T12:45:02Z","https://github.com/nuxt/ui/issues/3985",0.7074529,{"description":3250,"labels":3251,"number":3257,"owner":3155,"repository":3156,"state":3195,"title":3258,"updated_at":3259,"url":3260,"score":3261},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v22.13.1\n- Nuxt Version: 3.16.2\n- CLI Version: 3.24.1\n- Nitro Version: 2.11.8\n- Package Manager: pnpm@10.8.1\n- Builder: -\n- User Config: app, compatibilityDate, css, devtools, devServer, eslint, imports, modules, nitro, runtimeConfig, sourcemap, ssr, fonts, icon, ui, colorMode\n- Runtime Modules: @nuxt/eslint@1.3.0, @nuxt/ui@3.0.2, @vueuse/nuxt@13.0.0\n- Build Modules: -\n------------------------------\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.16.2\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/amazing-cdn-vgydgy\n\n### Description\n\nI want to close `UContextMenu` programmatically by setting `v-model:open` to `false`, but it doesn’t close the menu as expected.\n\n## Reproduction:\n```\n\u003Ctemplate>\n \u003Cdiv class=\"flex flex-col items-center justify-center gap-4 h-screen\">\n \u003CUContextMenu v-model:open=\"contextMenuOpen\" :items=\"menuItems\">\n \u003Cdiv class=\"w-50 h-20 border-1 rounded flex items-center justify-center bg-slate-500\">Right Click Here\u003C/div>\n \u003C/UContextMenu>\n \u003Cdiv class=\"mt-5\">contextMenuOpen: {{contextMenuOpen}}\u003C/div>\n \u003C/div>\n\u003C/template>\n\n\u003Cscript lang=\"ts\" setup>\nconst contextMenuOpen = ref(false)\n\nconst menuItems = [[\n {\n label: 'Item1'\n },\n {\n label: 'Item2'\n }\n]]\n\nwatch(contextMenuOpen,(newValue)=>{\n if(newValue){\n setTimeout(()=>{\n contextMenuOpen.value = false\n }, 3000)\n }\n})\n\u003C/script>\n```\n\n## What happens\nAfter opening the context menu and waiting for 3 seconds, `contextMenuOpen` is set to `false`, but the menu remains open.\n\n## What I expected\nWhen `contextMenuOpen` becomes `false`, the context menu should close.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3252,3255,3256],{"name":3253,"color":3254},"enhancement","a2eeef",{"name":3149,"color":3150},{"name":3168,"color":3169},4107,"Cannot close `UContextMenu` programmatically via `v-model:open` = false","2025-05-10T15:45:52Z","https://github.com/nuxt/ui/issues/4107",0.71928144,{"description":3263,"labels":3264,"number":3271,"owner":3155,"repository":3155,"state":3195,"title":3272,"updated_at":3273,"url":3274,"score":3275}," nuxtjs layout is making vuetify overlay stop working\r\nI have a login layout and another default,\r\nAfter logging in I'm redirected to the dashboard screen.\r\nif I enter through the browser http: // myurl / dashboard the overlay closes when I click.\r\nif I log in to http: // myurl / login and after login I redirect (self. $ nuxt. $ router.replace ({path: '/ dashboard')) to dashboard.\r\nthe click on orverlay stops working\r\nI tested it without using nuxtjs and it worked, so I think there is something from nuxtjs that is breaking some js from vuetify, but it does not generate any errors\r\n\r\ni tested! nuxtjs not work with vuetify 16.8 only 16.1\r\nbroken navigation drawer overlay\r\n\r\nI tested with version 16.1 and it works, in version 16.8 does not work the click of the overlay in navigationdrawer when we use different layouts in nuxtjs\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This bug report is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1699\">#c1699\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3265,3268],{"name":3266,"color":3267},"good first issue","fbca04",{"name":3269,"color":3270},"2.x","d4c5f9",1899,"vuetify 16.8 not work with nuxtjs lastest version only 16.1","2023-02-06T11:25:02Z","https://github.com/nuxt/nuxt/issues/1899",0.7207324,["Reactive",3277],{},["Set"],["ShallowReactive",3280],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fBlC0t17rwo1fRE_E_ZGfLw2WKqiI-YN7NHSyvJWQbds":-1},"/nuxt/ui/4985"]