Toast

Basic toast. Toasts are stacked on top of each other

// simplest possible
Toast.show('Just toasting');

// with config
Toast.show({
  html         : 'Well toasted',
  showProgress : false
});

// as instance (instance is also returned from Toast.show()
const toast = new Toast({
  html    : 'Not going away',
  timeout : 0
});

toast.show();

To show toasts from the top and have them stack downwards, specify side as 'top':

Toast.show({
  html : 'Well toasted',
  side : 'top'
});

By default, Toasts show at the inline-end side of the screen, so on the right in LTR environments and on the left in RTL environments.

Append -start to the side to display at the required edge, or just use side : 'start' to show at the bottom but at the inline-start side of the screen.

Toast.show({
  html : 'Well toasted on the left',
  side : 'start'
});