opencode-plugin-context 1.1.1 → 1.2.0

package/README.md

@@ -14,9 +14,10 @@ Context
 ━━━━━━━━━━━━━━━━━ 69%
 138K / 200K tokens
 $0.04 spent
-▍c40K ▍p90K ▍t5K ▍o3K ▍r6K ▍f62K
+62.4 TPS · avg 48.1 · 23s
 ```
 
+
 One color-coded legend row follows the bar — `▍` marker in the segment's color,
 then a muted letter + count. Colors follow the active theme:
 
@@ -66,6 +67,25 @@ always reaches full width. A very small segment may not fill a single bar cell
 always visible in the legend. Percent is colored like the usage plugin: green
 `<50%`, amber `50–74%`, orange `75–99%`, red `100%`.
 
+## Throughput (TPS)
+
+While the assistant streams, a live tokens-per-second line is appended below the
+totals:
+
+```
+62.4 TPS · avg 48.1 · 23s
+```
+
+- **instant** — smoothed rate over a 1s rolling window, colored by speed: red
+  `<10`, amber `10–49`, green `≥50`. Shown only while tokens are arriving.
+- **avg** — tokens / active generation span (first → last token), so idle time
+  doesn't drag it down. Shown once the stream goes quiet.
+- **elapsed** — active generation span.
+
+Counts come from `session.text.delta` / `session.reasoning.delta`, estimated with
+the same chars/4 heuristic used elsewhere (sub-token deltas are carried over), so
+it tracks the live stream rather than the provider's final totals.
+
 ## Configuration
 
 All options are optional. Plugin entry in `tui.json`:

package/dist/tui.js

@@ -56,6 +56,79 @@ function computeContext(counts, limits, cost = 0, estimates, exclude = []) {
     known: window > 0
   };
 }
+var MIN_WINDOW_SECONDS = 0.3;
+var MAX_INITIAL_TPS = 100;
+function createTpsTracker(options = {}) {
+  const windowMs = options.windowMs && options.windowMs > 0 ? options.windowMs : 1e3;
+  const halfLifeMs = options.halfLifeMs && options.halfLifeMs > 0 ? options.halfLifeMs : 250;
+  let samples = [];
+  let total = 0;
+  let start = -1;
+  let last = -1;
+  let smoothed = 0;
+  let smoothedAt = 0;
+  let hasSmoothed = false;
+  function raw(now) {
+    if (samples.length === 0) return 0;
+    const cutoff = now - windowMs;
+    let tokens = 0;
+    let oldest = now;
+    for (const sample of samples) {
+      if (sample.t >= cutoff) {
+        tokens += sample.count;
+        if (sample.t < oldest) oldest = sample.t;
+      }
+    }
+    if (tokens === 0) return 0;
+    return tokens / Math.max((now - oldest) / 1e3, MIN_WINDOW_SECONDS);
+  }
+  return {
+    record(count, timestamp) {
+      if (!(count > 0)) return;
+      const t = timestamp ?? Date.now();
+      if (start < 0) start = t;
+      if (t > last) last = t;
+      total += count;
+      samples.push({ t, count });
+      const cutoff = t - windowMs;
+      let drop = 0;
+      while (drop < samples.length && samples[drop].t < cutoff) drop++;
+      if (drop > 0) samples = samples.slice(drop);
+      const value = raw(t);
+      if (!hasSmoothed) {
+        smoothed = Math.min(value, MAX_INITIAL_TPS);
+        hasSmoothed = true;
+      } else {
+        const dt = Math.max(1, t - smoothedAt);
+        const alpha = Math.exp(-Math.LN2 * dt / halfLifeMs);
+        smoothed = alpha * smoothed + (1 - alpha) * value;
+      }
+      smoothedAt = t;
+    },
+    instant() {
+      if (!hasSmoothed || Date.now() - last > windowMs) return 0;
+      return smoothed;
+    },
+    average() {
+      return start < 0 ? 0 : total / Math.max((last - start) / 1e3, MIN_WINDOW_SECONDS);
+    },
+    total() {
+      return total;
+    },
+    elapsed() {
+      return start < 0 ? 0 : last - start;
+    },
+    reset() {
+      samples = [];
+      total = 0;
+      start = -1;
+      last = -1;
+      smoothed = 0;
+      smoothedAt = 0;
+      hasSmoothed = false;
+    }
+  };
+}
 function segmentBar(segments, window, width, exclude = []) {
   if (window <= 0 || width <= 0) return [];
   let remaining = width;
@@ -117,27 +190,57 @@ var plugin = {
       setRenderTick((n) => n + 1);
       api.renderer.requestRender();
     };
+    const trackers = /* @__PURE__ */ new Map();
+    const carries = /* @__PURE__ */ new Map();
+    const trackerFor = (sessionId) => {
+      let tracker = trackers.get(sessionId);
+      if (!tracker) {
+        tracker = createTpsTracker();
+        trackers.set(sessionId, tracker);
+      }
+      return tracker;
+    };
+    const onDelta = (sessionId, text, at) => {
+      const carry = (carries.get(sessionId) ?? 0) + text.length;
+      const tokens = Math.floor(carry / 4);
+      carries.set(sessionId, carry - tokens * 4);
+      if (tokens > 0) trackerFor(sessionId).record(tokens, at);
+      throttledRepaint();
+    };
+    let lastRepaint = 0;
+    let pendingRepaint;
+    const throttledRepaint = () => {
+      const wait = lastRepaint + 50 - Date.now();
+      if (wait <= 0) {
+        lastRepaint = Date.now();
+        repaint();
+      } else if (pendingRepaint === void 0) {
+        pendingRepaint = setTimeout(() => {
+          pendingRepaint = void 0;
+          lastRepaint = Date.now();
+          repaint();
+        }, wait);
+      }
+    };
     const unsubs = [
-      api.event.on("message.updated", repaint),
-      api.event.on("message.part.updated", repaint),
-      api.event.on("message.part.removed", repaint),
-      api.event.on("message.removed", repaint),
-      api.event.on("session.updated", repaint),
-      api.event.on("session.compacted", repaint),
+      api.event.on("session.created", repaint),
       api.event.on("session.status", repaint),
-      api.event.on("session.idle", repaint)
+      api.event.on("session.idle", repaint),
+      api.event.on("session.text.delta", (event) => onDelta(event.data.sessionID, event.data.delta, event.created)),
+      api.event.on("session.reasoning.delta", (event) => onDelta(event.data.sessionID, event.data.delta, event.created))
     ];
     const repaintTimer = setInterval(repaint, 2e3);
     api.lifecycle.onDispose(() => {
       for (const unsub of unsubs) unsub();
       clearInterval(repaintTimer);
+      if (pendingRepaint !== void 0) clearTimeout(pendingRepaint);
     });
     api.slots.register({
       order: SLOT_ORDER,
       slots: {
         sidebar_content(_ctx, props) {
           getRenderTick();
-          return renderPanel(api, props.session_id, config);
+          return renderPanel(api, props.session_id, config, trackers.get(props.session_id));
         }
       }
     });
@@ -196,7 +299,7 @@ function sessionUsage(api, sessionId, config) {
   const estimates = config.estimate ? collectEstimates(api, sessionId) : void 0;
   return computeContext(counts, limits, cost, estimates, config.exclude);
 }
-function renderPanel(api, sessionId, config) {
+function renderPanel(api, sessionId, config, tps) {
   const theme = api.theme.current;
   const usage = sessionUsage(api, sessionId, config);
   const header = /* @__PURE__ */ jsx("text", { fg: theme.text, attributes: BOLD, children: "Context" });
@@ -264,8 +367,30 @@ function renderPanel(api, sessionId, config) {
   if (usage.cost > 0) {
     lines.push(/* @__PURE__ */ jsx("text", { fg: theme.textMuted, children: `${money.format(usage.cost)} spent` }));
   }
+  if (tps && tps.total() > 0) {
+    const instant = tps.instant();
+    const live = instant > 0.05;
+    const avg = tps.average();
+    lines.push(
+      /* @__PURE__ */ jsxs("box", { flexDirection: "row", children: [
+        live ? /* @__PURE__ */ jsx("text", { fg: speedColor(instant, theme), children: `${instant.toFixed(1)} TPS` }) : null,
+        /* @__PURE__ */ jsx("text", { fg: theme.textMuted, children: live ? ` \xB7 avg ${avg.toFixed(1)} \xB7 ${formatDuration(tps.elapsed())}` : `avg ${avg.toFixed(1)} TPS \xB7 ${formatDuration(tps.elapsed())}` })
+      ] })
+    );
+  }
   return /* @__PURE__ */ jsx("box", { width: "100%", flexDirection: "column", children: lines });
 }
+function formatDuration(ms) {
+  const seconds = ms / 1e3;
+  if (seconds < 60) return `${seconds.toFixed(1)}s`;
+  const whole = Math.round(seconds);
+  return `${Math.floor(whole / 60)}m${String(whole % 60).padStart(2, "0")}s`;
+}
+function speedColor(tps, theme) {
+  if (tps < 10) return theme.error;
+  if (tps < 50) return theme.warning;
+  return theme.success;
+}
 function segmentColor(id, theme, estimate) {
   const base = {
     cached: theme.success,

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "opencode-plugin-context",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "OpenCode TUI plugin that renders the session's context-window usage as a colored, segmented bar (cached / prompt / thinking / output / reserved output) in the sidebar",
   "type": "module",
   "exports": {
@@ -40,14 +40,14 @@
     "access": "public"
   },
   "peerDependencies": {
-    "@opencode-ai/plugin": ">=1.14.0",
+    "@opencode-ai/plugin": ">=0.0.0-next-17444",
     "@opentui/core": ">=0.2.9",
     "@opentui/solid": ">=0.2.9"
   },
   "devDependencies": {
-    "@opencode-ai/plugin": "1.18.18",
-    "@opentui/core": "0.5.4",
-    "@opentui/solid": "0.5.4",
+    "@opencode-ai/plugin": "0.0.0-next-17444",
+    "@opentui/core": "0.5.11",
+    "@opentui/solid": "0.5.11",
     "@types/node": "^26.2.0",
     "esbuild": "^0.28.0",
     "solid-js": "1.9.12",