Section alert
Section alerts are non-disruptive notifications that provide Success, Error, Warning, Information and Progress messages about a state change in a section of a page.
import { ... } from '@ag.ds-next/react/section-alert';Usage
Section alert components can be imported via the section-alert entrypoint in the @ag.ds-next/react package.
For example:
import { ... } from '@ag.ds-next/react/section-alert';Props
| Prop | Type | Description |
|---|---|---|
| title | string | The title of the alert. |
| tone | SectionAlertTone | The tone of the alert. |
| children? | ReactNode | The content of the alert description. |
| focusOnMount? | boolean | Whether the alert should be focused as soon as it's rendered. |
| focusOnUpdate? | string | number | readonly unknown[] | Focus the alert when a value in this array updates. |
| id? | string | The ID of the alert. |
| onClose? | MouseEventHandler<HTMLButtonElement> | Function to be called when the 'Close' button is pressed. |
| onDismiss? | MouseEventHandler<HTMLButtonElement> | @deprecated use `onClose` instead |
| ref? | Ref<HTMLDivElement> | |
| role? | AriaRole | The role of the alert. |
| tabIndex? | number | The tab index of the alert. |
Source
You can view the full source code for this package on Github.