Toasts

Index

Interfaces

• Options
• ToastButton
• ToastElement

Type Aliases

• CloseReason
• IconColor
• Type

Interfaces

Options

Options:

Configuration options for displaying a toast notification.

optionalbuttons

buttons?: ToastButton[]

Optional array of action buttons to render inside the toast.

optionalduration

duration?: number

How long (in milliseconds) the toast remains visible.

optionalicon

icon?: string

Optional icon to display alongside the message.

optionaliconColor

iconColor?: IconColor

Optional icon color.

message

message: string

Text content of the toast.

optionalonClick

onClick?: (ev: MouseEvent, toast: ToastElement) => void

Callback when the toast is clicked.

---

Type declaration

• • (ev: MouseEvent, toast: ToastElement): void

  • Parameters

    • ev: MouseEvent

    • toast: ToastElement

    Returns void

optionalonClose

onClose?: (toast: ToastElement, reason: CloseReason) => void

Callback when the toast is closed, with a reason.

---

Type declaration

• • (toast: ToastElement, reason: CloseReason): void

  • Parameters

    • toast: ToastElement

    • reason: CloseReason

    Returns void

optionalonShow

onShow?: (toast: ToastElement) => void

Callback when the toast is displayed.

---

Type declaration

• • (toast: ToastElement): void

  • Parameters

    • toast: ToastElement

    Returns void

optionalprogress

progress?: boolean

Whether to show a progress bar.

optionalstopProgressOnHover

stopProgressOnHover?: boolean

Whether to stop the progress bar animation when the mouse hovers over the toast.

optionaltitle

title?: string

Title of the toast.

optionaltype

type?: Type

Type and style of the toast.

ToastButton

ToastButton:

Defines a button to be rendered inside a toast notification.

• label:
• onClick:

label

label: string

Text displayed on the button.

onClick

onClick: (this: HTMLButtonElement, ev: MouseEvent, toast: ToastElement) => void

Handler invoked when the button is clicked. The this context is bound to the actual HTMLButtonElement created for this toast.

---

Type declaration

• • (this: HTMLButtonElement, ev: MouseEvent, toast: ToastElement): void

  • Parameters

    • this: HTMLButtonElement

    • ev: MouseEvent

    • toast: ToastElement

    Returns void

ToastElement

ToastElement:

Represents the DOM element for a rendered toast. Extends HTMLDivElement and may include an internal _dismiss method that can be programmatically called to close the toast with a given reason.

optional_dismiss

_dismiss?: (reason: CloseReason) => void

Type declaration

• • (reason: CloseReason): void

  • Parameters

    • reason: CloseReason

    Returns void

removeAttribute

• removeAttribute(qualifiedName: string): void

• Inherited from HTMLDivElement.removeAttribute

  Parameters

  • qualifiedName: string

  Returns void

setAttribute

• setAttribute(qualifiedName: string, value: any): void

• Inherited from HTMLDivElement.setAttribute

  Parameters

  • qualifiedName: string

  • value: any

  Returns void

Type Aliases

CloseReason

CloseReason: timeout | click | external | (string & {})

Describes why a toast was closed. Includes predefined reasons like 'timeout', 'manual', 'click', 'external', and allows for custom string-based reasons. Used in the Toasts.Options.onClose callback.

IconColor

IconColor: black | white | accent | default

Describes the color of an icon. Might help when default icons looks like shit. 'accent' is the same as the accent color of the toast, e.g. text.

Type

Type: info | success | warning | error | (string & {})

Defines the type and style of a toast notification. Includes standard types like 'info', 'success', 'warning', 'error', and allows for custom string-based types.