Dialog
Centered window that pauses work to ask for a decision.
Usage
import { Dialog } from '@smartui/react';
import '@smartui/react/styles.css';When to use
- Confirming an action that cannot be undone.
When not to use
- Long forms. Use a page or a Sheet.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
trigger | ReactNode | - | Element that opens it. |
title | string | required | |
description | string | - | |
kind | 'default' | 'danger' | 'default' | |
primaryAction | { label, onPress? } | required | |
cancelLabel | string | 'Cancel' | |
isOpen, onOpenChange | boolean, (open) => void | - |
Accessibility
- Focus is trapped inside and returns to the trigger on close.
- The destructive action is never the initial focus.