dsh-context 0.19.2 → 0.20.1

package/lib/client.js

@@ -29,6 +29,12 @@ var DICT_ZH = {
   "stats.compactions": "\u538B\u7F29",
   "stats.prunes": "\u526A\u679D",
   "stats.cacheHit": "\u7F13\u5B58\u547D\u4E2D",
+  "stats.cost": "\u9884\u4F30\u8D39\u7528",
+  "stats.costTip": "\u6309 DeepSeek \u5B98\u65B9\u520A\u4F8B\u4EF7\u4F30\u7B97\u6574\u4E2A\u4F1A\u8BDD\u7684\u7D2F\u8BA1\u8D39\u7528\uFF1A\u8F93\u5165\u533A\u5206\u7F13\u5B58\u547D\u4E2D/\u672A\u547D\u4E2D\uFF0C\u8F93\u51FA\u542B\u601D\u8003\uFF1B\u6309\u8BF7\u6C42\u65F6\u95F4\u533A\u5206\u9AD8\u5CF0\uFF08UTC 01:00\u201304:00\u300106:00\u201310:00\uFF09\u4E0E\u7A7A\u95F2\u65F6\u6BB5\uFF08\u534A\u4EF7\uFF09\u3002\u9002\u7528\u4E8E deepseek-v4-flash / deepseek-v4-pro\uFF08\u4E0D\u9650 provider\uFF09\uFF0C\u4EF7\u683C\u5199\u6B7B\u5728\u4EE3\u7801\u4E2D\uFF0C\u4EC5\u4F9B\u53C2\u8003\u3002",
+  "stats.costPriceHead": "\u6BCF\u767E\u4E07 tokens \u4EF7\u683C\uFF08\u9AD8\u5CF0 | \u7A7A\u95F2\u534A\u4EF7\uFF09\uFF1A",
+  "stats.costHit": "\u547D\u4E2D",
+  "stats.costMiss": "\u672A\u547D\u4E2D",
+  "stats.costOut": "\u8F93\u51FA",
   "plugin.title": "\u63D2\u4EF6\u4FE1\u606F",
   "plugin.hint": "The best DSH context plugin \u2B50",
   "plugin.name": "\u63D2\u4EF6",
@@ -133,6 +139,12 @@ var DICT_EN = {
   "stats.compactions": "Compactions",
   "stats.prunes": "Prunes",
   "stats.cacheHit": "Cache Hits",
+  "stats.cost": "Est. Cost",
+  "stats.costTip": "Rough cumulative cost of the whole session at DeepSeek\u2019s list prices: input split by cache hit/miss, output includes reasoning; each request is priced at the peak (01:00\u201304:00, 06:00\u201310:00 UTC) or half-price off-peak rate by its time. Applies to deepseek-v4-flash / deepseek-v4-pro on any provider; prices are hardcoded, for reference only.",
+  "stats.costPriceHead": "Per-1M-token rates (peak | off-peak at half price):",
+  "stats.costHit": "hit",
+  "stats.costMiss": "miss",
+  "stats.costOut": "output",
   "plugin.title": "Plugin Info",
   "plugin.hint": "The best DSH context plugin \u2B50",
   "plugin.name": "Plugin",
@@ -1053,6 +1065,23 @@ var STYLES = [
   ".lc-stat-label { color: var(--dsw-alias-label-secondary); font-size: 11px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }",
   ".lc-stat-value { color: var(--dsw-alias-label-primary); font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; }",
   ".lc-stat-sub { color: var(--dsw-alias-label-secondary); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }",
+  // Stats cell tooltip (cost cell): the explanation renders as styled DOM
+  // because the harness GUI never shows the native `title` tooltip. A "?"
+  // marker after the label signals the affordance; hovering ANYWHERE on the
+  // cell reveals the bubble BELOW it (the cell is the tip's position frame).
+  // The bubble may overlay the card content underneath — nothing below clips
+  // it, and z-index 6 matches the chart tips — so it can exceed the card
+  // without being cut off. Same chrome as `.lc-bar-tip`: layer-2 fill, border,
+  // 6px radius, soft shadow, 120ms opacity ease.
+  ".lc-stat-tipped { position: relative; }",
+  ".lc-stat-q { display: inline-block; margin-left: 4px; width: 11px; height: 11px; line-height: 11px; border-radius: 50%; text-align: center; font-size: 9px; font-weight: 700; font-style: normal; color: var(--dsw-alias-label-secondary); background: var(--dsw-alias-bg-layer-1); border: 1px solid var(--dsw-alias-border-l1); cursor: help; }",
+  ".lc-stat-tipped:hover .lc-stat-q { color: var(--dsw-alias-label-primary); border-color: var(--dsw-alias-label-primary); }",
+  ".lc-stat-tip { position: absolute; top: calc(100% + 6px); left: 0; z-index: 6; width: max-content; max-width: 280px; background: var(--dsw-alias-bg-layer-2); border: 1px solid var(--dsw-alias-border-l1); border-radius: 6px; padding: 6px 10px; font-size: 12px; line-height: 1.5; font-weight: 400; color: var(--dsw-alias-label-primary); box-shadow: 0 2px 8px rgba(0,0,0,0.18); pointer-events: none; opacity: 0; transition: opacity 120ms ease; }",
+  ".lc-stat-tipped:hover .lc-stat-tip { opacity: 1; }",
+  ".lc-stat-tip-prices { display: block; margin-top: 5px; border-top: 1px dashed var(--dsw-alias-border-l1); padding-top: 5px; }",
+  ".lc-stat-tip-head { display: block; font-weight: 600; }",
+  ".lc-stat-tip-row { display: block; margin-top: 2px; }",
+  ".lc-stat-tip-model { color: var(--dsw-alias-label-primary); }",
   ".lc-card-sub { font-weight: 400; color: var(--dsw-alias-label-secondary); font-size: 12px; }",
   ".lc-gran, .lc-kinds { margin-left: auto; display: flex; gap: 2px; background: var(--dsw-alias-bg-layer-2); border: 1px solid var(--dsw-alias-border-l1); border-radius: 6px; padding: 1px; }",
   ".lc-gran-btn { border: 0; background: transparent; color: var(--dsw-alias-label-secondary); font-size: 11px; line-height: 1; padding: 3px 8px; border-radius: 5px; cursor: pointer; font-family: inherit; }",
@@ -1443,7 +1472,7 @@ function makeEventList(kit) {
 
 // src/client/meta.ts
 var PLUGIN_NAME = "dsh-context";
-var PLUGIN_VERSION = true ? "0.19.2" : "0.0.0-dev";
+var PLUGIN_VERSION = true ? "0.20.1" : "0.0.0-dev";
 var PLUGIN_REPO = true ? "https://github.com/bowenliang123/dsh-context" : "https://github.com/bowenliang123/dsh-context";
 var PLUGIN_REPO_SHORT = PLUGIN_REPO.replace(/^https?:\/\/github\.com\//, "");
 
@@ -1512,6 +1541,49 @@ function makeRequestDetail(kit, StackedBar) {
   };
 }
 
+// src/client/cost.ts
+var PRICES = {
+  usd: {
+    flash: { peak: { hit: 0.014, miss: 0.44, out: 1.32 }, off: { hit: 7e-3, miss: 0.22, out: 0.66 } },
+    pro: { peak: { hit: 0.044, miss: 1.32, out: 3.96 }, off: { hit: 0.022, miss: 0.66, out: 1.98 } }
+  },
+  cny: {
+    flash: { peak: { hit: 0.1, miss: 3, out: 9 }, off: { hit: 0.05, miss: 1.5, out: 4.5 } },
+    pro: { peak: { hit: 0.3, miss: 9, out: 27 }, off: { hit: 0.15, miss: 4.5, out: 13.5 } }
+  }
+};
+function estimateSessionCost(usage, currency) {
+  if (usage === null || usage === void 0) return null;
+  let total = 0;
+  let any = false;
+  for (const family of ["flash", "pro"]) {
+    const fam = usage[family];
+    if (fam === void 0) continue;
+    for (const period of ["peak", "off"]) {
+      const b = fam[period];
+      if (b === void 0) continue;
+      const p = PRICES[currency][family][period];
+      total += (b.cacheRead * p.hit + (b.uncached + b.cacheWrite) * p.miss + b.output * p.out) / 1e6;
+      any = true;
+    }
+  }
+  return any ? total : null;
+}
+function formatCost(amount, currency) {
+  const symbol = currency === "cny" ? "\xA5" : "$";
+  return symbol + (amount >= 1 ? amount.toFixed(2) : amount.toPrecision(2));
+}
+function sessionPrices(currency) {
+  return ["flash", "pro"].map((id) => ({
+    family: id === "flash" ? "deepseek-v4-flash" : "deepseek-v4-pro",
+    peak: PRICES[currency][id].peak,
+    off: PRICES[currency][id].off
+  }));
+}
+function formatPriceRate(amount, currency) {
+  return formatCost(amount, currency).replace(/0+$/, "").replace(/\.$/, "");
+}
+
 // src/client/components/statsBoard.tsx
 function cacheHitPercent(usage) {
   const billed = usage.uncachedInputTokens + usage.cacheReadTokens + usage.cacheWriteTokens;
@@ -1534,8 +1606,15 @@ function makeStatsBoard(kit) {
       else if (ev.kind === "inject") injects++;
     }
     const hit = props.usage !== null ? cacheHitPercent(props.usage) : null;
-    const cell = (label, value) => /* @__PURE__ */ React.createElement("div", { className: "lc-stat" }, /* @__PURE__ */ React.createElement("span", { className: "lc-stat-label" }, label), /* @__PURE__ */ React.createElement("b", { className: "lc-stat-value" }, value));
-    return /* @__PURE__ */ React.createElement("div", { className: "lc-card lc-col lc-col-stats" }, /* @__PURE__ */ React.createElement("div", { className: "lc-card-title" }, /* @__PURE__ */ React.createElement("span", { className: "lc-card-title-text" }, t("stats.title")), /* @__PURE__ */ React.createElement("span", { className: "lc-card-sub" }, t("stats.hint"))), /* @__PURE__ */ React.createElement("div", { className: "lc-stats" }, cell(t("stats.turns"), fmt3(turns.size)), cell(t("stats.steps"), fmt3(steps)), cell(t("stats.injects"), fmt3(injects)), cell(t("stats.compactions"), fmt3(compactions)), cell(t("stats.prunes"), fmt3(prunes)), cell(t("stats.cacheHit"), hit === null ? "\u2014" : hit + "%")));
+    const currency = props.locale === "zh" ? "cny" : "usd";
+    const cost = estimateSessionCost(props.cost, currency);
+    const fmtRate = (n) => formatPriceRate(n, currency);
+    const costTip = [
+      t("stats.costTip"),
+      /* @__PURE__ */ React.createElement("span", { key: "prices", className: "lc-stat-tip-prices" }, /* @__PURE__ */ React.createElement("span", { className: "lc-stat-tip-head" }, t("stats.costPriceHead")), sessionPrices(currency).map((r) => /* @__PURE__ */ React.createElement("span", { key: r.family, className: "lc-stat-tip-row" }, /* @__PURE__ */ React.createElement("b", { className: "lc-stat-tip-model" }, r.family), " ", t("stats.costHit"), " ", fmtRate(r.peak.hit), "/", fmtRate(r.off.hit), " \xB7 ", t("stats.costMiss"), " ", fmtRate(r.peak.miss), "/", fmtRate(r.off.miss), " \xB7 ", t("stats.costOut"), " ", fmtRate(r.peak.out), "/", fmtRate(r.off.out))))
+    ];
+    const cell = (label, value, tip) => /* @__PURE__ */ React.createElement("div", { className: "lc-stat" + (tip === void 0 ? "" : " lc-stat-tipped") }, /* @__PURE__ */ React.createElement("span", { className: "lc-stat-label" }, label, tip !== void 0 && /* @__PURE__ */ React.createElement("i", { className: "lc-stat-q", "aria-hidden": "true" }, "?")), /* @__PURE__ */ React.createElement("b", { className: "lc-stat-value" }, value), tip !== void 0 && /* @__PURE__ */ React.createElement("span", { className: "lc-stat-tip", role: "tooltip" }, tip));
+    return /* @__PURE__ */ React.createElement("div", { className: "lc-card lc-col lc-col-stats" }, /* @__PURE__ */ React.createElement("div", { className: "lc-card-title" }, /* @__PURE__ */ React.createElement("span", { className: "lc-card-title-text" }, t("stats.title")), /* @__PURE__ */ React.createElement("span", { className: "lc-card-sub" }, t("stats.hint"))), /* @__PURE__ */ React.createElement("div", { className: "lc-stats" }, cell(t("stats.turns"), fmt3(turns.size)), cell(t("stats.steps"), fmt3(steps)), cell(t("stats.injects"), fmt3(injects)), cell(t("stats.compactions"), fmt3(compactions)), cell(t("stats.prunes"), fmt3(prunes)), cell(t("stats.cacheHit"), hit === null ? "\u2014" : hit + "%"), cell(t("stats.cost"), cost === null ? "\u2014" : formatCost(cost, currency), costTip)));
   };
 }
 
@@ -1777,9 +1856,9 @@ function makeContextView(ctx, kit) {
       };
     }, [sessionId]);
     React.useEffect(() => {
-      const localeSvc = ctx.get("locale");
-      if (!localeSvc) return void 0;
-      return localeSvc.subscribe(() => setTick((x) => x + 1));
+      const localeSvc2 = ctx.get("locale");
+      if (!localeSvc2) return void 0;
+      return localeSvc2.subscribe(() => setTick((x) => x + 1));
     }, []);
     void tick;
     if (!data) {
@@ -1811,7 +1890,9 @@ function makeContextView(ctx, kit) {
       }
     }
     const head = headlineOf(data, pressure);
-    return /* @__PURE__ */ React.createElement("div", { className: "lc-root", ref: rootRef }, /* @__PURE__ */ React.createElement("div", { className: "lc-cols lc-head" }, /* @__PURE__ */ React.createElement(StatsBoard, { requests, events, usage }), /* @__PURE__ */ React.createElement(PluginInfo, null)), /* @__PURE__ */ React.createElement("div", { className: "lc-cols" }, /* @__PURE__ */ React.createElement("div", { className: "lc-col" }, /* @__PURE__ */ React.createElement(
+    const localeSvc = ctx.get("locale");
+    const activeLocale = localeSvc !== void 0 && typeof localeSvc.getLocale === "function" ? localeSvc.getLocale().active : "en";
+    return /* @__PURE__ */ React.createElement("div", { className: "lc-root", ref: rootRef }, /* @__PURE__ */ React.createElement("div", { className: "lc-cols lc-head" }, /* @__PURE__ */ React.createElement(StatsBoard, { requests, events, usage, cost: data.cost, locale: activeLocale }), /* @__PURE__ */ React.createElement(PluginInfo, null)), /* @__PURE__ */ React.createElement("div", { className: "lc-cols" }, /* @__PURE__ */ React.createElement("div", { className: "lc-col" }, /* @__PURE__ */ React.createElement(
       CurrentComposition,
       {
         head,

package/lib/index.js

@@ -310,6 +310,36 @@ function applySurface(st, ev, type, data, message) {
   st.sums[cat] += node.tokens;
   return node;
 }
+function costFamilyOf(model) {
+  if (model === void 0) return null;
+  const m = model.toLowerCase();
+  if (!m.includes("v4")) return null;
+  if (m.includes("flash")) return "flash";
+  if (m.includes("pro")) return "pro";
+  return null;
+}
+function isPeakUtc(time) {
+  const h = new Date(time).getUTCHours();
+  return h >= 1 && h < 4 || h >= 6 && h < 10;
+}
+function accumulateCost(st, time, usage) {
+  const family = costFamilyOf(st.model);
+  if (family === null) return;
+  const prev = st.cost ?? {};
+  const fam = prev[family] ?? {};
+  const period = isPeakUtc(time) ? "peak" : "off";
+  const b = fam[period] ?? { uncached: 0, cacheRead: 0, cacheWrite: 0, output: 0 };
+  const nextFam = { ...fam };
+  nextFam[period] = {
+    uncached: b.uncached + (usage.inputTokens ?? 0),
+    cacheRead: b.cacheRead + (usage.cacheReadTokens ?? 0),
+    cacheWrite: b.cacheWrite + (usage.cacheWriteTokens ?? 0),
+    output: b.output + (usage.outputTokens ?? 0)
+  };
+  const next = { ...prev };
+  next[family] = nextFam;
+  st.cost = next;
+}
 function applyTimeline(state, event, bounds) {
   let st;
   const ensure = () => st ??= {
@@ -405,6 +435,7 @@ function applyTimeline(state, event, bounds) {
       if (usage && typeof usage.inputTokens === "number") {
         record.prompt = usage.inputTokens + (usage.cacheReadTokens || 0) + (usage.cacheWriteTokens || 0);
         if (typeof usage.outputTokens === "number") record.output = usage.outputTokens;
+        accumulateCost(s, event.time, usage);
       }
       s.requests.push(record);
       const asstMsg = deriveEventMessage(event);
@@ -458,6 +489,21 @@ function buildTimelineView(state, bounds) {
     droppedNodes: 0,
     archive: state.archived.map((n) => ({ ...n }))
   };
+  if (state.cost !== void 0) {
+    const copyFam = (f) => {
+      if (f === void 0) return void 0;
+      const out = {};
+      if (f.peak !== void 0) out.peak = { ...f.peak };
+      if (f.off !== void 0) out.off = { ...f.off };
+      return out;
+    };
+    const cost = {};
+    const flash = copyFam(state.cost.flash);
+    if (flash !== void 0) cost.flash = flash;
+    const pro = copyFam(state.cost.pro);
+    if (pro !== void 0) cost.pro = pro;
+    result.cost = cost;
+  }
   const overflowCount = Math.max(0, state.surface.length - bounds.maxNodes);
   const overflow = state.surface.slice(0, overflowCount);
   const tail = state.surface.slice(overflowCount);
@@ -544,6 +590,16 @@ var currentSchema = z3.object({
   tool: z3.number().int().nonnegative(),
   total: z3.number().int().nonnegative()
 }).strict();
+var costBucketsSchema = z3.object({
+  uncached: z3.number().int().nonnegative(),
+  cacheRead: z3.number().int().nonnegative(),
+  cacheWrite: z3.number().int().nonnegative(),
+  output: z3.number().int().nonnegative()
+}).strict();
+var costFamilySchema = z3.object({
+  peak: costBucketsSchema.optional(),
+  off: costBucketsSchema.optional()
+}).strict();
 var contextTimelineSchema = z3.object({
   ok: z3.literal(true),
   model: z3.string().optional(),
@@ -553,6 +609,7 @@ var contextTimelineSchema = z3.object({
   toolList: z3.array(z3.object({ name: z3.string(), tokens: z3.number().int().nonnegative() }).strict()),
   requests: z3.array(requestRecordSchema),
   events: z3.array(contextEventSchema),
+  cost: z3.object({ flash: costFamilySchema.optional(), pro: costFamilySchema.optional() }).strict().optional(),
   nodes: z3.array(surfaceNodeSchema),
   droppedNodes: z3.number().int().nonnegative(),
   archive: z3.array(surfaceNodeSchema),
@@ -582,7 +639,10 @@ function createContextTimelineDefinition(config) {
     // is not losslessly JSON-serializable) — which also starved the `title`
     // projection row and broke the session list after a restart. The bump
     // discards old cached rows and refolds them clean.
-    stateVersion: 4
+    // 5: the session-cost totals (`cost` — per-family/per-period billed
+    // tokens) joined the persisted state; cached rows predate the shape and
+    // are refolded.
+    stateVersion: 5
   };
 }
 

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "dsh-context",
-  "version": "0.19.2",
+  "version": "0.20.1",
   "description": "A DeepSeek Harness plugin for context insight and management, with context dashboard and context command, for understanding how the context is made of, and how it evolves.",
   "author": "bowenliang123",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/bowenliang123/dsh-context.git"
   },
-  "homepage": "https://github.com/bowenliang123/dsh-context#readme",
+  "homepage": "https://github.com/bowenliang123/dsh-context",
   "bugs": {
     "url": "https://github.com/bowenliang123/dsh-context/issues"
   },
@@ -59,14 +59,13 @@
     "ui"
   ],
   "license": "Apache-2.0",
-  "dependencies": {
-    "zod": "^4.4.3"
-  },
+  "dependencies": {},
   "peerDependencies": {
     "@deepseek-ai/cordis": "^4.0.1",
     "@deepseek-ai/dsh-client-ui-primitives": "^0.1.0-rc.7",
     "@deepseek-ai/dsh-session": "^0.1.0-rc.7",
-    "react": "^18.3.1"
+    "react": "^18.3.1",
+    "zod": "^4.4.3"
   },
   "peerDependenciesMeta": {
     "@deepseek-ai/dsh-client-ui-primitives": {
@@ -74,6 +73,9 @@
     },
     "react": {
       "optional": true
+    },
+    "zod": {
+      "optional": true
     }
   },
   "devDependencies": {