API reference · Sileo Svelte

State methods

sileo.show(input, description?)
sileo.success(input, description?)
sileo.error(input, description?)
sileo.warning(input, description?)
sileo.info(input, description?)
sileo.action(input, description?)
sileo.loading(input, description?)

Each method accepts a title string or a SileoOptions object and returns the toast id. Pass id to replace an existing notification with that name.

Lifecycle methods

sileo.update(id, options)
sileo.dismiss(id)
sileo.close(id)
sileo.clear(position?)

update accepts SileoOptions fields plus an optional state. Its first argument identifies the toast; an id inside the options does not rename it. Omitted fields stay unchanged. Set button: null to remove an action. clear can target one of the six positions.

Promise

sileo.promise<T>(
    promise: Promise<T> | (() => Promise<T>),
    options: SileoPromiseOptions<T>
): Promise<T>

type PromiseResult<T> = SileoOptions | ((data: T) => SileoOptions);

type SileoPromiseOptions<T> = {
    id?: string;
    loading: Pick<SileoOptions, 'title' | 'icon'>;
    error: SileoOptions | ((error: unknown) => SileoOptions);
    position?: SileoPosition;
} & ({ success: PromiseResult<T>; action?: undefined } | { action: PromiseResult<T>; success?: PromiseResult<T> });

Provide either success or action. If both are present, action becomes the final state.

Scoped defaults

const scoped = sileo.with(defaults);

The returned object has the same state, promise, update, dismiss, close, and clear methods. Call-level options override scoped defaults.

SileoOptions

Field	Type	Purpose
`id`	`string`	Stable identifier for replacing a toast.
`title`	`string`	Primary notification text.
`description`	`string \\| Snippet`	Supporting text or structured Svelte content.
`position`	`SileoPosition`	Viewport placement for this toast.
`duration`	`number \\| null`	Lifetime in milliseconds. `null` keeps it open.
`icon`	`Snippet \\| null`	Custom icon content or no icon.
`button`	`SileoButton \\| null`	One labeled action, or `null` to remove it.
`fill`	`string`	Toast background color.
`roundness`	`number`	Corner roundness used by the toast shape.
`autopilot`	`boolean \\| object`	Automatic expand and collapse timing.
`classes`	`SileoClasses`	Class names for supported internal parts.
`styles`	`SileoStyles`	Typed colors and backdrop filtering.

Exported types

import type {
    SileoApi,
    SileoButton,
    SileoClasses,
    SileoInput,
    SileoOptions,
    SileoPosition,
    SileoPromiseOptions,
    SileoScopedApi,
    SileoState,
    SileoStyles
} from 'sileo-svelte';

Background styling

Set styles.backdropFilter to a CSS backdrop filter such as blur(16px) saturate(1.4). Combine it with a translucent fill to blur the content behind the animated shape. See frosted glass for an example and browser limitations.

classes.toast applies to the outer toast. classes.background applies to the SVG background, or the masked HTML background when a backdrop filter is active. These are global class names, like the existing title and description classes.