Alert Dialog

Critical confirmation modal with glass overlay, uppercase mono headline, and contrasted action buttons that match the dashboard tone.

Alert dialog component

Delete Workspace

Uses the glass content surface and mono typography to emphasize the destructive action.

Installation

pnpm dlx shadcn@latest add @omni/alert-dialog

Usage

import {
  AlertDialog,
  AlertDialogTrigger,
  AlertDialogContent,
  AlertDialogHeader,
  AlertDialogTitle,
  AlertDialogDescription,
  AlertDialogFooter,
  AlertDialogCancel,
  AlertDialogAction,
} from "@/components/ui/alert-dialog"

<AlertDialog>
  <AlertDialogTrigger asChild>
    <Button variant="muted">Delete workspace</Button>
  </AlertDialogTrigger>
  <AlertDialogContent>
    <AlertDialogHeader>
      <AlertDialogTitle>DELETE</AlertDialogTitle>
      <AlertDialogDescription>
        Removing a workspace permanently deletes logs and metrics.
      </AlertDialogDescription>
    </AlertDialogHeader>
    <AlertDialogFooter>
      <AlertDialogCancel>Cancel</AlertDialogCancel>
      <AlertDialogAction>Confirm</AlertDialogAction>
    </AlertDialogFooter>
  </AlertDialogContent>
</AlertDialog>