showSnackbar

showSnackbar() is the programmatic entry point for transient notifications. It renders a snackbar into the shared stack, waits for it to close, and resolves with the outcome.

Basic Usage

import { showSnackbar } from '@rikkaw/m3-vue';

await showSnackbar({
  message: 'Saved',
});

Return Value

The promise resolves when the snackbar closes.

• Action click resolves to action.value, or 'action' by default.
• Dismiss button resolves to dismissValue, or 'dismiss' by default.
• Auto timeout resolves to timeoutValue, or 'timeout' by default.

The promise rejects if the function is called outside a browser environment, or if action.onClick throws or rejects.

Options

The tables below are generated from source types and stay in sync with API changes.

ShowSnackbarOptions

Field	Type	Required	Description	Default
message	string | undefined	No	Supporting text displayed inside the snackbar.	-
action	SnackbarAction | undefined	No	Optional action button.	-
duration	number | null | undefined	No	Milliseconds before the snackbar closes automatically. Use `null` to disable auto close.	-
timeoutValue	string | undefined	No	Value returned when the snackbar closes automatically.	-
dismissValue	string | undefined	No	Value returned when the dismiss button closes the snackbar.	-
position	SnackbarPosition | undefined	No	Where the snackbar stack is placed in the viewport.	-
actionOnNewLine	boolean | undefined	No	Whether the action should be placed on a separate line.	false
dismissible	boolean | undefined	No	Whether to show a dismiss button.	false
dismissButtonLabel	string | undefined	No	Accessible label for the dismiss button.	"Dismiss notification"

SnackbarAction

Field	Type	Required	Description	Default
label	string	Yes	Label shown in the action area.	-
value	string | undefined	No	Value returned when the action closes the snackbar.	-
disabled	boolean | undefined	No	Whether the action button is disabled.	-
autofocus	boolean | undefined	No	Whether the action button should autofocus when rendered.	-
closeOnClick	boolean | undefined	No	Whether clicking the action should close the snackbar.	-
onClick	(() => void | boolean | Promise<void | boolean>) | undefined	No	Optional callback invoked before the snackbar closes. Return `false` to keep it open.	-

Behavior Notes

• Multiple snackbars can be shown at the same time.
• Stacks are separated by position, so top and bottom placements do not interfere with each other.
• Hovering or focusing the snackbar pauses the auto-close timer.
• Leaving the snackbar resumes the remaining time instead of restarting the full duration.

For manually rendered snackbars, see Snackbar.