# Toast

A toast system — provider, imperative API, tones, and a live region for screen readers.

- Family: Feedback, imported from `mizu-ui` or `mizu-ui/feedback`
- Docs: https://mizu.user64bit.world/components/toast
- Source: https://github.com/0xuser64bit/mizu/blob/main/packages/mizu/src/feedback/Toast.tsx

## Usage

```tsx
"use client";

import type { ReactNode } from "react";
import { Button, ToastProvider, useToast } from "mizu-ui";

export function App({ children }: { children: ReactNode }) {
  return <ToastProvider>{children}</ToastProvider>;
}

export function Saver() {
  const { toast } = useToast();
  const notify = () => toast("Notification received", { tone: "success" });
  return <Button onClick={notify}>Notify</Button>;
}
```

## Copy it with the shadcn CLI

```sh
npx shadcn@latest init 0xuser64bit/mizu/preset # once, where there is no components.json
npx shadcn@latest add 0xuser64bit/mizu/toast 0xuser64bit/mizu/button
```

## Props

- `toast`: `(message, options?) => void`. Push a toast. options: tone (default | success | error), duration (ms).

## Accessibility

The viewport is aria-live=polite — toasts are announced without stealing focus.

## Motion

Expo rise on enter, slide-fade on exit. Maximum 4 visible; oldest is replaced.