Search documentation

Type to search the documentation.

Primitives

Toast

Notification system with multiple positions, durations, and action support. Keep users informed without interrupting their workflow.

At a glance

  • 6 Positions — All corners + centers
  • Auto-dismiss — Configurable duration
  • Persistent — Manual close option
  • Actions — Button support

Live examples

Loading demo…

Code

Toast Types

// Shorthand methods
toastService.success('Operation completed!', 'Success');
toastService.error('Something went wrong!', 'Error');
toastService.warning('Please review your input.', 'Warning');
toastService.info('This is an informational message.', 'Info');

Positions

// Any of 6 positions
toastService.show({
  type: 'info',
  message: 'Positioned toast',
  position: 'top-right', // or 'bottom-center', etc.
});

Duration Control

// Custom duration (ms)
toastService.show({
  type: 'info',
  message: 'Quick toast',
  duration: 2000, // 2 seconds
});

// Persistent toast
toastService.show({
  type: 'info',
  message: 'Manual close required',
  duration: 0, // No auto-dismiss
  closable: true,
});

API Usage

// Full options
toastService.show({
  type: 'success',
  title: 'Changes Saved',
  message: 'Your modifications have been saved successfully.',
  position: 'bottom-right',
  duration: 5000,
  closable: true,
});