Base UI Sidebar collapsing transition not working in Next.js

[addavid888]

Recording.2026-03-13.232518.mp4

I have this problem when using the sidebar-10 block. The transition when sidebar is collapsing is not working. Apart from that other transitions are working fine. I tried to reset the components using this command but it doesn't work.

npx shadcn@latest init --preset aKJAb4K --base base --template next

Does anyone has the same problem?

[aniruddhaadak80]

@AlanT25 Sidebar transitions often fail if the collapsible state isn''t correctly effectively toggling the classes.
Check if you have lucide-react icons that might be causing hydration mismatches, or if tailwind-merge config is stripping the transition classes.
Also ensure your layout.tsx wraps the provider correctly:

<SidebarProvider>
  <AppSidebar />
  <main>
    <SidebarTrigger />
    {children}
  </main>
</SidebarProvider>