Overlays components
10 Overlays components for React, shadcn, Vue 3, Laravel Blade and HTML + Alpine.js: AlertDialog, ConfirmProvider, ContextMenu, Dialog, Drawer, DropdownMenu, HoverCard, Popover, Sheet, Tooltip.
- AlertDialogModal that interrupts to ask for an explicit answer before a consequential action, plus a ConfirmButton shorthand. Wraps Base UI AlertDialog.
- ConfirmProviderOne app-wide confirm dialog you can await from any handler, so `if (!(await confirm({ title }))) return;` replaces window.confirm with a styled, localised AlertDialog.
- ContextMenuRight-click (or long-press) menu for a region, with items, checkbox and radio items, groups, shortcuts and submenus. Wraps Base UI ContextMenu and shares DropdownMenu styling.
- DialogModal dialog for short focused tasks and confirmations, with backdrop, focus trap and a built-in close button. Wraps Base UI Dialog.
- DrawerMobile bottom sheet on Base UI Dialog with a drag handle and swipe-down-to-close; snaps back below the threshold and respects reduced motion.
- DropdownMenuAction menu opened from a trigger, with items, checkbox and radio items, groups, shortcuts and submenus. Wraps Base UI Menu.
- HoverCardRich preview card shown when a link is hovered or focused, for sighted pointer users. Wraps Base UI PreviewCard.
- PopoverAnchored floating panel opened by a click on a trigger, holding rich content such as text, forms or actions. Wraps Base UI Popover.
- SheetSide-over panel that slides from the inline-start, inline-end or bottom edge, with header, scrolling body and footer. Wraps Base UI Dialog.
- TooltipShort supplementary label shown on hover and keyboard focus of a trigger. Shorthand plus composable parts over Base UI Tooltip.