{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "chat-dock-section",
  "title": "Chat Dock Section",
  "description": "Sidebar section that hosts a compact, scrollable chat thread alongside a spatial workspace — slotted into a dock or rail to keep an AI assistant in view.",
  "dependencies": [
    "@vllnt/ui@^0.2.1"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/default/chat-dock-section/chat-dock-section.tsx",
      "content": "import { forwardRef } from \"react\";\n\nimport { ArrowUpRight, MessageSquareText } from \"lucide-react\";\nimport type { ReactNode } from \"react\";\n\nimport { cn } from \"@vllnt/ui\";\nimport { Button } from \"@vllnt/ui\";\n\nexport type ChatDockMessage = {\n  body: ReactNode;\n  id: string;\n  speaker: ReactNode;\n};\n\nexport type ChatDockSectionProps = React.ComponentPropsWithoutRef<\"section\"> & {\n  composerPlaceholder?: string;\n  contextLabel?: ReactNode;\n  messages: ChatDockMessage[];\n  title?: ReactNode;\n};\n\nconst ChatDockSection = forwardRef<HTMLElement, ChatDockSectionProps>(\n  (\n    {\n      className,\n      composerPlaceholder = \"Ask about runs, errors, or pending work…\",\n      contextLabel,\n      messages,\n      title = \"Assistant\",\n      ...props\n    },\n    ref,\n  ) => (\n    <section\n      className={cn(\n        \"flex flex-col gap-4 rounded-2xl border border-border/70 bg-background/75 p-4 shadow-[0_10px_35px_oklch(var(--foreground)/0.06)] backdrop-blur-xl\",\n        className,\n      )}\n      ref={ref}\n      {...props}\n    >\n      <div className=\"flex items-start justify-between gap-3\">\n        <div className=\"space-y-2\">\n          <div className=\"flex items-center gap-2 text-sm font-medium text-foreground\">\n            <MessageSquareText className=\"size-4 text-primary\" />\n            {title}\n          </div>\n          {contextLabel ? (\n            <div className=\"text-xs uppercase tracking-[0.24em] text-muted-foreground\">\n              {contextLabel}\n            </div>\n          ) : null}\n        </div>\n        <Button size=\"sm\" type=\"button\" variant=\"ghost\">\n          Open thread\n          <ArrowUpRight className=\"size-4\" />\n        </Button>\n      </div>\n      <div className=\"space-y-3\">\n        {messages.map((message) => (\n          <div\n            className=\"rounded-xl border border-border/60 bg-background/85 px-3 py-2\"\n            key={message.id}\n          >\n            <div className=\"text-[11px] font-medium uppercase tracking-[0.18em] text-muted-foreground\">\n              {message.speaker}\n            </div>\n            <div className=\"mt-2 text-sm leading-6 text-foreground\">\n              {message.body}\n            </div>\n          </div>\n        ))}\n      </div>\n      <div className=\"rounded-xl border border-dashed border-border/80 bg-background/70 p-3 text-sm text-muted-foreground\">\n        {composerPlaceholder}\n      </div>\n    </section>\n  ),\n);\n\nChatDockSection.displayName = \"ChatDockSection\";\n\nexport { ChatDockSection };\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component",
  "version": "0.2.1",
  "stability": "stable"
}
