diff --git a/packages/components/snackbar/src/Snackbar.doc.mdx b/packages/components/snackbar/src/Snackbar.doc.mdx index 0e4e88913..524580d82 100644 --- a/packages/components/snackbar/src/Snackbar.doc.mdx +++ b/packages/components/snackbar/src/Snackbar.doc.mdx @@ -71,9 +71,9 @@ Use `icon` prop on snackbar item to add an icon before message. ### Dismiss -**To dismiss snackbar automatically** use `timeout` option. For accessibility reasons the value of this timeout shouldn't be less than 5 seconds. +**To dismiss snackbar automatically** use `timeout` option. For accessibility reasons the value of this timeout shouldn't be less than 5 seconds. Also for the same reasons timers will automatically pause when the user focuses or hovers over a snackbar. -**To allow the user to close by himself the snackbar** thanks to a dedicated close button, use `isClosable` prop on snackbar item, or as `addSnackbar` option. +**To allow the user to close the snackbar** thanks to a dedicated close button, use `isClosable` prop on snackbar item, or as `addSnackbar` option. For both cases there is a specific `onClose` handler which is called when snackbar closes. diff --git a/packages/components/snackbar/src/Snackbar.tsx b/packages/components/snackbar/src/Snackbar.tsx index 561e33388..b5d3398ae 100644 --- a/packages/components/snackbar/src/Snackbar.tsx +++ b/packages/components/snackbar/src/Snackbar.tsx @@ -105,7 +105,22 @@ export const Snackbar = forwardRef( Snackbar.displayName = 'Snackbar' -export interface AddSnackbarArgs extends SnackbarItemValue, SnackBarItemOptions {} +export interface AddSnackbarArgs extends SnackbarItemValue, SnackBarItemOptions { + /** + * Handler that is called when the snackbar is closed, either by the user + * or after a timeout. + */ + onClose?: () => void + /** + * A timeout to automatically close the snackbar after, in milliseconds. + * @default 5000 + */ + timeout?: number + /** + * The priority of the snackbar relative to other snackbars. Larger numbers indicate higher priority. + */ + priority?: number +} export const addSnackbar = ({ onClose, timeout = 5000, priority, ...content }: AddSnackbarArgs) => { const queue = getGlobalSnackBarQueue()