🍫 React Snackbar Alert

Sticky Snackbars

A snackbar can be sticky, which means that it is not automatically removed. This can be done in one of two ways:

  • Setting the sticky prop on the SnackbarProvider to make all snackbars sticky
  • Setting the sticky property on the object passed to createSnackbar to make a specific snackbar sticky

It is recommended that sticky snackbars are also user-dismissable, otherwise the snackbar can never be removed.

import React from 'react';

import { SnackbarProvider, wrapComponent } from 'react-snackbar-alert';

export default function StickyExample() {
  return (
    <SnackbarProvider dismissable={true} sticky={true}>
      <Container />

const Container = wrapComponent(function({ createSnackbar }) {
  function showSnackbar() {
      message: 'Hello Snackbar!'

  return (
      <button onClick={showSnackbar}>Show Snackbar</button>