Snackbars
Snackbars provide brief messages about app processes - typically at the bottom of the screen.
Snackbars inform users of a process that an app has performed or will perform. They appear temporarily, towards the bottom of the screen. They shouldn’t interrupt the user experience, and they don’t require user input to disappear.
Snackbars contain a single line of text directly related to the operation performed. They may contain a text action, but no icons. You can use them to display notifications.
Frequency
Only one snackbar may be displayed at a time.
Simple snackbars
A basic snackbar that aims to reproduce Google Keep's snackbar behavior.
Customized snackbars
Here are some examples of customizing the component. You can learn more about this in the overrides documentation page.
Positioned snackbars
There may be circumstances when the placement of the snackbar needs to be more flexible.
Transitions
Consecutive Snackbars
When multiple snackbar updates are necessary, they should appear one at a time.
Change Transition
Grow is the default transition but you can use a different one.
Control Slide direction
You can change the direction of the Slide transition.
Complementary projects
For more advanced use cases you might be able to take advantage of:
notistack
In the following example, we demonstrate how to use notistack. notistack makes it easy to display snackbars (so you don't have to deal with open/close state of them). It also enables you to stack them on top of one another (but discouraged by the specification).