Based on the original sonner
Documentation
Easy to use & setup
Accessible
Uses your MUI theme
Lightweight
Pause on hover
Supports Emojis
RTL support
Responsive
Dismiss on drag
Stacked notifications
Promise API
Possibility to update a toast
Installation
npm install mui-sonner
Add Toaster to your app.
<div><Toaster/></div
Start toasting - call it from anywhere!
toast("Hello World")
You can customise the type of toast you want to render, and pass in additional options as an object in the second argument.
toast("Hello world!")
Swipe direction changes depending on the position.
<Toaster position='top-left' />
By default the toast is styled to match your MUI theme's Alert and AlertTitle components.
If you want to override your default theme styles, you can do this in multiple ways
<Toaster alertSx={{p:2}}/>