pi-editor-footer 0.12.1 → 0.12.3

package/CHANGELOG.md

@@ -1,3 +1,33 @@
+# Changelog
+
+## [0.12.3](https://github.com/Rianico/pi-editor-footer/compare/v0.12.2...v0.12.3) (2026-09-17)
+
+### Bug Fixes
+
+* **footer:** count total input tokens in footer statistics ([a2153a1](https://github.com/Rianico/pi-editor-footer/commit/a2153a1f0f4884e3879a610744a9e664a9124053))
+
+### Documentation
+
+* **agents:** mark agent-run token accounting a scope boundary ([ffbbee2](https://github.com/Rianico/pi-editor-footer/commit/ffbbee29300a40d6963e0916c7526e0a1ce49881))
+* document total input token semantics for the footer ([9480bf9](https://github.com/Rianico/pi-editor-footer/commit/9480bf9f1508930d75a5e53b94d944d00d1f6a2a))
+
+<!-- markdownlint-configure-file { "MD004": { "style": "asterisk" } } -->
+<!-- Bullets stay `*`: semantic-release's preset writes `*`, and this file is excluded from the
+     formatters so they cannot normalize them to `-`. Keep `# Changelog` as the FIRST line:
+     @semantic-release/changelog rewrites the title in place only while the file starts with
+     the configured `changelogTitle`, and prepends release notes above it otherwise. Do not
+     move this title below the comments, and do not remove the title. -->
+
+All notable changes to this project will be documented in this file.
+
+## [0.12.2](https://github.com/Rianico/pi-editor-footer/compare/v0.12.1...v0.12.2) (2026-09-13)
+
+### Bug Fixes
+
+* **context:** tier-color the context window section by usage ([#30](https://github.com/Rianico/pi-editor-footer/issues/30)) ([8152d90](https://github.com/Rianico/pi-editor-footer/commit/8152d90b3c1b4013154eff95cc885e79e7564f6f))
+
+## [Unreleased]
+
 ## [0.12.1](https://github.com/Rianico/pi-editor-footer/compare/v0.12.0...v0.12.1) (2026-09-07)
 
 ### Bug Fixes
@@ -16,10 +46,6 @@
 * allow pnpm builds for esbuild and genai ([36e139e](https://github.com/Rianico/pi-editor-footer/commit/36e139e9443ef928a4366c3d7c8afe494b6e0850))
 * make prepare tolerant to missing husky for pi install ([23ebb62](https://github.com/Rianico/pi-editor-footer/commit/23ebb62cd8d732656fd113da27c807ffa34579fc))
 
-# Changelog
-
-All notable changes to this project will be documented in this file.
-
 ## [0.11.0] - 2026-08-29
 
 ### Changed

package/README.md

@@ -12,8 +12,8 @@ A [pi](https://pi.dev) extension that turns the editor chrome into a project-awa
 
 **Footer** — single line below the input, responsive via `fitSegmentsByPriority` and `alignRight`:
 - Left: `cwd` (`·` `git branch` + status `[! ? + ↑↓]` + stashed/conflicted) `•` `runtime` (`node`/`python`/`rust`/`go`… + version) `•` `timer` (`working`/`done`)
-- Right: `tokens` (` input |  output |  $cost`) immediately next to `context` (` [bar] % · tokens/contextWindow`)
-- Separators: `·` between `cwd` and `git`, `•` as default between other left components; `tokens` sits directly left of the context bar
+- Right: `tokens` (`↑ <total input> · ↓ <output> · $<cost>`) — `↑` counts every billed input token (uncached input + cache read + cache write), so it tracks the context bar's token figure instead of `usage.input` alone
+- Separators: `·` between `cwd` and `git`, `•` as default between other left components; the `context` bar (`<pct> · <tokens>/<window> | c <hit%>`) sits on the top border next to the model label, not in the footer
 - `cwd` respects `workspaceDisplay` (`~/development/ai/pi-skill-desc` vs `pi-skill-desc`, switchable in settings)
 - `context` bar uses `stressColor` and `renderBar` (12 cols max) with `•`/`·` handling
 - Extension statuses line (`wrapTextWithAnsi`) when `footerSegments.extensionStatuses`

package/dist/ansi-color.js

@@ -0,0 +1,142 @@
+const BASIC16 = [
+    [0, 0, 0],
+    [128, 0, 0],
+    [0, 128, 0],
+    [128, 128, 0],
+    [0, 0, 128],
+    [128, 0, 128],
+    [0, 128, 128],
+    [192, 192, 192],
+    [128, 128, 128],
+    [255, 0, 0],
+    [0, 255, 0],
+    [255, 255, 0],
+    [0, 0, 255],
+    [255, 0, 255],
+    [0, 255, 255],
+    [255, 255, 255],
+];
+/** 6x6x6 color-cube channel values (indices 0-5). */
+const CUBE_VALUES = [0, 95, 135, 175, 215, 255];
+/** Grayscale ramp values (indices 232-255: 24 grays from 8 to 238). */
+const GRAY_VALUES = Array.from({ length: 24 }, (_, i) => 8 + i * 10);
+/** Anything but the truecolor marker means the 256-color ramp. */
+export function normalizeColorMode(mode) {
+    return mode === "truecolor" ? "truecolor" : "256color";
+}
+export function indexToRgb(n) {
+    if (n >= 0 && n < 16) {
+        const [r, g, b] = BASIC16[n] ?? [0, 0, 0];
+        return { r, g, b };
+    }
+    if (n >= 16 && n <= 231) {
+        const v = n - 16;
+        return {
+            r: CUBE_VALUES[Math.floor(v / 36)] ?? 0,
+            g: CUBE_VALUES[Math.floor(v / 6) % 6] ?? 0,
+            b: CUBE_VALUES[v % 6] ?? 0,
+        };
+    }
+    if (n >= 232 && n <= 255) {
+        const gray = 8 + (n - 232) * 10;
+        return { r: gray, g: gray, b: gray };
+    }
+    return null;
+}
+function findClosestCubeIndex(value) {
+    let minDist = Infinity;
+    let minIdx = 0;
+    for (let i = 0; i < CUBE_VALUES.length; i++) {
+        const dist = Math.abs(value - (CUBE_VALUES[i] ?? 0));
+        if (dist < minDist) {
+            minDist = dist;
+            minIdx = i;
+        }
+    }
+    return minIdx;
+}
+function findClosestGrayIndex(gray) {
+    let minDist = Infinity;
+    let minIdx = 0;
+    for (let i = 0; i < GRAY_VALUES.length; i++) {
+        const dist = Math.abs(gray - (GRAY_VALUES[i] ?? 0));
+        if (dist < minDist) {
+            minDist = dist;
+            minIdx = i;
+        }
+    }
+    return minIdx;
+}
+function colorDistance(r1, g1, b1, r2, g2, b2) {
+    const dr = r1 - r2;
+    const dg = g1 - g2;
+    const db = b1 - b2;
+    // Weighted Euclidean distance (the eye is more sensitive to green).
+    return dr * dr * 0.299 + dg * dg * 0.587 + db * db * 0.114;
+}
+/** Quantize RGB to the closest xterm-256 index (same rule as the theme loader). */
+export function rgbTo256(r, g, b) {
+    const rIdx = findClosestCubeIndex(r);
+    const gIdx = findClosestCubeIndex(g);
+    const bIdx = findClosestCubeIndex(b);
+    const cubeR = CUBE_VALUES[rIdx] ?? 0;
+    const cubeG = CUBE_VALUES[gIdx] ?? 0;
+    const cubeB = CUBE_VALUES[bIdx] ?? 0;
+    const cubeIndex = 16 + 36 * rIdx + 6 * gIdx + bIdx;
+    const cubeDist = colorDistance(r, g, b, cubeR, cubeG, cubeB);
+    const gray = Math.round(0.299 * r + 0.587 * g + 0.114 * b);
+    const grayIdx = findClosestGrayIndex(gray);
+    const grayValue = GRAY_VALUES[grayIdx] ?? 0;
+    const grayIndex = 232 + grayIdx;
+    const grayDist = colorDistance(r, g, b, grayValue, grayValue, grayValue);
+    const spread = Math.max(r, g, b) - Math.min(r, g, b);
+    // Only consider grayscale when the color is nearly neutral AND closer.
+    if (spread < 10 && grayDist < cubeDist)
+        return grayIndex;
+    return cubeIndex;
+}
+/** Parse `#RRGGBB`. Throws on malformed input — callers pass literals, not user data. */
+export function hexToRgb(hex) {
+    const cleaned = hex.startsWith("#") ? hex.slice(1) : hex;
+    if (cleaned.length !== 6)
+        throw new Error(`Invalid hex color: ${hex}`);
+    const { r, g, b } = {
+        r: parseInt(cleaned.slice(0, 2), 16),
+        g: parseInt(cleaned.slice(2, 4), 16),
+        b: parseInt(cleaned.slice(4, 6), 16),
+    };
+    if (Number.isNaN(r) || Number.isNaN(g) || Number.isNaN(b)) {
+        throw new Error(`Invalid hex color: ${hex}`);
+    }
+    return { r, g, b };
+}
+/** Parse a theme token's ANSI escape back into RGB (truecolor or 256 index). */
+export function parseFgAnsiToRgb(theme, color) {
+    const ansi = theme.getFgAnsi(color);
+    const trueColor = ansi.match(/38;2;(\d+);(\d+);(\d+)/);
+    if (trueColor) {
+        return {
+            r: Number(trueColor[1]),
+            g: Number(trueColor[2]),
+            b: Number(trueColor[3]),
+        };
+    }
+    const palette = ansi.match(/38;5;(\d+)/);
+    if (palette)
+        return indexToRgb(Number(palette[1]));
+    return null;
+}
+/** SGR foreground sequence for an RGB value at the terminal's color fidelity. */
+export function rgbToFgAnsi({ r, g, b }, mode) {
+    return normalizeColorMode(mode) === "truecolor"
+        ? `\x1b[38;2;${r};${g};${b}m`
+        : `\x1b[38;5;${rgbTo256(r, g, b)}m`;
+}
+/**
+ * Color `s` with an exact hex, bypassing the theme's named-token lookup.
+ * Returned painter resets only the foreground (`\x1b[39m`), matching `theme.fg`.
+ */
+export function hexFg(hex, mode) {
+    const ansi = rgbToFgAnsi(hexToRgb(hex), mode);
+    return (s) => `${ansi}${s}\x1b[39m`;
+}

package/dist/chrome-composition.js

@@ -8,7 +8,7 @@
  * thus required touching 3-4 modules with no locality.
  *
  * Depth: one small interface (glyphs + isAscii + fg/dim/glow + format* helpers) hides
- * icon-mode resolution, the SAFETY theme cast, colour application, and the chrome format
+ * icon-mode resolution, the SAFETY theme cast, color application, and the chrome format
  * entry points (context bar, telemetry, tokens, run activity, stall). Callers learn one
  * shape; LiveBorder's islands become thin lookups.
  *
@@ -21,14 +21,19 @@ import { resolveGlyphs, resolveIconMode } from "./icons.js";
 import { formatTopContextFromSnapshot } from "./chrome-state.js";
 import { formatRunActivityTopRight } from "./run-activity.js";
 import { formatTelemetryTokens, formatTurnDuration, formatTurnTelemetry } from "./telemetry.js";
+import { hexFg } from "./ansi-color.js";
 /**
- * Read the live pi theme into a typed { fg } surface. The cast is a SAFETY seam — a pi theme
- * missing `fg` degrades to identity rather than throwing, keeping the chrome resilient.
+ * Read the live pi theme into a typed { fg, fgHex } surface. The cast is a SAFETY
+ * seam — a pi theme missing `fg` degrades to identity rather than throwing, keeping
+ * the chrome resilient. `fgHex` needs no theme call at all: the named-token lookup
+ * rejects raw hex, so hex is rendered straight to SGR at the theme's color mode.
  */
 export function adaptTheme(rawTheme) {
-    const t = rawTheme; // SAFETY: pi theme seam — fg is optional, guarded below
+    const t = rawTheme;
+    const mode = typeof t.getColorMode === "function" ? t.getColorMode() : undefined;
     return {
         fg: (style, s) => (typeof t.fg === "function" ? t.fg(style, s) : s),
+        fgHex: (hex, s) => hexFg(hex, mode)(s),
     };
 }
 /** Optional thinking-border glow (pi theme extension). Falls back to identity. */
@@ -57,7 +62,7 @@ export class ChromeComposition {
         this.theme = adaptTheme(rawTheme);
         this.glow = opts.glow ?? resolveGlow(rawTheme);
     }
-    /** Colour a string with a theme style (derived once, cast cached). */
+    /** Color a string with a theme style (derived once, cast cached). */
     fg(style, s) {
         return this.theme.fg(style, s);
     }

package/dist/chrome-state.js

@@ -15,20 +15,30 @@
  * inside this module, not part of its external seam.
  */
 import { getUsageTotals } from "./state.js";
-import { cacheHitColor, contextUsageColor } from "./color-policy.js";
+import { cacheHitColor, CONTEXT_TIER_HEX, CONTEXT_TIER_THEME_COLOR, contextUsageTier, } from "./color-policy.js";
 import { fmtTokens } from "./format.js";
 // ---------------------------------------------------------------------------
 // Context bar formatting — moved from footer.ts to centralize chrome rendering.
 // Re-exported from footer.ts for backward compatibility.
 // ---------------------------------------------------------------------------
-function renderBar(theme, pct, barWidth, ascii) {
+/**
+ * Painter for one context tier: exact hex when the live theme can emit raw hex,
+ * else the nearest semantic token (tests/mocks, themes without color mode).
+ */
+function contextPainter(theme, tier) {
+    const hex = CONTEXT_TIER_HEX[tier];
+    const fgHex = theme.fgHex;
+    if (fgHex)
+        return (s) => fgHex.call(theme, hex, s);
+    return (s) => theme.fg(CONTEXT_TIER_THEME_COLOR[tier], s);
+}
+function renderBar(theme, paint, pct, barWidth, ascii) {
     const filled = Math.max(0, Math.min(barWidth, Math.round((pct / 100) * barWidth)));
     const empty = barWidth - filled;
-    const color = contextUsageColor(pct);
     const filledCell = ascii ? "#" : "█";
     const emptyCell = ascii ? "-" : "░";
     return (theme.fg("dim", "[") +
-        theme.fg(color, filledCell.repeat(filled)) +
+        paint(filledCell.repeat(filled)) +
         theme.fg("dim", emptyCell.repeat(empty)) +
         theme.fg("dim", "]"));
 }
@@ -37,13 +47,13 @@ export function formatContextBar(contextUsage, theme, glyphs, isAscii, barWidth
     if (contextWindow <= 0)
         return "";
     const contextPct = contextUsage?.percent ?? 0;
-    const contextColor = contextUsageColor(contextPct);
-    const pctText = theme.fg(contextColor, `${contextPct.toFixed(1)}%`);
+    const paint = contextPainter(theme, contextUsageTier(contextPct, contextWindow));
+    const pctText = paint(`${contextPct.toFixed(1)}%`);
     const contextTokens = contextUsage?.tokens ?? 0;
-    const ctxText = `${theme.fg(contextColor, fmtTokens(contextTokens))}${theme.fg("dim", "/")}${theme.fg(contextColor, fmtTokens(contextWindow))}`;
+    const ctxText = `${paint(fmtTokens(contextTokens))}${theme.fg("dim", "/")}${paint(fmtTokens(contextWindow))}`;
     const baseCore = `${pctText} ${theme.fg("dim", "·")} ${ctxText}`;
     const base = showIconBar
-        ? `${theme.fg(contextColor, glyphs.context)} ${renderBar(theme, contextPct, barWidth, isAscii)} ${baseCore}`
+        ? `${paint(glyphs.context)} ${renderBar(theme, paint, contextPct, barWidth, isAscii)} ${baseCore}`
         : baseCore;
     const rate = cacheHitRate !== undefined && Number.isFinite(cacheHitRate) ? cacheHitRate : 0;
     const cacheText = `${glyphs.cacheHit} ${rate.toFixed(1)}%`;

package/dist/color-policy.js

@@ -5,24 +5,37 @@ export function stressColor(value, warn = 70, danger = 90) {
         return "warning";
     return "accent";
 }
-export function contextUsageColor(pct) {
-    // 12.5 / 25 / 50 quotas — four urgency tiers, increasingly aggressive as context fills.
-    // 0 – 12.5%  dim      — plenty of headroom, visually quiet.
-    // 12.5 – 25% accent   — first nudge, noticeable but calm.
-    // 25 – 50%   warning  — half consumed, needs attention.
-    // 50 – 100%  error     — critical, about to run out.
-    // Uses theme semantic tokens (dim/accent/warning/error) so the progression
-    // respects the active theme and remains legible on light/dark/custom palettes.
-    // A fixed hex palette (e.g. grey→sky→amber→red) would be more vivid but
-    // would ignore the user's theme and can clash with light backgrounds —
-    // semantic tokens keep the "aggressive" ordering while staying theme-coherent.
-    if (pct >= 50)
-        return "error";
-    if (pct >= 25)
-        return "warning";
-    if (pct >= 12.5)
-        return "accent";
-    return "dim";
+/**
+ * Fixed tier palette (nord green / nord yellow / dark red). Hex, not theme tokens:
+ * the tiers are an alarm scale the user picked explicitly, so they must read the
+ * same on every theme. `CONTEXT_TIER_THEME_COLOR` is only the fallback for themes
+ * that cannot emit raw hex.
+ */
+export const CONTEXT_TIER_HEX = {
+    ok: "#A3BE8C",
+    warn: "#EBCB8B",
+    critical: "#9A3939",
+};
+/** Semantic token approximating each tier — used when raw hex is unavailable. */
+export const CONTEXT_TIER_THEME_COLOR = {
+    ok: "success",
+    warn: "warning",
+    critical: "error",
+};
+/**
+ * Tier from the share of the context window consumed.
+ *
+ * Budgets scale with the window: a 1M window only earns 12.5 / 25 % of slack
+ * before the same alarm, while smaller windows (compacted far sooner) keep the
+ * looser 25 / 50 % steps.
+ */
+export function contextUsageTier(pct, contextWindow) {
+    const [warnAt, criticalAt] = contextWindow >= 1_000_000 ? [12.5, 25] : [25, 50];
+    if (pct >= criticalAt)
+        return "critical";
+    if (pct >= warnAt)
+        return "warn";
+    return "ok";
 }
 export function cacheHitColor(value) {
     if (value < 30)

package/dist/footer.js

@@ -1,5 +1,5 @@
 import { truncateToWidth, visibleWidth, wrapTextWithAnsi } from "@earendil-works/pi-tui";
-import { getUsageTotals } from "./state.js";
+import { getUsageTotals, totalInputTokens } from "./state.js";
 import { runtimeSymbol } from "./icons.js";
 import { ChromeComposition } from "./chrome-composition.js";
 import { alignRight, fitSegmentsByPriority, } from "./layout.js";
@@ -141,7 +141,9 @@ export function renderFooter(width, state, config, theme, ctx) {
     }
     const stats = [];
     if (segments.tokens) {
-        stats.push(theme.fg("accent", `${glyphs.input} ${fmtTokens(totals.input)}`));
+        // Total input billed for the model — includes the cached prompt prefix, not just
+        // `usage.input` (which excludes cacheRead/cacheWrite). See totalInputTokens.
+        stats.push(theme.fg("accent", `${glyphs.input} ${fmtTokens(totalInputTokens(totals))}`));
         stats.push(theme.fg("success", `${glyphs.output} ${fmtTokens(totals.output)}`));
     }
     if (segments.cost) {

package/dist/model-info.js

@@ -5,7 +5,8 @@
  * model-info-widget/index.ts, MIT-style personal extension) so that the
  * TrackingEditor — which owns the editor slot for this extension — can keep
  * rendering the model label and thinking-level border glow that the original
- * widget provided. Self-contained: no imports beyond pi-tui's width utils.
+ * widget provided. Self-contained apart from pi-tui width utils, the shared
+ * ANSI quantizer (ansi-color.ts) and stripAnsi (format.ts).
  *
  * The port is intentional: pi allows exactly ONE custom editor (last
  * `setEditorComponent` writer wins). pi-skill-desc must own the slot to track
@@ -13,6 +14,8 @@
  * its visual behavior lives here instead. See docs/adr/0001.
  */
 import { truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
+import { parseFgAnsiToRgb, rgbToFgAnsi } from "./ansi-color.js";
+import { stripAnsi } from "./format.js";
 const LEVEL_INDEX = {
     off: 0,
     minimal: 1,
@@ -36,117 +39,10 @@ const GLOW_FACTOR = 0.55;
 /** Space padding around the label inside the border (each side). */
 const LABEL_PAD = 1;
 // ---------------------------------------------------------------------------
-// Color helpers: theme ANSI → RGB → boosted glow ANSI
 // ---------------------------------------------------------------------------
-function stripAnsi(s) {
-    return s.replace(/\x1b\[[0-9;]*m/g, "");
-}
-const BASIC16 = [
-    [0, 0, 0],
-    [128, 0, 0],
-    [0, 128, 0],
-    [128, 128, 0],
-    [0, 0, 128],
-    [128, 0, 128],
-    [0, 128, 128],
-    [192, 192, 192],
-    [128, 128, 128],
-    [255, 0, 0],
-    [0, 255, 0],
-    [255, 255, 0],
-    [0, 0, 255],
-    [255, 0, 255],
-    [0, 255, 255],
-    [255, 255, 255],
-];
-const CUBE_VALUES = [0, 95, 135, 175, 215, 255];
-const GRAY_VALUES = Array.from({ length: 24 }, (_, i) => 8 + i * 10);
-function indexToRgb(n) {
-    if (n >= 0 && n < 16) {
-        const [r, g, b] = BASIC16[n] ?? [0, 0, 0];
-        return { r, g, b };
-    }
-    if (n >= 16 && n <= 231) {
-        const v = n - 16;
-        return {
-            r: CUBE_VALUES[Math.floor(v / 36)] ?? 0,
-            g: CUBE_VALUES[Math.floor(v / 6) % 6] ?? 0,
-            b: CUBE_VALUES[v % 6] ?? 0,
-        };
-    }
-    if (n >= 232 && n <= 255) {
-        const gray = 8 + (n - 232) * 10;
-        return { r: gray, g: gray, b: gray };
-    }
-    return null;
-}
-/** Parse a Theme.getFgAnsi() escape back into RGB. */
-function parseFgAnsiToRgb(theme, color) {
-    const ansi = theme.getFgAnsi(color);
-    const trueColor = ansi.match(/38;2;(\d+);(\d+);(\d+)/);
-    if (trueColor)
-        return {
-            r: Number(trueColor[1]),
-            g: Number(trueColor[2]),
-            b: Number(trueColor[3]),
-        };
-    const palette = ansi.match(/38;5;(\d+)/);
-    if (palette)
-        return indexToRgb(Number(palette[1]));
-    return null;
-}
-function findClosestCubeIndex(value) {
-    let minDist = Infinity;
-    let minIdx = 0;
-    for (let i = 0; i < CUBE_VALUES.length; i++) {
-        const dist = Math.abs(value - (CUBE_VALUES[i] ?? 0));
-        if (dist < minDist) {
-            minDist = dist;
-            minIdx = i;
-        }
-    }
-    return minIdx;
-}
-function findClosestGrayIndex(gray) {
-    let minDist = Infinity;
-    let minIdx = 0;
-    for (let i = 0; i < GRAY_VALUES.length; i++) {
-        const dist = Math.abs(gray - (GRAY_VALUES[i] ?? 0));
-        if (dist < minDist) {
-            minDist = dist;
-            minIdx = i;
-        }
-    }
-    return minIdx;
-}
-function colorDistance(r1, g1, b1, r2, g2, b2) {
-    const dr = r1 - r2;
-    const dg = g1 - g2;
-    const db = b1 - b2;
-    return dr * dr * 0.299 + dg * dg * 0.587 + db * db * 0.114;
-}
-/** Quantize an RGB value to the closest xterm-256 index (same as the theme loader). */
-function rgbTo256(r, g, b) {
-    const rIdx = findClosestCubeIndex(r);
-    const gIdx = findClosestCubeIndex(g);
-    const bIdx = findClosestCubeIndex(b);
-    const cubeR = CUBE_VALUES[rIdx] ?? 0;
-    const cubeG = CUBE_VALUES[gIdx] ?? 0;
-    const cubeB = CUBE_VALUES[bIdx] ?? 0;
-    const cubeIndex = 16 + 36 * rIdx + 6 * gIdx + bIdx;
-    const cubeDist = colorDistance(r, g, b, cubeR, cubeG, cubeB);
-    const gray = Math.round(0.299 * r + 0.587 * g + 0.114 * b);
-    const grayIdx = findClosestGrayIndex(gray);
-    const grayValue = GRAY_VALUES[grayIdx] ?? 0;
-    const grayIndex = 232 + grayIdx;
-    const grayDist = colorDistance(r, g, b, grayValue, grayValue, grayValue);
-    const maxC = Math.max(r, g, b);
-    const minC = Math.min(r, g, b);
-    const spread = maxC - minC;
-    if (spread < 10 && grayDist < cubeDist)
-        return grayIndex;
-    return cubeIndex;
-}
+// Color helpers: theme token ANSI → RGB → boosted glow ANSI
+// (RGB/256 quantization lives in ansi-color.ts, shared with the chrome tiers)
+// ---------------------------------------------------------------------------
 /**
  * Build a border color function for a thinking level: takes the theme's
  * per-level color and brightens it toward white proportionally to the level,
@@ -162,9 +58,7 @@ function buildGlow(theme, level) {
     const r = Math.round(base.r + (255 - base.r) * t);
     const g = Math.round(base.g + (255 - base.g) * t);
     const b = Math.round(base.b + (255 - base.b) * t);
-    const ansi = theme.getColorMode() === "truecolor"
-        ? `\x1b[38;2;${r};${g};${b}m`
-        : `\x1b[38;5;${rgbTo256(r, g, b)}m`;
+    const ansi = rgbToFgAnsi({ r, g, b }, theme.getColorMode());
     return (s) => `${ansi}${s}\x1b[39m`;
 }
 // ---------------------------------------------------------------------------

package/dist/state.js

@@ -1,6 +1,15 @@
 import { emptyGitStatus } from "./git.js";
 import { fmtTokens } from "./format.js";
 import { formatProviderLabel } from "./format.js";
+/**
+ * Total input tokens billed to the model: uncached input + cache read + cache write.
+ *
+ * pi-ai `Usage.input` excludes the cached prompt prefix (it lives in cacheRead/cacheWrite),
+ * so `input` alone under-reports the prompt by the whole cached history on every turn.
+ */
+export function totalInputTokens(totals) {
+    return totals.input + totals.cacheRead + totals.cacheWrite;
+}
 let usageCache;
 function entriesKey(ctx) {
     const entries = ctx.sessionManager?.getEntries() ?? [];
@@ -8,9 +17,7 @@ function entriesKey(ctx) {
     return `${entries.length}:${String(last?.id ?? "")}:${String(last?.timestamp ?? "")}`;
 }
 export function getUsageTotals(ctx) {
-    const key = entriesKey(
-    // SAFETY: pi seam — intentional unsafe cast, validated at runtime
-    ctx);
+    const key = entriesKey(ctx);
     if (usageCache && usageCache.key === key)
         return usageCache.totals;
     const totals = {
@@ -21,23 +28,36 @@ export function getUsageTotals(ctx) {
         cost: 0,
         latestCacheHitRate: undefined,
     };
-    const entries = 
-    // SAFETY: pi seam — intentional unsafe cast, validated at runtime
-    ctx.sessionManager?.getEntries() ?? [];
-    for (const entry of entries) {
+    const addUsage = (usage) => {
+        totals.input += usage.input ?? 0;
+        totals.output += usage.output ?? 0;
+        totals.cacheRead += usage.cacheRead ?? 0;
+        totals.cacheWrite += usage.cacheWrite ?? 0;
+        totals.cost += usage.cost?.total ?? 0;
+    };
+    for (const entry of ctx.sessionManager?.getEntries() ?? []) {
+        // Assistant turns carry the cache split the hit rate is derived from; tool results
+        // and summaries are usage from nested model calls — billed, so they count toward the
+        // session totals (parity with pi core's addUsageToTotals loop).
         if (entry.type === "message" && entry.message?.role === "assistant") {
-            const u = entry.message.usage;
-            if (!u)
+            const usage = entry.message.usage;
+            if (!usage)
                 continue;
-            totals.input += u.input ?? 0;
-            totals.output += u.output ?? 0;
-            totals.cacheRead += u.cacheRead ?? 0;
-            totals.cacheWrite += u.cacheWrite ?? 0;
-            totals.cost += u.cost?.total ?? 0;
-            const promptTokens = (u.input ?? 0) + (u.cacheRead ?? 0) + (u.cacheWrite ?? 0);
+            addUsage(usage);
+            const promptTokens = (usage.input ?? 0) + (usage.cacheRead ?? 0) + (usage.cacheWrite ?? 0);
             if (promptTokens > 0) {
-                totals.latestCacheHitRate = ((u.cacheRead ?? 0) / promptTokens) * 100;
+                totals.latestCacheHitRate = ((usage.cacheRead ?? 0) / promptTokens) * 100;
             }
+            continue;
+        }
+        if (entry.type === "message" && entry.message?.role === "toolResult") {
+            if (entry.message.usage)
+                addUsage(entry.message.usage);
+            continue;
+        }
+        if (entry.type === "branch_summary" || entry.type === "compaction") {
+            if (entry.usage)
+                addUsage(entry.usage);
         }
     }
     usageCache = { key, totals };

package/dist/utils.js

@@ -1,13 +1,13 @@
 // Barrel — preserves the old import surface while the codebase migrates to
 // focused modules. New code should import from the owning module directly:
 //   path-format → formatCwd, basenamePath, truncateBranch, truncatePath
-//   color-policy → stressColor, cacheHitColor, providerColor, effortColor
+//   color-policy → stressColor, cacheHitColor, contextUsageTier, providerColor, effortColor
 //   format → fmtTokens, formatDuration, formatModelLabel, formatProviderLabel, formatThinkingLabel, sanitizeStatus, stripAnsi
 //   layout → alignRight, fitSegmentsByPriority, isEditorBorderLine, findBottomBorderIndex, padRight, center, headerColumnWidths + width constants
 //   tip-policy → PI_BUILTIN_SLASH_COMMAND_NAMES, collectPiCommandNames, pickSlashCommandTips
 export { truncateToWidth, visibleWidth, wrapTextWithAnsi } from "@earendil-works/pi-tui";
 export { formatCwd, basenamePath, truncateBranch, truncatePath } from "./path-format.js";
 export { fmtTokens, formatDuration, formatModelLabel, formatProviderLabel, formatThinkingLabel, sanitizeStatus, stripAnsi, } from "./format.js";
-export { stressColor, cacheHitColor, contextUsageColor, providerColor, effortColor, } from "./color-policy.js";
+export { stressColor, cacheHitColor, CONTEXT_TIER_HEX, CONTEXT_TIER_THEME_COLOR, contextUsageTier, providerColor, effortColor, } from "./color-policy.js";
 export { alignRight, fitSegmentsByPriority, isEditorBorderLine, findBottomBorderIndex, padRight, center, headerColumnWidths, MIN_LEFT_WIDTH, MIN_TIPS_WIDTH, MAX_TIPS_WIDTH, } from "./layout.js";
 export { PI_BUILTIN_SLASH_COMMAND_NAMES, collectPiCommandNames, pickSlashCommandTips, } from "./tip-policy.js";

package/package.json

@@ -33,7 +33,7 @@
     "@earendil-works/pi-coding-agent": "*",
     "@earendil-works/pi-tui": "*"
   },
-  "version": "0.12.1",
+  "version": "0.12.3",
   "files": [
     "dist",
     "src",