Notification
Show a small popup notification to the user
Basic usage
Basic usage
Use the
showNotification
function to display a popup notification that clears in a few seconds.tsxCopied1<Button onClick={() => showNotification({ message: "I am a notification" })}>2Click for notification3</Button>
Notification types
Notification types
Use the
type
field to display a notification with a built in icon and color.tsxCopied1<Button2color="success"3onClick={() => showNotification({ message: "Something went right", type: "success" })}4>5Success6</Button>7<Button8color="error"9onClick={() => showNotification({ message: "Something went wrong", type: "error" })}10>11Error12</Button>
Customize the notification
Customize the notification
Notifications can have an optional
title
and icon
in addition to the required message
.tsxCopied1<Button2onClick={() =>3showNotification({ message: "Message", title: "Title", icon: <AcademicCapIcon /> })4}5>6Click for notification7</Button>
API
API
icon
optional
An icon on the left side of the notification.
message
optional
The message content of the notification.
title
optional
An optional title that appears above the message.
type
optional
Default
info
The type of the notification. Renders a specific icon and color combination.