Snackbar

A Snackbar displays a succinct message that is cleared out after a small delay.

It can also offer the user options, like viewing a published post. But these options should also be available elsewhere in the UI.

View on Storybook

View source on GitHub

Import

import { Snackbar } from '@wordpress/components';

Props

NameTypeDefaultRequiredDescription
spokenMessageunknownchildren
politenessunknown'polite'
actionsunknown[]
iconunknownnull
explicitDismissunknownfalse

Examples

Default

const Default = ( {
	children,
	...props
} ) => {
	return <Snackbar { ...props }>{ children }</Snackbar>;
};

With Actions

const WithActions = ( {
	children,
	...props
} ) => {
	return <Snackbar { ...props }>{ children }</Snackbar>;
};

With Icon

const WithIcon = ( {
	children,
	...props
} ) => {
	return <Snackbar { ...props }>{ children }</Snackbar>;
};

With Explicit Dismiss

const WithExplicitDismiss = ( {
	children,
	...props
} ) => {
	return <Snackbar { ...props }>{ children }</Snackbar>;
};

With Action And Explicit Dismiss

const WithActionAndExplicitDismiss = ( {
	children,
	...props
} ) => {
	return <Snackbar { ...props }>{ children }</Snackbar>;
};