{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "toast",
  "type": "registry:ui",
  "title": "Toast",
  "description": "A short message that appears for a few seconds after something happens, like \"Saved\". Built on sonner.",
  "dependencies": [
    "sonner@^2.0.8"
  ],
  "registryDependencies": [
    "https://blank.vageshwar.dev/r/theme.json"
  ],
  "files": [
    {
      "path": "ui/toast.tsx",
      "type": "registry:ui",
      "content": "// BlankUI: toast. Managed by BlankUI. Read toast.md before editing. Render <Toaster /> once, call toast() anywhere.\nimport type { ComponentProps } from \"react\"\nimport { Toaster as Sonner, toast } from \"sonner\"\n\n/**\n * Renders toasts. Put it once in your root layout. Then call `toast()` from anywhere.\n *\n * @example\n * // app/layout.tsx\n * <body>\n *   {children}\n *   <Toaster />\n * </body>\n */\nexport function Toaster({ position = \"bottom-right\", ...props }: ComponentProps<typeof Sonner>) {\n  return (\n    <Sonner\n      position={position}\n      toastOptions={{\n        unstyled: true,\n        classNames: {\n          toast:\n            \"flex w-full items-start gap-3 rounded-lg border bg-surface-raised p-4 text-sm text-foreground shadow-lg\",\n          title: \"font-medium\",\n          description: \"text-muted-foreground\",\n          actionButton:\n            \"ml-auto shrink-0 cursor-pointer rounded-md border border-edge bg-primary px-3 py-1.5 text-xs font-medium text-primary-foreground\",\n          cancelButton:\n            \"shrink-0 cursor-pointer rounded-md border border-input bg-surface px-3 py-1.5 text-xs font-medium\",\n          success: \"[&_[data-icon]]:text-success\",\n          error: \"[&_[data-icon]]:text-destructive\",\n          warning: \"[&_[data-icon]]:text-warning\",\n        },\n      }}\n      {...props}\n    />\n  )\n}\n\n/**\n * Show a toast. Re-exported from sonner.\n *\n * @example\n * toast(\"Saved\")\n * toast.success(\"Project created\", { description: \"You can invite people now.\" })\n * toast.error(\"Could not save\", { action: { label: \"Retry\", onClick: save } })\n */\nexport { toast }\n"
    },
    {
      "path": "ui/toast.md",
      "type": "registry:ui",
      "content": "---\nname: toast\ntitle: Toast\ndescription: A short message that appears for a few seconds after something happens, like \"Saved\". Built on sonner.\ncategory: feedback\nwhenToUse:\n  - Confirming an action finished, like saving or copying.\n  - Reporting an error from a background action, with an optional Retry action.\n  - Offering Undo after an action that is easy to reverse.\nwhenNotToUse:\n  - when: Asking the user to confirm before an action.\n    use: alert-dialog\n  - when: A validation error on a form field.\n    use: field (use the error prop)\n  - when: Information the user must read or act on.\n    use: dialog\nrelated: [alert-dialog, field, button]\nrequiredParts: [Toaster, toast]\nantiPatterns:\n  - avoid: 'import { toast } from \"sonner\" in app code'\n    instead: 'import { toast } from \"@/components/ui/toast\"'\n  - avoid: \"useToast() hook (old shadcn toast)\"\n    instead: \"toast() from @/components/ui/toast\"\n  - avoid: \"Several <Toaster /> elements\"\n    instead: \"One <Toaster /> in the root layout\"\n  - avoid: \"alert('Saved')\"\n    instead: 'toast.success(\"Saved\")'\n---\n\n# Toast\n\nBuilt on [sonner](https://sonner.emilkowal.ski). Render one `<Toaster />` in the root layout, then call `toast()` anywhere, including outside React components.\n\n## Import\n\n```tsx\nimport { Toaster, toast } from \"@/components/ui/toast\"\n```\n\n## Setup\n\n```tsx\n// app/layout.tsx\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\" data-theme=\"default\" data-mode=\"light\">\n      <body>\n        {children}\n        <Toaster />\n      </body>\n    </html>\n  )\n}\n```\n\n## Examples\n\n```tsx\ntoast(\"Link copied\")\ntoast.success(\"Project created\", { description: \"Invite your team next.\" })\ntoast.error(\"Could not save changes\", { action: { label: \"Retry\", onClick: save } })\ntoast(\"Message archived\", { action: { label: \"Undo\", onClick: unarchive } })\n```\n\nPromise toasts:\n\n```tsx\ntoast.promise(saveProject(), {\n  loading: \"Saving...\",\n  success: \"Saved\",\n  error: \"Could not save\",\n})\n```\n"
    }
  ],
  "docs": "Read components/ui/toast.md before using Toast. Docs: https://blank.vageshwar.dev/docs/toast",
  "meta": {
    "category": "feedback",
    "requiredParts": [
      "Toaster",
      "toast"
    ],
    "related": [
      "alert-dialog",
      "field",
      "button"
    ]
  }
}