Resizable
Panels that split a layout and resize by dragging the handle between them.
Logs
10:42:01 sirdar-prod-eu scaling up: 4 -> 6 replicas
10:42:04 sirdar-prod-eu replica-6 healthy
10:43:12 sirdar-prod-eu request p99 118ms
Terminal
$ namche deploy sirdar --region eu-west
Install
pnpm dlx shadcn@latest add @namche/resizableUsage
import {
ResizableHandle,
ResizablePanel,
ResizablePanelGroup,
} from '@/components/ui/resizable';
<ResizablePanelGroup className="h-64">
<ResizablePanel defaultSize={65} minSize={30}>
Logs
</ResizablePanel>
<ResizableHandle withHandle />
<ResizablePanel defaultSize={35} minSize={20}>
Terminal
</ResizablePanel>
</ResizablePanelGroup>Built on react-resizable-panels. ResizablePanelGroup lays panels out
along its orientation (horizontal by default, or vertical); each
ResizablePanel takes defaultSize, minSize, and maxSize as percentages
of the group. ResizableHandle needs an explicit height on its parent group
— it has no intrinsic size to resize against.