Reference

Options

Per toast

toast(message, options) and every toast.* call take these.

Option	Type	Default	What it does
`id`	`string`	generated	Calling again with the same id updates that toast instead of adding one.
`type`	`'default' \| 'success' \| 'error' \| 'warning' \| 'info' \| 'loading'`	`'default'`	Colour, icon and politeness.
`description`	`string`	—	The second line.
`duration`	`number`	4000, errors 6000, loading ∞	Milliseconds. `0` keeps it until dismissed.
`position`	`ToastPosition`	the toaster's	Six corners and centres.
`action`	`{ label, onClick, className }`	—	The primary button. Return `false` from `onClick` to keep the toast.
`cancel`	`{ label, onClick, className }`	—	The quiet button beside it.
`closeButton`	`boolean`	the toaster's	The ✕ in the corner.
`icon`	`string \| false`	by type	Your own markup, or none.
`classNames`	`Partial<Record<ToastPart, string>>`	—	Your classes on this toast's parts.
`politeness`	`'polite' \| 'assertive'`	errors are assertive	How a screen reader interrupts.
`render`	`(node, { dismiss, update }) => void`	—	Draw it yourself; timing, swiping and stacking still apply.
`data`	`unknown`	—	Anything of yours, handed back to `onDismiss`.
`onDismiss`	`(reason) => void`	—	`'timeout' \| 'user' \| 'swipe' \| 'code' \| 'replaced'`.
`onAutoClose`	`() => void`	—	Only when the timer ran out.

configure(init) for the shared toaster, or createToaster(init) for one of your own.

Option	Type	Default	What it does
`position`	`ToastPosition`	`'bottom-right'`	`top-left`, `top-center`, `top-right`, `bottom-left`, `bottom-center`, `bottom-right`.
`max`	`number`	`3`	On screen at once; the rest queue.
`duration`	`number`	`4000`	Default lifetime.
`gap`	`number`	`10`	Pixels between toasts.
`closeButton`	`boolean`	`true`
`expand`	`boolean`	`true`	Collapse the stack, fan it out on hover.
`progress`	`boolean`	`true`	The thin line that counts down.
`newestFirst`	`boolean`	`true`	New toasts in front.
`theme`	`'light' \| 'dark' \| 'auto'`	`'auto'`	Follows the page.
`container`	`HTMLElement`	`document.body`	Keep toasts inside a panel, an iframe or a shadow root.
`classNames`	`Partial<Record<ToastPart, string>>`	—	Your classes on every toast.
`icons`	`Partial<Record<ToastType, string>>`	built-in SVG
`strings`	`Partial<ToastStrings>`	English	`region`, `close`, `loading`, `more`.

Call	Does
`toast(message, options)`	Shows one; returns its id.
`toast.success/error/warning/info/loading(message, options)`	The same, with a type.
`toast.custom(render, options)`	Your own markup.
`toast.promise(promise, { loading, success, error }, options)`	Follows a promise; returns it.
`toast.update(id, { message, ...options })`	Changes one that is already on screen.
`toast.dismiss(id?)`	One, or all.
`toast.toasts()`	`{ id, message, type }[]` of what is live.
`toast.configure(init)`	Change the defaults.
`toast.destroy()`	Remove the region and stop every timer.

createToaster() returns exactly this shape, so two independent stacks (say, one inside an embedded app) never interfere.

region, toast, icon, body, title, description, action, cancel, close, progress.

Updated 12 Sep 2026