dsh-remote-panel 0.3.7 → 0.3.9

package/lib/client.js

@@ -1159,6 +1159,8 @@ window.__ModuleLoader__.load({
   .dsh-mobile-clear-workspace[data-none="true"] { display: none !important; }
   /* 抽屉/遮罩打开时顶栏按钮让位 */
   html.dsh-drawer-open .dsh-mobile-newchat { display: none !important; }
+  /* 「+」是固定定位 + 内联 top:6px，顶栏被安全区顶下去后它会错位，这里拉回同一基线 */
+  .dsh-mobile-newchat { top: calc(6px + var(--dsh-safe-top, 0px)) !important; }
 
   /* 空态：鱼标按原型放大并竖排到标题上方；标题 22/650，收掉「预览版」角标 */
   .pXSMma_headline { flex-direction: column !important; align-items: center !important; gap: 14px !important; }
@@ -1170,26 +1172,28 @@ window.__ModuleLoader__.load({
   .pXSMma_previewBadge { display: none !important; }
   /* 原生把「问候语 + 输入条」一起居中；手机按原型拆开：
      问候语留在屏幕中间（原生居中），输入条钉到底部 */
-  /* 输入条下方那排统计（轮次/步数、token、分支）：手机上一行放不下时会互相挤压，
-     允许换行 + 拉开间距，宁可两行也别把「58 轮 956 步」挤成一团 */
-  .uV2eYG_dock {
-    flex-wrap: wrap !important;
-    justify-content: flex-start !important;
-    column-gap: 14px !important;
-    row-gap: 4px !important;
-    padding: 0 2px !important;
-  }
-  /* 前两个胶囊外面那层是 display:contents，Chrome 里它不会参与 flex 换行计算，
-     于是每颗都被挤到单独一行。这里把它实体化成一行，两颗才能并排 */
-  .uV2eYG_dock > div {
-    display: flex !important;
-    align-items: center !important;
-    gap: 14px !important;
-    min-width: 0 !important;
+  /* 输入条下方那排统计（轮次/步数、token、缓存）：手机上会撑高输入区，
+     按「托盘状态」的思路挪到右上角，做成一行半透明小字，不再占输入条的垂直空间 */
+  /* 原生的统计条藏在输入条下方、文案又长，手机上只能挤；这里整体隐藏，
+     由 installStatsTray() 读它的文本、精简后放到顶部右上角 */
+  .uV2eYG_dock { display: none !important; }
+
+  .dsh-stats-tray {
+    position: fixed;
+    top: max(2px, calc(var(--dsh-safe-top, 0px) - 24px));
+    right: 14px;
+    z-index: 57;
+    max-width: 62vw;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    font-size: 10px;
+    line-height: 16px;
+    font-variant-numeric: tabular-nums;
+    color: rgba(255, 255, 255, .5);
+    pointer-events: none;
+    letter-spacing: .01em;
   }
-  /* 手机上那排统计放不下三个：分支名是这里最不关键的一个（抽屉/面板里也能看到），
-     先收掉它，让「轮次/步数」和「token/缓存」并排 */
-  [data-composer-stat="git-branch"] { display: none !important; }
 
   /* 输入条座位顶部有一段渐隐（DSH 原本渐到 #151517），在纯黑底上会显出一条灰带，
      这里把终点色换成纯黑，观感才对得上；底部那行状态（轮次/token/缓存）同理 */
@@ -1678,6 +1682,54 @@ window.__ModuleLoader__.load({
 		}
 
 
+		/**
+		 * 顶部统计托盘：DSH 的统计条文案太长（「2 轮 8 步 · 211 tok/s」「1.7M tok · 缓存命中 99%」），
+		 * 手机上一行放不下。这里读它的文本、精简成 `2 轮 · 211 tok/s · 缓存 99%` 放到右上角，
+		 * 原条隐藏，既省高度又不挤。
+		 */
+		function installStatsTray() {
+			if (typeof document === 'undefined' || typeof MutationObserver === 'undefined') return () => {}
+			const tray = document.createElement('div')
+			tray.className = 'dsh-stats-tray'
+			tray.setAttribute('aria-hidden', 'true')
+			document.body.appendChild(tray)
+
+			let frame = 0
+			let shown = ''
+			const format = (text) => {
+				const rounds = text.match(/(\d+)\s*轮/)
+				const speed = text.match(/([\d.]+)\s*tok\/s/i)
+				const cache = text.match(/(\d+(?:\.\d+)?)\s*%/)
+				const parts = []
+				if (rounds !== null) parts.push(`${rounds[1]} 轮`)
+				if (speed !== null) parts.push(`${speed[1]} tok/s`)
+				if (cache !== null) parts.push(`缓存 ${cache[1]}%`)
+				return parts.join(' · ')
+			}
+			const sync = () => {
+				frame = 0
+				const dock = document.querySelector('.uV2eYG_dock')
+				const raw = dock?.textContent ?? ''
+				const next = raw.trim() === '' ? '' : format(raw)
+				if (next === shown) return
+				shown = next
+				tray.textContent = next
+				tray.style.display = next === '' ? 'none' : 'block'
+			}
+			const schedule = () => {
+				if (frame !== 0) return
+				frame = requestAnimationFrame(sync)
+			}
+			const observer = new MutationObserver(schedule)
+			observer.observe(document.body, { subtree: true, childList: true, characterData: true })
+			sync()
+			return () => {
+				observer.disconnect()
+				if (frame !== 0) cancelAnimationFrame(frame)
+				tray.remove()
+			}
+		}
+
 		/**
 		 * 外壳挂点自检：DSH 升级后这些 hash 类名可能全变，样式就整体失配。
 		 * 启动后检查一遍 DOM，把结果报给宿主，面板里能直接看到「外壳适配」这盏灯。
@@ -2319,6 +2371,7 @@ window.__ModuleLoader__.load({
 			const cleanupFocus = installComposerFocusGuard()
 			const cleanupFps = installFpsMeter()
 			const cleanupContract = installShellContractReport()
+			const cleanupTray = installStatsTray()
 			if (typeof ctx.effect === 'function') ctx.effect(() => cleanupClear, 'remote-panel: workspace clear')
 			if (typeof ctx.effect === 'function') ctx.effect(() => cleanupBack, 'remote-panel: back gesture')
 			if (typeof ctx.effect === 'function') ctx.effect(() => cleanupAttention, 'remote-panel: attention')
@@ -2327,6 +2380,7 @@ window.__ModuleLoader__.load({
 			if (typeof ctx.effect === 'function') ctx.effect(() => cleanupFocus, 'remote-panel: composer focus guard')
 			if (typeof ctx.effect === 'function') ctx.effect(() => cleanupFps, 'remote-panel: fps meter')
 			if (typeof ctx.effect === 'function') ctx.effect(() => cleanupContract, 'remote-panel: shell contract report')
+			if (typeof ctx.effect === 'function') ctx.effect(() => cleanupTray, 'remote-panel: stats tray')
 			if (typeof ctx.effect === 'function') ctx.effect(() => cleanup, 'remote-panel: mobile shell css')
 
 			ctx.slots.inject('shell.overlay', () =>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-remote-panel",
-  "version": "0.3.7",
+  "version": "0.3.9",
   "description": "DSH 远程访问控制面：部署向导、状态面板与一键配对（EasyTier + Caddy），数据面保持进程外。",
   "type": "module",
   "main": "./lib/index.js",