{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tool-call-chip",
  "title": "ToolCallChip",
  "description": "Compact running/complete/error indicator for one agent tool invocation.",
  "dependencies": [
    "@hugeicons/react",
    "@hugeicons/core-free-icons"
  ],
  "registryDependencies": [
    "utils",
    "https://ui.neon.com/r/neon-tokens.json"
  ],
  "files": [
    {
      "path": "src/components/tool-call-chip/tool-call-chip.tsx",
      "content": "\"use client\";\n\nimport {\n  Cancel01Icon,\n  Loading03Icon,\n  Tick02Icon,\n} from \"@hugeicons/core-free-icons\";\nimport { HugeiconsIcon } from \"@hugeicons/react\";\nimport type { ComponentProps } from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nexport type ToolCallState = \"running\" | \"done\" | \"error\";\n\nexport type ToolCallChipProps = Omit<ComponentProps<\"span\">, \"children\"> & {\n  /** Tool name, shown in mono, e.g. \"writeFile\". */\n  name: string;\n  /** Lifecycle state of the invocation. */\n  state?: ToolCallState;\n  /** What the tool touched, e.g. a file path or command. */\n  detail?: string;\n};\n\n/* ─────────────────────────────────────────────────────────\n * A quiet log line, not a badge: a tiny status glyph, the\n * tool name in mono, and the target dimmed after it. No\n * border, no fill — the states speak through the glyph:\n * spinner while running, a small green check when done, a\n * red cross on error. Color only ever touches the glyph.\n * ───────────────────────────────────────────────────────── */\nconst STATE_ICON: Record<ToolCallState, typeof Tick02Icon> = {\n  done: Tick02Icon,\n  error: Cancel01Icon,\n  running: Loading03Icon,\n};\n\nexport const ToolCallChip = ({\n  className,\n  detail,\n  name,\n  state = \"done\",\n  ...props\n}: ToolCallChipProps) => {\n  const Icon = STATE_ICON[state];\n\n  return (\n    <span\n      className={cn(\n        \"inline-flex max-w-full items-center gap-2 py-0.5 font-mono text-muted-foreground text-xs\",\n        className\n      )}\n      data-slot=\"tool-call-chip\"\n      data-state={state}\n      {...props}\n    >\n      <HugeiconsIcon\n        aria-hidden=\"true\"\n        icon={Icon}\n        strokeWidth={2}\n        className={cn(\n          \"size-3 shrink-0\",\n          state === \"running\" && \"animate-spin text-muted-foreground/70\",\n          state === \"done\" && \"text-primary\",\n          state === \"error\" && \"text-destructive\"\n        )}\n      />\n      <span className=\"shrink-0\">{name}</span>\n      {detail ? (\n        <span\n          className=\"min-w-0 truncate text-muted-foreground/50\"\n          title={detail}\n        >\n          {detail}\n        </span>\n      ) : null}\n      <span className=\"sr-only\">{state === \"running\" ? \"running\" : state}</span>\n    </span>\n  );\n};\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}