dsh-token-gauge 0.1.8 → 0.1.10

package/lib/client.mjs

@@ -32,7 +32,6 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var client_exports = {};
 __export(client_exports, {
   apply: () => apply,
-  inject: () => inject,
   name: () => name
 });
 module.exports = __toCommonJS(client_exports);
@@ -966,34 +965,134 @@ function GaugePanel() {
     }
   });
 }
-var name = PLUGIN_ID;
-var inject = ["slots"];
-function apply(ctx) {
-  let disposeRegistration = void 0;
-  const doRegister = () => {
-    disposeRegistration = ctx.slots.register(
-      {
-        name: "shell.overlay",
-        id: PLUGIN_ID,
-        order: 100,
-        label: "Token \u4EEA\u8868\u76D8"
-      },
-      () => import_react.default.createElement(GaugePanel)
-    );
+function GaugeTab() {
+  return import_react.default.createElement("div", {
+    ref: gaugeRef,
+    className: "tg-panel-root",
+    style: {
+      width: "100%",
+      height: "100%",
+      boxSizing: "border-box",
+      overflow: "hidden",
+      background: "var(--dsw-alias-bg-base)",
+      color: "var(--dsw-alias-label-primary)"
+    }
+  });
+}
+var GaugeIcon = (size) => {
+  const s = typeof size === "number" && size > 0 ? size : 16;
+  const svgProps = {
+    width: s,
+    height: s,
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-hidden": "true"
   };
-  let stop = void 0;
-  try {
-    if (typeof ctx.slots.inject === "function") {
-      stop = ctx.slots.inject("shell.overlay", doRegister);
-    } else {
-      doRegister();
+  const arc = import_react.default.createElement("path", {
+    d: "M2.6 11.6a5.6 5.6 0 1 1 10.8 0",
+    stroke: "currentColor",
+    strokeWidth: 1.5,
+    strokeLinecap: "round"
+  });
+  const needle = import_react.default.createElement("path", {
+    d: "M8 11.6 10.4 7.2",
+    stroke: "currentColor",
+    strokeWidth: 1.5,
+    strokeLinecap: "round"
+  });
+  return import_react.default.createElement("svg", svgProps, arc, needle);
+};
+var TAB_ORDER = 90;
+var name = PLUGIN_ID;
+function findOurTab(snap) {
+  if (!snap) return null;
+  const trees = [snap.splits, snap.bottomSplits];
+  for (const tree of trees) {
+    if (!tree) continue;
+    const stack = [tree];
+    while (stack.length) {
+      const node = stack.pop();
+      if (!node) continue;
+      if (Array.isArray(node.tabs)) {
+        for (const t2 of node.tabs) if (t2 && t2.type === PLUGIN_ID) return t2;
+      }
+      if (Array.isArray(node.children)) stack.push(...node.children);
+      if (node.splits) stack.push(node.splits);
+      if (node.bottomSplits) stack.push(node.bottomSplits);
     }
-  } catch (e) {
-    console.error("[dsh-token-gauge] \u6CE8\u518C shell.overlay \u5931\u8D25", e);
   }
+  return null;
+}
+function apply(ctx) {
+  let unregisterTab = null;
+  let mountedOverlay = false;
+  let slotsService = null;
+  let fallbackTimer = void 0;
+  let openTimer = null;
+  const stopSlots = ctx.inject(["slots"], (slotsCtx) => {
+    slotsService = slotsCtx.slots;
+  });
+  const mountOverlay = (reason) => {
+    if (mountedOverlay || unregisterTab) return;
+    if (!slotsService || typeof slotsService.register !== "function") return;
+    console.warn(`[dsh-token-gauge] ${reason}\uFF0C\u4EEA\u8868\u76D8\u6539\u4E3A\u53F3\u4E0B\u89D2\u6D6E\u5C42\u663E\u793A\uFF08\u4ECD\u53EF\u7528\uFF09\u3002`);
+    try {
+      const d = slotsService.register(
+        { name: "shell.overlay", id: PLUGIN_ID, order: 100, label: "Token \u4EEA\u8868\u76D8" },
+        () => import_react.default.createElement(GaugePanel)
+      );
+      if (typeof d === "function") mountedOverlay = true;
+    } catch (e) {
+      console.error("[dsh-token-gauge] \u6D6E\u5C42\u515C\u5E95\u4E5F\u5931\u8D25", e);
+    }
+  };
+  const stopSidebar = ctx.inject(["betterSidebar"], (sidebarCtx) => {
+    const sidebar = sidebarCtx.betterSidebar;
+    if (!sidebar || typeof sidebar.registerTab !== "function") return;
+    unregisterTab = sidebar.registerTab({
+      id: PLUGIN_ID,
+      title: "Token \u4EEA\u8868\u76D8",
+      single: true,
+      order: TAB_ORDER,
+      icon: GaugeIcon,
+      component: () => import_react.default.createElement(GaugeTab)
+    });
+    if (typeof fallbackTimer !== "undefined") clearTimeout(fallbackTimer);
+    let attempts = 0;
+    openTimer = setInterval(() => {
+      attempts++;
+      const snap = sidebar.getSnapshot?.();
+      const sid = snap?.sessionId;
+      if (sid !== void 0 && typeof sidebar.openTab === "function") {
+        try {
+          sidebar.openTab({ type: PLUGIN_ID });
+        } catch {
+        }
+      }
+      if (sid !== void 0 && findOurTab(snap)) {
+        clearInterval(openTimer);
+        openTimer = null;
+        return;
+      }
+      if (attempts >= 45) {
+        clearInterval(openTimer);
+        openTimer = null;
+        mountOverlay("better-sidebar \u5DF2\u6CE8\u518C\u4F46\u4F1A\u8BDD\u59CB\u7EC8\u672A\u5C31\u7EEA");
+      }
+    }, 800);
+    return () => {
+      if (unregisterTab) unregisterTab();
+    };
+  });
+  fallbackTimer = setTimeout(() => {
+    if (!unregisterTab) mountOverlay("\u672A\u53D6\u5F97 dsh-better-sidebar \u670D\u52A1\uFF08\u8BF7\u786E\u8BA4\u5176\u5DF2\u5B89\u88C5\u5E76\u542F\u7528\uFF09");
+  }, 8e3);
   return () => {
-    if (typeof disposeRegistration === "function") disposeRegistration();
-    if (typeof stop === "function") stop();
+    if (typeof fallbackTimer !== "undefined") clearTimeout(fallbackTimer);
+    if (openTimer) clearInterval(openTimer);
+    if (typeof stopSidebar === "function") stopSidebar();
+    if (typeof stopSlots === "function") stopSlots();
   };
 }
 ; return module.exports; } });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-token-gauge",
-  "version": "0.1.8",
+  "version": "0.1.10",
   "description": "DSH 机车风格 Token 用量/费用仪表盘侧边栏插件（稳定版 0.1.1-rc.x 兼容）",
   "type": "module",
   "main": "lib/index.mjs",
@@ -60,7 +60,8 @@
   },
   "peerDependencies": {
     "@deepseek-ai/cordis": "*",
-    "@deepseek-ai/dsh-host-webserver": "*"
+    "@deepseek-ai/dsh-host-webserver": "*",
+    "dsh-better-sidebar": ">=0.15.2"
   },
   "peerDependenciesMeta": {
     "@deepseek-ai/cordis": {
@@ -68,6 +69,9 @@
     },
     "@deepseek-ai/dsh-host-webserver": {
       "optional": true
+    },
+    "dsh-better-sidebar": {
+      "optional": true
     }
   },
   "devDependencies": {

package/src/client.ts

@@ -4,7 +4,9 @@
 // 通过同域 HTTP 与 Host 半边通信：
 //   GET  /plugins/dsh-token-gauge/state -> 完整 State(JSON)
 //   POST /plugins/dsh-token-gauge/cmd   -> {type,payload} -> 更新后 State
-// 通过官方 shell.overlay 插槽独立挂载浮层面板（方案 A），不再依赖 dsh-better-sidebar。
+// 优先把仪表盘注册到 dsh-better-sidebar 的右侧工作台 Tab（停靠侧边栏），注册后轮询
+// openTab 直到会话就绪并自动打开激活（解决“已挂载却未显示”：session 未就绪时 openTab
+// 会静默 no-op）；若 better-sidebar 始终不可用，回退到官方 shell.overlay 浮层兜底。
 // 为避免与运行时 React 产生双实例 hook 冲突，本组件不调用任何 hook，
 // 仅在 ref 回调里挂载一次原生 DOM 仪表盘，并自行轮询刷新。
 // ============================================================================
@@ -223,6 +225,22 @@ function GaugePanel(): React.ReactElement {
   })
 }
 
+// 停靠在 better-sidebar 工作台 Tab 内的面板：填满容器（非固定定位），同样零 hook、ref 挂原生 DOM。
+function GaugeTab(): React.ReactElement {
+  return React.createElement('div', {
+    ref: gaugeRef,
+    className: 'tg-panel-root',
+    style: {
+      width: '100%',
+      height: '100%',
+      boxSizing: 'border-box',
+      overflow: 'hidden',
+      background: 'var(--dsw-alias-bg-base)',
+      color: 'var(--dsw-alias-label-primary)',
+    } as any,
+  })
+}
+
 // 侧边栏图标：better-sidebar 以 `icon(size)` 形式调用（见其内置 tab：
 // `icon: (size) => jsx(Icon, { size })`），故这里接收数字尺寸。用 currentColor
 // 着色以自适应明暗主题，纯 SVG 零依赖。
@@ -258,45 +276,111 @@ const TAB_ORDER = 90
 
 export const name = PLUGIN_ID
 
-// 方案 A：通过官方 shell.overlay 插槽（list 型、additive、全框架级浮层）独立挂载仪表盘，
-// 不再依赖第三方插件 dsh-better-sidebar。slots 是 layout 提供的框架级服务（root 早期即
-// 就绪），故插件级 `inject: ['slots']` 不会触发此前 betterSidebar 的 pending / without-inject
-// 问题——这正是脱离 better-sidebar 的核心收益。
-export const inject = ['slots']
+// 不声明顶层 inject（避免 pending 导致插件加载失败）。better-sidebar（兄弟 bundle 服务）
+// 与 slots（框架级浮层服务）都用 apply 内的 ctx.inject 软注入回调按需获取。
+
+// 在 better-sidebar 快照里查找我们的 Tab 是否已打开（按 type 判定，single 单例）。
+function findOurTab(snap: any): any {
+  if (!snap) return null
+  const trees = [snap.splits, snap.bottomSplits]
+  for (const tree of trees) {
+    if (!tree) continue
+    const stack: any[] = [tree]
+    while (stack.length) {
+      const node = stack.pop()
+      if (!node) continue
+      if (Array.isArray(node.tabs)) {
+        for (const t of node.tabs) if (t && t.type === PLUGIN_ID) return t
+      }
+      if (Array.isArray(node.children)) stack.push(...node.children)
+      if (node.splits) stack.push(node.splits)
+      if (node.bottomSplits) stack.push(node.bottomSplits)
+    }
+  }
+  return null
+}
 
 export function apply(ctx: any): (() => void) | void {
-  let disposeRegistration: unknown = void 0
+  let unregisterTab: (() => void) | null = null
+  let mountedOverlay = false
+  let slotsService: any = null
+  let fallbackTimer: any = void 0
+  let openTimer: any = null
 
-  const doRegister = (): void => {
-    // shell.overlay 是 click-through 层，entry 需自行 opt-in pointer events（已在
-    // GaugePanel 外层设 pointerEvents:'auto'）。第二参是返回 React.Element 的工厂函数
-    //（照抄 dsh-cordis-client-runner 官方示例）。
-    disposeRegistration = ctx.slots.register(
-      {
-        name: 'shell.overlay',
-        id: PLUGIN_ID,
-        order: 100,
-        label: 'Token 仪表盘',
-      },
-      () => React.createElement(GaugePanel),
-    )
-  }
+  // 取得框架级 slots（仅用于浮层兜底）。若平台不提供 slots，浮层兜底不可用，但侧边栏主路径不受影响。
+  const stopSlots = ctx.inject(['slots'], (slotsCtx: any) => {
+    slotsService = slotsCtx.slots
+  })
 
-  let stop: unknown = void 0
-  try {
-    // slots.inject(seat, cb)：等 shell.overlay 这个 seat 就绪再注册（root 已声明，
-    // 通常同步触发）。某些环境下若无 inject 方法，则直接 register 兜底。
-    if (typeof ctx.slots.inject === 'function') {
-      stop = ctx.slots.inject('shell.overlay', doRegister)
-    } else {
-      doRegister()
+  // 浮层兜底：把仪表盘挂到官方 shell.overlay（右下角 33vh），仅当 better-sidebar 不可用或会话始终未就绪时。
+  const mountOverlay = (reason: string): void => {
+    if (mountedOverlay || unregisterTab) return // 已注册到侧边栏则不再叠加浮层
+    if (!slotsService || typeof slotsService.register !== 'function') return
+    console.warn(`[dsh-token-gauge] ${reason}，仪表盘改为右下角浮层显示（仍可用）。`)
+    try {
+      const d = slotsService.register(
+        { name: 'shell.overlay', id: PLUGIN_ID, order: 100, label: 'Token 仪表盘' },
+        () => React.createElement(GaugePanel),
+      )
+      if (typeof d === 'function') mountedOverlay = true
+    } catch (e) {
+      console.error('[dsh-token-gauge] 浮层兜底也失败', e)
     }
-  } catch (e) {
-    console.error('[dsh-token-gauge] 注册 shell.overlay 失败', e)
   }
 
+  // 主路径：注册到 better-sidebar 右侧工作台 Tab（停靠侧边栏），并轮询 openTab 直到会话就绪，
+  // 让仪表盘自动打开并成为当前可见页（“已挂载但未显示”的根因是 session 未就绪时 openTab 静默 no-op）。
+  const stopSidebar = ctx.inject(['betterSidebar'], (sidebarCtx: any) => {
+    const sidebar = sidebarCtx.betterSidebar
+    if (!sidebar || typeof sidebar.registerTab !== 'function') return
+    unregisterTab = sidebar.registerTab({
+      id: PLUGIN_ID,
+      title: 'Token 仪表盘',
+      single: true,
+      order: TAB_ORDER,
+      icon: GaugeIcon,
+      component: () => React.createElement(GaugeTab),
+    })
+    if (typeof fallbackTimer !== 'undefined') clearTimeout(fallbackTimer)
+    let attempts = 0
+    openTimer = setInterval(() => {
+      attempts++
+      const snap = sidebar.getSnapshot?.()
+      const sid = snap?.sessionId
+      // session 已就绪才尝试打开（未就绪时 openTab 会静默 no-op）
+      if (sid !== undefined && typeof sidebar.openTab === 'function') {
+        try {
+          sidebar.openTab({ type: PLUGIN_ID })
+        } catch {
+          /* ignore */
+        }
+      }
+      if (sid !== undefined && findOurTab(snap)) {
+        clearInterval(openTimer)
+        openTimer = null
+        return
+      }
+      if (attempts >= 45) {
+        // 约 36s 仍未打开（极端：会话始终未建立）→ 浮层兜底，保证可见
+        clearInterval(openTimer)
+        openTimer = null
+        mountOverlay('better-sidebar 已注册但会话始终未就绪')
+      }
+    }, 800)
+    return () => {
+      if (unregisterTab) unregisterTab()
+    }
+  })
+
+  // 兜底：8s 内 better-sidebar 仍未就绪 → 浮层
+  fallbackTimer = setTimeout(() => {
+    if (!unregisterTab) mountOverlay('未取得 dsh-better-sidebar 服务（请确认其已安装并启用）')
+  }, 8000)
+
   return () => {
-    if (typeof disposeRegistration === 'function') (disposeRegistration as () => void)()
-    if (typeof stop === 'function') (stop as () => void)()
+    if (typeof fallbackTimer !== 'undefined') clearTimeout(fallbackTimer)
+    if (openTimer) clearInterval(openTimer)
+    if (typeof stopSidebar === 'function') stopSidebar()
+    if (typeof stopSlots === 'function') stopSlots()
   }
 }