Overview

The AlertDialog component is used to interrupt the user with a mandatory confirmation or action.

Properties

Properties	Description
defaultOpen	The open state of the dialog when it is initially rendered. Use when you do not need to control its open state.
open	The controlled open state of the dialog. Must be used in conjunction with onOpenChange.
onOpenChange	Event handler called when the open state of the dialog changes.
id	A unique identifier for the component. The id is used to generate id attributes for nested components. If no id prop is provided, a generated id will be used.
title	An accessible name to be announced when the dialog is opened.
description	An accessible description to be announced when the dialog is opened.
actionText	The text representative of the action/confirmation button
cancelText	The text representative of the cancel/undo button
actionButtoncolor	Property to change the action/confirmation button without affecting other buttons.
cancelButtoncolor	Property to change action/confirmation button without affecting other buttons.
className	The className property can be used to add a CSS class to a component that accepts styling. In Clutch, the className property powers the visual styling panel and the class name itself is auto-generated. Additional class names can be passed to the component by twirling open the className control and passing in strings.
style	The style property accepts a CSS JavaScript object with camelCased properties rather than a CSS string. Using the style attribute as the primary means of styling elements is generally not recommended. The style is most often used in React applications to add dynamically-computed styles at render time. Learn more about the style property here.
ref	The ref property allows users to attach React refs to the component. Learn more about refs in React here
children	The Children prop allows users to pass other components as a property, enabling users to compose together components.