vue-toast-next

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 vue-toast-next

With NPM

npm install vue-toast-next

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!

<script setup lang="ts">
import { Toaster, toast } from "vue-toast-next";
const notify = () => toast('Here is your toast.');

</script>

<template>
  <div>
    <button @click="notify">Make me a toast</button>
    <Toaster />
  </div>
</template>

Documentation