Sheet
Presents a focused task in an edge-anchored modal panel without replacing the current page.
@rivetui/sheetPreview
Explore each composition interactively, then open its code in the same context.
Default
Open contextual controls from the viewport edge without replacing the current page.
Note
Set
side to right, left, top, orbottom according to the surrounding layout.Environment / Production
Runtime configuration
Review regional and scaling controls without leaving the deployment.
Long content
Keep the header and footer fixed while the body scrolls independently.
Header and footer stay fixed while the body handles long content independently.
Registry
Installation
Add the component source and its declared dependencies with the shadcn CLI.
Install component
bunx --bun shadcn@latest add @rivetui/sheetPublic interface
API reference
Component-specific props are listed here. Native element and Base UI props continue to pass through.
Sheet
| Prop | Type | Default |
|---|---|---|
open | boolean | — |
defaultOpen | boolean | false |
onOpenChange | (open: boolean, details) => void | — |
modal | boolean | true |
SheetContent
| Prop | Type | Default |
|---|---|---|
side | "top" | "right" | "bottom" | "left" | "right" |
showCloseButton | boolean | true |
closeLabel | string | "Close sheet" |
className | string | — |