Resizable

Preview

Installation

npx shadcn@latest add @cubby-ui/resizable

Usage

import {
  ResizablePanelGroup,
  ResizablePanel,
  ResizableHandle,
} from "@/components/ui/cubby-ui/resizable";

<ResizablePanelGroup>
  <ResizablePanel />
  <ResizableHandle />
</ResizablePanelGroup>

Examples

Vertical Layout

Stack resizable panels vertically.

Three Panels

Create layouts with three resizable sections.

Min and Max Size

Set minimum and maximum panel sizes.

Custom Handle

Use custom styled resize handles.

Nested Panels

Create complex layouts with nested resizable panels.