Feedback

Snackbar

Action-focused snackbar that springs up from the bottom.

Setup Required

This component requires the SnackbarProvider. See Getting Started.

Snackbars

Snackbars are small alerts at the bottom of the screen with optional actions.

'use client'

import React from 'react'
import { Button, Stack, useSnackbar } from 'biibaos'

export default function App() {
  const { snackbar } = useSnackbar()
  return (
    <Stack gap={12} wrap>
      <Button variant="secondary" onClick={() => snackbar({ message: 'Profile updated' })}>Basic Snackbar</Button>
      <Button variant="secondary" onClick={() => snackbar({ message: 'Message deleted', action: { label: 'Undo', onClick: () => alert('Undone!') } })}>With Action</Button>
    </Stack>
  )
}

Properties

Prop	Type	Default	Description
`message`	`string`	—	The primary message text of the notification
`action`	`{ label: string; onClick: () => void }`	—	Optional button label and action handler
`duration`	`number`	3500	Time in milliseconds before auto-dismiss

Toast

Alert