@mrclrchtr/supi-context 1.16.1 → 2.0.0

package/README.md

@@ -34,7 +34,7 @@ After install, pi gets one user command and an optional agent-callable tool:
 
 The command sends a custom `supi-context` message, and this package registers a dedicated renderer so the report shows up as a structured TUI view instead of plain text.
 
-The `supi_context` tool returns the same analysis as JSON, so the agent can inspect context usage programmatically — useful for checking remaining capacity before large operations or after heavy tool results.
+The `supi_context` tool returns the same analysis as JSON, so the agent can inspect context usage programmatically — useful for checking remaining capacity before large operations or after heavy tool results. In the TUI, the tool renders a compact usage summary by default and expands into the same structured report as `/supi-context`.
 
 ## What the report shows
 
@@ -104,7 +104,9 @@ The tool is disabled by default and requires a `/reload` or restart after toggli
 - `src/format-sections.ts` — instruction file, context file, skill, guideline, tool, compaction, and provider sections
 - `src/prompt-inference.ts` — fallback recovery of context files, skills, and guideline sections from the live system prompt
 - `src/renderer.ts` — custom renderer for `supi-context` messages
+- `src/report-component.ts` — shared width-aware report component for message and tool renderers
 - `src/tool/guidance.ts` — tool description, prompt snippet, and guidelines for the agent tool
+- `src/tool/render.ts` — TUI call/result renderer for the agent tool
 - `src/utils.ts` — token and plural-format helpers
 
 Tests live under `__tests__/unit/`.

package/node_modules/@mrclrchtr/supi-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mrclrchtr/supi-core",
-  "version": "1.16.1",
+  "version": "2.0.0",
   "description": "SuPi core — shared infrastructure for SuPi extensions (XML context tags, config system)",
   "license": "MIT",
   "repository": {
@@ -23,6 +23,7 @@
     "settings",
     "configuration"
   ],
+  "type": "module",
   "files": [
     "src/**/*.ts",
     "!__tests__"
@@ -49,12 +50,14 @@
   },
   "main": "src/api.ts",
   "exports": {
+    "./abort-utils": "./src/abort-utils.ts",
     "./api": "./src/api.ts",
     "./config": "./src/config.ts",
     "./context": "./src/context.ts",
     "./debug": "./src/debug-registry.ts",
     "./footer-registry": "./src/footer-registry.ts",
     "./llm": "./src/llm.ts",
+    "./model-selection": "./src/model-selection.ts",
     "./package.json": "./package.json",
     "./path": "./src/path.ts",
     "./report": "./src/report.ts",
@@ -63,6 +66,8 @@
     "./session": "./src/session.ts",
     "./settings": "./src/settings.ts",
     "./settings-ui": "./src/settings-ui.ts",
+    "./spinner-frames": "./src/spinner-frames.ts",
+    "./status-spinner": "./src/status-spinner.ts",
     "./terminal": "./src/terminal.ts",
     "./tool-framework": "./src/tool-framework.ts",
     "./types": "./src/types.ts"

package/node_modules/@mrclrchtr/supi-core/src/abort-utils.ts

@@ -0,0 +1,31 @@
+/**
+ * Abort controller/signal utility helpers.
+ *
+ * @module
+ */
+
+/**
+ * Combine a caller-provided abort controller with a generation timeout signal.
+ *
+ * Returns the combined signal and a cleanup function that removes both
+ * event listeners. Callers must invoke cleanup in a `finally` block
+ * to avoid listener leaks.
+ */
+export function combineAbortSignals(
+  abort: AbortController,
+  timeoutMs: number,
+): { signal: AbortSignal; cleanup: () => void } {
+  const timeoutSignal = AbortSignal.timeout(timeoutMs);
+  const combinedController = new AbortController();
+  const onAbort = () => combinedController.abort();
+  abort.signal.addEventListener("abort", onAbort, { once: true });
+  timeoutSignal.addEventListener("abort", onAbort, { once: true });
+
+  return {
+    signal: combinedController.signal,
+    cleanup: () => {
+      abort.signal.removeEventListener("abort", onAbort);
+      timeoutSignal.removeEventListener("abort", onAbort);
+    },
+  };
+}

package/node_modules/@mrclrchtr/supi-core/src/api.ts

@@ -6,6 +6,8 @@
 // For lighter imports, use one of the domain subpaths directly
 // (e.g. @mrclrchtr/supi-core/config, @mrclrchtr/supi-core/context).
 
+// biome-ignore lint/performance/noReExportAll: intentional convenience barrel
+export * from "./abort-utils.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./config.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
@@ -17,6 +19,8 @@ export * from "./footer-registry.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./llm.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
+export * from "./model-selection.ts";
+// biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./path.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./project.ts";
@@ -29,6 +33,10 @@ export * from "./settings.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./settings-ui.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
+export * from "./spinner-frames.ts";
+// biome-ignore lint/performance/noReExportAll: intentional convenience barrel
+export * from "./status-spinner.ts";
+// biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./terminal.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./tool-framework.ts";

package/node_modules/@mrclrchtr/supi-core/src/config/config-settings.ts

@@ -5,6 +5,7 @@
 // to enable auto-generated persistChange. When all items have a configType,
 // the persistChange callback can be omitted.
 
+import type { ExtensionContext } from "@earendil-works/pi-coding-agent";
 import type { SettingItem } from "@earendil-works/pi-tui";
 import type { SettingsScope } from "../settings/settings-registry.ts";
 import { registerSettings } from "../settings/settings-registry.ts";
@@ -60,7 +61,12 @@ export interface ConfigSettingsOptions<T> {
    * persistChange handling. When ALL items declare a configType,
    * the `persistChange` callback can be omitted.
    */
-  buildItems: (settings: T, scope: SettingsScope, cwd: string) => ConfigSettingItem[];
+  buildItems: (
+    settings: T,
+    scope: SettingsScope,
+    cwd: string,
+    ctx?: ExtensionContext,
+  ) => ConfigSettingItem[];
   /**
    * Handle a settings change with scoped persistence helpers.
    *
@@ -141,12 +147,12 @@ export function registerConfigSettings<T>(options: ConfigSettingsOptions<T>): vo
   registerSettings({
     id: options.id,
     label: options.label,
-    loadValues: (scope, cwd) => {
+    loadValues: (scope, cwd, ctx) => {
       const settings = loadSupiConfigForScope(options.section, cwd, options.defaults, {
         scope,
         homeDir: options.homeDir,
       });
-      const items = options.buildItems(settings, scope, cwd);
+      const items = options.buildItems(settings, scope, cwd, ctx);
       cachedItems = items;
       return items;
     },
@@ -173,7 +179,7 @@ export function registerConfigSettings<T>(options: ConfigSettingsOptions<T>): vo
       }
 
       // Auto-generate when all items are declarative
-      const items = cachedItems ?? options.buildItems(options.defaults, scope, cwd);
+      const items = cachedItems ?? options.buildItems(options.defaults, scope, cwd, undefined);
       if (areAllItemsDeclarative(items)) {
         autoPersistChange(settingId, value, helpers, items);
       }

package/node_modules/@mrclrchtr/supi-core/src/config.ts

@@ -1,6 +1,7 @@
 // supi-core config domain — config loading and config-settings helpers.
 export type { SupiConfigLocation, SupiConfigOptions } from "./config/config.ts";
 export {
+  loadSectionConfig,
   loadSupiConfig,
   loadSupiConfigForScope,
   readJsonFile,

package/node_modules/@mrclrchtr/supi-core/src/footer-registry.ts

@@ -8,7 +8,7 @@
 import { createRegistry } from "./registry-utils.ts";
 
 /** Where the contribution should appear in the footer. */
-export type FooterPlacement = "stats" | "status";
+export type FooterPlacement = "stats" | "stats-end" | "status";
 
 /** A single footer contribution registered by an extension. */
 export interface FooterContribution {

package/node_modules/@mrclrchtr/supi-core/src/index.ts

@@ -6,6 +6,8 @@
 // For lighter imports, use one of the domain subpaths directly
 // (e.g. @mrclrchtr/supi-core/config, @mrclrchtr/supi-core/context).
 
+// biome-ignore lint/performance/noReExportAll: intentional convenience barrel
+export * from "./abort-utils.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./config.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
@@ -15,6 +17,8 @@ export * from "./debug-registry.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./footer-registry.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
+export * from "./model-selection.ts";
+// biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./path.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./project.ts";
@@ -27,6 +31,8 @@ export * from "./settings.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./settings-ui.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
+export * from "./status-spinner.ts";
+// biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./terminal.ts";
 // biome-ignore lint/performance/noReExportAll: intentional convenience barrel
 export * from "./tool-framework.ts";

package/node_modules/@mrclrchtr/supi-core/src/model-selection.ts

@@ -0,0 +1,134 @@
+/**
+ * Shared model-selection helpers for SuPi extensions.
+ *
+ * Provides scoped-model listing using PI's `enabledModels` configuration,
+ * matching the same semantics as the `@mrclrchtr/supi-review` model picker.
+ *
+ * @module
+ */
+
+import type { Model } from "@earendil-works/pi-ai";
+import { type ExtensionContext, SettingsManager } from "@earendil-works/pi-coding-agent";
+
+// ── Types ──────────────────────────────────────────────────────────────────
+
+/** A selectable model entry with display metadata. */
+export interface ModelSelection {
+  /** Canonical `provider/model-id` string. */
+  canonicalId: string;
+  /** Provider name, e.g. `"anthropic"`. */
+  provider: string;
+  /** Model id, e.g. `"claude-sonnet-4-5"`. */
+  id: string;
+  // biome-ignore lint/suspicious/noExplicitAny: Model<any> is pi's canonical type
+  model: Model<any>;
+  /** Human-readable label (model name or canonicalId). */
+  label: string;
+  /** Optional description (canonicalId when different from label). */
+  description?: string;
+  /** Whether this model is the current session model. */
+  isCurrent: boolean;
+}
+
+// ── Helpers ────────────────────────────────────────────────────────────────
+
+/** Build the canonical `provider/model-id` string. */
+export function toCanonicalModelId(
+  model: Pick<NonNullable<ExtensionContext["model"]>, "provider" | "id">,
+): string {
+  return `${model.provider}/${model.id}`;
+}
+
+/**
+ * List selectable models from PI's scoped model configuration.
+ *
+ * Only models that match the configured `enabledModels` patterns are offered.
+ * The current session model is included only when it is inside that scoped set.
+ * Returns an empty array when no scoped model patterns are configured.
+ */
+export function getSelectableModels(
+  ctx: Pick<ExtensionContext, "cwd" | "modelRegistry" | "model">,
+  enabledModelPatterns = SettingsManager.create(ctx.cwd).getEnabledModels(),
+): ModelSelection[] {
+  if (!enabledModelPatterns || enabledModelPatterns.length === 0) {
+    return [];
+  }
+
+  const byCanonicalId = new Map<string, ModelSelection>();
+  const availableModels = filterByEnabledModels(
+    enabledModelPatterns,
+    ctx.modelRegistry.getAvailable(),
+  );
+
+  const addModel = (
+    // biome-ignore lint/suspicious/noExplicitAny: Model<any> is pi's canonical type
+    model: Model<any>,
+    isCurrent: boolean,
+  ) => {
+    const canonicalId = toCanonicalModelId(model);
+    const existing = byCanonicalId.get(canonicalId);
+    if (existing) {
+      if (isCurrent) existing.isCurrent = true;
+      return;
+    }
+
+    byCanonicalId.set(canonicalId, {
+      canonicalId,
+      provider: model.provider,
+      id: model.id,
+      model,
+      label: model.name ?? canonicalId,
+      description: canonicalId,
+      isCurrent,
+    });
+  };
+
+  if (ctx.model && matchModelPatterns(ctx.model, enabledModelPatterns)) {
+    addModel(ctx.model, true);
+  }
+
+  for (const model of availableModels) {
+    addModel(
+      model,
+      ctx.model ? toCanonicalModelId(model) === toCanonicalModelId(ctx.model) : false,
+    );
+  }
+
+  return Array.from(byCanonicalId.values()).sort((a, b) => {
+    if (a.isCurrent !== b.isCurrent) return a.isCurrent ? -1 : 1;
+    return a.canonicalId.localeCompare(b.canonicalId);
+  });
+}
+
+// ── Private helpers ────────────────────────────────────────────────────────
+
+function filterByEnabledModels<T extends { provider: string; id: string }>(
+  patterns: string[],
+  models: T[],
+): T[] {
+  return models.filter((model) => matchModelPatterns(model, patterns));
+}
+
+function matchModelPatterns(model: { provider: string; id: string }, patterns: string[]): boolean {
+  return patterns.some((pattern) => matchModelPattern(model, pattern));
+}
+
+function matchModelPattern(model: { provider: string; id: string }, pattern: string): boolean {
+  const canonicalId = `${model.provider}/${model.id}`;
+  if (pattern.includes("/")) {
+    return simpleGlobMatch(canonicalId, pattern);
+  }
+  return simpleGlobMatch(model.id, pattern) || simpleGlobMatch(canonicalId, pattern);
+}
+
+function simpleGlobMatch(text: string, pattern: string): boolean {
+  if (!pattern.includes("*") && !pattern.includes("?")) {
+    return text.toLowerCase() === pattern.toLowerCase();
+  }
+
+  const regex = pattern
+    .replace(/[.+^${}()|[\]\\]/g, "\\$&")
+    .replace(/\*/g, ".*")
+    .replace(/\?/g, ".");
+  return new RegExp(`^${regex}$`, "i").test(text);
+}

package/node_modules/@mrclrchtr/supi-core/src/settings/settings-registry.ts

@@ -3,6 +3,7 @@
 // Extensions declare their settings via `registerSettings()` during their
 // factory function. The generic settings UI reads them via `getRegisteredSettings()`.
 
+import type { ExtensionContext } from "@earendil-works/pi-coding-agent";
 import type { SettingItem } from "@earendil-works/pi-tui";
 import { createRegistry } from "../registry-utils.ts";
 
@@ -14,9 +15,15 @@ export interface SettingsSection {
   /** Human-readable label shown in the UI */
   label: string;
   /** Load current SettingItem[] for the given scope */
-  loadValues: (scope: SettingsScope, cwd: string) => SettingItem[];
+  loadValues: (scope: SettingsScope, cwd: string, ctx?: ExtensionContext) => SettingItem[];
   /** Persist a change back to config */
-  persistChange: (scope: SettingsScope, cwd: string, settingId: string, value: string) => void;
+  persistChange: (
+    scope: SettingsScope,
+    cwd: string,
+    settingId: string,
+    value: string,
+    ctx?: ExtensionContext,
+  ) => void;
 }
 
 const registry = createRegistry<SettingsSection>("settings-registry");

package/node_modules/@mrclrchtr/supi-core/src/settings/settings-ui.ts

@@ -10,10 +10,14 @@ import {
   Input,
   Key,
   matchesKey,
+  type SelectItem,
+  SelectList,
+  type SelectListTheme,
   type SettingItem,
   SettingsList,
   Text,
 } from "@earendil-works/pi-tui";
+import { getSelectableModels } from "../model-selection.ts";
 import {
   getRegisteredSettings,
   type SettingsScope,
@@ -84,10 +88,11 @@ function buildFlatItems(
   sections: SettingsSection[],
   scope: SettingsScope,
   cwd: string,
+  ctx?: ExtensionContext,
 ): SettingItem[] {
   const items: SettingItem[] = [];
   for (const section of sections) {
-    const sectionItems = section.loadValues(scope, cwd);
+    const sectionItems = section.loadValues(scope, cwd, ctx);
     for (const item of sectionItems) {
       items.push({
         ...item,
@@ -115,6 +120,7 @@ function findSectionAndId(
 // ── Component ────────────────────────────────────────────────
 
 interface SettingsOverlayDeps {
+  ctx: ExtensionContext;
   state: OverlayState;
   container: Container;
   settingsList: SettingsList | null;
@@ -125,15 +131,21 @@ interface SettingsOverlayDeps {
 
 function createSettingsList(deps: SettingsOverlayDeps): SettingsList {
   const sections = getRegisteredSettings();
-  const items = buildFlatItems(sections, deps.state.scope, deps.state.cwd);
+  const items = buildFlatItems(sections, deps.state.scope, deps.state.cwd, deps.ctx);
   const onChange = (flatId: string, newValue: string) => {
     const found = findSectionAndId(sections, flatId);
     if (found) {
-      found.section.persistChange(deps.state.scope, deps.state.cwd, found.itemId, newValue);
+      found.section.persistChange(
+        deps.state.scope,
+        deps.state.cwd,
+        found.itemId,
+        newValue,
+        deps.ctx,
+      );
     }
     // Re-read all values to reflect persisted changes, but keep the list
     // instance (and its selectedIndex) intact.
-    const updatedItems = buildFlatItems(sections, deps.state.scope, deps.state.cwd);
+    const updatedItems = buildFlatItems(sections, deps.state.scope, deps.state.cwd, deps.ctx);
     for (const updated of updatedItems) {
       const existing = items.find((i) => i.id === updated.id);
       if (existing && existing.currentValue !== updated.currentValue) {
@@ -182,6 +194,98 @@ function handleScopeToggle(deps: SettingsOverlayDeps): void {
   deps.tui.requestRender();
 }
 
+/** Minimal SelectList theme — uses identity so the parent SettingsList provides styling context. */
+const PASSTHROUGH_THEME: SelectListTheme = {
+  selectedPrefix: (text) => `› ${text}`,
+  selectedText: (text) => text,
+  description: (text) => text,
+  scrollInfo: (text) => text,
+  noMatch: (text) => text,
+};
+
+/**
+ * Create a model picker submenu for settings.
+ *
+ * Shows a scrollable list of selectable models from the scoped model set,
+ * with the current session model annotated `[current]`.  The first entry is
+ * always `"disabled"`.
+ *
+ * @param currentValue - Currently configured canonical model id or `"disabled"`.
+ * @param done - Callback invoked with the selected value, or undefined on cancel.
+ * @param ctx - Extension context for model listing.  When undefined, only
+ *   `"disabled"` is offered.
+ */
+export function createModelPickerSubmenu(
+  currentValue: string,
+  done: (selectedValue?: string) => void,
+  ctx?: ExtensionContext,
+): {
+  render: (width: number) => string[];
+  invalidate: () => void;
+  handleInput: (data: string) => boolean;
+} {
+  const items = buildModelItems(ctx);
+
+  const initialIndex =
+    currentValue === "disabled"
+      ? 0
+      : Math.max(
+          0,
+          items.findIndex((item) => item.value === currentValue),
+        );
+
+  const container = new Container();
+  container.addChild(new Text("  Select suggestion model", 1, 0));
+  container.addChild(new Text("", 1, 0));
+
+  const selectList = new SelectList(items, Math.min(items.length, 15), PASSTHROUGH_THEME);
+
+  if (initialIndex >= 0) {
+    selectList.setSelectedIndex(initialIndex);
+  }
+
+  selectList.onSelect = (item) => done(item.value);
+  selectList.onCancel = () => done();
+
+  container.addChild(selectList);
+  container.addChild(new Text("  ↑↓ navigate • enter select • esc cancel", 1, 0));
+
+  return {
+    render: (width: number) => container.render(width),
+    invalidate: () => container.invalidate(),
+    handleInput: (data: string) => {
+      selectList.handleInput(data);
+      return true;
+    },
+  };
+}
+
+/** Build selectable model items with "disabled" first. */
+function buildModelItems(ctx?: ExtensionContext): SelectItem[] {
+  const items: SelectItem[] = [
+    {
+      value: "disabled",
+      label: "disabled",
+      description: "No prompt suggestions",
+    },
+  ];
+
+  if (!ctx) return items;
+
+  const models = getSelectableModels(ctx);
+
+  for (const model of models) {
+    const suffix = model.isCurrent ? "  [current]" : "";
+    items.push({
+      value: model.canonicalId,
+      label: `${model.canonicalId}${suffix}`,
+      description: model.label !== model.canonicalId ? model.label : undefined,
+    });
+  }
+
+  return items;
+}
+
 // ── Entry point ──────────────────────────────────────────────
 
 export function openSettingsOverlay(ctx: ExtensionContext): void {
@@ -196,6 +300,7 @@ export function openSettingsOverlay(ctx: ExtensionContext): void {
     const container = new Container();
 
     const deps: SettingsOverlayDeps = {
+      ctx,
       state,
       container,
       settingsList: null,

package/node_modules/@mrclrchtr/supi-core/src/settings-ui.ts

@@ -1,2 +1,6 @@
 // supi-core settings-ui domain — settings TUI components (imports pi-tui at runtime, heavy).
-export { createInputSubmenu, openSettingsOverlay } from "./settings/settings-ui.ts";
+export {
+  createInputSubmenu,
+  createModelPickerSubmenu,
+  openSettingsOverlay,
+} from "./settings/settings-ui.ts";

package/node_modules/@mrclrchtr/supi-core/src/spinner-frames.ts

@@ -0,0 +1,11 @@
+/**
+ * Shared UI constants for SuPi extensions.
+ *
+ * @module
+ */
+
+/** Braille spinner frames used across SuPi extensions for animated loaders. */
+export const BRAILLE_SPINNER_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+
+/** Tick interval (ms) shared by all braille-spinner consumers. */
+export const SPINNER_INTERVAL_MS = 80;

package/node_modules/@mrclrchtr/supi-core/src/status-spinner.ts

@@ -0,0 +1,68 @@
+/**
+ * Lightweight status-bar spinner for SuPi extensions.
+ *
+ * Manages a setInterval-based animated spinner that writes to
+ * `ctx.ui.setStatus`.  Each tick advances the frame and re-renders
+ * with the current message.
+ *
+ * @module
+ */
+
+import type { ExtensionContext } from "@earendil-works/pi-coding-agent";
+import { BRAILLE_SPINNER_FRAMES, SPINNER_INTERVAL_MS } from "./spinner-frames.ts";
+
+/**
+ * Manages an animated braille spinner on the status bar.
+ *
+ * Usage:
+ * ```ts
+ * const spinner = new StatusSpinner(ctx, "my-package");
+ * spinner.start("generating…");
+ * // later
+ * spinner.stop();
+ * ```
+ */
+export class StatusSpinner {
+  private interval: ReturnType<typeof setInterval> | null = null;
+  private frame = 0;
+  private currentMessage = "";
+
+  constructor(
+    private ctx: ExtensionContext,
+    private source: string,
+    private frames: readonly string[] = BRAILLE_SPINNER_FRAMES,
+  ) {}
+
+  /** Start the spinner with the given message. Overwrites any active spinner. */
+  start(message: string): void {
+    this.stop();
+    this.currentMessage = message;
+    this.render();
+
+    this.interval = setInterval(() => {
+      this.frame++;
+      this.render();
+    }, SPINNER_INTERVAL_MS);
+  }
+
+  /** Update the display message without resetting the spinner. */
+  update(message: string): void {
+    this.currentMessage = message;
+  }
+
+  /** Stop the spinner and clear the status. */
+  stop(): void {
+    if (this.interval !== null) {
+      clearInterval(this.interval);
+      this.interval = null;
+    }
+    this.ctx.ui.setStatus(this.source, "");
+  }
+
+  // ── Private ──────────────────────────────────────────────────────────
+
+  private render(): void {
+    const icon = this.frames[this.frame % this.frames.length];
+    this.ctx.ui.setStatus(this.source, `${icon} ${this.currentMessage}`);
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mrclrchtr/supi-context",
-  "version": "1.16.1",
+  "version": "2.0.0",
   "description": "SuPi Context extension — detailed context usage report via /supi-context command",
   "license": "MIT",
   "repository": {
@@ -25,13 +25,14 @@
     "usage-report",
     "diagnostics"
   ],
+  "type": "module",
   "files": [
     "src/**/*.ts",
     "README.md"
   ],
   "dependencies": {
     "typebox": "*",
-    "@mrclrchtr/supi-core": "1.16.1"
+    "@mrclrchtr/supi-core": "2.0.0"
   },
   "bundledDependencies": [
     "@mrclrchtr/supi-core"

package/src/context.ts

@@ -5,6 +5,11 @@ import { loadContextConfig } from "./config.ts";
 import { registerContextRenderer } from "./renderer.ts";
 import { registerContextSettings } from "./settings-registration.ts";
 import { promptGuidelines, promptSnippet, toolDescription } from "./tool/guidance.ts";
+import {
+  type ContextToolDetails,
+  renderContextToolCall,
+  renderContextToolResult,
+} from "./tool/render.ts";
 import { formatTokens } from "./utils.ts";
 
 export default function contextExtension(pi: ExtensionAPI) {
@@ -49,12 +54,14 @@ export default function contextExtension(pi: ExtensionAPI) {
       promptSnippet,
       parameters: Type.Object({}),
       promptGuidelines,
+      renderCall: renderContextToolCall,
+      renderResult: renderContextToolResult,
       // biome-ignore lint/complexity/useMaxParams: pi tool execute signature
       async execute(_toolCallId, _params, _signal, _onUpdate, ctx) {
         const analysis = analyzeContext(ctx, pi, cachedOptions, true);
         return {
           content: [{ type: "text", text: JSON.stringify(analysis, null, 2) }],
-          details: undefined,
+          details: { analysis } satisfies ContextToolDetails,
         };
       },
     });

package/src/renderer.ts

@@ -1,35 +1,7 @@
 import type { ExtensionAPI } from "@earendil-works/pi-coding-agent";
 import { Text } from "@earendil-works/pi-tui";
 import type { ContextAnalysis } from "./analysis.ts";
-import { formatContextReport } from "./format.ts";
-
-type Theme = Parameters<Parameters<ExtensionAPI["registerMessageRenderer"]>[1]>[2];
-
-class ContextReportComponent {
-  private cachedWidth?: number;
-  private cachedLines?: string[];
-
-  constructor(
-    private readonly analysis: ContextAnalysis,
-    private readonly theme: Theme,
-  ) {}
-
-  render(width: number): string[] {
-    if (this.cachedLines && this.cachedWidth === width) {
-      return this.cachedLines;
-    }
-
-    const lines = formatContextReport(this.analysis, this.theme, width);
-    this.cachedWidth = width;
-    this.cachedLines = lines;
-    return lines;
-  }
-
-  invalidate(): void {
-    this.cachedWidth = undefined;
-    this.cachedLines = undefined;
-  }
-}
+import { ContextReportComponent } from "./report-component.ts";
 
 export function registerContextRenderer(pi: ExtensionAPI): void {
   pi.registerMessageRenderer("supi-context", (message, _renderOptions, theme) => {

package/src/report-component.ts

@@ -0,0 +1,30 @@
+import type { Theme } from "@earendil-works/pi-coding-agent";
+import type { ContextAnalysis } from "./analysis.ts";
+import { formatContextReport } from "./format.ts";
+
+/** Width-aware rendered context report shared by message and tool renderers. */
+export class ContextReportComponent {
+  private cachedWidth?: number;
+  private cachedLines?: string[];
+
+  constructor(
+    private readonly analysis: ContextAnalysis,
+    private readonly theme: Theme,
+  ) {}
+
+  render(width: number): string[] {
+    if (this.cachedLines && this.cachedWidth === width) {
+      return this.cachedLines;
+    }
+
+    const lines = formatContextReport(this.analysis, this.theme, width);
+    this.cachedWidth = width;
+    this.cachedLines = lines;
+    return lines;
+  }
+
+  invalidate(): void {
+    this.cachedWidth = undefined;
+    this.cachedLines = undefined;
+  }
+}

package/src/tool/render.ts

@@ -0,0 +1,90 @@
+import type { Theme } from "@earendil-works/pi-coding-agent";
+import { Text } from "@earendil-works/pi-tui";
+import type { ContextAnalysis } from "../analysis.ts";
+import { healthColor, pct } from "../format-helpers.ts";
+import { ContextReportComponent } from "../report-component.ts";
+import { formatTokens, pluralize } from "../utils.ts";
+
+export interface ContextToolDetails {
+  analysis: ContextAnalysis;
+}
+
+interface ContextToolResult {
+  content: Array<{ type: string; text?: string }>;
+  details?: unknown;
+  isError?: boolean;
+}
+
+interface ResultOptions {
+  expanded: boolean;
+  isPartial: boolean;
+}
+
+export function renderContextToolCall(_args: unknown, theme: Theme): Text {
+  const content = `${theme.fg("toolTitle", "supi_context")} ${theme.fg("muted", "current session")}`;
+  return new Text(content, 0, 0);
+}
+
+export function renderContextToolResult(
+  result: ContextToolResult | undefined,
+  options: ResultOptions,
+  theme: Theme,
+): Text | ContextReportComponent {
+  if (options.isPartial) {
+    return new Text(theme.fg("warning", "Analyzing context…"), 0, 0);
+  }
+
+  if (result?.isError) {
+    return new Text(theme.fg("error", "supi_context failed"), 0, 0);
+  }
+
+  const analysis = extractAnalysis(result?.details);
+  if (!analysis) {
+    return new Text(theme.fg("dim", "No context analysis data"), 0, 0);
+  }
+
+  if (options.expanded) {
+    return new ContextReportComponent(analysis, theme);
+  }
+
+  return new Text(formatCollapsedSummary(analysis, theme), 0, 0);
+}
+
+function extractAnalysis(details: unknown): ContextAnalysis | undefined {
+  if (!details || typeof details !== "object" || !("analysis" in details)) {
+    return undefined;
+  }
+  return (details as ContextToolDetails).analysis;
+}
+
+function formatCollapsedSummary(analysis: ContextAnalysis, theme: Theme): string {
+  const used = analysis.totalTokens ?? 0;
+  const usage =
+    analysis.contextWindow > 0
+      ? `${formatTokens(used)} / ${formatTokens(analysis.contextWindow)} (${pct(used, analysis.contextWindow)})`
+      : `${formatTokens(used)} tokens`;
+  const dot = theme.fg("dim", "·");
+  const parts = [
+    `${theme.fg(healthColor(analysis), "●")} ${theme.fg("dim", "usage")} ${theme.fg("text", theme.bold(usage))}`,
+  ];
+
+  if (analysis.contextWindow > 0) {
+    parts.push(
+      `${theme.fg("dim", "free")} ${theme.fg("muted", formatTokens(analysis.categories.freeSpace))}`,
+    );
+  }
+
+  if (analysis.compaction) {
+    parts.push(
+      `${theme.fg("dim", "compacted")} ${theme.fg("muted", pluralize(analysis.compaction.summarizedTurns, "turn", "turns"))}`,
+    );
+  }
+
+  parts.push(`${theme.fg("dim", "model")} ${theme.fg("muted", analysis.modelName)}`);
+
+  if (!analysis.approximationNote) {
+    return parts.join(` ${dot} `);
+  }
+
+  return `${parts.join(` ${dot} `)}\n${theme.fg("warning", analysis.approximationNote)}`;
+}