Sheet
A panel that slides in from the edge of the screen. Supports top, right, bottom, and left sides. Built on Base UI Dialog primitive.
Installation
npx shadcn add sheet --registry https://ui.ch.sh/r
Usage
import {
Sheet,
SheetTrigger,
SheetContent,
SheetHeader,
SheetTitle,
SheetDescription,
} from "@/components/ui/sheet"
export default function Example() {
return (
<Sheet>
<SheetTrigger>Open</SheetTrigger>
<SheetContent>
<SheetHeader>
<SheetTitle>Title</SheetTitle>
<SheetDescription>Description</SheetDescription>
</SheetHeader>
</SheetContent>
</Sheet>
)
}