AI 仓库情报摘要

FR-AI / ANALYSIS

为什么值得关注

它能够以高保真、无障碍的方式将三种主流编码代理的终端 UI 封装为 shadcn 组件，无需截图或 iframe 即可直接在文档和演示中使用。

适合谁使用

使用 shadcn/ui 且需要真实代理终端组件的 React 开发者
为 AI 编码工具编写文档的技术写作者
构建 AI 代理演示或营销页面的产品团队
原型设计终端交互的设计师

典型使用场景

在产品更新日志或博客中嵌入 Claude Code 会话
在教程或交互式指南中展示 Codex 输出
为 Grok 构建带有真实终端效果的着陆页
为开发者作品集或案例研究创建可复制的 UI 块

项目优势

基于真实终端捕获（通过 tmux 工具链）实现高保真还原
完全兼容 shadcn/ui 的注册表与复制粘贴工作流
覆盖三个不同的代理系列，提供大量子组件和块
采用 MIT 许可证，支持社区贡献

使用前须知

需要已配置 shadcn/ui 注册表系统的 React 项目
没有独立的纯 JavaScript 版本，绑定在 shadcn 生态内
仅支持列出的三种代理，未包含自定义或未来代理

README 快速开始

brainless

Claude Code, Codex, and Grok interfaces as shadcn components.

Site: brainless.swerdlow.dev · Repo: github.com/theswerd/brainless

What is this?

brainless is a shadcn/ui registry of accessible React components that recreate the terminal UIs of coding agents — Claude Code, OpenAI Codex, and Grok — so you can drop them into docs, demos, marketing pages, and product UI without screenshots or iframes.

Components are built for fidelity against real terminal captures, then shipped as copy-pasteable registry items.

Install

Namespace (recommended)

bunx shadcn@latest registry add @brainless=https://brainless.swerdlow.dev/r/{name}.json
bunx shadcn@latest add @brainless/claude-session
bunx shadcn@latest add @brainless/codex-session
bunx shadcn@latest add @brainless/grok-session

Or add the registry manually in components.json:

{
  "registries": {
    "@brainless": "https://brainless.swerdlow.dev/r/{name}.json"
  }
}

URL

bunx shadcn@latest add https://brainless.swerdlow.dev
bunx shadcn@latest add https://brainless.swerdlow.dev/r/claude-session.json

GitHub

bunx shadcn@latest add theswerd/brainless/claude-session

Browse individual pieces on components and blocks.

Components

Family	Pieces
Claude	header, message, thinking, tool call, diff, permission, prompt, slash menu, todo list
Codex	header, message, working, exec, diff, permissions, prompt, slash menu
Grok	status, header, message, thinking, thought, tool, write, turn end, prompt, slash menu, and more
Blocks	`claude-session`, `codex-session`, `grok-session`, `grok-session-active`

Repo layout

registry/brainless/   # source components (claude / codex / grok / blocks / ui)
public/r/             # built registry JSON for shadcn add
references/captures/  # ANSI / HTML / text frames from real CLIs
tools/capture/        # tmux capture harness
app/                  # docs site (Next.js)
docs/screenshots/     # README screenshots

Capture harness

Fidelity starts from real terminal output. The capture tools under tools/capture/ drive agents

项目描述

Claude Code, Codex, and Grok interfaces as shadcn components

brainless

为什么值得关注

适合谁使用

典型使用场景

项目优势

使用前须知

README 快速开始

brainless

What is this?

Install

Namespace (recommended)

URL

GitHub

Components

Repo layout

Capture harness

项目描述

相关仓库与替代方案

router

scriptc

thinking-orbs