@stanfordspezi/spezi-web-design-system/dist/src/molecules/ConfirmDeleteDialog/ConfirmDeleteDialog.d.ts

Stanford Biodesign Digital Health Spezi Web Design System

import { ComponentProps, MouseEventHandler, ReactNode } from 'react';
import { Dialog } from '../../components/Dialog';
export interface ConfirmDeleteDialogProps extends ComponentProps<typeof Dialog> {
    /**
     * Name of the entity type being deleted.
     * Provide in singular or plural form as appropriate for the context.
     * @example "user" — when deleting a single user
     * @example "3 users" — when deleting multiple users
     */
    entityName?: ReactNode;
    /**
     * Distinctive item identifier(s) shown before confirming deletion.
     * Pass a single value or an array for bulk deletion.
     * When more than 4 items are provided, only the first 2 are listed
     * followed by "and N more".
     * @example "example@example.com"
     * @example ["alice@example.com", "bob@example.com"]
     */
    itemName?: ReactNode | ReactNode[];
    onDelete: MouseEventHandler;
}
/**
 * A dialog component for confirming destructive actions like deletion.
 * Built on top of the Dialog component, it provides a consistent interface
 * for confirming irreversible actions.
 *
 * Supports both single and bulk deletion via the `itemName` prop.
 *
 * @example Single item
 * ```tsx
 * <ConfirmDeleteDialog
 *   entityName="user"
 *   itemName="john@example.com"
 *   onDelete={handleDelete}
 *   open={isOpen}
 *   onOpenChange={setIsOpen}
 * />
 * ```
 *
 * @example Multiple items
 * ```tsx
 * <ConfirmDeleteDialog
 *   entityName="3 users"
 *   itemName={["alice@example.com", "bob@example.com", "carol@example.com"]}
 *   onDelete={handleDelete}
 *   open={isOpen}
 *   onOpenChange={setIsOpen}
 * />
 * ```
 */
export declare const ConfirmDeleteDialog: ({ entityName, itemName, onDelete, ...props }: ConfirmDeleteDialogProps) => import("react").JSX.Element;