Notification

Notification cards in the top-right corner, supporting title, description, duration, and type.

Basic usage

Four types

InfoSuccessWarningError

Example

Custom duration

Custom duration

8sNo auto-close

Example

With progress bar

With progress bar

Progress bar (bottom)Progress bar (top)

Example

Scrollable long content

Scrollable long content

Long content

Example

Clear all

Clear all

Fire threeClear all

Example

API

Attributes

Attribute	Description	Type	Default
description	Description content	string	—
duration	Auto-close duration in ms; pass 0 to keep it open	string	4500
progress-position	Progress bar position: bottom (default) / top	string	bottom
scrollable	Scroll inside the card when the content is too long; enabled by default, pass false to disable	string	true
show-progress	Show the auto-close countdown progress bar (animates in sync with duration)	boolean	—
title	Title text	string	—
type	Notification type: info/success/warning/error	string	info

Methods

Method	Description
notification.info({ title, description?, duration?, showProgress?, progressPosition?, scrollable? })	Info notification
notification.success({ title, description?, duration?, showProgress?, progressPosition?, scrollable? })	Success notification
notification.warning({ title, description?, duration?, showProgress?, progressPosition?, scrollable? })	Warning notification
notification.error({ title, description?, duration?, showProgress?, progressPosition?, scrollable? })	Error notification
destroyAllNotification()	Clear all notifications

• duration defaults to 4500ms; pass 0 to keep the notification open.
• showProgress shows the auto-close countdown progress bar, animating in sync with duration; progressPosition accepts bottom (default) / top.
• scrollable is enabled by default (scroll inside the card when the content is too long); pass false to disable.
• Stacked at the top-right, role="region" + aria-label="Notification".