{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "toast",
  "title": "Toast",
  "description": "A shadcn-style toast component built with Ark UI primitives.",
  "dependencies": ["@ark-ui/react", "lucide-react"],
  "files": [
    {
      "path": "src/components/ui/toast.tsx",
      "content": "\"use client\";\n\nimport { Portal } from \"@ark-ui/react/portal\";\nimport {\n  createToaster,\n  Toaster,\n  Toast as ToastPrimitive,\n} from \"@ark-ui/react/toast\";\nimport {\n  CircleAlertIcon,\n  CircleCheckIcon,\n  InfoIcon,\n  LoaderIcon,\n  TriangleAlertIcon,\n  XIcon,\n} from \"lucide-react\";\nimport type { ComponentProps } from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nexport type ToastProps = ToastPrimitive.RootProps;\nexport type ToastTitleProps = ToastPrimitive.TitleProps;\nexport type ToastDescriptionProps = ToastPrimitive.DescriptionProps;\nexport type ToastActionTriggerProps = ToastPrimitive.ActionTriggerProps;\nexport type ToastCloseTriggerProps = ToastPrimitive.CloseTriggerProps;\nexport type ToastProviderProps = Omit<\n  ComponentProps<typeof Toaster>,\n  \"toaster\" | \"children\"\n>;\nexport type AnchoredToastProviderProps = Omit<\n  ComponentProps<typeof Toaster>,\n  \"toaster\" | \"children\"\n>;\n\nconst ICON_MAP: Record<string, React.ComponentType<{ className?: string }>> = {\n  success: CircleCheckIcon,\n  error: CircleAlertIcon,\n  warning: TriangleAlertIcon,\n  info: InfoIcon,\n  loading: LoaderIcon,\n};\n\nconst ICON_COLOR_MAP: Record<string, string> = {\n  success: \"text-success-foreground\",\n  error: \"text-destructive\",\n  warning: \"text-warning-foreground\",\n  info: \"text-info-foreground\",\n  loading: \"text-muted-foreground\",\n};\n\nexport const ToastRoot = ({ className, ...props }: ToastProps) => (\n  <ToastPrimitive.Root\n    className={cn(\n      \"group pointer-events-auto relative flex w-full flex-col gap-1 overflow-hidden rounded-lg border border-border/80 bg-popover p-4 pe-10 text-popover-foreground shadow-lg\",\n      \"data-[placement=top]:mx-auto data-[placement=bottom]:mx-auto\",\n      \"data-[placement=top]:w-fit data-[placement=bottom]:w-fit\",\n      \"data-[placement=top]:max-w-[min(26rem,calc(100vw-2rem))] data-[placement=bottom]:max-w-[min(26rem,calc(100vw-2rem))]\",\n      \"will-change-transform\",\n      \"data-[state=open]:animate-in data-[state=open]:fade-in data-[state=open]:duration-300 data-[state=open]:ease-out\",\n      \"data-[state=closed]:animate-out data-[state=closed]:fade-out data-[state=closed]:duration-250 data-[state=closed]:ease-in\",\n      \"data-[placement^=top]:data-[state=open]:slide-in-from-top-2 data-[placement^=bottom]:data-[state=open]:slide-in-from-bottom-2\",\n      \"data-[placement^=top]:data-[state=closed]:slide-out-to-top-2 data-[placement^=bottom]:data-[state=closed]:slide-out-to-bottom-2\",\n      className,\n    )}\n    data-slot=\"toast\"\n    {...props}\n  />\n);\n\nexport const ToastTitle = ({ className, ...props }: ToastTitleProps) => (\n  <ToastPrimitive.Title\n    className={cn(\"flex items-center gap-2 font-semibold text-sm\", className)}\n    data-slot=\"toast-title\"\n    {...props}\n  />\n);\n\nexport const ToastDescription = ({\n  className,\n  ...props\n}: ToastDescriptionProps) => (\n  <ToastPrimitive.Description\n    className={cn(\"text-muted-foreground text-sm\", className)}\n    data-slot=\"toast-description\"\n    {...props}\n  />\n);\n\nexport const ToastActionTrigger = ({\n  className,\n  ...props\n}: ToastActionTriggerProps) => (\n  <ToastPrimitive.ActionTrigger\n    className={cn(\n      \"mt-1 inline-flex h-7 shrink-0 cursor-pointer items-center justify-center rounded-md border border-border/80 bg-transparent px-3 font-medium text-xs transition-colors hover:bg-accent focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-1 disabled:pointer-events-none disabled:opacity-50\",\n      className,\n    )}\n    data-slot=\"toast-action\"\n    {...props}\n  />\n);\n\nexport const ToastCloseTrigger = ({\n  className,\n  ...props\n}: ToastCloseTriggerProps) => (\n  <ToastPrimitive.CloseTrigger\n    className={cn(\n      \"absolute top-2 inset-e-2 cursor-pointer rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring group-hover:opacity-100\",\n      className,\n    )}\n    data-slot=\"toast-close\"\n    {...props}\n  >\n    <XIcon className=\"size-4\" />\n  </ToastPrimitive.CloseTrigger>\n);\n\nexport const ToastIndicator = ({\n  type,\n  className,\n}: {\n  type?: string;\n  className?: string;\n}) => {\n  if (!type || !(type in ICON_MAP)) return null;\n  const Icon = ICON_MAP[type];\n  return (\n    <Icon\n      className={cn(\n        \"size-4 shrink-0\",\n        ICON_COLOR_MAP[type] ?? \"text-muted-foreground\",\n        type === \"loading\" && \"animate-spin\",\n        className,\n      )}\n    />\n  );\n};\n\nexport const toaster = createToaster({\n  placement: \"bottom-end\",\n  overlap: true,\n  gap: 16,\n  max: 5,\n});\ntype ToasterProps = Omit<\n  ComponentProps<typeof Toaster>,\n  \"toaster\" | \"children\"\n>;\n\nexport const ToastProvider = ({ className, ...props }: ToasterProps) => (\n  <Portal>\n    <Toaster\n      toaster={toaster}\n      className={cn(\n        \"fixed! z-100 flex max-h-screen w-full flex-col-reverse p-4 sm:top-auto sm:inset-e-0 sm:bottom-0 sm:flex-col md:max-w-105\",\n        className,\n      )}\n      data-slot=\"toast-provider\"\n      {...props}\n    >\n      {(toast) => (\n        <ToastRoot key={toast.id}>\n          <ToastTitle>\n            <ToastIndicator type={toast.type} />\n            {toast.title}\n          </ToastTitle>\n          {toast.description && (\n            <ToastDescription>{toast.description}</ToastDescription>\n          )}\n          {toast.action && (\n            <ToastActionTrigger>{toast.action.label}</ToastActionTrigger>\n          )}\n          <ToastCloseTrigger />\n        </ToastRoot>\n      )}\n    </Toaster>\n  </Portal>\n);\n\nexport const ToastContext = ToastPrimitive.Context;\n\nexport { createToaster, Toaster } from \"@ark-ui/react/toast\";\n",
      "type": "registry:ui",
      "target": "src/components/ui/toast.tsx"
    }
  ],
  "cssVars": {
    "theme": {
      "--color-destructive-foreground": "var(--destructive-foreground)",
      "--color-info": "var(--info)",
      "--color-info-foreground": "var(--info-foreground)",
      "--color-success": "var(--success)",
      "--color-success-foreground": "var(--success-foreground)",
      "--color-warning": "var(--warning)",
      "--color-warning-foreground": "var(--warning-foreground)"
    },
    "light": {
      "--destructive-foreground": "var(--color-red-400)",
      "--info": "var(--color-blue-500)",
      "--info-foreground": "var(--color-blue-700)",
      "--success": "var(--color-emerald-500)",
      "--success-foreground": "var(--color-emerald-700)",
      "--warning": "var(--color-amber-500)",
      "--warning-foreground": "var(--color-amber-700)"
    },
    "dark": {
      "--destructive-foreground": "var(--color-red-400)",
      "--info": "var(--color-blue-500)",
      "--info-foreground": "var(--color-blue-400)",
      "--success": "var(--color-emerald-500)",
      "--success-foreground": "var(--color-emerald-400)",
      "--warning": "var(--color-amber-500)",
      "--warning-foreground": "var(--color-amber-400)"
    }
  },
  "css": {
    "@layer base": {
      "[data-scope=\"toast\"][data-part=\"root\"]": {
        "translate": "var(--x) var(--y)",
        "scale": "var(--scale)",
        "z-index": "var(--z-index)",
        "height": "var(--height)",
        "opacity": "var(--opacity)",
        "will-change": "translate, opacity, scale",
        "transition": "translate 400ms, scale 400ms, opacity 400ms, height 400ms, box-shadow 200ms",
        "transition-timing-function": "cubic-bezier(0.21, 1.02, 0.73, 1)"
      },
      "[data-scope=\"toast\"][data-part=\"root\"][data-state=\"closed\"]": {
        "transition": "translate 400ms, scale 400ms, opacity 200ms",
        "transition-timing-function": "cubic-bezier(0.06, 0.71, 0.55, 1)"
      }
    }
  },
  "type": "registry:ui"
}