前言¶
DeepSeek Harness（DSH）把助手能力拆成插件生態：模型輸出可以是文本，也可以觸發客戶端側的富交互界面。若回覆裏只有 Markdown 表格或代碼塊，排序、篩選、拖參數改圖、表單回傳等操作往往要再發一輪 prompt，體驗和延遲都不理想。
dsh-genui 一類插件通過 dsh-ui 代碼圍欄，把模型生成的聲明式 UI 直接嵌進對話。社區倉庫 Asaiuta/dsh-genui-enhanced 是在上游 @changfenhuang/dsh-genui 0.14.0 上的本地 fork（包名仍爲 @changfenhuang/dsh-genui，版本 0.14.0-fork.3），在保留上游組件面的同時，換了圖表引擎並補了幾項交互能力。下面介紹它是什麼、相對上游改了什麼，以及如何在本機構建並掛到 DSH。
這是什麼¶
定位：GenUI for DeepSeek Harness——在助手回覆中內聯渲染安全、可交互的 UI（表格、圖表、表單、測驗、工作區佈局等），並通過 action 事件與模型雙向聯動。
維護與分類：維護者 Asaiuta；在 SkillHub 插件目錄 中歸類爲「客戶端」。許可證 MIT（見倉庫 README 與 package.json）。
與上游的關係：fork 自 @changfenhuang/dsh-genui 0.14.0，未發佈到 npm；npm 上的 @changfenhuang/dsh-genui 是上游穩定版，不包含本 fork 的增量。完整差異見倉庫內 FORK.md 與 CHANGELOG.md。
相對上游的核心增量¶
資料中明確列出的 fork 差異如下，寫 prompt 或讀 SKILL 時可按這些能力預期行爲。
- Diagram 引擎：由 mermaid 換爲 pele（約 1.02 MB 體量，資料稱相對 mermaid 約 −70% 資源體積）；支持通過 CSS 變量做 live theming；
mindmap、timeline在白名單內。 - 圖表：ECharts 場景下增加
chart的kind:"area"。 - 表單輸入：原生
date/datetime-local/time/number，並支持min/max/step。 - 表格：自動分頁（
pageSize）；行數上限提高到 200。 - Computed fields：輸入驅動本地重算（自上游 0.15.0 fix 線移植）。
上游 README 中的能力矩陣、演示截圖與視頻仍適用於本 fork 的組件面；僅 diagram 渲染引擎不同（pele 替代 mermaid）。
環境要求¶
安裝與激活前確認：
- DSH 版本：
^0.2.0-rc.1 || ^0.2.1-rc.1（README 寫明已在dsh-v0.2.0-rc.1、dsh-v0.2.1-rc.2上驗證）。 - pnpm：
dsh pluginCLI 依賴 pnpm；若未安裝可先corepack enable或npm i -g pnpm，新開終端後執行pnpm -v確認可用。
安裝與啓用¶
本 fork 不能用「只改 GitHub 路徑」的方式代替官方命令；且 lib/ 未提交倉庫，必須先本地構建再 link: 註冊。
路徑 A：只要上游 npm 版（無本 fork 增量）¶
若不需要 pele、area 圖、表格分頁與 Computed fields 等 fork 特性，可直接安裝上游包：
dsh plugin --profile web add @changfenhuang/dsh-genui
注意包名必須是 @changfenhuang/dsh-genui。npm 上另有未 scope 的 dsh-genui（其他維護者的 Vue/OpenTiny 實現），peer 依賴不兼容，勿裝錯。
僅 npm install @changfenhuang/dsh-genui 只會加 Node 依賴，不會向 DSH 註冊插件；集成 DSH 仍需上面的 dsh plugin add。
路徑 B：本 fork（源碼構建 + link）¶
在已具備本倉庫源碼的目錄中（例如從 GitHub 獲取），按 README Quick Start Option B 執行：
cd dsh-genui-enhanced
pnpm install
pnpm 可能提示批准 esbuild 的 build script，按提示確認。隨後做構建門禁（README 提到 pnpm 11 細節見 FORK.md）：
./node_modules/.bin/tsc -p tsconfig.json
./node_modules/.bin/tsdown
類型檢查需零錯誤；tsdown 會生成 lib/（含 client.js、index.js、assets/*）。未構建完成前不要用 link:，否則 peer 資源（diagram 引擎等）無法正確解析。
註冊到 DSH Web profile：
dsh plugin --profile web add link:$PWD
快速驗證¶
- 重啓 DSH Web 服務，瀏覽器 硬刷新（
Ctrl + F5或Cmd + Shift + R）。 - 新開一段對話，發送：
Use dsh-ui to draw a stats dashboard with a sortable service table.
- 預期：回覆中出現可就地交互的儀表盤（含可排序表格等），而不是純代碼塊。
- 打開瀏覽器開發者工具 Console，應看到：
[genui] client active; fence-channel=dom。
組件語法與字段說明見倉庫根目錄 SKILL.md；上游產品站與能力矩陣鏈接見 README（本 fork 繼承同一套 dsh-ui 圍欄教學與 client 渲染鏈路）。
典型用法說明¶
模型在回覆裏輸出 dsh-ui 圍欄內的聲明式結構（佈局、stat、table、chart、plot、form、quiz 等），客戶端插件負責解析並在對話 DOM 中渲染。用戶點擊表頭排序、搜索過濾、拖動 plot 參數滑塊、或點擊 action 按鈕時，可在本地即時更新或把事件回傳給模型，減少爲「再描述一次 UI 變更」而重複生成的次數。
具體字段與示例以 SKILL.md 與 demo-prompts.md 爲準；勿在資料未記載處臆造配置項。
適用場景與注意¶
適合誰：在 DSH Web 端做數據看板、參數探索、輕量表單與測驗等「回答即界面」場景的開發者；需要更小 diagram 資源體積或 pele 主題化、area 圖、表格分頁與 Computed fields 時，優先考慮本 fork 而非 npm 上游包。
安全與權限：插件作爲 DSH 客戶端擴展運行，能力邊界與當前 DSH 進程及瀏覽器環境一致；安裝前請自行審閱源碼與 MIT 許可證，確認符合你的部署策略。
常見坑（README Installation Pitfalls）：
- 勿安裝錯誤的 npm 包名（見上文 scope）。
link:目錄必須先./node_modules/.bin/tsc+tsdown產出lib/。- 本 fork 不在 npm 發佈；需要 fork 增量時必須走路徑 B，不能假設
dsh plugin add某 GitHub 簡寫即可替代構建流程。
結尾¶
dsh-genui-enhanced 在 DSH 對話流裏把 GenUI 做成一等公民：上游 0.14.0 的交互組件面保留，diagram 換 pele 併疊加 chart area、原生日期/數字輸入、表格分頁與 Computed fields 等改進。目錄頁：https://www.skillhub.cn/plugins/Asaiuta/dsh-genui-enhanced；源碼與構建說明：https://github.com/Asaiuta/dsh-genui-enhanced。
