dsh-markdown-preview

DeepSeek Harness 聊天输入框的 Markdown / 公式实时预览插件





在 输入框上方实时渲染你正在输入的 Markdown：**加粗** 当场变粗，$x+y$ / $$x+y$$ 当场变公式。
输入框本身完全不动——预览面板吸附在输入卡片上沿，输入框不会因渲染而移位。

✨ 功能一览

• 📝 Markdown 实时预览：加粗 / 斜体 / 行内代码 / 代码块 / 删除线 / 引用 / 链接 / 有序无序列表 / 标题 / 表格 / 分隔线，边打边渲染
• 🧮 KaTeX 公式：$x+y$ 行内公式、$$\n…\n$$ 块级公式实时渲染（KaTeX 渲染器构建时内联进插件，无外部运行时依赖）
• 📍 预览在输入框上方：面板吸附在输入卡片上沿，随草稿出现/消失——输入框位置永远不动
• 🎛️ 一键收起/展开：标题栏右侧箭头按钮切换预览显示（展开时 ▾、收起时 ▸），默认展开，选择会记住（localStorage 持久化），收起后保留一条细栏可随时再展开
• 🔌 零核心补丁：纯插件实现，注册官方 conversation.input.dock 槽位，不修改、不复制任何 DSH 核心代码，与输入框原有全部功能（/ @ 触发、附件、plan 模式、队列 dock 等）天然兼容
• 🛡️ 安全：草稿中的原始 HTML 一律转义，只渲染 Markdown 结构，粘贴恶意标签不会执行
• ⚡ 轻量：草稿为空时不渲染（无布局跳动）；预览区限高 240px 自动滚动，长文档不挤压聊天区

📸 截图

Markdown 基础格式	行内 + 块级公式

代码块与表格	收起态（点击 ▾ 恢复展开）

📦 安装

方式一：dsh 插件命令（推荐，发布渠道）

dsh plugin --profile web add github:thomasly/dsh-markdown-preview

安装后重启 dsh web 生效。

方式二：本地手动挂载

# 1. 克隆到 profile 的插件目录
mkdir -p ~/.dsh/profiles/web/plugins
git clone https://github.com/thomasly/dsh-markdown-preview.git ~/.dsh/profiles/web/plugins/dsh-markdown-preview

# 2. 链接进 profile 依赖
cd ~/.dsh/profiles/web
pnpm add --save-exact file:./plugins/dsh-markdown-preview

# 3. 在 ~/.dsh/profiles/web/cordis.patch.yml 中追加注册条目
#    - insert:
#        - id: markdown-preview
#          name: dsh-markdown-preview

# 4. 重启生效
dsh web

⚠️ 两种方式只能选其一，切勿混用：方式一会把插件加入 dsh.profile.bundles，由插件自带的 dsh.bundle.patch 经 bundle 渠道注册；方式二则是手动 insert。若同时存在，会出现 duplicate loader entry id: markdown-preview 的启动报错——切换方式前请先清理另一条注册。

🖥️ 使用

打开任意会话，直接在输入框输入 Markdown 即可：

• 这是 **加粗** 的文字 → 预览面板中"加粗"立即变为粗体
• 行内公式 $x+y$ → 立即渲染为数学符号
• 块级公式换行书写 $$ … $$ → 居中渲染
• 清空输入框 → 预览面板自动消失，输入框位置始终不动

预览只是"所见即所得"的辅助显示：发送的内容始终是原始 Markdown 文本，消息气泡由 DSH 自带渲染器渲染，二者互不影响。

🧹 卸载

dsh plugin --profile web remove dsh-markdown-preview   # 或：pnpm remove dsh-markdown-preview
# 同时删除 cordis.patch.yml 中的 insert 条目，重启 dsh web

🔨 从源码构建

npm install        # 安装构建依赖（esbuild / marked / katex / marked-katex-extension）
node build.mjs     # 产出 lib/client.js（marked+KaTeX 内联，仅 react 走模块加载器）

🧠 工作原理

cordis.patch.yml 注册插件 entry
  → 宿主扫描 dsh.client 声明（platform: web）
  → 浏览器加载 /plugins/dsh-markdown-preview/client.js
  → 客户端 Cordis runner 应用插件（ctx.slots）
  → 注册官方 conversation.input.dock 槽位条目（输入栏上方停靠区）
  → 槽位 owner props 随每次击键下发实时 input.draft
  → marked + marked-katex-extension + KaTeX 渲染
  → 预览面板吸附在输入卡片上沿；草稿为空时渲染 null（零布局跳动）

关键点：

• 不碰 DOM、不碰 InputBar：草稿文本来自官方槽位的 owner props（input.draft），每个击键随 React 重渲染自动更新；
• 零核心补丁：区别于"修改 core 文件 + 同步脚本"的补丁路线，本插件升级 DSH 后依然生效，无需任何维护脚本；
• 持久化：插件本体安装在 profile 目录，清 npm 缓存、升级 dsh 都不影响它。

📄 许可证

MIT