shadcn.io is an independent project built on shadcn/ui
The title is Success. The text says the changes have been saved. Continue is the only button. Nothing in the demo was saved.
Use it when a silent update would leave people unsure. A small save is less interrupting as a Toast. In Solid, Ark UI does not know whether a save worked.
Installation
Anatomy
Usage
<AlertDialog>
<AlertDialogTrigger asChild={props => <Button {...props()}>Complete Action</Button>} />
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Success!</AlertDialogTitle>
<AlertDialogDescription>
Your changes have been saved successfully.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogClose asChild={props => <AlertDialogAction {...props()}>Continue</AlertDialogAction>} />
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>FAQ
Success dialog or toast?
A dialog for significant completions people should acknowledge, like a payment or an account created. A toast for routine ones, like a saved setting.
What should the title say?
Something short and plain: Success!, Saved!, Done!. The description says what actually happened.
What goes in the description?
What completed, in past tense and plain words: Your changes have been saved successfully.
API Reference
Alert Dialog
Sets asChild and props. The rest is on the Alert Dialog page.
Button
Sets props. The rest is on the Button page.
