base-ui-svelte

Toast

A succinct message that is displayed temporarily.

View as Markdown

API Reference

Props mirror Base UI React where applicable, adapted for Svelte 5. Native HTML attributes for the rendered element are also accepted unless noted.

Toast.Root

Extends div HTML attributes.

PropertyTypeDefaultDescription
toastToastData
swipeDirectionToastSwipeDirection | ToastSwipeDirection[] | undefined
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-closedPresent when the part is closed.
data-ending-stylePresent while the exit animation can run.
data-expandedPresent on the element when applicable.
data-limitedPresent on the element when applicable.
data-openPresent when the part is open.
data-starting-stylePresent while the enter animation can run.
data-swipe-directionDirection of an active toast swipe.
data-swipingPresent on the element when applicable.
data-typePresent on the element when applicable.

Toast.Provider

PropertyTypeDefaultDescription
toasterToastManager | undefined
timeoutnumber | undefined
limitnumber | undefined
childrenSnippetContent rendered inside the part.

Toast.Action

Extends button HTML attributes.

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.

Toast.Arrow

Extends span HTML attributes.

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-anchoredPresent on the element when applicable.
data-sideThe side the popup is placed on.

Toast.Close

Extends button HTML attributes.

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.

Toast.Content

Extends div HTML attributes.

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-behindPresent on the element when applicable.
data-expandedPresent on the element when applicable.

Toast.Description

Extends paragraph HTML attributes.

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-typePresent on the element when applicable.

Toast.Portal

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.

Toast.Positioner

Extends div HTML attributes.

PropertyTypeDefaultDescription
side'top' | 'right' | 'bottom' | 'left'
align'start' | 'center' | 'end'
sideOffsetnumber
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-anchoredPresent on the element when applicable.
data-sideThe side the popup is placed on.

Toast.Title

Extends heading HTML attributes.

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-typePresent on the element when applicable.

Toast.Viewport

Extends div HTML attributes.

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-expandedPresent on the element when applicable.