JS Toast Notification
Yet another JS Toast notification plugin.
Installation
# yarn
yarn add toast-js-insideo
# npm
npm install toast-js-insideoUsage
const toast = new Toast({
text: "This is my favorite Toast message component",
position: "top-right",
messageType: "success",
pauseOnHover: true,
autoClose: 3000,
pauseOnFocusLoss: true,
})Available options
The API methods accepts these options:
| Attribute | Type | Default | Description |
|---|---|---|---|
| text | String | -- | Message text/html (required) |
| type | String | success |
One of success, info, warning, error, default
|
| position | String | bottom-right |
One of top, bottom, top-right, bottom-right,top-left, bottom-left
|
| duration | Number | 3000 |
Visibility duration in milliseconds, set to 0 to keep toast visible |
| dismissible | Boolean | true |
Allow user dismiss by clicking |
| onClick | Function | -- | Do something when user clicks |
| onDismiss | Function | -- | Do something after toast gets dismissed |
| queue | Boolean | false |
Wait for existing to dismiss before showing new |
| pauseOnHover | Boolean | true |
Pause the timer when mouse on over a toast |
Run examples on your localhost
- Clone this repo
- Make sure you have node-js
>=12.15and yarn>=1.22pre-installed - Install dependencies -
yarn install - Run webpack dev server -
yarn start - This should open the demo page at
http://localhost:9000in your default web browser
License
MIT License