@rooode/dsh-plugin-preview 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +121 -0
- package/cordis.patch.yml +16 -0
- package/lib/client.js +2200 -0
- package/lib/index.d.ts +18 -0
- package/lib/index.js +212 -0
- package/package.json +68 -0
package/README.md
ADDED
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
# DeepSeek Harness - 右侧 Markdown 文档预览插件 (`@rooode/dsh-plugin-preview`)
|
|
2
|
+
|
|
3
|
+
[](https://www.npmjs.com/package/@rooode/dsh-plugin-preview)
|
|
4
|
+
[](https://github.com/rooode)
|
|
5
|
+
|
|
6
|
+
本插件为 **DeepSeek Harness (DSH)** 与 **WorkBuddy** 对话界面提供了参考 WorkBuddy `FileTabs` 设计的**右侧多标签 Markdown 与文档预览面板**。
|
|
7
|
+
|
|
8
|
+
在 DSH 中，大模型经常会生成、改写或读取 `.md` 文档。默认情况下，点击生成的文档链接会直接调用 Windows 系统的本地记事本 (Notepad) 打开，打断了用户在 Web 会话中的阅读与操作体验。通过安装本插件，点击任何 Markdown 文档将直接在**右侧滑出多标签预览抽屉**，提供富文本渲染、目录大纲、源码分栏、一键复制、实时刷新以及按需本地打开等全套能力。
|
|
9
|
+
|
|
10
|
+
---
|
|
11
|
+
|
|
12
|
+
## 🌟 核心特性 (Features)
|
|
13
|
+
|
|
14
|
+
1. **自动拦截与无感打开**：
|
|
15
|
+
- 自动拦截对话底部 **产出文件行 (`ProducedFiles`)**、**工具执行行 (`ToolRow`)** 以及对话正文中的所有 `.md`、`.markdown`、`.txt`、`.json` 等文档点击。
|
|
16
|
+
- 不再弹出本地记事本，直接在右侧平滑滑出预览面板。
|
|
17
|
+
|
|
18
|
+
2. **右侧多标签页支持 (FileTabs)**：
|
|
19
|
+
- 支持同时打开多个文档，标签栏清晰展示文件图标、文档名、修改标记与独立关闭按钮。
|
|
20
|
+
- 支持快速切换激活标签、一键全部关闭。
|
|
21
|
+
- 左侧边框支持 **鼠标自由拖拽调节宽度 (ResizeHandle)**（支持 380px 至 90vw 自由调整）。
|
|
22
|
+
|
|
23
|
+
3. **全功能 GFM Markdown 渲染引擎**：
|
|
24
|
+
- **三模视图切换**：
|
|
25
|
+
- 📖 **渲染预览 (Preview)**：排版精美的富文本 Markdown 渲染。
|
|
26
|
+
- 📝 **源码模式 (Source)**：带行号与等宽字体的 Markdown 原文。
|
|
27
|
+
- 🌓 **分栏对比 (Split)**：左右双栏并排对照。
|
|
28
|
+
- **GitHub Alerts 提示框**：完整支持 `> [!NOTE]`、`> [!TIP]`、`> [!IMPORTANT]`、`> [!WARNING]`、`> [!CAUTION]` 彩色卡片渲染。
|
|
29
|
+
- **代码块语法高亮**：支持 JavaScript/TypeScript、Python、JSON、Bash、HTML、CSS 等多种语言关键字高亮，顶部附带语言标识与**一键复制代码**按钮。
|
|
30
|
+
- **LaTeX 数学公式**：支持 `$inline$` 与 `$$block$$` 数学公式排版。
|
|
31
|
+
- **数据表格与任务清单**：斑马纹表格自适应排版、交互式勾选框列表。
|
|
32
|
+
- **目录大纲导航 (TOC)**：自动提取 H1~H6 标题生成侧栏目录，点击平滑滚动跳转至对应章节。
|
|
33
|
+
|
|
34
|
+
4. **实用操作工具栏**：
|
|
35
|
+
- 📋 **一键复制 (Copy)**：一键复制完整 Markdown 内容至系统剪贴板。
|
|
36
|
+
- 🔄 **实时刷新 (Refresh)**：重新从磁盘加载最新文件内容（Agent 持续写入时可一键更新）。
|
|
37
|
+
- 🖥️ **本地应用打开 (Open Native)**：若确需在系统外部编辑器（记事本/VSCode）中打开，可一键唤起。
|
|
38
|
+
- 📁 **资源管理器中定位 (Reveal)**：一键调用系统资源管理器定位并高亮选中该文件。
|
|
39
|
+
- 🔍 **文档内关键词搜索 (Find)**：快速高亮匹配文本。
|
|
40
|
+
- ✕ **快捷收起与悬浮入口**：支持 Esc 快捷键关闭；收起后右下角保留胶囊浮窗，一键随时恢复展开。
|
|
41
|
+
|
|
42
|
+
5. **Node 端服务与安全保障**：
|
|
43
|
+
- 配合 Node 端 Cordis `PreviewService`，提供 `/api/preview/read`、`/api/preview/reveal` 等 REST 路由，解决本地工作区文件跨目录读取与超大文件防护。
|
|
44
|
+
|
|
45
|
+
---
|
|
46
|
+
|
|
47
|
+
## 📦 快速安装 (Installation)
|
|
48
|
+
|
|
49
|
+
### 方式 1：通过 `dsh plugin` 命令安装
|
|
50
|
+
```bash
|
|
51
|
+
# 1. 安装插件到 web profile
|
|
52
|
+
npx @deepseek-ai/dsh plugin --profile web add @rooode/dsh-plugin-preview
|
|
53
|
+
|
|
54
|
+
# 2. 启动 DSH Web
|
|
55
|
+
npx @deepseek-ai/dsh web
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
### 方式 2：本地源码一键构建与分发部署
|
|
59
|
+
在本项目根目录下执行：
|
|
60
|
+
```bash
|
|
61
|
+
# 编译并自动分发到所有本地 DSH 环境与 npx 缓存
|
|
62
|
+
npm run build
|
|
63
|
+
|
|
64
|
+
# 启动 Web UI 体验
|
|
65
|
+
npx @deepseek-ai/dsh web
|
|
66
|
+
```
|
|
67
|
+
|
|
68
|
+
---
|
|
69
|
+
|
|
70
|
+
## 📁 目录结构 (Directory Structure)
|
|
71
|
+
|
|
72
|
+
```text
|
|
73
|
+
dsh-plugin-preview/
|
|
74
|
+
├── package.json # 插件元信息与 npm 脚本配置
|
|
75
|
+
├── cordis.patch.yml # DSH 组合包 patch 描述文件
|
|
76
|
+
├── tsconfig.json # TypeScript 编译配置
|
|
77
|
+
├── README.md # 插件说明文档
|
|
78
|
+
├── scripts/
|
|
79
|
+
│ └── build.js # 自动构建、分发与补丁安装脚本
|
|
80
|
+
├── src/
|
|
81
|
+
│ ├── types.ts # 核心 TypeScript 类型定义
|
|
82
|
+
│ ├── service.ts # Node 端 PreviewService 服务 (HTTP 路由)
|
|
83
|
+
│ ├── index.ts # Node 端 Cordis Service 注册与 Schema 导出
|
|
84
|
+
│ └── client.js # Web 浏览器端 React 预览面板与拦截器
|
|
85
|
+
└── lib/
|
|
86
|
+
├── index.js # Node ESM 导出产物
|
|
87
|
+
├── index.d.ts # 类型声明文件
|
|
88
|
+
└── client.js # Web 端 ModuleLoader 加载产物
|
|
89
|
+
```
|
|
90
|
+
|
|
91
|
+
---
|
|
92
|
+
|
|
93
|
+
## ⚙️ 配置项说明 (Configuration)
|
|
94
|
+
|
|
95
|
+
可以在 `cordis.patch.yml` 或配置中自定义以下参数：
|
|
96
|
+
|
|
97
|
+
```yaml
|
|
98
|
+
- id: ui-preview
|
|
99
|
+
name: '@rooode/dsh-plugin-preview'
|
|
100
|
+
config:
|
|
101
|
+
# 自动拦截并右侧预览的文件后缀列表
|
|
102
|
+
autoPreviewExtensions:
|
|
103
|
+
- .md
|
|
104
|
+
- .markdown
|
|
105
|
+
- .txt
|
|
106
|
+
- .json
|
|
107
|
+
- .yaml
|
|
108
|
+
- .yml
|
|
109
|
+
# 最大允许读取的文件大小 (MB)
|
|
110
|
+
maxFileSizeMb: 10
|
|
111
|
+
# 默认打开视图: 'preview' (预览) | 'source' (源码) | 'split' (分栏)
|
|
112
|
+
defaultViewMode: preview
|
|
113
|
+
# 右侧预览面板默认宽度 (px)
|
|
114
|
+
defaultPanelWidth: 620
|
|
115
|
+
```
|
|
116
|
+
|
|
117
|
+
---
|
|
118
|
+
|
|
119
|
+
## 📄 开源许可证 (License)
|
|
120
|
+
|
|
121
|
+
MIT License © 2026 rooode
|
package/cordis.patch.yml
ADDED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
# ==============================================================================
|
|
2
|
+
# DeepSeek Harness - Markdown Preview Plugin Bundle Patch
|
|
3
|
+
# ==============================================================================
|
|
4
|
+
|
|
5
|
+
- insert:
|
|
6
|
+
- id: ui-preview
|
|
7
|
+
name: '@rooode/dsh-plugin-preview'
|
|
8
|
+
config:
|
|
9
|
+
autoPreviewExtensions:
|
|
10
|
+
- .md
|
|
11
|
+
- .markdown
|
|
12
|
+
- .txt
|
|
13
|
+
- .json
|
|
14
|
+
- .yaml
|
|
15
|
+
- .yml
|
|
16
|
+
maxFileSizeMb: 10
|