react-alert-template-basic-with-icons
Basic alert template with icons for react-alert
Installation
$ npm install --save react-alert-template-basic-with-icons
Usage
You can use this package with react-alert
by importing AlertTemplate from this package and giving it to the AlertProvider from react-alert
. Alternatively, you can create a styled alert component, and then give the styled component to the AlertProvider as the template. You can override the default template style, and change the icon colors like so:
// StyledAlertTemplate.js; // Template style overridesconst styleOverrides = backgroundColor: 'white' color: 'black' width: '450px' <AlertTemplate ...props iconColors= close: 'black' style= ...propsstyle ...styleOverrides />
You can also create your own custom alert template and use the exposed icons. You can import the icons like so:
//MyAlertTemplate.js ; const MyAlertTemplate = {} //Create your template with the icon components here
Options
You can provide an iconColors
prop to AlertTemplate in order to change the color of the icons. It takes an object of the following type:
iconColors?: info?: string success?: string error?: string close?: string
The default colors are:
info: '#2E9AFE'success: '#31B404'error: '#FF0040'close: '#FFFFFF'