Skip to content

组件系统

200+ 个终端 UI 组件,从简单的文本高亮到复杂的虚拟滚动列表。每一个都是 React 组件,用 JSX 写的。

核心组件

PromptInput

用户输入框。不是简单的 readline,而是一个完整的编辑器:

  • 多行输入
  • 语法高亮
  • 历史记录(上下箭头)
  • Tab 补全
  • Vim 键绑定(可选)

VirtualMessageList

消息列表的虚拟滚动实现:

  • 只渲染可视区域
  • 平滑滚动
  • 懒加载历史消息
  • 代码块语法高亮

StatusLine

底部状态栏,显示:

  • 当前模型
  • Session 费用
  • Token 使用量
  • 上下文使用率
  • 权限模式

LogoHeader

启动时的 Claude Logo 和版本信息。

工具 UI 组件

每个工具都有对应的 UI 组件,处理不同状态的展示:

  • 进度态:显示执行进度(如文件读取百分比)
  • 结果态:格式化展示工具输出
  • 错误态:友好的错误信息
  • 权限确认态:展示操作详情,等待用户确认