🦚 TypeScript Toastify allows you to add toast notifications to your web app easily.
Light.webm
dark.webm
> npm i typescript-toastify
- Easy to set up
- Super easy to customize
- Has
onClose
function, which runs function you define when toast closes - Can remove a toast programmatically
- Update toast in between
- Pause toast when the window loses focus 👁
- pause toast on toast hover
- Fancy progress bar to display the remaining time
- Dark mode 🌑
- set custom position
- set toast closing time
- can use diffrent type of toast like info, error, warning
- And much more !
import Toast from 'typescript-toastify';
const toast = new Toast({
position: 'top-right',
toastMsg: 'Hello, world!',
autoCloseTime: 3000,
onClose: () => {
alert('TS Toast 🍞');
},
canClose: true,
showProgress: true,
pauseOnHover: true,
pauseOnFocusLoss: true,
type: 'info',
theme: 'dark',
});
A demo is worth a thousand words
Check the documentation to get you started!
Licensed under MIT