Minimal toast notifications for React.
npm install react-toast

Install with yarn
``sh`
yarn add react-toast
Install with NPM
`sh`
npm install react-toast
`jsx
import { ToastContainer, toast } from 'react-toast'
const App = () => {
const wave = () => toast('Hi there 👋')
return (
$3
Demo on CodeSandbox.
$3
#### Toast Container
To use
react-toast, you need to put ToastContainer in a top-level component in your application. e.g. App.jsIt can take some props, here's a list of them:
| Props | Type | Description | Default |
| :------------ | :---------------------------------------------------------------------------------------------- | :---------------- | :------------ |
|
position | top-left \| top-center \| top-right \| bottom-left \| bottom-center \| bottom-right | position of toast | bottom-left |
| deplay (ms) | number | delay for toast | 6000 |#### Toast
There are 4 base toast type available,
success, error, info and warn. For instance:`js
const success = () => toast.success('Message sent successfully!')
`or
`js
fetch('someRandomUrl')
.then(res => res.json())
.then(res => console.log(res))
.catch(err => toast.error(err.message))
`Custom toast
You can display custom styled toasts, here's an example and a list of options that are available for customization:
`js
const customToast = () =>
toast('Morning! Have a good day.', {
backgroundColor: '#8329C5',
color: '#ffffff',
})
`| Property | Type | Description | Default |
| :---------------- | :------- | :------------------------ | :------------------------------------------------ |
|
backgroundColor | string | background color of toast | based on toast type, e.g. success will be green |
| color | string | color of text in toast | #ffffff` |