Toast

Toast is used to display messages in an overlay.

Toast component is controlled via the ToastService, it is automatically loaded in the vue application

You only need to load the aptoast component into the app once. Used for teleport.

  <ApToast />

Then call the useToast composable with your toast message.

Example Toasts

Success

import {useToast} from 'active-designsystem'
const toast = useToast()

  toast.add({
    severity: 'success' ,
    summary: 'Success',
    detail: 'Message Content',
    life: 3000 })

import {useToast} from 'active-designsystem'
const toast = useToast()

  toast.add({
    severity: 'warn' ,
    summary: 'Warning',
    detail: 'Message Content',
    life: 3000 })

import {useToast} from 'active-designsystem'
const toast = useToast()

  toast.add({
    severity: 'error' ,
    summary: 'Danger',
    detail: 'Message Content',
    life: 3000 })

Parameters

Name	Type
severity	'error', 'success', 'warn'
summary	string
detail	string
life	Number