Components
Dialog primitive with 20 variants covering the daliagents.com console surfaces - go-live confirms, Agent Care upsell and cancel, invites, OTP verification, dashboard sharing, and engagement terms for Dali Agents.

import { CircleCheckIcon } from 'lucide-react'
import { Button } from '@/components/ui/button'
import {
Dialog,
DialogClose,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from '@/components/ui/dialog'
export function Dialog12() {
return (
<Dialog>
<DialogTrigger asChild>
<Button variant="outline">Complete setup</Button>
</DialogTrigger>
<DialogContent className="sm:max-w-sm">
<DialogHeader className="items-center text-center">
<div className="bg-primary/10 text-primary mb-1 flex size-14 items-center justify-center rounded-full">
<CircleCheckIcon />
</div>
<DialogTitle>Your agent is live</DialogTitle>
<DialogDescription>
It passed the acceptance test and is now handling real work. Track
every run from your Dali console.
</DialogDescription>
</DialogHeader>
<DialogFooter className="sm:justify-center">
<DialogClose asChild>
<Button className="w-full sm:w-auto">Open console</Button>
</DialogClose>
</DialogFooter>
<a
href="https://daliagents.com"
target="_blank"
rel="noreferrer"
className="text-muted-foreground/60 hover:text-muted-foreground mx-auto text-[10px] tracking-wide transition-colors"
>
daliagents.com
</a>
</DialogContent>
</Dialog>
)
}
export default Dialog12


















Part of Dali Agents — browse the full library on 21st.dev.