Toast

A notification component for displaying brief messages to users.

Basic Usage

✔

Success

Your changes have been saved.

dart
1
2
3
4
5
DToast(
  title: 'Success',
  description: 'Your changes have been saved.',
  color: DColor.success,
)

Colors

🔔

Primary notification

✔

Success notification

⚠

Warning notification

✖

Error notification

ℹ

Info notification

dart
1
2
3
4
5
DToast(title: 'Primary', color: DColor.primary)
DToast(title: 'Success', color: DColor.success)
DToast(title: 'Warning', color: DColor.warning)
DToast(title: 'Error', color: DColor.error)
DToast(title: 'Info', color: DColor.info)

Variants

✔

Solid Toast

ℹ

Outline Toast

⚠

Soft Toast

✖

Subtle Toast

dart
1
2
3
4
DToast(title: 'Solid', variant: DToastVariant.solid, color: DColor.success)
DToast(title: 'Outline', variant: DToastVariant.outline, color: DColor.info)
DToast(title: 'Soft', variant: DToastVariant.soft, color: DColor.warning)
DToast(title: 'Subtle', variant: DToastVariant.subtle, color: DColor.error)

With Description

✔

Event Created

Your event has been scheduled for tomorrow at 3:00 PM.

✖

Error Occurred

Something went wrong. Please try again later.

dart
1
2
3
4
5
DToast(
  title: 'Event Created',
  description: 'Your event has been scheduled for tomorrow at 3:00 PM.',
  color: DColor.success,
)

Closable Toast

🔔

Notification

You have a new message.

dart
1
2
3
4
5
6
DToast(
  title: 'Notification',
  description: 'You have a new message.',
  closable: true,
  onClose: () => print('Toast closed'),
)

With Action

✔

File Uploaded

Your document has been uploaded successfully.

dart
1
2
3
4
5
6
7
8
9
10
11
DToast(
  title: 'File Uploaded',
  description: 'Your document has been uploaded successfully.',
  color: DColor.success,
  action: DButton(
    label: 'View',
    size: DSize.sm,
    variant: DButtonVariant.ghost,
    onClick: () => viewFile(),
  ),
)