# Toaster

Toast notification system for displaying temporary messages

## Example

## Toaster

Toast notification system for displaying temporary messages

**Source:** [`packages/appkit-ui/src/react/ui/sonner.tsx`](https://github.com/databricks/appkit/blob/main/packages/appkit-ui/src/react/ui/sonner.tsx)

### Props

| Prop | Type | Required | Default | Description |
|------|------|----------|---------|-------------|
| `id` | `string` |  | - | - |
| `invert` | `boolean` |  | - | - |
| `theme` | `enum` |  | - | - |
| `position` | `enum` |  | - | - |
| `hotkey` | `string[]` |  | - | - |
| `richColors` | `boolean` |  | - | - |
| `expand` | `boolean` |  | - | - |
| `duration` | `number` |  | - | - |
| `gap` | `number` |  | - | - |
| `visibleToasts` | `number` |  | - | - |
| `closeButton` | `boolean` |  | - | - |
| `toastOptions` | `ToastOptions` |  | - | - |
| `className` | `string` |  | - | - |
| `style` | `CSSProperties` |  | - | - |
| `offset` | `Offset` |  | - | - |
| `mobileOffset` | `Offset` |  | - | - |
| `dir` | `enum` |  | - | - |
| `swipeDirections` | `SwipeDirection[]` |  | - | - |
| `icons` | `ToastIcons` |  | - | - |
| `containerAriaLabel` | `string` |  | - | - |

### Usage

```tsx
import { Toaster } from '@databricks/appkit-ui';

```