Skip to content
RivetUI

Sheet

Presents a focused task in an edge-anchored modal panel without replacing the current page.

@rivetui/sheet

Preview

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/sheet
Inspect registry item

Public interface

API reference

Component-specific props are listed here. Native element and Base UI props continue to pass through.

Sheet

PropTypeDefault
openboolean—
defaultOpenbooleanfalse
onOpenChange(open: boolean, details) => void—
modalbooleantrue

SheetContent

PropTypeDefault
side"top" | "right" | "bottom" | "left""right"
showCloseButtonbooleantrue
closeLabelstring"Close sheet"
classNamestring—
Rivet UI / SheetComponents engineered, not decorated.