@primer/react
Version:
An implementation of GitHub's Primer Design System using React
66 lines • 2.32 kB
TypeScript
import type React from 'react';
import type { DialogWidth, DialogHeight } from '../Dialog/Dialog';
/**
* Props to customize the ConfirmationDialog.
*/
export interface ConfirmationDialogProps {
/**
* Required. This callback is invoked when a gesture to close the dialog
* is performed. The first argument indicates the gesture.
*/
onClose: (gesture: 'confirm' | 'close-button' | 'cancel' | 'escape') => void;
/**
* Required. The title of the ConfirmationDialog. This is usually a brief
* question.
*/
title: React.ReactNode;
/**
* The text to use for the cancel button. Default: "Cancel".
*/
cancelButtonContent?: React.ReactNode;
/**
* The text to use for the confirm button. Default: "OK".
*/
confirmButtonContent?: React.ReactNode;
/**
* The type of button to use for the confirm button. Default: Button.
*/
confirmButtonType?: 'normal' | 'primary' | 'danger';
/**
* Additional class names to apply to the dialog
*/
className?: string;
/**
* The width of the dialog.
* small: 296px
* medium: 320px
* large: 480px
* xlarge: 640px
* @default 'medium'
*/
width?: DialogWidth;
/**
* The height of the dialog.
* small: 480px
* large: 640px
* auto: variable based on contents
*/
height?: DialogHeight;
}
/**
* A ConfirmationDialog is a special kind of dialog with more rigid behavior. It
* is used to confirm a user action. ConfirmationDialogs always have exactly
* two buttons: one to cancel the action and one to confirm it. No custom
* rendering capabilities are provided for ConfirmationDialog.
*/
export declare const ConfirmationDialog: React.FC<React.PropsWithChildren<ConfirmationDialogProps>>;
export type ConfirmOptions = Omit<ConfirmationDialogProps, 'onClose'> & {
content: React.ReactNode;
};
/**
* This hook takes no parameters and returns an `async` function, `confirm`. When `confirm`
* is called, it shows the confirmation dialog. When the dialog is dismissed, a promise is
* resolved with `true` or `false` depending on whether or not the confirm button was used.
*/
export declare function useConfirm(): (options: ConfirmOptions) => Promise<boolean>;
//# sourceMappingURL=ConfirmationDialog.d.ts.map