Confirmation Modal

ConfirmationModal is a generic confirmation dialog for destructive or irreversible actions like deletion. Requires explicit user confirmation before proceeding.

Import


import { ConfirmationModal } from "@phpcreation/frontend-crud-react-nextjs-bundle/components/ConfirmationModal";

Usage


import { ConfirmationModal } from "...";
 
<ConfirmationModal
  open={deleteOpen}
  onOpenChange={setDeleteOpen}
  title="Delete Invoice"
  description="This will permanently delete the invoice. This action cannot be undone."
  confirmLabel="Delete"
  confirmVariant="destructive"
  onConfirm={async () => {
    await deleteInvoice(entity.id);
    setDeleteOpen(false);
    router.push("/invoices");
  }}
/>

Props

Prop	Type	Default	Description
`open`	`boolean`	—	Modal open state
`onOpenChange`	`(open: boolean) => void`	—	Open state handler
`title`	`string`	`"Are you sure?"`	Dialog title
`description`	`string`	—	Warning text
`confirmLabel`	`string`	`"Confirm"`	Confirm button label
`cancelLabel`	`string`	`"Cancel"`	Cancel button label
`confirmVariant`	`ButtonVariant`	`"default"`	Confirm button variant
`onConfirm`	`() => void \| Promise<void>`	—	Confirm action
`loading`	`boolean`	`false`	Show spinner on confirm button

Confirmation Modal

Import

Usage

Props

Related