[bug]: Resizable component Broken #9118
Description
Describe the bug
Hi Everyone : D
After updating dependencies, the shadcn/ui Resizable component seems to behave incorrectly.
It looks related to an update in the underlying library (react-resizable-panels).
Before the update, the same layout worked as expected.
I created a minimal reproduction to demonstrate the issue.
Thanks for the great project!
Affected component/components
Resizable
How to reproduce
Steps to reproduce:
- Add the Resizable component from the shadcn/ui documentation.
- Use the Resizable component with a basic example
- App crashes
Expected behavior:
Resizable panels behave correctly as before.
Actual behavior:
The app stops working due to not found components
Codesandbox/StackBlitz link
https://codesandbox.io/p/devbox/3s558d
Logs
## Error Type
Build Error
## Error Message
Export PanelGroup doesn't exist in target module
## Build Output
./components/ui/resizable.tsx:4:1
Export PanelGroup doesn't exist in target module
2 |
3 | import { GripVertical } from "lucide-react"
> 4 | import * as ResizablePrimitive from "react-resizable-panels"
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
5 |
6 | import { cn } from "@/lib/utils"
7 |
The export PanelGroup was not found in module [project]/node_modules/.pnpm/react-resizable-panels@4.0.1_react-dom@19.0.0_react@19.0.0/node_modules/react-resizable-panels/dist/react-resizable-panels.js [app-client] (ecmascript).
Did you mean to import Panel?
All exports of the module are statically known (It doesn't have dynamic exports). So it's known statically that the requested export doesn't exist.
Import trace:
Server Component:
./components/ui/resizable.tsx
./components/resizableDemo.tsx
./app/page.tsx
Next.js version: 15.5.7 (Turbopack)System Info
OS : Windows 11
Browser : Microsoft Edge
Front : Next.JsBefore submitting
- I've made research efforts and searched the documentation
- I've searched for existing issues