dsh-popout-sidebar

项目详情摘要

可弹出式侧边栏 · Popout Sidebar 可弹出式侧边栏**：侧边栏展示产物与文件树，支持多种文件预览形式；并可弹出为独立浏览器标签页（可拖至另一显示器上更大更清晰的观看）；兼容其他 sidebar 插件，可以同时显示。 **Popout Sidebar**: a sidebar that lists the agent's artifacts and a file tree, with multiple preview formats, and pops out into a separate browser tab (drag it to another monitor for a larger, clearer view) — coexisting with other sidebar plugins at the same time. 给 DeepSeek Harness Web UI 增加一个展示**产物（artifacts）**与**文件树**的侧边栏，并可一键弹出为**独立浏览器标签页**。 已上线 / Now available 本插件已收录进 DeepSeek Harness 插件生态： 渠道 | 入口 | 插件精选列表 | awesome-dsh-plugin.com · 详情页 | 插件市场 | dsh-market（DSH 内：设置 → Plugin Market） | 一键安装（推荐） 先装市场： 重启 `dsh web` 后，打开 **设置 → Plugin Market**，搜索 **popout** 或 **sidebar**，点「安装」。 或直接按注册表命令安装： 装完**重启 `dsh web`** 并**硬刷新浏览器**（Cmd/Ctrl+Shift+R），界面右上角出现常驻「产物」图标按钮（无会话时也可见）。 特性 / Features ↗️ **弹出为独立标签页**：一键把侧边栏弹出为独立网页标签页（`/popout-sidebar`），每 1.5s 自动刷新，可拖到另一块显示器上更大、更清晰地观看。 🗂 **产物侧边栏**：实时列出代理通过 `write` / `edit` 创建或修改的文件，以及 `bash` / `pwsh` 命令在工作区里产生的文件（如脚本生成的图片）；列表与预览区之间的分界线可拖动调整。 🌳 **文件树**：侧边栏与独立标签页内都有「文件树」，可浏览当前工作区目录（懒加载展开，点击文件即预览），并**实时跟随工作区切换**。 👀 **多类型预览**：按文件类型预览——代码 / 纯文本（语法高亮 + 行号）、Markdown 渲染、图片、PDF（浏览器原生查看器）、HTML（沙箱 iframe），超长内容自动截断。 📝 **编辑差异**：`edit` 修改过的文件在预览里展示「删除 / 新增」改动片段对比。 🔗 **复制 / 引用**：一键复制文件路径，或把 `@path` 引用写入会话输入框（悬浮在列表行）。 🧭 **与其他 sidebar 兼容**：其他「侧边卡片」打开时，本侧边栏自动让位到其左侧，两者同时可见。 ⚙️ **设置面板**：DSH 设置里新增「Popout Sidebar」选项卡，可开关默认展开、自动刷新、文件树，设置最短面板宽度（存于 `localStorage`）；面板更宽可通过拖动左边缘调整。 🗑 **清除模式**：右上角进入清除模式后，点击产物将其标红，再点红色 × 移除列表条目（仅移除条目，不动磁盘文件）。 ✖️ **关闭**：点击右上角「产物」图标按钮收起面板。 工作原理 / How it works **Host（Node 进程）** 监听 `tools/result` 事件，追踪 `write` / `edit` 的成功调用并提取 `file_path`（`edit` 额外记录 `old_string`/`new_string` 改动片段，并按扩展名标注预览类型）。 监听 `tools/execute` 事件，对 `bash` / `pwsh` 这类「不透明」执行器做工作区前后快照对比（`fs.listDir` 递归 + 版本 token 指纹，跳过 `node_modules`/`.git` 等大目录），把命令间接新增/改写的