MeldUI

Sonner

Toast notification system for success, error, and informational messages.

Setup

Add the Toaster component once in your app root:

<script setup>
import { Toaster } from '@meldui/vue'
</script>

<template>
  <RouterView />
  <Toaster position="bottom-right" />
</template>

Usage

Exports

ExportDescription
ToasterToast container component. Props: position, richColors, expand, duration
toastToast function with .success(), .error(), .warning(), .info() methods
useVueSonnerComposable for programmatic control