React Library HubReact Library Hub
NO

Notistack

notistack

Highly customizable notification snackbars (toasts) that can be stacked on top of each other

State Management
notistack
enqueueSnackbar
snackbarprovider
useSnackbar
multiple
react
javascript
material-ui
toast
redux
Documentation GitHub npm
Stars
4.1k
Weekly
1.6M
Open issues
67
Bundle
~25 kB

Installation

npm install notistack

Code example

import { create } from "notistack";

const useStore = create((set) => ({
  count: 0,
  inc: () => set((s) => ({ count: s.count + 1 })),
}));

export function Example() {
  const { count, inc } = useStore();
  return (
    <button type="button" onClick={inc}>
      Count: {count}
    </button>
  );
}

Pros & cons

Pros

  • Actively maintained by Hossein Dehnokhalaji
  • 1.6M weekly downloads. Battle tested
  • First-class TypeScript definitions
  • MIT licensed

Considerations

  • Adds roughly ~25 kB to your bundle
  • Needs client-only rendering in SSR frameworks
  • Not supported in React Native
  • 67 open issues on GitHub

FAQs

Alternatives & similar libraries