Snackbar
Ready for production
Responsive
Simple Use
Show Code
Edit on Stackblitz
Show Snackbar
Message
Show Code
Edit on Stackblitz
Show Snackbar
Action, action click
Show Code
Edit on Stackblitz
- action="undo"
- onActionClick={() => console.log("Acion Clicked")}
Show Example
Disabled Use
Show Code
Edit on Stackblitz
Show Disabled Snackbar
Show Dismiss and onClose event
Show Code
Edit on Stackblitz
- showDismiss="true"
- onClose={() => console.log("Snackbar is closed")}
Show Example
Duration
Show Code
Edit on Stackblitz
Show Snackbar for 10 sec
Custom Color
Show Code
Edit on Stackblitz
Show Snackbar with custom color
Children
Show Code
Edit on Stackblitz
Show Snackbar with Children
Custom Postion (default is top-right)
Show Code
Edit on Stackblitz
Show Top Left
Show Bottom Left
Show Top Right
Show Bottom Right
Show Top Center
Show Bottom Center
Theme
Show Code
Edit on Stackblitz
Show Snackbar with primary theme
Show Snackbar with secondary theme
Show Snackbar with dark theme
Show Snackbar with light theme
Show Snackbar with info theme
Show Snackbar with warning theme
Show Snackbar with danger theme
Show Snackbar with success theme
Custom Class
Show Code
Edit on Stackblitz
Show Snackbar with custom class