Skip to content

Toast

Toast Props ​

NameTypeDefaultDescription
typeToastType'info'Visual type. Optional: info, success, warning, error.
bodystring-Toast message text.
autoClosebooleantrueWhether the toast auto-dismisses.
durationnumber5000Auto-dismiss duration in milliseconds.

Toast Events ​

NameDescription
closeEmitted when the toast is dismissed.

Toast Slots ​

NameDescription
defaultCustom toast content. Defaults to body.

ToastViewport Props ​

NameTypeDefaultDescription
placementToastPlacement'bottom-center'Position of the toast stack in the viewport. Optional: top-start, top-center, top-end, bottom-start, bottom-center, bottom-end.

useToast ​

ts
const toast = useToast()

const dismiss = toast({ body: 'Hello', type: 'info', duration: 3000 })
// dismiss manually
dismiss()
// dismiss all
toast.clear()