dsh-turn-dial:把對話輪次軌道變成半個儀表盤

前言

DeepSeek Harness 的會話右側有一條纖細的輪次導航軌道,輪次多起來之後,用戶很難一眼看出自己讀到第幾輪、整段對話有多少輪。開發者想在界面層解決這件事時,一般要改宿主的會話組件,自己寫一套導航 UI,再處理虛擬化列表下的點擊、懸停預覽和鍵盤焦點。下面介紹的 dsh-turn-dial 把這件事做成一個插件:它不新增一套導航,而是直接重用宿主軌道上已有的每一條 marker,把它們畫成鐘面上的刻度,再加一根指向當前輪次的指針。

這個插件由 Surtr-crimson 維護,MIT 許可,面向 DeepSeek Harness 0.2.1-rc.1 及以上版本,peer 依賴是 @deepseek-ai/dsh-client-ui-conversation。它是純視覺插件:不調用宿主 API,不髮網絡請求,不寫存儲,也沒有配置項。

它做了什麼

插件把軌道上的 marker 旋轉到錶盤邊緣,每個 marker 變成一根刻度:幾輪對話就有幾根刻度,不多也不少。每第五根刻度更長、更粗,顏色爲紫色,其餘保持細的銀色。當前輪次由一根藍色細針指示,針跟隨軌道標記的 current 輪次擺動,滾動對話或切換輪次時手針都會動。

刻度仍然是原來的軌道。點擊刻度跳轉到對應輪次,懸停在刻度上會像原來一樣彈出預覽卡片,鍵盤焦點仍然能到達每個標記。錶盤本身由一圈雙層邊框、刻度內側的章節環、虛線內圈、扇形射線和一箇中心軸環組成,全部畫在一個 inline SVG 裏。

插件沒有註冊任何鍵盤處理器,也沒有替換點擊邏輯。它讀取虛擬化列表寫出的列表高度,把滾動容器撐到那個高度讓所有 marker 都掛載,然後用一條內聯 transform 旋轉指針。

核心功能

  1. 一根刻度對應一輪對話,直接複用軌道的 marker,不額外生成 DOM。
  2. 每第五根刻度加粗、拉長並着紫色,其餘爲銀色細線。
  3. 藍色指針指向當前輪次,隨滾動和輪次切換移動。
  4. 點擊、懸停預覽、鍵盤焦點保持軌道原生行爲。
  5. 錶盤由單個 inline SVG 繪製,含雙層邊框、章節環、虛線內圈、扇形射線和軸環。
  6. 無 API 調用、無網絡請求、無存儲、無配置項。

安裝與啓用

方式一,從 DeepSeek Harness 插件市場安裝:打開 Plugins → Market,搜索 Turn Dial,安裝後重啓 Harness。

方式二,用插件管理器安裝。它會讀取 package.json 裏的 dsh.bundle,自動套用 cordis.patch.yml。

dsh plugin add

方式三,手工安裝,適用於沒有插件管理器的 profile。先把包複製到 <profile>/node_modules/dsh-turn-dial,再在 <profile>/cordis.patch.yml 里加入:

- insert:
    - id: turn-dial
      name: dsh-turn-dial

補充一種不含市場的手工佈局:把 index.js、client.js 複製進 ~/.dsh/profiles/<profile>/node_modules/@local/turn-dial/,然後在該 profile 的 cordis.patch.yml 裏寫:

- insert:
    - id: turn-dial
      name: '@local/turn-dial'

這種做法下,本地 package.json 的 name 必須是 @local/turn-dial,與入口名和 client.js 裏的 loader id 一致,並且不能聲明 dsh.bundle——那個字段專供市場安裝和 dsh plugin add 使用,此時包名是 dsh-turn-dial。

裝上之後沒有需要配置的字段。插件隨會話啓動注入,inject 指向 @deepseek-ai/dsh-client-ui-conversation,加載即可生效。

兼容性與佈局

要求 DeepSeek Harness 0.2.1-rc.1 及以上,package.json 的 peerDependencies 爲 @deepseek-ai/dsh-client-ui-conversation: ^0.2.1-rc.1,engines 爲 Node.js >= 20。

錶盤跟隨宿主的響應式規則:當會話列寬度小於 900px 時錶盤隱藏。尺寸取對話視口高度的約 40%,介於 190 到 272 px 之間,低檔爲 104 × 196 px,窗口變化時重新測量。

典型場景

輪次不超過 260 輪的對話。 插件把軌道滾動容器撐到列表真實高度,虛擬化器因此掛載全部 marker,每根刻度都是真實按鈕,原生支持點擊、懸停預覽和鍵盤焦點。

超過 260 輪的長對話。 刻度改用三條 SVG 路徑繪製,分別對應普通、每第五根和當前三種樣式,DOM 裏只保留軌道自己的標記窗口。刻度以約 3 px 間距畫成細線,三千輪的對話只需幾百條 path 指令,而不是幾千個按鈕。點擊錶盤時把指針角度映射到輪次,把該輪滾動進軌道窗口,再點擊它的 marker。

改插件自身。 dev/preview.html 渲染一條與宿主同 DOM 結構的假軌道並加載 client.js,不必啓動 Harness 就能調錶盤。輪次數量和當前輪次在頁面的 turns 數組裏改。

適用場景與注意

適合覺得輪次軌道不夠直觀、想在界面上直接看出對話長度和當前位置的開發者,以及打算研究 DSH 插件如何在不觸碰宿主源碼的前提下改 UI 的人。

需要注意:插件以當前 DSH 進程的權限運行,安裝前應先檢查源碼與許可證(MIT)。它讀取虛擬化列表的高度並改變滾動容器的尺寸,這是宿主內部行爲,屬於對現有實現的依賴,升級宿主後建議重新驗證長對話下的表現。星標、下載量、分類等信息在公開資料中未給出。

結尾

dsh-turn-dial 的價值在於它沒有替換軌道,而是在軌道的既有結構上疊加一層儀表盤渲染,代價是零配置和零 API 調用,換來的是輪次數量和當前位置一眼可讀。

目錄頁:https://www.skillhub.cn/plugins/Surtr-crimson/dsh-turn-dial

源碼:https://github.com/Surtr-crimson/dsh-turn-dial

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

小夜