Overlays

Dialogs, dropdown menus, and edge drawers.

Dialog

A focus-trapped modal with a header, body, footer, and close actions.

  • Dialog
  • DialogTrigger
  • DialogContent
  • DialogHeader
  • DialogTitle
  • DialogDescription
  • DialogFooter
  • DialogClose
  • DialogBackdrop

Sheet

An edge drawer (the mobile-nav primitive) with a header, body, and footer.

  • Sheet
  • SheetTrigger
  • SheetContent
  • SheetHeader
  • SheetTitle
  • SheetDescription
  • SheetFooter
  • SheetClose
  • SheetBackdrop
  • SheetPortal