` component, specifically with the `v-model:open` binding:\n\n* `v-model:collapsed` works great — it properly handles the collapsed/expanded state.\n* But `v-model:open` doesn't seem to behave as expected. When I bind it to a custom `open` state and try to set it to `false` (e.g., using a custom button), the sidebar doesn’t actually close. Then, as soon as I click anywhere else on the page, the `open` value is automatically reset to `true`.\n\nIt feels like something internal is re-opening the sidebar and overriding the bound value.\n\nOther small notes:\n\n* `\u003CUDashboardSidebarToggle />` is hidden on desktop due to `lg:hidden`, which makes sense for mobile setups. But even when made visible, it doesn’t allow fully toggling the sidebar on desktop — the sidebar remains fixed.\n* I also tried changing the `default-size` prop (e.g., to `16rem` / `256px`), and it didn’t apply immediately. It only worked after clearing the site data. I’m guessing this is due to cookies storing the previous value? Maybe it could be possible to sync the cookie automatically when `default-size` changes?\n\nHere’s a minimal reproduction of the issue: [Here](https://codesandbox.io/p/devbox/polished-cookies-lrv5hm?file=%2Fapp%2Fpages%2Findex.vue%3A9%2C23)\n\nLastly, I was wondering if in the future it might be possible to support a prop like `expand-on-hover`, where a collapsed sidebar could temporarily expand on mouse hover — without pushing the rest of the layout. This could allow building more advanced layouts similar to what Supabase uses: a primary sidebar that stays collapsed when a secondary one is open, but can still expand on hover without shifting the content.\n\nThanks again for your amazing work and for considering these ideas! 😊\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3137,3140,3143],{"name":3138,"color":3139},"bug","d73a4a",{"name":3141,"color":3142},"v3","49DCB8",{"name":3144,"color":3145},"triage","ffffff",4599,"nuxt","ui","open","DashboardSidebar: v-model:open not working as expected","2025-07-25T16:31:55Z","https://github.com/nuxt/ui/issues/4599",0.7316952,{"description":3155,"labels":3156,"number":3160,"owner":3147,"repository":3147,"state":3149,"title":3161,"updated_at":3162,"url":3163,"score":3164},"### Environment\n\n- Operating System: `Darwin`\n- Node Version: `v22.9.0`\n- Nuxt Version: `3.16.0`\n- CLI Version: `3.23.0`\n- Nitro Version: `2.11.6`\n- Package Manager: `pnpm@9.5.0`\n- Builder: `-`\n- User Config: `ssr`, `devtools`, `compatibilityDate`, `css`, `app`, `modules`, `runtimeConfig`, `vite`, `vueQuery`, `ui`, `icon`, `elementPlus`\n- Runtime Modules: `@nuxt/eslint@1.2.0`, `@nuxt/icon@1.11.0`, `@nuxt/scripts@0.11.2`, `@nuxt/test-utils@3.17.2`, `@nuxt/ui@3.0.2`, `@element-plus/nuxt@1.1.1`, `@hebilicious/vue-query-nuxt@0.3.0`, `@vueuse/nuxt@13.0.0`\n- Build Modules: `-`\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/purple-worker-q927r2?workspaceId=ws_Nd6bGHokakFXXgZBfRPLsD\n\n### Describe the bug\n\n**Steps to Reproduce:**\n\n1. Open the reproduction link.\n2. Click on 'page 2' at the top to navigate to the page2 page.\n3. The loading animation will not disappear.\n\nThe code logic of the page2 page is to call the `fetchData` function when the page is opened, while setting `loading` to true and then setting it to false within a short period.\n\nThis bug is triggered when a Nuxt page uses a transition with the mode set to `out-in`. Specifically, when the component's props change rapidly, the code related to DOM operations does not correctly handle the state of the props, resulting in abnormal component display.\n\nWorkaround:\n\n1. Set the mode to a value other than `out-in`.\n2. Wrap the component using `v-loading` with a `\u003CClientOnly>` component.\n3. Call `fetchData` within the `onMounted` callback.\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```\n\nEdit: pick right words",[3157],{"name":3158,"color":3159},"pending triage","E99695",31613,"page transtion with fast props change","2025-04-02T03:30:33Z","https://github.com/nuxt/nuxt/issues/31613",0.7363192,{"description":3166,"labels":3167,"number":3171,"owner":3147,"repository":3148,"state":3149,"title":3172,"updated_at":3173,"url":3174,"score":3175},"### Environment\n\n- Node Version: v22.17.1\n- Nuxt Version: 4.0.3\n- CLI Version: 3.27.0\n- Nitro Version: 2.12.4\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.3.0\n\n### Reproduction\n\nhttps://ui.nuxt.com/components/navigation-menu#control-active-item\n\n### Description\n\nas per title, seems that manual active control is not working at all even in docs https://ui.nuxt.com/components/navigation-menu#control-active-item\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3168,3169,3170],{"name":3138,"color":3139},{"name":3141,"color":3142},{"name":3144,"color":3145},4682,"[NavigationMenu] v-model, value, default-value: does nothing","2025-08-08T08:39:46Z","https://github.com/nuxt/ui/issues/4682",0.7435025,{"description":3177,"labels":3178,"number":3181,"owner":3147,"repository":3148,"state":3182,"title":3183,"updated_at":3184,"url":3185,"score":3186},"### Environment\n\n- Nuxt Version: `3.17.6`\n- Nuxt UI Version: `3.2.0`\n\n### Version\n\nv3.2.0\n\n### Reproduction\n\n- Visit the Tabs component documentation page\n- Observe the indicator animation on page load when change component page and going back to the tab page\n- Compare with the playground implementation\n- Notice the difference in initial positioning behavior\n\n### Description\n\nThe Tabs component's indicator animation behaves differently between the documentation site and the playground, causing a visual inconsistency in the user experience.\n\n**Expected Behavior**\nThe indicator should be properly positioned on the active tab from the initial render, as demonstrated in the playground.\n\n**Actual Behavior**\nIn the documentation, the indicator starts from position zero (left edge) and slides to the correct position, creating an unwanted animation on page load.\n\n### Additional context\n\nWe started to understand how it happens by logging `--reka-tabs-indicator-[variable]` where Tabs is used.\n\n```js\nonMounted(() => {\n const el = document.querySelector('[data-reka-collection-item][data-orientation]')?.previousElementSibling\n console.log(el.style.getPropertyValue('--reka-tabs-indicator-size'), el.style.getPropertyValue('--reka-tabs-indicator-position')) // 0px 0px \n})\n```",[3179,3180],{"name":3138,"color":3139},{"name":3141,"color":3142},4491,"closed","[Tabs] Indicator animation inconsistency","2025-07-31T04:27:20Z","https://github.com/nuxt/ui/issues/4491",0.70342016,{"description":3188,"labels":3189,"number":3198,"owner":3147,"repository":3148,"state":3182,"title":3199,"updated_at":3200,"url":3201,"score":3202},"### Environment\n\n- Operating System: Darwin\n- Node Version: v23.3.0\n- Nuxt Version: 3.16.1\n- CLI Version: 3.23.1\n- Nitro Version: 2.11.7\n- Package Manager: pnpm@9.9.0\n- Builder: -\n- User Config: compatibilityDate, css, devtools, modules, colorMode, runtimeConfig, ui, app\n- Runtime Modules: @nuxt/ui@3.0.1, @nuxtjs/device@3.2.4\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.1\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/modest-euclid-j92wtc\n\n### Description\n\nThe v-model does not open the tab of the navigation bar if this is not a \"parent of children\" type of tab. It's confusing because there is no more \"isActive\" items status since the v3.\n\n### Additional context\n\n(it's my first time creating an issue, maybe I've done some things wrong during creation)\n\n### Logs\n\n```shell-script\n\n```",[3190,3191,3192,3193,3196],{"name":3138,"color":3139},{"name":3141,"color":3142},{"name":3144,"color":3145},{"name":3194,"color":3195},"closed-by-bot","ededed",{"name":3197,"color":3195},"stale",3650,"The NavigationMenu's v-model does not update correctly","2025-06-18T09:01:24Z","https://github.com/nuxt/ui/issues/3650",0.71536297,{"description":3204,"labels":3205,"number":3210,"owner":3147,"repository":3147,"state":3182,"title":3211,"updated_at":3212,"url":3213,"score":3214},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.10.0\n- Nuxt Version: 3.13.1\n- CLI Version: 3.13.1\n- Nitro Version: 2.9.7\n- Package Manager: npm@10.2.3\n- Builder: -\n- User Config: app, compatibilityDate, devtools\n- Runtime Modules: -\n- Build Modules: -\n\nAffects every single version of Nuxt 3 – this has never worked. In Nuxt 2 it was perfect. \n\n### Reproduction\n\nhttps://github.com/simonhrogers/transition-no-worky\n\n### Describe the bug\n\nLayout transitions are not retaining correct scroll position. Page transitions do. \n\nNavigate from the about page to the home page here, the home page is already partially scrolled:\n\nhttps://layout-transition-no-worky-nuxt3.netlify.app/about\n\nI can provide further demonstration if needed. Written explanation below, as well as written explanation of the behaviour I would expect, which occurs correctly without layout transitions. \n\nI open my website. I scroll down 200px. I click a NuxtLink. The browser navigates to the new page. The new page is already scrolled 200px from the top. I scroll up 52px. I click on Chrome’s back button. It takes me back to the index page, which is scrolled down 148px.\n\nThis is not the default behaviour of the website, which operates correctly without layout transitions. But it is happening between layout transitions.\n\nHow can I make the default behaviour occur? The desired behaviour is as follows:\n\nI open my website. I scroll down 200px. I click a NuxtLink. The browser navigates to the new page. The new page is at the top – scroll distance: 0px. I scroll down 250px. I click on Chrome’s back button. It takes me back to the index page, which is scrolled down 200px, exactly where I left it.\n\nThank you!\n\n### Additional context\n\nI’m wondering if the issue might stem from [`nuxt/src/pages/runtime/router.options.ts`](https://github.com/nuxt/nuxt/blob/main/packages/nuxt/src/pages/runtime/router.options.ts), which checks for `route.meta.pageTransition`, but not `route.meta.layoutTransition` inside the `hasTransition` function? This appears to be the deciding factor in whether the page is scrolled to top or not, so would make total sense at first glance. But I’m just getting to grips with the codebase, and I fear it can’t be this easy? \n\nIf that’s not the solution, more below:\n\nDirectly below, `hookToWait` appears to await the resolution of both `page:transition:finish` and `page:finish`, but Nuxt lacks a corresponding `layout:transition:finish` hook to call. As far as I can see, `page:transition:finish` is not called in relation to layout transitions.\n\nIn [`nuxt/src/pages/runtime/page.ts`](https://github.com/nuxt/nuxt/blob/main/packages/nuxt/src/pages/runtime/page.ts), we see a repetition of `hasTransition` which again, only checks for page transitions. If a page transition is present, `page:transition:finish` is called `onAfterLeave`:\n\n```js\nconst hasTransition = !!(props.transition ?? routeProps.route.meta.pageTransition ?? defaultPageTransition)\nconst transitionProps = hasTransition && _mergeTransitionProps([\n props.transition,\n routeProps.route.meta.pageTransition,\n defaultPageTransition,\n { onAfterLeave: () => { nuxtApp.callHook('page:transition:finish', routeProps.Component) } },\n].filter(Boolean))\n```\n\nAnd finally, [`nuxt/src/app/components/nuxt-layout.ts`](https://github.com/nuxt/nuxt/blob/main/packages/nuxt/src/app/components/nuxt-layout.ts) appears to be the only location where `route.meta.layoutTransition` is mentioned, providing the layout prop `hasTransition`.\n\n### Logs\n\n_No response_",[3206,3207],{"name":3138,"color":3139},{"name":3208,"color":3209},"🔨 p3-minor","FBCA04",28988,"Layout Transitions break scroll position on route change and browser forward/back","2025-04-02T08:44:50Z","https://github.com/nuxt/nuxt/issues/28988",0.7205584,{"description":3216,"labels":3217,"number":3222,"owner":3147,"repository":3147,"state":3182,"title":3223,"updated_at":3224,"url":3225,"score":3226},"### Environment\n\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v18.18.0\r\n- Nuxt Version: 3.9.0\r\n- CLI Version: 3.10.0\r\n- Nitro Version: 2.8.1\r\n- Package Manager: npm@9.4.2\r\n- Builder: -\r\n- User Config: devtools, app\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-starter-zo83ve?file=app.vue\n\n### Describe the bug\n\nWhen custom page transitions are defined with the 'out-in' mode, it causes a disruption in custom layouts. The \u003Cslot> is consistently rendered at the end of the page after the initial navigation. An example illustrating this issue can be found on [Stackblitz](https://stackblitz.com/edit/nuxt-starter-zo83ve?file=app.vue). The provided example uses the default layout and is expected to display components in the following order:\r\n\r\n1️⃣ Navigation\r\n2️⃣ [slot]\r\n3️⃣ Footer\r\n\r\nHowever, after navigating to the /second page, the layout breaks, resulting in the following rendering:\r\n\r\n1️⃣ Navigation\r\n3️⃣ Footer\r\n2️⃣ [slot]\r\n\r\nThe page transition is defined inside the nuxt.config.ts.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3218,3221],{"name":3219,"color":3220},"3.x","29bc7f",{"name":3158,"color":3159},25065,"Page transitions in 'out-in' mode disrupt layout order","2024-01-05T10:08:42Z","https://github.com/nuxt/nuxt/issues/25065",0.7299258,{"description":3228,"labels":3229,"number":3234,"owner":3147,"repository":3147,"state":3182,"title":3235,"updated_at":3236,"url":3237,"score":3238},"### Environment\n\n```\r\n- Operating System: `Darwin`\r\n- Node Version: `v18.9.0`\r\n- Nuxt Version: `3.0.0-rc.12`\r\n- Nitro Version: `0.6.0`\r\n- Package Manager: `npm@8.19.1`\r\n- Builder: `vite`\r\n- User Config: `experimental`, `build`, `modules`, `publicRuntimeConfig`, `pageTransition`, `privateRuntimeConfig`, `globalName`, `app`, `i18n`, `http`, `proxy`, `auth`, `tailwindcss`, `googleFonts`, `content`\r\n- Runtime Modules: `@nuxtjs-alt/auth@2.0.16`, `@nuxtjs-alt/http@1.3.19`, `@nuxtjs-alt/proxy@1.3.8`, `@nuxt/content@2.2.0`, `@nuxtjs/tailwindcss@6.0.1`, `@nuxtjs/google-fonts@3.0.0-0`, `@pinia/nuxt@0.4.3`, `@nuxtjs/i18n@8.0.0-beta.1`\r\n- Build Modules: `-`\r\n```\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-hph1uk?file=pages/index.vue\n\n### Describe the bug\n\nIf I set `nuxt.config.js` to\r\n\r\n```\r\nexport default defineNuxtConfig({\r\n pageTransition: {\r\n mode: 'out-in',\r\n name: 'transition-slide'\r\n },\r\n layoutTransition: {\r\n mode: 'out-in',\r\n name: 'transition-slide'\r\n },\r\n //...\r\n```\r\n\r\nI would expect the transition to be `transition-slide`, as defined here:\r\n\r\n```\r\n\u003Cstyle>\r\n.transition-slide-enter-from,\r\n.transition-slide-leave-to{\r\n opacity: 0;\r\n transform: translateY(2.5rem);\r\n}\r\n\r\n.transition-slide-enter-active,\r\n.transition-slide-leave-active {\r\n transition: all 0.2s;\r\n}\r\n\u003C/style>\r\n```\r\n\r\nBut unfortunately it does not.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3230,3233],{"name":3231,"color":3232},"documentation","5319e7",{"name":3219,"color":3220},15226,"update global transitions docs","2023-01-19T17:46:27Z","https://github.com/nuxt/nuxt/issues/15226",0.732439,{"description":3240,"labels":3241,"number":3244,"owner":3147,"repository":3147,"state":3182,"title":3245,"updated_at":3246,"url":3247,"score":3248},"### Environment\n\n- Operating System: `Darwin`\r\n- Node Version: `v16.13.1`\r\n- Nuxt Version: `3.0.0-rc.13`\r\n- Nitro Version: `0.6.1`\r\n- Package Manager: `yarn@1.22.15`\r\n- Builder: `vite`\r\n- User Config: `alias`, `app`, `build`, `modules`, `progress`, `plausible`, `runtimeConfig`, `vite`\r\n- Runtime Modules: `@nuxtjs/tailwindcss@6.1.3`, `nuxt-progress@0.1.6`, `vue-plausible@1.3.2`\r\n- Build Modules: `-`\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-ruxdek?file=pages/index.vue\n\n### Describe the bug\n\nReproduction:\r\n* Have two pages, each with more than 100vh width.\r\n* Scroll down on page 1\r\n* Navigate to page 2\r\n\r\nExpected behavior:\r\n* Page 2 should scroll to top\r\n\r\nActual behavior:\r\n* Page 2 stays at the scroll position of page 1\r\n\r\nThe reason is that `router.options.ts` falsely thinks that an `undefined` page transition is `true`, meaning it HAS a transition.\r\nhttps://github.com/nuxt/framework/blob/bde96947333501c22a5e981515bd27c24eb8b88f/packages/nuxt/src/pages/runtime/router.options.ts#L34\r\n\r\nWhereas `page.mjs` correctly interprets an `undefined` transition as `false`.\r\nhttps://github.com/nuxt/framework/blob/bde96947333501c22a5e981515bd27c24eb8b88f/packages/nuxt/src/pages/runtime/page.ts#L46\r\n\r\nI will submit a PR to fix this issue.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3242,3243],{"name":3219,"color":3220},{"name":3158,"color":3159},15364,"Default scroll behavior without page transition is broken in rc.13","2023-01-19T17:49:02Z","https://github.com/nuxt/nuxt/issues/15364",0.7355106,{"description":3250,"labels":3251,"number":3254,"owner":3147,"repository":3147,"state":3182,"title":3255,"updated_at":3256,"url":3257,"score":3258},"### Environment\n\nNuxt 3\n\n### Reproduction\n\ninstall apexcharts or any charting library and try to render a chart in a page different than index, when navigating to the page without animations, the chart renders fine, but when i add page transitions, especialy with the 'out-in' mode, the website crashes.\r\n\r\nbtw SSR is set to false.\n\n### Describe the bug\n\ninstall apexcharts or any charting library and try to render a chart in a page different than index, when navigating to the page without animations, the chart renders fine, but when i add page transitions, especialy with the 'out-in' mode, the website crashes.\r\n\n\n### Additional context\n\n\u003Cimg width=\"1800\" alt=\"image\" src=\"https://github.com/nuxt/nuxt/assets/56976418/d51640ba-2e26-4049-aa8b-c9d2cfd122df\">\r\n\u003Cimg width=\"1344\" alt=\"image\" src=\"https://github.com/nuxt/nuxt/assets/56976418/83704cf1-91c2-42a0-a301-544dc3667092\">\r\n\n\n### Logs\n\n_No response_",[3252,3253],{"name":3219,"color":3220},{"name":3158,"color":3159},22285,"Chart Error when navigating between pages that have animations","2023-07-22T19:58:17Z","https://github.com/nuxt/nuxt/issues/22285",0.73597145,["Reactive",3260],{},["Set"],["ShallowReactive",3263],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$f9_HNKGr-Gp9XzbwA9DDP1fAXJdhoUQH4D5xQwZ52vIw":-1},"/nuxt/ui/3084"]