yarn add @twilio-paste/alert - or - yarn add @twilio-paste/core
import {Alert} from '@twilio-paste/core/alert';
const Component = () => <Alert variant="error">There is an error in the system.</Alert>;
element
Overrides the default element name to apply unique styles with the Customization Provider
- Type
any
- Default
'ALERT'
i18nDismissLabel
Title for dismiss label. Only necessary when using onDismiss.
- Type
string
- Default
'Dismiss alert'
i18nErrorLabel
Title for error icon when using Error Alerts.
- Type
string
- Default
'(error)'
i18nNeutralLabel
Title for info icon when using Neutral Alerts.
- Type
string
- Default
'(information)'
i18nWarningLabel
Title for info icon when using Warning Alerts.
- Type
string
- Default
'(warning)'
onDismiss
Function to run on dismiss of the Alert. Adds a close button.
- Type
() => void
- Default
null
role
ARIA role applied to the Alert.
- Type
string
- Default
'status' for Neutral Alerts, 'error' for Error Alerts, 'warning' for Warning Alerts
variant
- Type
any
Inherited props
Paste components will often extend native HTML elements and as a result will inherit or extend their available properties. Below is a list of the props this component has inherited and are also available to use.