{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "elements-tool-group",
  "type": "registry:component",
  "title": "Parallel tools",
  "description": "Calls that went out together, collapsed to one row until you want the detail.",
  "registryDependencies": [
    "https://r.assistant-ui.com/elements-surfaces.json"
  ],
  "dependencies": [
    "lucide-react"
  ],
  "files": [
    {
      "type": "registry:component",
      "path": "components/assistant-ui/elements/tool-group.tsx",
      "content": "\"use client\";\n\nimport type { ComponentProps } from \"react\";\nimport { CheckIcon, ChevronRightIcon, Loader2Icon, XIcon } from \"lucide-react\";\nimport { cn } from \"@/lib/utils\";\nimport { mono, paper } from \"./surfaces\";\n\nexport type GroupedToolState = \"running\" | \"done\" | \"failed\";\n\nexport interface GroupedTool {\n  id: string;\n  name: string;\n  target: string;\n  state: GroupedToolState;\n  durationMs?: number;\n}\n\nexport function ToolGroup({\n  label,\n  tools,\n  open,\n  onOpenChange,\n  className,\n  ...props\n}: Omit<\n  ComponentProps<\"div\">,\n  \"children\" | \"label\" | \"tools\" | \"open\" | \"onOpenChange\"\n> & {\n  label: string;\n  tools: readonly GroupedTool[];\n  open: boolean;\n  onOpenChange?: (open: boolean) => void;\n}) {\n  const running = tools.filter((tool) => tool.state === \"running\").length;\n  const failed = tools.filter((tool) => tool.state === \"failed\").length;\n\n  return (\n    <div\n      data-slot=\"tool-group\"\n      className={cn(\n        paper,\n        \"flex w-full max-w-sm flex-col overflow-hidden rounded-2xl\",\n        className,\n      )}\n\n      {...props}\n    >\n      <button\n        type=\"button\"\n        aria-expanded={open}\n        onClick={() => onOpenChange?.(!open)}\n        className=\"hover:bg-foreground/[0.03] flex items-center gap-2.5 px-3.5 py-2.5 text-start transition-colors\"\n      >\n        <ChevronRightIcon\n          className={cn(\n            \"text-foreground/25 size-3 shrink-0 transition-transform duration-200 motion-reduce:transition-none\",\n            open && \"rotate-90\",\n          )}\n        />\n        <span className=\"min-w-0 flex-1 truncate text-[13.5px]\">{label}</span>\n        <span className={cn(mono, \"text-foreground/30 shrink-0 tabular-nums\")}>\n          {running > 0\n            ? `${tools.length - running}/${tools.length}`\n            : failed > 0\n              ? `${failed} failed`\n              : `${tools.length} done`}\n        </span>\n        {running > 0 ? (\n          <Loader2Icon className=\"text-foreground/35 size-3.5 shrink-0 animate-spin motion-reduce:animate-none\" />\n        ) : failed > 0 ? (\n          <XIcon className=\"size-3.5 shrink-0 text-red-500\" />\n        ) : (\n          <CheckIcon className=\"size-3.5 shrink-0 text-emerald-500\" />\n        )}\n      </button>\n\n      {open && (\n        <div className=\"border-foreground/[0.06] fade-in slide-in-from-top-1 animate-in flex flex-col border-t duration-200\">\n          {tools.map((tool) => (\n            <div\n              key={tool.id}\n              className=\"flex items-center gap-2.5 px-3.5 py-2\"\n            >\n              <span className=\"flex size-3.5 shrink-0 items-center justify-center\">\n                {tool.state === \"running\" ? (\n                  <Loader2Icon className=\"text-foreground/35 size-3 animate-spin motion-reduce:animate-none\" />\n                ) : tool.state === \"failed\" ? (\n                  <XIcon className=\"size-3 text-red-500\" />\n                ) : (\n                  <CheckIcon className=\"size-3 text-emerald-500\" />\n                )}\n              </span>\n              <span className={cn(mono, \"text-foreground/55 shrink-0\")}>\n                {tool.name}\n              </span>\n              <span className=\"text-foreground/80 min-w-0 flex-1 truncate text-[13px]\">\n                {tool.target}\n              </span>\n              {tool.durationMs !== undefined && (\n                <span\n                  className={cn(\n                    mono,\n                    \"text-foreground/25 shrink-0 tabular-nums\",\n                  )}\n                >\n                  {tool.durationMs}ms\n                </span>\n              )}\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"
    }
  ]
}