The dialog kit also supports customizing your dialog with a compound component structure.
This allows for greater flexibility and more complex dialogs.



The dialog will create a scroll container automatically when the text exceeds the height of the page.
No prop or configuration is needed.

Overlay Click

When shouldCloseOnOverlayClick is explicitly set to false, click events on the overlay will not close the modal.
By default, shouldCloseOnOverlayClick is set to true.

Status Alert

This shows the different alert statuses that can be used for dialog boxes. These all have two buttons which is a default

Stacked Button Alert

This is designed to show you how the buttons can stack with different alert styles. It also has a link style for the buttons for the mobile views.