Overlays
Sheet
A panel that slides in from any edge of the screen — filters, detail views and secondary forms. Use it when the person still needs the context of the page behind.
Purpose
A Sheet keeps the page visible behind it, which is what separates it from
Dialog. Set the edge with side: top, bottom, left or
right.
Sides
Accessibility & keyboard
- Focus is trapped inside while open and returned to the trigger on close.
- Give every sheet a
SheetTitle— it is what screen readers announce. - Keyboard: Esc closes; Tab cycles within the panel.
Alert dialog
A confirmation that must not be dismissed by accident. Unlike Dialog it cannot be closed by clicking the overlay or pressing Esc — the person has to choose. Use it for every destructive or irreversible action.
PopoverDraft
A lightweight surface anchored to its trigger, for a small form or a snippet of contextual content. Unlike a tooltip it can hold interactive controls.