{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "toast",
  "type": "registry:ui",
  "title": "Toast",
  "description": "The result of a person's own action, with Undo: a 44 tall smoked pill at the bottom centre, one at a time, arriving on settle and leaving on release. Built on Base UI Toast.",
  "dependencies": [
    "@base-ui/react@^1.8.0"
  ],
  "registryDependencies": [
    "https://metalui.dev/r/tokens.json"
  ],
  "files": [
    {
      "path": "packages/metalui/src/components/toast/toast.tsx",
      "type": "registry:ui",
      "target": "components/metalui/toast/toast.tsx",
      "content": "'use client';\n\nimport * as React from 'react';\nimport { Toast } from '@base-ui/react/toast';\nimport { Kbd } from '../kbd/kbd';\n\n/* ─────────────────────────────────────────────────────────\n * TOAST (object sheet) on Base UI Toast\n *   show     one at a time; arrives one nest from below from .97 on settle\n *   undo     a cap with ⌘Z; the toast stays 5 s (plain 2.6 s); errors stay until resolved\n *   leave    on release, the way it came (a crossfade under Reduce Motion)\n * Toasts are for a person's own actions with Undo, never for recognition.\n * ───────────────────────────────────────────────────────── */\n\nexport type ToastTone = 'default' | 'success' | 'error';\n\nexport interface ToastOptions {\n  /** What happened, as the person would say it: \"Moved 3 blocks\", \"Pinned as a live region\". */\n  title: string;\n  /** A short detail after a middle dot: \"it updates as you write\". */\n  sub?: string;\n  /** Undo the action. Adds the Undo cap and keeps the toast 5 s. */\n  undo?: () => void;\n  /** success carries its check; error stays until resolved. */\n  tone?: ToastTone;\n  /** Override how long it stays, in ms (0: until dismissed). */\n  timeout?: number;\n}\n\nconst ms = (name: string, fallback: number) =>\n  typeof window === 'undefined' ? fallback : parseFloat(getComputedStyle(document.documentElement).getPropertyValue(name)) || fallback;\n\n/** Shows toasts. Call show() from anywhere under a ToastProvider. */\nexport function useToast() {\n  const manager = Toast.useToastManager();\n  return React.useMemo(() => ({\n    show({ title, sub, undo, tone = 'default', timeout }: ToastOptions) {\n      return manager.add({\n        title,\n        description: sub,\n        type: tone,\n        timeout: timeout ?? (tone === 'error' ? 0 : undo ? ms('--mu-toast-undo-ms', 5000) : ms('--mu-toast-plain-ms', 2600)),\n        actionProps: undo ? { onClick: undo } : undefined,\n      });\n    },\n    dismiss: (id: string) => manager.close(id),\n  }), [manager]);\n}\n\n/* Styled with the theme's utilities (the toast recipe): a graphite glass pill that rises one nest from\n * below on settle and leaves the way it came on release; the Undo cap presses by the material's travel. */\nconst VIEWPORT = 'mu-toast-viewport fixed left-1/2 bottom-toast-bottom z-toast-z -translate-x-1/2 flex flex-col items-center outline-none';\nconst TOAST = 'mu-toast group/toast flex items-center gap-toast-gap h-toast-height pl-toast-pad-left pr-toast-pad-right not-has-[.mu-toast-undo]:pr-toast-pad-left rounded-pill whitespace-nowrap type-toast text-toast-ink recipe-toast backdrop-toast-blur transition-toast data-starting-style:toast-enter data-ending-style:toast-leave reduce-transparency:opaque-frost-graphite';\nconst TEXT = 'mu-toast-text inline-flex items-center gap-toast-text-gap';\nconst SUB = 'mu-toast-sub text-toast-sub-ink';\nconst CHECK = 'mu-toast-check text-success';\nconst UNDO = 'mu-toast-undo inline-flex items-center gap-toast-undo-gap h-toast-undo-height pl-toast-undo-pad-left pr-toast-undo-pad-right border-0 rounded-pill type-toast-undo text-inherit recipe-toast-undo cursor-pointer transition-transform ease-release duration-release active:translate-y-press active:duration-toast-undo-press focus-visible:toast-undo-focus';\nconst KEY = 'text-toast-kbd-ink recipe-toast-kbd';\n\n/** The toast's part classes, for stills of it outside the toast region (docs, previews). */\nexport const toastParts = { TOAST, TEXT, SUB, UNDO, KEY } as const;\n\nfunction ToastList() {\n  const { toasts } = Toast.useToastManager();\n  return (\n    <Toast.Portal>\n      <Toast.Viewport className={VIEWPORT}>\n        {toasts.map((t) => (\n          <Toast.Root key={t.id} toast={t} className={TOAST} data-type={t.type}>\n            <span className={TEXT}>\n              {t.type === 'success' && <span aria-hidden className={CHECK}>✓</span>}\n              <Toast.Title render={<span />}>{t.title}</Toast.Title>\n              {t.description && <Toast.Description render={<span className={SUB} />}>· {t.description}</Toast.Description>}\n            </span>\n            {t.actionProps && (\n              <Toast.Action className={UNDO} aria-keyshortcuts=\"Meta+Z\">\n                Undo <Kbd surface=\"plain\" className={KEY}>⌘Z</Kbd>\n              </Toast.Action>\n            )}\n          </Toast.Root>\n        ))}\n      </Toast.Viewport>\n    </Toast.Portal>\n  );\n}\n\n/** Put once near the root: the toast region at the bottom centre, one toast at a time. */\nexport function ToastProvider({ children }: { children: React.ReactNode }) {\n  return (\n    <Toast.Provider limit={1}>\n      {children}\n      <ToastList />\n    </Toast.Provider>\n  );\n}\n"
    }
  ],
  "docs": "Agent guide: https://metalui.dev/r/toast.md. SwiftUI: MetalToast, .metalToast(_:) in the MetalUI Swift package."
}
