Modal Directory

Description

Modals are elements that overlay base UI to communicate a focused message or to prompt feedback. Pando exposes several versions of this experience, but does not provide a specifically named <Modal /> component.

Usage

Some of Pando’s overlay experiences are meant to be blocking to require a user action, while others allow the user to continue to interact with base UI. Be sure to choose the right experience for your use case.

Modal Directory

Blocking experiences

Pando provides a few different versions of the dialog element, which indicates a mandatory user action. Each of these versions is designed to be used in different contexts.

<AlertDialog /> is the collection of components that comprise a modal. Use this collection of components and/or recipes to have the ability to fully customize your dialog experience. Alert Dialog is a blocking experience to require a user action.

<ConfirmDialog> is meant to interrupt the user with a mandatory confirmation or action. This is a blocking experience.

<PromptDialog /> is used to interrupt the user with a mandatory validation input and action. This is a blocking experience.

Non-blocking experiences

Pando provides a few different versions of non-blocking overlay experiences.

<Popover /> is meant to display a focused message or prompt feedback in an element floating around a trigger. This is a non-blocking experience.

<Toast /> is a low priority message that is displayed in a non-blocking manner. Toasts are meant to be used for feedback or confirmation of an action. This is a non-blocking experience.

<Tooltip /> is used to display a helpful message when hovering over an element. This is a non-blocking experience.