Code UI (codeui)

VSCode 风格的代码变更查看器，把 DeepSeek Harness 变成「编辑器 + 对话助手」的工作台。 A VSCode-style code-change viewer that turns DeepSeek Harness into an IDE-like workbench.

中文文档 · English

---

中文

简介

Code UI 是一个 DeepSeek Harness 的 Cordis 动态插件，把界面改造成 VSCode 式三栏工作台：

位置	内容
最左侧	可点击切换、弹出/隐藏的 资源管理器（当前工作区的文件夹/文件树）
中间	标签式代码编辑器：显示智能体编辑过的文件差异，绿色 = 新增行，红色 = 删除行，灰色/黑色 = 未变更行
右侧	对话窗口（右移，就像 VSCode 靠右的对话助手），左边界可拖动调整宽度

功能特性

• 资源管理器（左侧抽屉）：浏览当前工作目录，点击文件夹展开、点击文件在中间打开为新标签页。
• 连续全文件差异：中间面板渲染一份连续的文件视图（行号不重排），对比基准为「上一回合修改后的完整代码」——第一次新建文件时全文标绿；后续修改只把改动的行标绿/标红，其余保持灰色上下文。
• 横向标签栏：所有打开的文件以标签横排于顶部，点击切换、点 × 关闭单个文件；被智能体修改的文件自动加入标签页。
• 执行中自动跳转：任务运行期间，中间面板优先跳到「正在编辑」的文件并实时显示差异。
• 对话窗口可调宽度：右移后的对话窗口左边界可拖动（300–520px），输入框下方状态文字自动换行为两行，权限/模型选择框在窄列下自动分行不重叠。
• 设置页：设置 → Code UI 提供三个开关（显示资源管理器 / 显示代码变更面板 / 对话右移·代码居中）。
• 插件管理：作为 Cordis 动态插件，自动出现在 设置 → 插件 列表中，可停用 / 更新 / 删除。

安装（动态插件）

在 DeepSeek Harness 中使用 cordis_define 新建插件：

1. kind: "new"，idPrefix: "codeui"（Host 会分配最终 id，如 codeui-1）。
2. code.host 填入 host.js 的内容，code.client 填入 client.js 的内容。
3. 在界面批准运行（单勾 = 本次版本，双勾 = 未来版本自动放行）。

运行后：左下角出现 📁 按钮切换资源管理器；开始会话后中间自动打开代码变更面板，对话窗口移动到最右。

文件结构

codeui/
├── package.json   # npm 元数据
├── index.js       # 包清单（说明 host/client 两半的对应关系）
├── host.js        # Host 半边：文件系统 RPC（listDir / readFile / workspaceRoot）
├── client.js      # Client 半边：资源管理器、标签式 diff 编辑器、对话右移、设置页
├── LICENSE        # MIT
└── README.md

host.js 与 client.js 都是纯 JavaScript 的 Cordis "function body" 源码（顶层 return { ... } 即函数体），零依赖、无 import/require/JSX/TypeScript。

架构说明