Logo

Documentation v4.0.0

  • Home
  • Components
  • Toast
Light
Dark
System

Overview

Toast is a static class that displays non-blocking notification messages. Supports success, info, warning, and error styles with optional title and auto-dismiss delay.

Import

import {components} from 'metronic-extension';
const {Toast} = components;

Methods

All methods are static. No instantiation is required.
Method Description
success(message, title?, delay?) Displays a success toast.
info(message, title?, delay?) Displays an info toast.
warning(message, title?, delay?) Displays a warning toast.
error(message, title?, delay?) Displays an error toast.

Parameters

Name Type Default Description
message string - Toast message text.
title string | undefined undefined Optional toast title.
delay number 5000 Auto-dismiss delay in milliseconds.

Basic Example

Click each button to display a toast notification. Toasts auto-dismiss after 5 seconds.
import {components} from 'metronic-extension';
const {Toast} = components;

// Simple success toast
Toast.success('Item saved successfully.');

// Info toast
Toast.info('Your session will expire in 5 minutes.');

// Warning toast
Toast.warning('Disk space is running low.');

// Error toast
Toast.error('Failed to save the item.');

Title Example

Toasts with a title displayed above the message.
import {components} from 'metronic-extension';
const {Toast} = components;

Toast.success('Your changes have been saved.', 'Saved');
Toast.error('Please check the form and try again.', 'Validation Error');
Previous Tagify Next Tree