Promise Notifications

toast.promise() is the highlight: hand it a promise and it shows a loading toast, then automatically swaps to success or error when the promise settles.

import { useToast } from 'notifications-kit/vue'
const toast = useToast()

await toast.promise(
  api.saveProfile(form),
  {
    loading: 'Saving…',
    success: 'Profile updated',
    error: 'Something went wrong',
  }
)

No manual loading flags, no try/catch just to show feedback — one call covers all three states.

Dynamic messages

Both success and error can be functions that receive the resolved value or the thrown error:

toast.promise(fetchUser(id), {
  loading: 'Loading…',
  success: (user) => `Welcome back, ${user.name}`,
  error: (err) => err.message,
})

It still returns the value

promise() resolves with the original data (and re-throws on error), so you can keep using the result:

const user = await toast.promise(fetchUser(id), {
  loading: 'Loading…',
  success: 'Loaded',
  error: 'Failed',
})

console.log(user.name)