**[Notistack](https://notistack.com): Display notifications with call of a function.**

Easy to use, customizable, smooth transitions, stack and queue them up!

Documentation · Examples

[![npm version](https://img.shields.io/npm/v/notistack.svg?label=version)](https://www.npmjs.com/package/notistack) [![npm downloads](https://img.shields.io/npm/dm/notistack.svg)](https://www.npmjs.com/package/notistack) [![package license](https://img.shields.io/npm/l/notistack.svg)](https://www.npmjs.com/package/notistack)

| Stacking behaviour | Dismiss oldest when reached maxSnack (3 here)| | --- | --- | |

|

|

Table of Contents -- - [How to use](#how-to-use) - [Online demo](#online-demo) - [Documentation](https://notistack.com/api-reference) ## Getting Started Use your preferred package manager: ``` npm install notistack yarn add notistack ``` #### Version guide | Version | Notes | --- | --- | | `v3.x.x` | Latest stable release. Standalone (i.e. not dependent on [material-ui](https://github.com/mui/material-ui)) | | <= `v2.0.8` | Requires Material-UI v5 as peer dependency. `npm install notistack@2.0.8` | | <= `1.0.10` | Requires Material-UI <= v4 as peer dependency. `npm install notistack@latest-mui-v4` | ### How to use Instantiate a `SnackbarProvider` component and start showing snackbars: (see [docs](https://notistack.com/notistack/api-reference) for a full list of available props) ```jsx import { SnackbarProvider, enqueueSnackbar } from 'notistack'; const App = () => { return (

); }; ``` Alternatively, You can use `useSnackbar` hook to display Snackbars. Just remember to wrap your app inside of a `SnackbarProvider` to have access to the hook context: ```jsx import { SnackbarProvider, useSnackbar } from 'notistack'; // wrap your app const MyButton = () => { const { enqueueSnackbar, closeSnackbar } = useSnackbar(); return ; }; ``` ### Online demo **Visit the [`documentation website`](https://notistack.com/features/basic) to see all the examples.**
Or play with a minimal working example: [codesandbox](https://codesandbox.io/s/github/iamhosseindhv/notistack/tree/master/examples/simple-example??hidenavigation=1&module=%2FApp.js)
### Contribution Open an issue and your problem will be solved. ### Author - Contact Hossein Dehnokhalaji

	Stars	Issues	Version	Updated	Created
notistack	3,890	55	3.0.1	2 years ago	6 years ago
react-notifications-component	1,270	18	4.0.1	2 years ago	6 years ago
react-toast-notifications	2,170	30	2.5.1	3 years ago	6 years ago

notistack vs react-notifications-component vs react-toast-notifications

Downloads in past1 Month3 Months6 Months1 Year2 Years5 YearsAll time

Stats

Sick of boring JavaScript newsletters?

Downloads in past