Dosnt work in NextJs about react-resizable-panels HOT 8 CLOSED

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 13b7588..66809d0 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,17 +2,23 @@
 import { Panel, PanelGroup, PanelResizeHandle } from "react-resizable-panels";
 
 export default function Home() {
-    return (
-        <PanelGroup direction='horizontal'>
-            <Panel defaultSize={30} minSize={20}>
-                <div>Hi</div>
-            </Panel>
-            <PanelResizeHandle className='w-2 bg-blue-800' />
-            <Panel minSize={30}>middle</Panel>
-            <PanelResizeHandle className='w-2 bg-blue-800' />
-            <Panel defaultSize={30} minSize={20}>
-                <div>hi right</div>
-            </Panel>
-        </PanelGroup>
-    );
+  return (
+    <PanelGroup direction="horizontal" style={{ height: 400 }}>
+      <Panel defaultSize={30} minSize={20}>
+        <div>Hi</div>
+      </Panel>
+      <PanelResizeHandle
+        className="w-2 bg-blue-800"
+        style={{ width: 5, backgroundColor: "red" }}
+      />
+      <Panel minSize={30}>middle</Panel>
+      <PanelResizeHandle
+        className="w-2 bg-blue-800"
+        style={{ width: 5, backgroundColor: "red" }}
+      />
+      <Panel defaultSize={30} minSize={20}>
+        <div>hi right</div>
+      </Panel>
+    </PanelGroup>
+  );
 }