ConfirmDialog

Asking before an act that can't be taken back: a small dialog with the question, what happens and what stays, the act — red when it destroys — and a way out. It opens over Settings as well as the page.

Removing someone from the team

<ConfirmDialog
  open={open}
  onOpenChange={setOpen}
  title="Remove Katka from the team?"
  description="Their sign-in ends and they leave the calendar. Their bookings stay."
  confirmLabel="Remove"
  cancelLabel="Keep"
  destructive
  onConfirm={remove}
/>

API

Prop	Type	Default	Description
title	string	—	The question, naming who or what.
description	ReactNode	—	What happens, and what stays.
confirmLabel / cancelLabel	string	—	The act, named as on the button that asked; the way out.
destructive	boolean	false	The act destroys: its button is red.
busy	boolean	false	The act is on its way: the buttons wait.

Guidelines

Only for what can't be undone. A change with Undo lands at once, with no asking.
The confirm button says the act again (“Remove”, not “OK”); the way out keeps things as they are (“Keep”).