# @askrjs/ui/alert-dialog

> Published API exports for @askrjs/ui/alert-dialog.

Source: [https://askrjs.com/docs/reference/api/ui/alert-dialog](https://askrjs.com/docs/reference/api/ui/alert-dialog)

Status: stable. Packages: @askrjs/ui/alert-dialog.

**Published packages are authoritative.** Examples may lag behind a published contract. When guidance differs, verify the exports and TypeScript declarations in your installed package, then file an issue.

## Exports

This entrypoint publishes 30 exports from the declarations shipped by @askrjs/ui.

### `ALERT_DIALOG_A11Y_CONTRACT`

```ts
ALERT_DIALOG_A11Y_CONTRACT: { readonly CONTENT_ROLE: "alertdialog"; readonly LABELLED_BY_ATTRIBUTE: "aria-labelledby"; readonly DESCRIBED_BY_ATTRIBUTE: "aria-describedby"; readonly ACTION_REQUIREMENTS: { readonly hasPrimaryAction: true; readonly hasCancelAction: true; }; }
```

Alert dialog accessibility contract.

### `AlertDialog`

```ts
AlertDialog: (props: AlertDialogProps) => JSX.Element
```

Renders a part of `alert-dialog`.

### `AlertDialogA11yContract`

```ts
AlertDialogA11yContract: typeof ALERT_DIALOG_A11Y_CONTRACT
```

Type of the Alert Dialog A11y Contract object.

### `AlertDialogAction`

```ts
DialogClose: { (props: DialogCloseProps): JSX.Element; (props: DialogCloseAsChildProps): JSX.Element; }
```

Renders the `dialog-close` part of `dialog`.

Supports polymorphic rendering via `asChild`.

### `AlertDialogActionAsChildProps`

```ts
AlertDialogActionAsChildProps: DialogCloseAsChildProps
```

Props for the `asChild` (polymorphic) rendering of Alert Dialog Action.

- `asChild`: asChild: true;

- `children`: children: JSXElement;

- `disabled`: disabled?: boolean | undefined;

- `onPress`: onPress?: ((event: PressEvent) => void) | undefined;

- `ref`: ref?: Ref<Element>;

- `type`: type?: undefined;

### `AlertDialogActionProps`

```ts
AlertDialogActionProps: DialogCloseProps
```

Props for Alert Dialog Action.

- `asChild`: asChild?: false | undefined;

- `children`: children?: unknown;

- `disabled`: disabled?: boolean | undefined;

- `onPress`: onPress?: ((event: PressEvent) => void) | undefined;

- `ref`: ref?: Ref<HTMLButtonElement>;

- `type`: type?: "button" | "submit" | "reset" | undefined;

### `AlertDialogCancel`

```ts
DialogClose: { (props: DialogCloseProps): JSX.Element; (props: DialogCloseAsChildProps): JSX.Element; }
```

Renders the `dialog-close` part of `dialog`.

Supports polymorphic rendering via `asChild`.

### `AlertDialogCancelAsChildProps`

```ts
AlertDialogCancelAsChildProps: DialogCloseAsChildProps
```

Props for the `asChild` (polymorphic) rendering of Alert Dialog Cancel.

- `asChild`: asChild: true;

- `children`: children: JSXElement;

- `disabled`: disabled?: boolean | undefined;

- `onPress`: onPress?: ((event: PressEvent) => void) | undefined;

- `ref`: ref?: Ref<Element>;

- `type`: type?: undefined;

### `AlertDialogCancelProps`

```ts
AlertDialogCancelProps: DialogCloseProps
```

Props for Alert Dialog Cancel.

- `asChild`: asChild?: false | undefined;

- `children`: children?: unknown;

- `disabled`: disabled?: boolean | undefined;

- `onPress`: onPress?: ((event: PressEvent) => void) | undefined;

- `ref`: ref?: Ref<HTMLButtonElement>;

- `type`: type?: "button" | "submit" | "reset" | undefined;

### `AlertDialogContent`

```ts
AlertDialogContent: (props: AlertDialogContentProps | AlertDialogContentAsChildProps) => JSX.Element
```

Renders a part of `alert-dialog`.

Supports polymorphic rendering via `asChild`.

### `AlertDialogContentAsChildProps`

```ts
AlertDialogContentAsChildProps: DialogContentAsChildProps
```

Props for the `asChild` (polymorphic) rendering of Alert Dialog Content.

- `asChild`: asChild: true;

- `children`: children: JSXElement;

- `forceMount`: forceMount?: boolean | undefined;

- `onDismiss`: onDismiss?: (() => void) | undefined;

- `onEscapeKeyDown`: onEscapeKeyDown?: ((event: KeyboardEvent) => void) | undefined;

- `onInteractOutside`: onInteractOutside?: ((event: Event) => void) | undefined;

- `onPointerDownOutside`: onPointerDownOutside?: ((event: PointerEvent) => void) | undefined;

- `ref`: ref?: Ref<Element>;

- `role`: role?: "alertdialog" | "dialog" | undefined;

### `AlertDialogContentOwnProps`

```ts
AlertDialogContentOwnProps: DialogContentOwnProps
```

Own props for Alert Dialog Content, before merging with native element attributes.

- `forceMount`: forceMount?: boolean | undefined;

- `onDismiss`: onDismiss?: (() => void) | undefined;

- `onEscapeKeyDown`: onEscapeKeyDown?: ((event: KeyboardEvent) => void) | undefined;

- `onInteractOutside`: onInteractOutside?: ((event: Event) => void) | undefined;

- `onPointerDownOutside`: onPointerDownOutside?: ((event: PointerEvent) => void) | undefined;

- `role`: role?: "alertdialog" | "dialog" | undefined;

### `AlertDialogContentProps`

```ts
AlertDialogContentProps: DialogContentProps
```

Props for Alert Dialog Content.

- `asChild`: asChild?: false | undefined;

- `children`: children?: unknown;

- `forceMount`: forceMount?: boolean | undefined;

- `onDismiss`: onDismiss?: (() => void) | undefined;

- `onEscapeKeyDown`: onEscapeKeyDown?: ((event: KeyboardEvent) => void) | undefined;

- `onInteractOutside`: onInteractOutside?: ((event: Event) => void) | undefined;

- `onPointerDownOutside`: onPointerDownOutside?: ((event: PointerEvent) => void) | undefined;

- `ref`: ref?: Ref<HTMLDivElement>;

- `role`: role?: "alertdialog" | "dialog" | undefined;

### `AlertDialogDescription`

```ts
DialogDescription: { (props: DialogDescriptionProps): JSX.Element; (props: DialogDescriptionAsChildProps): JSX.Element; }
```

Renders the `dialog-description` part of `dialog`.

Supports polymorphic rendering via `asChild`.

### `AlertDialogDescriptionAsChildProps`

```ts
AlertDialogDescriptionAsChildProps: DialogDescriptionAsChildProps
```

Props for the `asChild` (polymorphic) rendering of Alert Dialog Description.

- `asChild`: asChild: true;

- `children`: children: JSXElement;

- `ref`: ref?: Ref<Element>;

### `AlertDialogDescriptionProps`

```ts
AlertDialogDescriptionProps: DialogDescriptionProps
```

Props for Alert Dialog Description.

- `asChild`: asChild?: false | undefined;

- `children`: children?: unknown;

- `ref`: ref?: Ref<HTMLParagraphElement>;

### `AlertDialogOverlay`

```ts
DialogOverlay: { (props: DialogOverlayProps): JSX.Element | null; (props: DialogOverlayAsChildProps): JSX.Element | null; }
```

Renders the `dialog-overlay` part of `dialog`.

With `@askrjs/themes/default`, the overlay is fully styled out of the box
with the shared backdrop token, blur, stacking, and fade animation. Standard
Dialog and AlertDialog usage requires no additional overlay CSS; customize
the theme tokens instead of applying a competing background class.

Supports polymorphic rendering via `asChild`.

### `AlertDialogOverlayAsChildProps`

```ts
AlertDialogOverlayAsChildProps: DialogOverlayAsChildProps
```

Props for the `asChild` (polymorphic) rendering of Alert Dialog Overlay.

- `asChild`: asChild: true;

- `children`: children: JSXElement;

- `forceMount`: forceMount?: boolean | undefined;

- `ref`: ref?: Ref<Element>;

### `AlertDialogOverlayOwnProps`

```ts
AlertDialogOverlayOwnProps: DialogOverlayOwnProps
```

Own props for Alert Dialog Overlay, before merging with native element attributes.

- `forceMount`: forceMount?: boolean | undefined;

### `AlertDialogOverlayProps`

```ts
AlertDialogOverlayProps: DialogOverlayProps
```

Props for Alert Dialog Overlay.

- `asChild`: asChild?: false | undefined;

- `children`: children?: unknown;

- `forceMount`: forceMount?: boolean | undefined;

- `ref`: ref?: Ref<HTMLDivElement>;

### `AlertDialogOwnProps`

```ts
AlertDialogOwnProps: DialogProps
```

Own props for Alert Dialog, before merging with native element attributes.

- `children`: children?: unknown;

- `defaultOpen`: defaultOpen?: boolean | undefined;

- `id`: id?: string | undefined;

- `modal`: modal?: boolean | undefined;

- `onOpenChange`: onOpenChange?: ((open: boolean) => void) | undefined;

- `open`: open?: boolean | undefined;

### `AlertDialogPortal`

```ts
DialogPortal: (props: DialogPortalProps) => JSX.Element | null
```

Renders a part of `dialog`.

### `AlertDialogPortalProps`

```ts
AlertDialogPortalProps: DialogPortalProps
```

Props for Alert Dialog Portal.

- `children`: children?: unknown;

### `AlertDialogProps`

```ts
AlertDialogProps: DialogProps
```

Props for Alert Dialog.

- `children`: children?: unknown;

- `defaultOpen`: defaultOpen?: boolean | undefined;

- `id`: id?: string | undefined;

- `modal`: modal?: boolean | undefined;

- `onOpenChange`: onOpenChange?: ((open: boolean) => void) | undefined;

- `open`: open?: boolean | undefined;

### `AlertDialogTitle`

```ts
DialogTitle: { (props: DialogTitleProps): JSX.Element; (props: DialogTitleAsChildProps): JSX.Element; }
```

Renders the `dialog-title` part of `dialog`.

Supports polymorphic rendering via `asChild`.

### `AlertDialogTitleAsChildProps`

```ts
AlertDialogTitleAsChildProps: DialogTitleAsChildProps
```

Props for the `asChild` (polymorphic) rendering of Alert Dialog Title.

- `asChild`: asChild: true;

- `children`: children: JSXElement;

- `ref`: ref?: Ref<Element>;

### `AlertDialogTitleProps`

```ts
AlertDialogTitleProps: DialogTitleProps
```

Props for Alert Dialog Title.

- `asChild`: asChild?: false | undefined;

- `children`: children?: unknown;

- `ref`: ref?: Ref<HTMLHeadingElement>;

### `AlertDialogTrigger`

```ts
AlertDialogTrigger: (props: AlertDialogTriggerProps | AlertDialogTriggerAsChildProps) => JSX.Element
```

Renders a part of `alert-dialog`.

Supports polymorphic rendering via `asChild`.

### `AlertDialogTriggerAsChildProps`

```ts
AlertDialogTriggerAsChildProps: DialogTriggerAsChildProps
```

Props for the `asChild` (polymorphic) rendering of Alert Dialog Trigger.

- `asChild`: asChild: true;

- `children`: children: JSXElement;

- `disabled`: disabled?: boolean | undefined;

- `onPress`: onPress?: ((event: PressEvent) => void) | undefined;

- `ref`: ref?: Ref<Element>;

- `type`: type?: undefined;

### `AlertDialogTriggerProps`

```ts
AlertDialogTriggerProps: DialogTriggerProps
```

Props for Alert Dialog Trigger.

- `asChild`: asChild?: false | undefined;

- `children`: children?: unknown;

- `disabled`: disabled?: boolean | undefined;

- `onPress`: onPress?: ((event: PressEvent) => void) | undefined;

- `ref`: ref?: Ref<HTMLButtonElement>;

- `type`: type?: "button" | "submit" | "reset" | undefined;

## Documentation navigation

[Previous](https://askrjs.com/docs/reference/api/ui/accordion/index.md) | [Next](https://askrjs.com/docs/reference/api/ui/collapsible/index.md)