sn-toast

A beautiful, animated toast notification library for React with Tailwind CSS

github

Installation

npm i sn-toast@latest

Usage

Render the toaster in the root of your app.(If you're using Next.js, make sure to place <Toaster /> inside a client component).

import { Toaster, toast } from 'buzzly'

// ...

function App() {

  return (
    <div>
      <Toaster /> 
      <button onClick={() => toast.success('My first toast')}>
          Give me a Toast
      </button>
    </div>
  );
}

Types

Types are used to define the type of the data that is being passed to the component.

toast.normal('Event has been created')

Positions

Swipe direction changes depending on the position.

<Toaster position={"top-left"} />

Others

You can use more options to customize the toast.

toast.normal('Event has been created')

// ...
<Toaster richColor={false} />
Have feedback, a bug report, or a feature request? Click here