Snackbar

Snackbars show short updates about app processes at the bottom of the screen.

Developer experience

open is controlled; defaultOpen initializes uncontrolled usage. Defaults to true.
duration (ms) auto-dismisses the snackbar; omit it to require an explicit onOpenChange or a click on the built-in close button.
Renders in normal document flow at the call site. Fixed/bottom positioning, stacking, and queueing multiple snackbars are the caller's responsibility.
The height transition is implemented once with Motion JavaScript in @udixio/core/dom, shared with Angular. It applies the initial open state immediately; only transitions after the first render animate.

Renders role="status" and aria-live="polite" so assistive technology announces the message without interrupting the user. The element stays mounted and inert while closed instead of unmounting, so the live region is reliably present before it announces.

React props
Name	Type	Required	Default	Description
`className`	`string \| Partial<Record<"container" \| "icon" \| "snackbar" \| "supportingText", string>> \| ClassNameComponent<SnackbarInterface>`	No	`—`	Root classes (string), static element classes (object), or state-aware element classes (function).
`message`	`string`	Yes	`—`	Message announced through the snackbar.
`open`	`boolean`	No	`—`	Controlled open state.
`defaultOpen`	`boolean`	No	`true`	Initial open state when uncontrolled. Defaults to `true`.
`duration`	`number`	No	`—`	Auto-dismiss delay in milliseconds. Omit to require an explicit close.
`closeIcon`	`Icon`	No	`iClose`	Icon for the built-in close button.
`transition`	`Transition`	No	`—`	Motion transition shared by every framework for the open/close height animation.
`onOpenChange`	`(open: boolean) => void`	No	`—`	Notifies an accepted open-state request.