@axa-fr/react-toolkit-alert
v3.0.2
Published
1. [Installation](#installation) 2. [Alert](#alert) 3. [AlertCore](#alertcore) 4. [Alert With Type](#alert-with-type)
Downloads
464
Maintainers
Keywords
Readme
@axa-fr/react-toolkit-alert
Installation
npm i @axa-fr/react-toolkit-alert
| classModifier / type | | -------------------- | | danger | | info | | error | | success |
Alert
Import
import Alert from '@axa-fr/react-toolkit-alert';
import '@axa-fr/react-toolkit-alert/dist/af-alert.css';
Use
const AlertComponent = () => (
<Alert
classModifier="danger"
icon="glyphicon glyphicon-alert"
title="Warning: information is missing"
/>
);
export default AlertComponent;
AlertCore
Import
import { AlertCore } from '@axa-fr/react-toolkit-alert';
import '@axa-fr/react-toolkit-alert/dist/af-alert.css';
Use
const MyErrorAlert = () => (
<AlertCore
classModifier="error"
iconClassName="glyphicon glyphicon-minus-sign"
title="Error :">
<ul>
<li>Name is required</li>
<li>Firstname is required</li>
<li>Email is required</li>
<li>The date format is invalid</li>
</ul>
</AlertCore>
);
export default MyErrorAlert;
Alert With Type
Import
import { AlertWithType } from '@axa-fr/react-toolkit-alert';
import '@axa-fr/react-toolkit-alert/dist/af-alert.css';
Use
const MyInfoAlert = () => (
<AlertWithType
type="info"
title="Info: you can also contact an advisor by phone"
/>
);
export default MyInfoAlert;