Skip to content

timolins/react-hot-toast

main
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
December 22, 2020 21:56
src
July 17, 2022 15:57
July 17, 2022 15:58
December 7, 2020 23:04
December 27, 2020 10:18
February 14, 2022 15:29
April 28, 2023 17:05

react-hot-toast - Try it out

NPM Version minzipped size Build Status

Smoking hot Notifications for React.
Lightweight, customizable and beautiful by default.


Cooked by Timo Lins πŸ‘¨β€πŸ³

Features

  • πŸ”₯ Hot by default
  • πŸ”© Easily Customizable
  • ⏳ Promise API - Automatic loader from a promise
  • πŸ•Š Lightweight - less than 5kb including styles
  • βœ… Accessible
  • 🀯 Headless Hooks - Create your own with useToaster()

Installation

With yarn

yarn add react-hot-toast

With NPM

npm install react-hot-toast

Getting Started

Add the Toaster to your app first. It will take care of rendering all notifications emitted. Now you can trigger toast() from anywhere!

import toast, { Toaster } from 'react-hot-toast';

const notify = () => toast('Here is your toast.');

const App = () => {
  return (
    <div>
      <button onClick={notify}>Make me a toast</button>
      <Toaster />
    </div>
  );
};

Documentation

Find the full API reference on official documentation.