组件系统
200+ 个终端 UI 组件,从简单的文本高亮到复杂的虚拟滚动列表。每一个都是 React 组件,用 JSX 写的。
核心组件
PromptInput
用户输入框。不是简单的 readline,而是一个完整的编辑器:
- 多行输入
- 语法高亮
- 历史记录(上下箭头)
- Tab 补全
- Vim 键绑定(可选)
VirtualMessageList
消息列表的虚拟滚动实现:
- 只渲染可视区域
- 平滑滚动
- 懒加载历史消息
- 代码块语法高亮
StatusLine
底部状态栏,显示:
- 当前模型
- Session 费用
- Token 使用量
- 上下文使用率
- 权限模式
LogoHeader
启动时的 Claude Logo 和版本信息。
工具 UI 组件
每个工具都有对应的 UI 组件,处理不同状态的展示:
- 进度态:显示执行进度(如文件读取百分比)
- 结果态:格式化展示工具输出
- 错误态:友好的错误信息
- 权限确认态:展示操作详情,等待用户确认