Claude Code 面板插件：仪表盘与侧边面板

Claude Code 面板插件会在对话旁边打开一个面板，并在 Claude 工作时持续更新其中的内容。典型用途包括未提交改动的实时 diff、测试结果仪表盘、日志尾部输出，或整个会话的 token 用量图表。与状态栏不同，面板有足够的空间放下表格、列表和按钮。

Claude Code 面板插件是如何工作的？#

插件通过 $.ui.open(...) 打开面板，并通过处理 Pane 渲染位置的 ui.render 事件来绘制它。面板内部的视图由 Box、Text、Markdown、Code、Button、Input 和 Select 等元素构成，这些元素都来自 $.ui.resolve(e)。当你按下按钮或在输入框中键入内容时，插件会收到 ui.press、ui.input 或 ui.select 事件。ui.close 在面板即将关闭前触发，$.ui.panes() 则列出当前打开的面板。

大多数面板是通过插件用 $.command.register 添加的斜杠命令打开的，它们把数据保存在 $.state 中，因此数据一变化，视图就会自动重绘。Claude Code 自带的 /diff 命令就是以这种方式构建的内置插件。界面文档介绍了每一种元素。

安装前应该检查什么？#

面板插件几乎总会显示 修改界面 标记，通常还有 添加命令/工具。关键在于数据来自哪里。diff 面板需要 执行命令 来运行 git；日志或指标仪表盘可能需要 读取文件 或 网络访问。如果面板渲染了 Client 元素，就意味着它会在面板中运行网页内容，请阅读源码，弄清它加载了什么。

还要确认支持的界面。面板可以在终端和桌面应用的 Code 标签页中使用，但在 claude -p、VS Code 扩展的聊天面板以及 Agent SDK 中不会绘制，在这些环境里插件只运行钩子。

什么时候不适合用面板？#

如果你只需要看一个数字，状态栏或输入框上方的横栏占用的屏幕空间更少。如果你需要在某件事完成时收到提醒，用提示（toast）更合适。当你原本需要在 Claude Code 旁边再开一个终端时，面板才真正物有所值，例如反复运行 git diff，或盯着测试运行器的输出。