@dropalltables/yacu 0.1.0

package/dist/yacu.js

@@ -0,0 +1,1782 @@
+#!/usr/bin/env bun
+// @bun
+
+// src/index.tsx
+import { createCliRenderer, RGBA as RGBA2 } from "@opentui/core";
+import { createRoot } from "@opentui/react";
+
+// src/tui/App.tsx
+import { useEffect as useEffect2, useMemo as useMemo2, useState as useState7 } from "react";
+import { useKeyboard, useRenderer as useRenderer2, useTerminalDimensions } from "@opentui/react";
+
+// src/domain/dates.ts
+function localDate(value) {
+  const date = value instanceof Date ? value : new Date(value);
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  return `${year}-${month}-${day}`;
+}
+function dateDaysAgo(daysAgo) {
+  const date = new Date;
+  date.setHours(0, 0, 0, 0);
+  date.setDate(date.getDate() - daysAgo);
+  return localDate(date);
+}
+function datesInRange(days) {
+  return Array.from({ length: days }, (_, index) => dateDaysAgo(days - index - 1));
+}
+function shortDate(value) {
+  return new Intl.DateTimeFormat("en-US", { month: "short", day: "numeric" }).format(new Date(`${value}T12:00:00`));
+}
+
+// src/domain/types.ts
+var SOURCE_META = {
+  claude: { id: "claude", label: "Claude Code", mark: "*" },
+  codex: { id: "codex", label: "Codex", mark: "o" },
+  cursor: { id: "cursor", label: "Cursor", mark: ">" },
+  gemini: { id: "gemini", label: "Gemini CLI", mark: "g" },
+  grok: { id: "grok", label: "Grok Build", mark: "x" },
+  opencode: { id: "opencode", label: "OpenCode", mark: "+" }
+};
+var SOURCE_ORDER = ["codex", "claude", "cursor", "gemini", "grok", "opencode"];
+
+// src/domain/aggregate.ts
+function emptyTotals() {
+  return {
+    inputTokens: 0,
+    outputTokens: 0,
+    cacheCreationTokens: 0,
+    cacheReadTokens: 0,
+    processedTokens: 0,
+    costUsd: 0,
+    cacheSavingsUsd: 0
+  };
+}
+function addRecord(target, record) {
+  target.inputTokens += record.inputTokens;
+  target.outputTokens += record.outputTokens;
+  target.cacheCreationTokens += record.cacheCreationTokens;
+  target.cacheReadTokens += record.cacheReadTokens;
+  target.processedTokens += record.inputTokens + record.outputTokens + record.cacheCreationTokens + record.cacheReadTokens;
+  target.costUsd += record.costUsd;
+  target.cacheSavingsUsd += record.cacheSavingsUsd;
+}
+function metricValue(totals, metric) {
+  return metric === "cost" ? totals.costUsd : totals.processedTokens;
+}
+function buildDashboard(dataset, range, metric) {
+  const days = datesInRange(range);
+  const dateSet = new Set(days);
+  const records = dataset.records.filter((record) => dateSet.has(record.date));
+  const sessions = dataset.sessions.filter((session) => dateSet.has(session.date));
+  const totals = emptyTotals();
+  for (const record of records)
+    addRecord(totals, record);
+  const providerMap = new Map;
+  const providerSessions = new Map;
+  for (const record of records) {
+    const aggregate = providerMap.get(record.source) ?? emptyTotals();
+    addRecord(aggregate, record);
+    providerMap.set(record.source, aggregate);
+  }
+  for (const session of sessions) {
+    const ids = providerSessions.get(session.source) ?? new Set;
+    ids.add(session.id);
+    providerSessions.set(session.source, ids);
+  }
+  const metricTotal = metricValue(totals, metric);
+  const providers = SOURCE_ORDER.filter((source) => providerMap.has(source)).map((source) => {
+    const values = providerMap.get(source) ?? emptyTotals();
+    return {
+      ...values,
+      source,
+      sessions: providerSessions.get(source)?.size ?? 0,
+      share: metricTotal > 0 ? metricValue(values, metric) / metricTotal : 0
+    };
+  });
+  const modelMap = new Map;
+  for (const record of records) {
+    const key = `${record.source}\x00${record.model}`;
+    const row = modelMap.get(key) ?? {
+      ...emptyTotals(),
+      key,
+      label: record.model,
+      source: record.source,
+      share: 0
+    };
+    addRecord(row, record);
+    modelMap.set(key, row);
+  }
+  const models = [...modelMap.values()].map((row) => ({ ...row, share: metricTotal > 0 ? metricValue(row, metric) / metricTotal : 0 })).sort((a, b) => metricValue(b, metric) - metricValue(a, metric));
+  const dailyMap = new Map;
+  for (const day of days) {
+    dailyMap.set(day, { ...emptyTotals(), key: day, label: day, share: 0 });
+  }
+  for (const record of records)
+    addRecord(dailyMap.get(record.date), record);
+  const daily = [...dailyMap.values()].map((row) => ({ ...row, share: metricTotal > 0 ? metricValue(row, metric) / metricTotal : 0 })).sort((a, b) => metricValue(b, metric) - metricValue(a, metric));
+  const series = Object.fromEntries(SOURCE_ORDER.map((source) => {
+    const values = days.map((day) => {
+      const dayTotals = emptyTotals();
+      for (const record of records) {
+        if (record.source === source && record.date === day)
+          addRecord(dayTotals, record);
+      }
+      return metricValue(dayTotals, metric);
+    });
+    return [source, values];
+  }));
+  return { days, records, totals, sessions: new Set(sessions.map((session) => session.id)).size, providers, models, daily, series };
+}
+
+// src/data/sources/claude.ts
+import { homedir } from "os";
+import { join, resolve } from "path";
+
+// src/data/pricing.ts
+import {
+  estimateUsdCost,
+  normalizeTokenUsage,
+  pricingFromUsdPerMillion
+} from "tokentally";
+var PRICING = [
+  [/claude.*opus/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 5, outputUsdPerMillion: 25, cachedInputUsdPerMillion: 0.5, cacheCreationInputUsdPerMillion: 6.25 })],
+  [/claude.*sonnet/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 3, outputUsdPerMillion: 15, cachedInputUsdPerMillion: 0.3, cacheCreationInputUsdPerMillion: 3.75 })],
+  [/claude.*haiku/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 1, outputUsdPerMillion: 5, cachedInputUsdPerMillion: 0.1, cacheCreationInputUsdPerMillion: 1.25 })],
+  [/(^|\/)gpt-5|codex/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 1.75, outputUsdPerMillion: 14, cachedInputUsdPerMillion: 0.175 })],
+  [/grok|composer/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 2, outputUsdPerMillion: 10, cachedInputUsdPerMillion: 0.2 })],
+  [/deepseek/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 0.27, outputUsdPerMillion: 1.1, cachedInputUsdPerMillion: 0.07 })],
+  [/gemini-3\.1-pro/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 2, outputUsdPerMillion: 12, cachedInputUsdPerMillion: 0.2 })],
+  [/gemini-2\.5-pro/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 1.25, outputUsdPerMillion: 10, cachedInputUsdPerMillion: 0.125 })],
+  [/gemini-3\.[67]-flash/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 0.75, outputUsdPerMillion: 3.75, cachedInputUsdPerMillion: 0.075 })],
+  [/gemini-3\.5-flash/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 1.5, outputUsdPerMillion: 9, cachedInputUsdPerMillion: 0.15 })],
+  [/gemini-3\.1-flash-lite/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 0.25, outputUsdPerMillion: 1.5, cachedInputUsdPerMillion: 0.025 })],
+  [/gemini.*flash/i, pricingFromUsdPerMillion({ inputUsdPerMillion: 0.3, outputUsdPerMillion: 2.5, cachedInputUsdPerMillion: 0.03 })]
+];
+function resolvePricing(model) {
+  return PRICING.find(([pattern]) => pattern.test(model))?.[1] ?? null;
+}
+function estimateCost(model, tokens) {
+  const usage = normalizeTokenUsage({
+    inputTokens: tokens.inputTokens,
+    outputTokens: tokens.outputTokens,
+    cachedInputTokens: tokens.cacheReadTokens,
+    cacheCreationInputTokens: tokens.cacheCreationTokens
+  });
+  return estimateUsdCost({ usage, pricing: resolvePricing(model) })?.totalUsd ?? 0;
+}
+function estimateCacheSavings(model, cachedReadTokens) {
+  const pricing = resolvePricing(model);
+  if (pricing == null)
+    return 0;
+  const cachedRate = pricing.cachedInputUsdPerToken ?? pricing.inputUsdPerToken;
+  return Math.max(0, cachedReadTokens * (pricing.inputUsdPerToken - cachedRate));
+}
+
+// src/data/jsonl.ts
+import { stat } from "fs/promises";
+async function forEachJsonLine(path, callback) {
+  const reader = Bun.file(path).stream().getReader();
+  const decoder = new TextDecoder;
+  let pending = "";
+  while (true) {
+    const { done, value } = await reader.read();
+    if (done)
+      break;
+    pending += decoder.decode(value, { stream: true });
+    const lines = pending.split(`
+`);
+    pending = lines.pop() ?? "";
+    for (const line of lines)
+      await parseLine(line, callback);
+  }
+  pending += decoder.decode();
+  await parseLine(pending, callback);
+}
+async function parseLine(line, callback) {
+  if (line.trim() === "")
+    return;
+  try {
+    await callback(JSON.parse(line));
+  } catch {
+    return;
+  }
+}
+async function globFiles(root, pattern, options = {}) {
+  if (!await Bun.file(root).exists() && !await isDirectory(root))
+    return [];
+  const files = [];
+  const glob = new Bun.Glob(pattern);
+  for await (const file of glob.scan({
+    cwd: root,
+    absolute: true,
+    onlyFiles: options.includeSymlinks !== true
+  }))
+    files.push(file);
+  if (options.includeSymlinks === true) {
+    const existingFiles = await Promise.all(files.map(async (file) => {
+      try {
+        return (await stat(file)).isFile() ? file : null;
+      } catch {
+        return null;
+      }
+    }));
+    return existingFiles.filter((file) => file != null).sort();
+  }
+  return files.sort();
+}
+async function isDirectory(path) {
+  try {
+    return (await stat(path)).isDirectory();
+  } catch {
+    return false;
+  }
+}
+function asObject(value) {
+  return typeof value === "object" && value != null && !Array.isArray(value) ? value : null;
+}
+function numberValue(value) {
+  return typeof value === "number" && Number.isFinite(value) ? value : 0;
+}
+function stringValue(value) {
+  return typeof value === "string" && value !== "" ? value : null;
+}
+
+// src/data/sources/claude.ts
+async function loadClaudeUsage() {
+  const files = [...new Set((await Promise.all(claudeRoots().map((root) => globFiles(join(root, "projects"), "**/*.jsonl", { includeSymlinks: true })))).flat())];
+  const records = [];
+  const sessions = new Map;
+  const processed = new Set;
+  for (const path of files) {
+    await forEachJsonLine(path, (value) => {
+      const entry = parseClaudeUsageEntry(value);
+      if (entry == null)
+        return;
+      const uniqueId = entry.messageId != null && entry.requestId != null ? `${entry.messageId}:${entry.requestId}` : null;
+      if (uniqueId != null && processed.has(uniqueId))
+        return;
+      if (uniqueId != null)
+        processed.add(uniqueId);
+      const date = localDate(entry.timestamp);
+      const sessionId = entry.sessionId == null ? undefined : `claude:${entry.sessionId}`;
+      const tokens = {
+        inputTokens: entry.inputTokens,
+        outputTokens: entry.outputTokens,
+        cacheCreationTokens: entry.cacheCreationTokens,
+        cacheReadTokens: entry.cacheReadTokens
+      };
+      if (sumTokens(tokens) === 0 || entry.model === "<synthetic>")
+        return;
+      records.push({
+        date,
+        source: "claude",
+        model: entry.model,
+        sessionId,
+        ...tokens,
+        costUsd: estimateCost(entry.model, tokens),
+        cacheSavingsUsd: estimateCacheSavings(entry.model, entry.cacheReadTokens)
+      });
+      if (sessionId != null) {
+        const existing = sessions.get(sessionId);
+        if (existing == null || existing.date < date) {
+          sessions.set(sessionId, { id: sessionId, source: "claude", date });
+        }
+      }
+    });
+  }
+  return { records, sessions: [...sessions.values()], files: files.length };
+}
+function parseClaudeUsageEntry(value) {
+  const row = asObject(value);
+  const message = asObject(row?.message);
+  const usage = asObject(message?.usage);
+  const timestamp = stringValue(row?.timestamp);
+  const inputTokens = finiteNumber(usage?.input_tokens);
+  const outputTokens = finiteNumber(usage?.output_tokens);
+  if (timestamp == null || Number.isNaN(new Date(timestamp).getTime()) || inputTokens == null || outputTokens == null)
+    return null;
+  return {
+    timestamp,
+    sessionId: stringValue(row?.sessionId),
+    model: stringValue(message?.model) ?? "unknown",
+    messageId: stringValue(message?.id),
+    requestId: stringValue(row?.requestId),
+    inputTokens,
+    outputTokens,
+    cacheCreationTokens: numberValue(usage?.cache_creation_input_tokens),
+    cacheReadTokens: numberValue(usage?.cache_read_input_tokens)
+  };
+}
+function claudeRoots() {
+  const configured = process.env.CLAUDE_CONFIG_DIR?.trim();
+  if (configured != null && configured !== "") {
+    return [...new Set(configured.split(",").map((path) => resolve(path.trim())).filter(Boolean))];
+  }
+  return [join(homedir(), ".config", "claude"), join(homedir(), ".claude")];
+}
+function finiteNumber(value) {
+  return typeof value === "number" && Number.isFinite(value) ? value : null;
+}
+function sumTokens(tokens) {
+  return tokens.inputTokens + tokens.outputTokens + tokens.cacheCreationTokens + tokens.cacheReadTokens;
+}
+
+// src/data/sources/codex.ts
+import { homedir as homedir2 } from "os";
+import { join as join2 } from "path";
+async function loadCodexUsage() {
+  const root = join2(process.env.CODEX_HOME ?? join2(homedir2(), ".codex"), "sessions");
+  const files = await globFiles(root, "**/*.jsonl");
+  const records = [];
+  const sessions = new Map;
+  for (const path of files) {
+    let sessionId = path;
+    let model = "codex";
+    let skipSession = false;
+    let previousTotal = "";
+    await forEachJsonLine(path, (unknownValue) => {
+      const value = asObject(unknownValue);
+      const payload = asObject(value?.payload);
+      const type = stringValue(value?.type);
+      if (type === "session_meta") {
+        sessionId = stringValue(payload?.id) ?? sessionId;
+        const timestamp2 = stringValue(payload?.timestamp) ?? stringValue(value?.timestamp);
+        const threadSource = payload?.thread_source;
+        skipSession = typeof threadSource !== "string" && JSON.stringify(threadSource).toLowerCase().includes("sub");
+        previousTotal = "";
+        if (timestamp2 != null && !skipSession) {
+          sessions.set(sessionId, { id: `codex:${sessionId}`, source: "codex", date: localDate(timestamp2) });
+        }
+        return;
+      }
+      if (type === "turn_context") {
+        model = stringValue(payload?.model) ?? model;
+        return;
+      }
+      if (skipSession || type !== "event_msg" || payload?.type !== "token_count")
+        return;
+      const info = asObject(payload.info);
+      const last = asObject(info?.last_token_usage);
+      const total = asObject(info?.total_token_usage);
+      if (last == null)
+        return;
+      const signature = JSON.stringify(total);
+      if (signature === previousTotal)
+        return;
+      previousTotal = signature;
+      const cached = numberValue(last.cached_input_tokens);
+      const rawInput = numberValue(last.input_tokens);
+      const input = Math.max(0, rawInput - cached);
+      const output = numberValue(last.output_tokens);
+      if (input + cached + output === 0)
+        return;
+      const timestamp = stringValue(value?.timestamp) ?? new Date().toISOString();
+      const tokens = { inputTokens: input, outputTokens: output, cacheCreationTokens: 0, cacheReadTokens: cached };
+      records.push({
+        date: localDate(timestamp),
+        source: "codex",
+        model,
+        sessionId: `codex:${sessionId}`,
+        ...tokens,
+        costUsd: estimateCost(model, tokens),
+        cacheSavingsUsd: estimateCacheSavings(model, cached)
+      });
+    });
+  }
+  return { records, sessions: [...sessions.values()], files: files.length };
+}
+
+// src/data/sources/cursor.ts
+import { stat as stat2 } from "fs/promises";
+import { homedir as homedir3 } from "os";
+import { basename, dirname, join as join3 } from "path";
+import { countTokens } from "gpt-tokenizer/encoding/o200k_base";
+async function loadCursorUsage() {
+  const root = process.env.CURSOR_CONFIG_DIR ?? join3(homedir3(), ".cursor");
+  const files = await globFiles(join3(root, "projects"), "**/agent-transcripts/**/*.jsonl");
+  const fallbackModel = await readConfiguredModel(join3(root, "cli-config.json"));
+  const records = [];
+  const sessions = [];
+  for (const path of files) {
+    const counts = { inputTokens: 0, outputTokens: 0 };
+    let model = fallbackModel;
+    await forEachJsonLine(path, (unknownValue) => {
+      const value = asObject(unknownValue);
+      const message = asObject(value?.message) ?? value;
+      const role = stringValue(value?.role) ?? stringValue(message?.role);
+      model = stringValue(value?.model) ?? stringValue(message?.model) ?? model;
+      const tokens2 = countContent(message?.content);
+      if (role === "user")
+        counts.inputTokens += tokens2;
+      if (role === "assistant")
+        counts.outputTokens += tokens2;
+    });
+    if (counts.inputTokens + counts.outputTokens === 0)
+      continue;
+    const timestamp = (await stat2(path)).mtime;
+    const date = localDate(timestamp);
+    const rawSessionId = basename(dirname(path));
+    const sessionId = `cursor:${rawSessionId}`;
+    const tokens = { ...counts, cacheCreationTokens: 0, cacheReadTokens: 0 };
+    records.push({
+      date,
+      source: "cursor",
+      model,
+      sessionId,
+      ...tokens,
+      costUsd: estimateCost(model, tokens),
+      cacheSavingsUsd: 0
+    });
+    sessions.push({ id: sessionId, source: "cursor", date });
+  }
+  return { records, sessions, files: files.length };
+}
+function countContent(value) {
+  if (typeof value === "string")
+    return countTokens(value);
+  if (!Array.isArray(value))
+    return 0;
+  return value.reduce((total, item) => {
+    const part = asObject(item);
+    if (part == null)
+      return total;
+    const text = stringValue(part.text);
+    if (text != null)
+      return total + countTokens(text);
+    if (part.type === "tool_use")
+      return total + countTokens(JSON.stringify({ name: part.name, input: part.input }));
+    return total;
+  }, 0);
+}
+async function readConfiguredModel(path) {
+  try {
+    const config = asObject(await Bun.file(path).json());
+    const model = asObject(config?.model);
+    const selected = asObject(config?.selectedModel);
+    return stringValue(model?.modelId) ?? stringValue(model?.id) ?? stringValue(selected?.modelId) ?? stringValue(selected?.id) ?? "cursor-agent";
+  } catch {
+    return "cursor-agent";
+  }
+}
+
+// src/data/sources/gemini.ts
+import { homedir as homedir4 } from "os";
+import { basename as basename2, join as join4 } from "path";
+async function loadGeminiUsage() {
+  const root = process.env.GEMINI_HOME ?? join4(homedir4(), ".gemini");
+  const files = [
+    ...await globFiles(join4(root, "tmp"), "**/chats/*.json"),
+    ...await globFiles(join4(root, "tmp"), "**/chats/*.jsonl")
+  ];
+  const records = [];
+  const sessions = new Map;
+  for (const path of files) {
+    let parsed = null;
+    try {
+      parsed = parseGeminiConversation(await Bun.file(path).text(), basename2(path));
+    } catch {
+      continue;
+    }
+    if (parsed == null)
+      continue;
+    const sessionId = `gemini:${parsed.sessionId}`;
+    for (const message of parsed.messages) {
+      if (message.type !== "gemini")
+        continue;
+      const usage = asObject(message.tokens) ?? asObject(message.usageMetadata);
+      if (usage == null)
+        continue;
+      const cached = numberValue(usage.cached) || numberValue(usage.cachedContentTokenCount);
+      const prompt = numberValue(usage.input) || numberValue(usage.promptTokenCount);
+      const candidates = numberValue(usage.output) || numberValue(usage.candidatesTokenCount);
+      const thoughts = numberValue(usage.thoughts) || numberValue(usage.thoughtsTokenCount);
+      const tool = numberValue(usage.tool) || numberValue(usage.toolUsePromptTokenCount);
+      const tokens = {
+        inputTokens: Math.max(0, prompt - cached) + tool,
+        outputTokens: candidates + thoughts,
+        cacheCreationTokens: 0,
+        cacheReadTokens: cached
+      };
+      if (Object.values(tokens).every((value) => value === 0))
+        continue;
+      const model = stringValue(message.model) ?? "gemini";
+      const timestamp = stringValue(message.timestamp) ?? parsed.startTime ?? new Date().toISOString();
+      const date = localDate(timestamp);
+      records.push({
+        date,
+        source: "gemini",
+        model,
+        sessionId,
+        ...tokens,
+        costUsd: estimateCost(model, tokens),
+        cacheSavingsUsd: estimateCacheSavings(model, cached)
+      });
+      sessions.set(sessionId, { id: sessionId, source: "gemini", date });
+    }
+  }
+  return { records, sessions: [...sessions.values()], files: files.length };
+}
+function parseGeminiConversation(text, fallbackId = "session") {
+  const trimmed = text.trim();
+  if (trimmed === "")
+    return null;
+  try {
+    const full = asObject(JSON.parse(trimmed));
+    if (full != null && Array.isArray(full.messages)) {
+      return {
+        sessionId: stringValue(full.sessionId) ?? fallbackId,
+        startTime: stringValue(full.startTime),
+        messages: full.messages.flatMap((message) => {
+          const row = asObject(message);
+          return row == null ? [] : [row];
+        })
+      };
+    }
+  } catch {}
+  let sessionId = fallbackId;
+  let startTime = null;
+  const messages = [];
+  for (const line of trimmed.split(`
+`)) {
+    let row = null;
+    try {
+      row = asObject(JSON.parse(line));
+    } catch {
+      continue;
+    }
+    if (row == null)
+      continue;
+    const metadata = asObject(row.$set) ?? row;
+    sessionId = stringValue(metadata.sessionId) ?? sessionId;
+    startTime = stringValue(metadata.startTime) ?? startTime;
+    const rewindTo = stringValue(row.$rewindTo);
+    if (rewindTo != null) {
+      const index = messages.findIndex((message) => message.id === rewindTo);
+      if (index >= 0)
+        messages.splice(index + 1);
+    } else if (stringValue(row.type) != null) {
+      messages.push(row);
+    }
+  }
+  return { sessionId, startTime, messages };
+}
+
+// src/data/sources/grok.ts
+import { homedir as homedir5 } from "os";
+import { basename as basename3, dirname as dirname2, join as join5 } from "path";
+async function loadGrokUsage() {
+  const root = process.env.GROK_HOME ?? join5(homedir5(), ".grok");
+  const files = await globFiles(join5(root, "sessions"), "**/updates.jsonl");
+  const records = [];
+  const sessions = new Map;
+  for (const path of files) {
+    const sessionId = `grok:${basename3(dirname2(path))}`;
+    await forEachJsonLine(path, (unknownValue) => {
+      const value = asObject(unknownValue);
+      const update = asObject(value?.update);
+      const usage = asObject(update?.usage);
+      if (update?.sessionUpdate !== "turn_completed" || usage == null)
+        return;
+      const metadata = asObject(value?._meta);
+      const timestamp = stringValue(value?.timestamp) ?? (numberValue(metadata?.agentTimestampMs) || Date.now());
+      const date = localDate(timestamp);
+      const models = asObject(usage.modelUsage);
+      const entries = models == null ? [["grok-build", usage]] : Object.entries(models);
+      const cost = numberValue(usage.costUsdTicks) / 1e9;
+      const tokenWeights = entries.map(([, entry]) => {
+        const tokens = asObject(entry);
+        return numberValue(tokens?.inputTokens) + numberValue(tokens?.outputTokens);
+      });
+      const totalWeight = tokenWeights.reduce((sum, value2) => sum + value2, 0);
+      entries.forEach(([model, entry], index) => {
+        const raw = asObject(entry);
+        const cached = numberValue(raw?.cachedReadTokens);
+        const input = Math.max(0, numberValue(raw?.inputTokens) - cached);
+        const tokens = {
+          inputTokens: input,
+          outputTokens: numberValue(raw?.outputTokens),
+          cacheCreationTokens: 0,
+          cacheReadTokens: cached
+        };
+        const allocatedCost = totalWeight > 0 ? cost * (tokenWeights[index] / totalWeight) : 0;
+        records.push({
+          date,
+          source: "grok",
+          model,
+          sessionId,
+          ...tokens,
+          costUsd: allocatedCost || estimateCost(model, tokens),
+          cacheSavingsUsd: estimateCacheSavings(model, cached)
+        });
+      });
+      sessions.set(sessionId, { id: sessionId, source: "grok", date });
+    });
+  }
+  return { records, sessions: [...sessions.values()], files: files.length };
+}
+
+// src/data/sources/opencode.ts
+import { homedir as homedir6 } from "os";
+import { join as join6 } from "path";
+async function loadOpenCodeUsage() {
+  const root = process.env.OPENCODE_DATA_DIR ?? join6(homedir6(), ".local", "share", "opencode");
+  const files = await globFiles(join6(root, "storage", "message"), "**/*.json");
+  const seen = new Set;
+  const records = [];
+  const sessions = new Map;
+  for (const path of files) {
+    try {
+      const message = asObject(await Bun.file(path).json());
+      const id = stringValue(message?.id);
+      const model = stringValue(message?.modelID);
+      const tokensValue = asObject(message?.tokens);
+      if (id == null || model == null || tokensValue == null || seen.has(id))
+        continue;
+      seen.add(id);
+      const cache = asObject(tokensValue.cache);
+      const tokens = {
+        inputTokens: numberValue(tokensValue.input),
+        outputTokens: numberValue(tokensValue.output),
+        cacheCreationTokens: numberValue(cache?.write),
+        cacheReadTokens: numberValue(cache?.read)
+      };
+      if (Object.values(tokens).every((value) => value === 0))
+        continue;
+      const time = asObject(message?.time);
+      const date = localDate(numberValue(time?.created) || Date.now());
+      const rawSession = stringValue(message?.sessionID) ?? id;
+      const sessionId = `opencode:${rawSession}`;
+      const localCost = typeof message?.cost === "number" ? message.cost : null;
+      records.push({
+        date,
+        source: "opencode",
+        model,
+        sessionId,
+        ...tokens,
+        costUsd: localCost ?? estimateCost(model, tokens),
+        cacheSavingsUsd: estimateCacheSavings(model, tokens.cacheReadTokens)
+      });
+      sessions.set(sessionId, { id: sessionId, source: "opencode", date });
+    } catch {
+      continue;
+    }
+  }
+  return { records, sessions: [...sessions.values()], files: files.length };
+}
+
+// src/data/load.ts
+var SOURCES = [
+  { id: "claude", load: loadClaudeUsage },
+  { id: "codex", load: loadCodexUsage },
+  { id: "cursor", load: loadCursorUsage },
+  { id: "gemini", load: loadGeminiUsage },
+  { id: "opencode", load: loadOpenCodeUsage },
+  { id: "grok", load: loadGrokUsage }
+];
+async function loadUsageDataset(onProgress) {
+  let completed = 0;
+  const results = await Promise.all(SOURCES.map(async (source) => {
+    const common = { source: source.id, label: SOURCE_META[source.id].label, total: SOURCES.length };
+    onProgress?.({ ...common, status: "scanning", completed });
+    try {
+      const value = await source.load();
+      completed += 1;
+      onProgress?.({
+        ...common,
+        status: "done",
+        completed,
+        files: value.files,
+        records: value.records.length,
+        sessions: value.sessions.length
+      });
+      return { value, error: null };
+    } catch (cause) {
+      completed += 1;
+      const error = cause instanceof Error ? cause.message : String(cause);
+      onProgress?.({ ...common, status: "error", completed, error });
+      return { value: null, error };
+    }
+  }));
+  const records = results.flatMap((result) => result.value?.records ?? []);
+  const sessions = results.flatMap((result) => result.value?.sessions ?? []);
+  const errors = results.flatMap((result) => result.error == null ? [] : [result.error]);
+  return { records, sessions, errors, scannedAt: new Date };
+}
+
+// src/tui/components/Segmented.tsx
+import { useState as useState2 } from "react";
+
+// src/tui/ThemeContext.tsx
+import { createContext, useContext } from "react";
+
+// src/tui/theme.ts
+import { useEffect, useState } from "react";
+import { RGBA } from "@opentui/core";
+var dark = createTheme("dark");
+var light = createTheme("light");
+function terminalTheme(mode) {
+  return mode === "light" ? light : dark;
+}
+function useTerminalTheme(renderer) {
+  const [mode, setMode] = useState(renderer.themeMode ?? colorFgBgMode() ?? "dark");
+  useEffect(() => {
+    const update = (next) => setMode(next);
+    const updatePalette = (colors) => {
+      const next = backgroundMode(colors.defaultBackground);
+      if (next != null)
+        setMode(next);
+    };
+    renderer.on("theme_mode", update);
+    renderer.on("palette", updatePalette);
+    renderer.waitForThemeMode(300).then((next) => {
+      if (next != null)
+        setMode(next);
+    });
+    renderer.getPalette({ size: 16, timeout: 300 }).then(updatePalette).catch(() => {});
+    return () => {
+      renderer.off("theme_mode", update);
+      renderer.off("palette", updatePalette);
+    };
+  }, [renderer]);
+  return terminalTheme(mode);
+}
+function colorFgBgMode() {
+  const index = Number(process.env.COLORFGBG?.split(";").at(-1));
+  if (!Number.isInteger(index))
+    return null;
+  return index === 7 || index > 8 ? "light" : "dark";
+}
+function backgroundMode(background) {
+  if (background == null)
+    return null;
+  const hex = background.match(/^#([\da-f]{2})([\da-f]{2})([\da-f]{2})$/i);
+  if (hex == null)
+    return null;
+  const red = Number.parseInt(hex[1], 16);
+  const green = Number.parseInt(hex[2], 16);
+  const blue = Number.parseInt(hex[3], 16);
+  const luminance = (0.2126 * red + 0.7152 * green + 0.0722 * blue) / 255;
+  return luminance >= 0.55 ? "light" : "dark";
+}
+function createTheme(mode) {
+  const isLight = mode === "light";
+  const textSnapshot = isLight ? "#202020" : "#ededed";
+  const backgroundSnapshot = isLight ? "#fafafa" : "#1e1e1e";
+  return {
+    mode,
+    bg: RGBA.defaultBackground(backgroundSnapshot),
+    panel: RGBA.defaultBackground(backgroundSnapshot),
+    hover: RGBA.fromHex(isLight ? "#e4e4e4" : "#303030"),
+    selected: RGBA.fromHex(isLight ? "#d8d8d8" : "#3a3a3a"),
+    text: RGBA.defaultForeground(textSnapshot),
+    onHover: RGBA.defaultForeground(textSnapshot),
+    onSelected: RGBA.defaultForeground(textSnapshot),
+    muted: RGBA.fromHex(isLight ? "#666666" : "#858585"),
+    faint: RGBA.fromHex(isLight ? "#c8c8c8" : "#424242"),
+    accent: RGBA.fromHex(isLight ? "#8a5a00" : "#d7a94a"),
+    error: RGBA.fromHex(isLight ? "#a52a2a" : "#dc6b6b"),
+    progress: RGBA.fromHex(isLight ? "#1f9d68" : "#35c98b"),
+    onProgress: RGBA.fromHex(isLight ? "#ffffff" : "#111111"),
+    sources: {
+      claude: RGBA.fromHex(isLight ? "#a84324" : "#dc7957"),
+      codex: RGBA.defaultForeground(textSnapshot),
+      cursor: RGBA.fromHex(isLight ? "#713b91" : "#c58be2"),
+      gemini: RGBA.fromHex(isLight ? "#245fa8" : "#77a7e8"),
+      grok: RGBA.fromHex(isLight ? "#5e5e5e" : "#a5a5a5"),
+      opencode: RGBA.fromHex(isLight ? "#287a73" : "#72a7a0")
+    }
+  };
+}
+
+// src/tui/ThemeContext.tsx
+import { jsx } from "@opentui/react/jsx-runtime";
+var ThemeContext = createContext(terminalTheme("dark"));
+function ThemeProvider({ theme, children }) {
+  return /* @__PURE__ */ jsx(ThemeContext.Provider, {
+    value: theme,
+    children
+  });
+}
+function useTheme() {
+  return useContext(ThemeContext);
+}
+
+// src/tui/usePointer.ts
+import { useRenderer } from "@opentui/react";
+function usePointer(style = "pointer") {
+  const renderer = useRenderer();
+  return {
+    pointerOver: () => renderer.setMousePointer(style),
+    pointerOut: () => renderer.setMousePointer("default")
+  };
+}
+
+// src/tui/components/Segmented.tsx
+import { jsx as jsx2 } from "@opentui/react/jsx-runtime";
+function Segmented({
+  options,
+  selected,
+  onChange
+}) {
+  const theme = useTheme();
+  const [hovered, setHovered] = useState2(null);
+  const { pointerOver, pointerOut } = usePointer();
+  const mousePress = (value) => (event) => {
+    if (event.button !== 0)
+      return;
+    event.stopPropagation();
+    onChange(value);
+  };
+  const keyPress = (value) => (key) => {
+    if (key.name === "return" || key.name === "space")
+      onChange(value);
+  };
+  return /* @__PURE__ */ jsx2("box", {
+    flexDirection: "row",
+    backgroundColor: theme.panel,
+    children: options.map((option) => {
+      const active = option.value === selected;
+      const hot = option.value === hovered;
+      return /* @__PURE__ */ jsx2("box", {
+        focusable: true,
+        height: 1,
+        backgroundColor: active ? theme.selected : hot ? theme.hover : theme.panel,
+        onMouseDown: mousePress(option.value),
+        onMouseOver: () => {
+          setHovered(option.value);
+          pointerOver();
+        },
+        onMouseOut: () => {
+          setHovered(null);
+          pointerOut();
+        },
+        onKeyDown: keyPress(option.value),
+        children: /* @__PURE__ */ jsx2("text", {
+          selectable: false,
+          fg: active ? theme.onSelected : hot ? theme.onHover : theme.muted,
+          children: ` ${option.label} `
+        })
+      }, String(option.value));
+    })
+  });
+}
+
+// src/tui/components/PointerButton.tsx
+import { useState as useState3 } from "react";
+import { jsx as jsx3 } from "@opentui/react/jsx-runtime";
+function PointerButton({ label, onPress }) {
+  const theme = useTheme();
+  const [hovered, setHovered] = useState3(false);
+  const { pointerOver, pointerOut } = usePointer();
+  const press = (event) => {
+    if (event.button !== 0)
+      return;
+    event.stopPropagation();
+    onPress();
+  };
+  const keyPress = (key) => {
+    if (key.name === "return" || key.name === "space")
+      onPress();
+  };
+  return /* @__PURE__ */ jsx3("box", {
+    focusable: true,
+    height: 1,
+    backgroundColor: hovered ? theme.hover : theme.panel,
+    onMouseDown: press,
+    onMouseOver: () => {
+      setHovered(true);
+      pointerOver();
+    },
+    onMouseOut: () => {
+      setHovered(false);
+      pointerOut();
+    },
+    onKeyDown: keyPress,
+    children: /* @__PURE__ */ jsx3("text", {
+      selectable: false,
+      fg: hovered ? theme.onHover : theme.muted,
+      children: ` ${label} `
+    })
+  });
+}
+
+// src/tui/components/Header.tsx
+import { jsx as jsx4, jsxs } from "@opentui/react/jsx-runtime";
+function Header({
+  metric,
+  range,
+  days,
+  compact,
+  onMetricChange,
+  onRangeChange,
+  onRefresh
+}) {
+  const theme = useTheme();
+  const dateLabel = days.length === 0 ? "" : `${shortDate(days[0])} to ${shortDate(days.at(-1))}`;
+  return /* @__PURE__ */ jsxs("box", {
+    flexDirection: compact ? "column" : "row",
+    justifyContent: "space-between",
+    width: "100%",
+    gap: 1,
+    children: [
+      /* @__PURE__ */ jsxs("text", {
+        fg: theme.text,
+        children: [
+          /* @__PURE__ */ jsx4("strong", {
+            children: "yacu"
+          }),
+          /* @__PURE__ */ jsx4("span", {
+            fg: theme.muted,
+            children: `  /  ${dateLabel}`
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs("box", {
+        flexDirection: "row",
+        gap: 2,
+        children: [
+          /* @__PURE__ */ jsx4(Segmented, {
+            selected: metric,
+            onChange: onMetricChange,
+            options: [{ value: "cost", label: "Cost" }, { value: "tokens", label: "Tokens" }]
+          }),
+          /* @__PURE__ */ jsx4(Segmented, {
+            selected: range,
+            onChange: onRangeChange,
+            options: [
+              { value: 1, label: "Past 24h" },
+              { value: 7, label: "7 days" },
+              { value: 30, label: "30 days" },
+              { value: 90, label: "90 days" }
+            ]
+          }),
+          /* @__PURE__ */ jsx4(PointerButton, {
+            label: "r \u21BB",
+            onPress: onRefresh
+          })
+        ]
+      })
+    ]
+  });
+}
+
+// src/tui/components/Summary.tsx
+import { useState as useState4 } from "react";
+
+// src/tui/format.ts
+function formatMoney(value) {
+  return new Intl.NumberFormat("en-US", {
+    style: "currency",
+    currency: "USD",
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 2
+  }).format(value);
+}
+function formatCompact(value) {
+  if (value < 1000)
+    return Math.round(value).toLocaleString("en-US");
+  const units = [
+    [1e9, "B"],
+    [1e6, "M"],
+    [1000, "K"]
+  ];
+  const [divisor, suffix] = units.find(([divisor2]) => value >= divisor2) ?? units[2];
+  const scaled = value / divisor;
+  return `${scaled >= 100 ? scaled.toFixed(0) : scaled >= 10 ? scaled.toFixed(1) : scaled.toFixed(2)}${suffix}`;
+}
+function formatMetric(value, metric) {
+  return metric === "cost" ? formatMoney(value) : formatCompact(value);
+}
+function formatAxis(value, metric) {
+  if (metric === "tokens")
+    return formatCompact(value);
+  if (value >= 1000)
+    return `$${formatCompact(value)}`;
+  return `$${Math.round(value).toLocaleString("en-US")}`;
+}
+function percent(value) {
+  return `${(value * 100).toFixed(1)}%`;
+}
+function truncate(value, width) {
+  if (value.length <= width)
+    return value.padEnd(width);
+  if (width <= 1)
+    return value.slice(0, width);
+  return `${value.slice(0, width - 1)}\u2026`;
+}
+
+// src/tui/components/Summary.tsx
+import { jsx as jsx5, jsxs as jsxs2 } from "@opentui/react/jsx-runtime";
+function Summary({
+  dashboard,
+  metric,
+  visibleSources,
+  onToggleSource
+}) {
+  const theme = useTheme();
+  const [hovered, setHovered] = useState4(null);
+  const { pointerOver, pointerOut } = usePointer();
+  const total = metric === "cost" ? formatMoney(dashboard.totals.costUsd) : formatCompact(dashboard.totals.processedTokens);
+  return /* @__PURE__ */ jsxs2("box", {
+    flexDirection: "column",
+    width: "100%",
+    gap: 1,
+    children: [
+      /* @__PURE__ */ jsx5("text", {
+        fg: theme.text,
+        children: /* @__PURE__ */ jsx5("strong", {
+          children: total
+        })
+      }),
+      /* @__PURE__ */ jsx5("text", {
+        fg: theme.muted,
+        children: `${dashboard.sessions.toLocaleString("en-US")} sessions \xB7 API estimate`
+      }),
+      /* @__PURE__ */ jsx5("box", {
+        height: 1
+      }),
+      dashboard.providers.map((provider) => {
+        const meta = SOURCE_META[provider.source];
+        const value = metric === "cost" ? provider.costUsd : provider.processedTokens;
+        const visible = visibleSources.has(provider.source);
+        const hot = hovered === provider.source;
+        const toggle = (event) => {
+          if (event.button !== 0)
+            return;
+          event.stopPropagation();
+          onToggleSource(provider.source);
+        };
+        return /* @__PURE__ */ jsxs2("box", {
+          flexDirection: "column",
+          marginBottom: 1,
+          backgroundColor: hot ? theme.hover : theme.bg,
+          opacity: visible ? 1 : 0.45,
+          onMouseDown: toggle,
+          onMouseOver: () => {
+            setHovered(provider.source);
+            pointerOver();
+          },
+          onMouseOut: () => {
+            setHovered(null);
+            pointerOut();
+          },
+          children: [
+            /* @__PURE__ */ jsxs2("box", {
+              flexDirection: "row",
+              justifyContent: "space-between",
+              children: [
+                /* @__PURE__ */ jsxs2("text", {
+                  selectable: false,
+                  fg: hot ? theme.onHover : theme.sources[provider.source],
+                  children: [
+                    `${meta.mark} `,
+                    /* @__PURE__ */ jsx5("span", {
+                      fg: hot ? theme.onHover : theme.text,
+                      children: meta.label
+                    }),
+                    /* @__PURE__ */ jsx5("span", {
+                      fg: hot ? theme.onHover : theme.muted,
+                      children: ` ${provider.sessions} sessions`
+                    })
+                  ]
+                }),
+                /* @__PURE__ */ jsx5("text", {
+                  selectable: false,
+                  fg: hot ? theme.onHover : theme.text,
+                  children: formatMetric(value, metric)
+                })
+              ]
+            }),
+            /* @__PURE__ */ jsx5("text", {
+              selectable: false,
+              fg: hot ? theme.onHover : theme.muted,
+              children: `${percent(provider.share)} of ${metric} \xB7 ${formatCompact(provider.processedTokens)} tokens`
+            })
+          ]
+        }, provider.source);
+      })
+    ]
+  });
+}
+
+// src/tui/components/Chart.tsx
+import { useMemo, useState as useState5 } from "react";
+
+// src/tui/chart.ts
+var DOTS = [
+  [1, 8],
+  [2, 16],
+  [4, 32],
+  [64, 128]
+];
+function renderBrailleChart(series, width, height, highlightColumn, highlightColor, highlightForeground, palette = terminalTheme("dark")) {
+  const safeWidth = Math.max(4, width);
+  const safeHeight = Math.max(3, height);
+  const pixelWidth = safeWidth * 2;
+  const pixelHeight = safeHeight * 4;
+  const cells = Array.from({ length: safeHeight }, () => Array.from({ length: safeWidth }, () => ({ bits: 0, source: null })));
+  const entries = Object.entries(series).filter(([, values]) => values.some((value) => value > 0)).sort(([, a], [, b]) => sum(a) - sum(b));
+  const max = Math.max(0, ...entries.flatMap(([, values]) => values));
+  if (max > 0) {
+    for (const [source, values] of entries) {
+      const points = values.map((value, index) => ({
+        x: values.length <= 1 ? 0 : Math.round(index / (values.length - 1) * (pixelWidth - 1)),
+        y: Math.round((1 - value / max) * (pixelHeight - 1))
+      }));
+      if (points.length === 1)
+        plot(cells, points[0].x, points[0].y, source);
+      for (let index = 1;index < points.length; index++) {
+        drawLine(cells, points[index - 1], points[index], source);
+      }
+    }
+  }
+  return {
+    max,
+    rows: cells.map((row) => groupSegments(row, highlightColumn, highlightColor, highlightForeground, palette))
+  };
+}
+function sum(values) {
+  return values.reduce((total, value) => total + value, 0);
+}
+function drawLine(cells, from, to, source) {
+  let x = from.x;
+  let y = from.y;
+  const dx = Math.abs(to.x - from.x);
+  const sx = from.x < to.x ? 1 : -1;
+  const dy = -Math.abs(to.y - from.y);
+  const sy = from.y < to.y ? 1 : -1;
+  let error = dx + dy;
+  while (true) {
+    plot(cells, x, y, source);
+    if (x === to.x && y === to.y)
+      return;
+    const doubled = error * 2;
+    if (doubled >= dy) {
+      error += dy;
+      x += sx;
+    }
+    if (doubled <= dx) {
+      error += dx;
+      y += sy;
+    }
+  }
+}
+function plot(cells, pixelX, pixelY, source) {
+  const row = Math.floor(pixelY / 4);
+  const column = Math.floor(pixelX / 2);
+  const cell = cells[row]?.[column];
+  if (cell == null)
+    return;
+  cell.bits |= DOTS[pixelY % 4][pixelX % 2];
+  cell.source = source;
+}
+function groupSegments(cells, highlightColumn, highlightColor, highlightForeground, palette = terminalTheme("dark")) {
+  const segments = [];
+  for (const [column, cell] of cells.entries()) {
+    const text = cell.bits === 0 ? " " : String.fromCodePoint(10240 + cell.bits);
+    const color = column === highlightColumn && highlightForeground != null ? highlightForeground : cell.source == null ? palette.faint : palette.sources[cell.source];
+    const background = column === highlightColumn ? highlightColor : undefined;
+    const previous = segments.at(-1);
+    if (previous?.color === color && previous.background === background)
+      previous.text += text;
+    else
+      segments.push({ text, color, background });
+  }
+  return segments;
+}
+function dayIndexAtColumn(column, width, dayCount) {
+  if (dayCount <= 1 || width <= 1)
+    return 0;
+  const bounded = Math.max(0, Math.min(width - 1, column));
+  return Math.round(bounded / (width - 1) * (dayCount - 1));
+}
+function chartColumnForDay(index, width, dayCount) {
+  if (dayCount <= 1 || width <= 1)
+    return 0;
+  const bounded = Math.max(0, Math.min(dayCount - 1, index));
+  return Math.round(bounded / (dayCount - 1) * (width - 1));
+}
+
+// src/tui/components/Chart.tsx
+import { jsx as jsx6, jsxs as jsxs3 } from "@opentui/react/jsx-runtime";
+function Chart({
+  dashboard,
+  metric,
+  width,
+  visibleSources,
+  selectedDay,
+  onSelectDay,
+  height = 11
+}) {
+  const theme = useTheme();
+  const labelWidth = 9;
+  const graphWidth = Math.max(8, width - labelWidth - 1);
+  const [hoveredIndex, setHoveredIndex] = useState5(null);
+  const { pointerOver, pointerOut } = usePointer("crosshair");
+  const selectedIndex = selectedDay == null ? -1 : dashboard.days.indexOf(selectedDay);
+  const activeIndex = hoveredIndex ?? (selectedIndex >= 0 ? selectedIndex : null);
+  const highlightColumn = activeIndex == null ? undefined : chartColumnForDay(activeIndex, graphWidth, dashboard.days.length);
+  const visibleSeries = useMemo(() => Object.fromEntries(SOURCE_ORDER.map((source) => [
+    source,
+    visibleSources.has(source) ? dashboard.series[source] : dashboard.series[source].map(() => 0)
+  ])), [dashboard.series, visibleSources]);
+  const chart = renderBrailleChart(visibleSeries, graphWidth, height, highlightColumn, theme.selected, theme.onSelected, theme);
+  const indexFromEvent = (event) => {
+    const start = event.currentTarget?.screenX ?? event.x;
+    return dayIndexAtColumn(event.x - start, graphWidth, dashboard.days.length);
+  };
+  const move = (event) => setHoveredIndex(indexFromEvent(event));
+  const select = (event) => {
+    if (event.button !== 0)
+      return;
+    event.stopPropagation();
+    const index = indexFromEvent(event);
+    const day = dashboard.days[index] ?? null;
+    onSelectDay(day === selectedDay ? null : day);
+  };
+  return /* @__PURE__ */ jsxs3("box", {
+    flexDirection: "column",
+    width: "100%",
+    children: [
+      /* @__PURE__ */ jsx6("text", {
+        fg: theme.text,
+        children: `Daily ${metric}`
+      }),
+      /* @__PURE__ */ jsx6("box", {
+        height: 1,
+        children: activeIndex == null ? null : /* @__PURE__ */ jsx6(ChartPoint, {
+          dashboard,
+          metric,
+          index: activeIndex,
+          visibleSources,
+          pinned: hoveredIndex == null && selectedIndex === activeIndex
+        })
+      }),
+      /* @__PURE__ */ jsxs3("box", {
+        flexDirection: "row",
+        height,
+        children: [
+          /* @__PURE__ */ jsx6("box", {
+            flexDirection: "column",
+            width: labelWidth,
+            children: chart.rows.map((_, index) => {
+              const ratio = 1 - index / Math.max(1, chart.rows.length - 1);
+              const show = index === 0 || index === Math.floor(chart.rows.length / 2) || index === chart.rows.length - 1;
+              const label = show ? formatAxis(chart.max * ratio, metric) : "";
+              return /* @__PURE__ */ jsx6("text", {
+                fg: theme.muted,
+                height: 1,
+                children: label.padStart(labelWidth - 1)
+              }, index);
+            })
+          }),
+          /* @__PURE__ */ jsx6("box", {
+            focusable: true,
+            flexDirection: "column",
+            width: graphWidth,
+            height,
+            onMouseMove: move,
+            onMouseDown: select,
+            onMouseOver: pointerOver,
+            onMouseOut: () => {
+              setHoveredIndex(null);
+              pointerOut();
+            },
+            children: chart.rows.map((segments, index) => /* @__PURE__ */ jsx6("text", {
+              height: 1,
+              selectable: false,
+              children: segments.map((segment, segmentIndex) => /* @__PURE__ */ jsx6("span", {
+                fg: segment.color,
+                bg: segment.background,
+                children: segment.text
+              }, segmentIndex))
+            }, index))
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs3("box", {
+        flexDirection: "row",
+        marginLeft: labelWidth,
+        justifyContent: "space-between",
+        width: graphWidth,
+        children: [
+          /* @__PURE__ */ jsx6("text", {
+            fg: theme.muted,
+            children: shortDate(dashboard.days[0] ?? "")
+          }),
+          /* @__PURE__ */ jsx6("text", {
+            fg: theme.muted,
+            children: shortDate(dashboard.days[Math.floor(dashboard.days.length / 2)] ?? "")
+          }),
+          /* @__PURE__ */ jsx6("text", {
+            fg: theme.muted,
+            children: shortDate(dashboard.days.at(-1) ?? "")
+          })
+        ]
+      })
+    ]
+  });
+}
+function ChartPoint({
+  dashboard,
+  metric,
+  index,
+  visibleSources,
+  pinned
+}) {
+  const theme = useTheme();
+  const values = SOURCE_ORDER.filter((source) => visibleSources.has(source)).map((source) => ({ source, value: dashboard.series[source][index] ?? 0 })).filter(({ value }) => value > 0);
+  const total = values.reduce((sum2, { value }) => sum2 + value, 0);
+  return /* @__PURE__ */ jsxs3("text", {
+    height: 1,
+    children: [
+      /* @__PURE__ */ jsx6("span", {
+        fg: theme.text,
+        children: shortDate(dashboard.days[index] ?? "")
+      }),
+      /* @__PURE__ */ jsx6("span", {
+        fg: theme.muted,
+        children: `  ${formatMetric(total, metric)}`
+      }),
+      values.map(({ source, value }) => /* @__PURE__ */ jsx6("span", {
+        fg: theme.sources[source],
+        children: `  ${SOURCE_META[source].mark} ${formatMetric(value, metric)}`
+      }, source)),
+      pinned ? /* @__PURE__ */ jsx6("span", {
+        fg: theme.muted,
+        children: "  pinned"
+      }) : null
+    ]
+  });
+}
+
+// src/tui/components/Totals.tsx
+import { jsx as jsx7, jsxs as jsxs4 } from "@opentui/react/jsx-runtime";
+function Totals({ dashboard, compact }) {
+  const theme = useTheme();
+  const values = [
+    ["Processed tokens", formatCompact(dashboard.totals.processedTokens)],
+    ["Cached input", formatCompact(dashboard.totals.cacheReadTokens)],
+    ["Uncached input", formatCompact(dashboard.totals.inputTokens + dashboard.totals.cacheCreationTokens)],
+    ["Output", formatCompact(dashboard.totals.outputTokens)],
+    ["Cache savings", formatMoney(dashboard.totals.cacheSavingsUsd)]
+  ];
+  return /* @__PURE__ */ jsxs4("box", {
+    flexDirection: "column",
+    width: "100%",
+    gap: 1,
+    children: [
+      /* @__PURE__ */ jsx7("text", {
+        fg: theme.text,
+        children: /* @__PURE__ */ jsx7("strong", {
+          children: "Totals"
+        })
+      }),
+      /* @__PURE__ */ jsx7("box", {
+        flexDirection: compact ? "column" : "row",
+        justifyContent: "space-between",
+        gap: compact ? 0 : 2,
+        children: values.map(([label, value]) => /* @__PURE__ */ jsxs4("box", {
+          flexDirection: compact ? "row" : "column",
+          justifyContent: "space-between",
+          flexGrow: 1,
+          children: [
+            /* @__PURE__ */ jsx7("text", {
+              fg: theme.muted,
+              children: label
+            }),
+            /* @__PURE__ */ jsx7("text", {
+              fg: theme.text,
+              children: value
+            })
+          ]
+        }, label))
+      })
+    ]
+  });
+}
+
+// src/tui/components/Breakdown.tsx
+import { useState as useState6 } from "react";
+import { jsx as jsx8, jsxs as jsxs5 } from "@opentui/react/jsx-runtime";
+function Breakdown({
+  dashboard,
+  mode,
+  metric,
+  width,
+  selectedDay,
+  onModeChange,
+  onSelectDay
+}) {
+  const theme = useTheme();
+  const [hovered, setHovered] = useState6(null);
+  const { pointerOver, pointerOut } = usePointer();
+  const rows = mode === "model" ? dashboard.models : dashboard.daily;
+  const nameWidth = Math.max(18, width - 42);
+  return /* @__PURE__ */ jsxs5("box", {
+    flexDirection: "column",
+    width: "100%",
+    gap: 1,
+    children: [
+      /* @__PURE__ */ jsxs5("box", {
+        flexDirection: "row",
+        justifyContent: "space-between",
+        children: [
+          /* @__PURE__ */ jsx8("text", {
+            fg: theme.text,
+            children: /* @__PURE__ */ jsx8("strong", {
+              children: "Breakdown"
+            })
+          }),
+          /* @__PURE__ */ jsx8(Segmented, {
+            selected: mode,
+            onChange: onModeChange,
+            options: [{ value: "model", label: "Model" }, { value: "day", label: "Day" }]
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs5("box", {
+        flexDirection: "row",
+        children: [
+          /* @__PURE__ */ jsx8("text", {
+            fg: theme.muted,
+            width: nameWidth,
+            children: mode === "model" ? "Model" : "Day"
+          }),
+          /* @__PURE__ */ jsx8("text", {
+            fg: theme.muted,
+            width: 15,
+            children: metric === "cost" ? "Cost" : "Tokens"
+          }),
+          /* @__PURE__ */ jsx8("text", {
+            fg: theme.muted,
+            width: 12,
+            children: "Share"
+          }),
+          /* @__PURE__ */ jsx8("text", {
+            fg: theme.muted,
+            children: "Tokens"
+          })
+        ]
+      }),
+      rows.slice(0, 18).map((row) => {
+        const value = metric === "cost" ? row.costUsd : row.processedTokens;
+        const color = row.source == null ? theme.text : theme.sources[row.source];
+        const mark = row.source == null ? " " : SOURCE_META[row.source].mark;
+        const interactive = mode === "day";
+        const selected = interactive && selectedDay === row.key;
+        const hot = interactive && hovered === row.key;
+        const select = interactive ? (event) => {
+          if (event.button !== 0)
+            return;
+          event.stopPropagation();
+          onSelectDay(selected ? null : row.key);
+        } : undefined;
+        return /* @__PURE__ */ jsxs5("box", {
+          flexDirection: "row",
+          backgroundColor: selected ? theme.selected : hot ? theme.hover : theme.bg,
+          onMouseDown: select,
+          onMouseOver: interactive ? () => {
+            setHovered(row.key);
+            pointerOver();
+          } : undefined,
+          onMouseOut: interactive ? () => {
+            setHovered(null);
+            pointerOut();
+          } : undefined,
+          children: [
+            /* @__PURE__ */ jsx8("text", {
+              selectable: !interactive,
+              fg: selected ? theme.onSelected : hot ? theme.onHover : color,
+              width: nameWidth,
+              children: `${mark} ${truncate(row.label, nameWidth - 2)}`
+            }),
+            /* @__PURE__ */ jsx8("text", {
+              selectable: !interactive,
+              fg: selected ? theme.onSelected : hot ? theme.onHover : theme.text,
+              width: 15,
+              children: formatMetric(value, metric)
+            }),
+            /* @__PURE__ */ jsx8("text", {
+              selectable: !interactive,
+              fg: selected ? theme.onSelected : hot ? theme.onHover : theme.muted,
+              width: 12,
+              children: percent(row.share)
+            }),
+            /* @__PURE__ */ jsx8("text", {
+              selectable: !interactive,
+              fg: selected ? theme.onSelected : hot ? theme.onHover : theme.muted,
+              children: formatMetric(row.processedTokens, "tokens")
+            })
+          ]
+        }, row.key);
+      })
+    ]
+  });
+}
+
+// src/tui/components/Footer.tsx
+import { jsx as jsx9, jsxs as jsxs6 } from "@opentui/react/jsx-runtime";
+function Footer({ loading }) {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsxs6("box", {
+    width: "100%",
+    flexDirection: "row",
+    justifyContent: "space-between",
+    backgroundColor: theme.panel,
+    paddingX: 1,
+    children: [
+      /* @__PURE__ */ jsx9("text", {
+        fg: theme.muted,
+        children: "c cost/tokens   1-4 range   b breakdown   r refresh   q quit"
+      }),
+      /* @__PURE__ */ jsx9("text", {
+        fg: loading ? theme.accent : theme.muted,
+        children: loading ? "loading" : "local"
+      })
+    ]
+  });
+}
+
+// src/tui/components/ScanBoot.tsx
+import { jsx as jsx10, jsxs as jsxs7 } from "@opentui/react/jsx-runtime";
+function ScanBoot({
+  completed,
+  total,
+  width
+}) {
+  const theme = useTheme();
+  const progress = total === 0 ? 1 : Math.max(0, Math.min(1, completed / total));
+  const barWidth = Math.max(8, Math.min(20, width - 4));
+  const filled = Math.round(progress * barWidth);
+  return /* @__PURE__ */ jsx10("box", {
+    width: "100%",
+    flexGrow: 1,
+    justifyContent: "center",
+    alignItems: "center",
+    children: /* @__PURE__ */ jsxs7("box", {
+      flexDirection: "column",
+      alignItems: "center",
+      gap: 1,
+      children: [
+        /* @__PURE__ */ jsx10("text", {
+          fg: theme.text,
+          children: "scanning usage..."
+        }),
+        /* @__PURE__ */ jsx10("text", {
+          fg: theme.text,
+          children: `[${"#".repeat(filled)}${" ".repeat(barWidth - filled)}]`
+        })
+      ]
+    })
+  });
+}
+
+// src/tui/App.tsx
+import { jsx as jsx11, jsxs as jsxs8, Fragment } from "@opentui/react/jsx-runtime";
+var RANGES = [1, 7, 30, 90];
+var COMPLETED_SCAN_HOLD_MS = 800;
+function App() {
+  const renderer = useRenderer2();
+  const theme = useTerminalTheme(renderer);
+  const { width, height } = useTerminalDimensions();
+  const [dataset, setDataset] = useState7(null);
+  const [metric, setMetric] = useState7("cost");
+  const [range, setRange] = useState7(30);
+  const [breakdown, setBreakdown] = useState7("model");
+  const [visibleSources, setVisibleSources] = useState7(() => new Set(SOURCE_ORDER));
+  const [selectedDay, setSelectedDay] = useState7(null);
+  const [loading, setLoading] = useState7(true);
+  const [error, setError] = useState7(null);
+  const [scanCompleted, setScanCompleted] = useState7(0);
+  const refresh = async () => {
+    const initialScan = dataset == null;
+    setLoading(true);
+    setError(null);
+    if (initialScan)
+      setScanCompleted(0);
+    try {
+      const nextDataset = await loadUsageDataset((progress) => {
+        if (initialScan)
+          setScanCompleted(progress.completed);
+      });
+      if (initialScan)
+        await Bun.sleep(COMPLETED_SCAN_HOLD_MS);
+      setDataset(nextDataset);
+    } catch (cause) {
+      setError(cause instanceof Error ? cause.message : String(cause));
+    } finally {
+      setLoading(false);
+    }
+  };
+  useEffect2(() => {
+    refresh();
+  }, []);
+  const changeRange = (next) => {
+    setRange(next);
+    setSelectedDay(null);
+  };
+  const selectDay = (day) => {
+    setSelectedDay(day);
+    if (day != null)
+      setBreakdown("day");
+  };
+  const toggleSource = (source) => {
+    setVisibleSources((current) => {
+      const next = new Set(current);
+      if (next.has(source))
+        next.delete(source);
+      else
+        next.add(source);
+      return next;
+    });
+  };
+  useKeyboard((key) => {
+    if (key.name === "q" || key.name === "escape")
+      renderer.destroy();
+    else if (key.name === "c")
+      setMetric((value) => value === "cost" ? "tokens" : "cost");
+    else if (key.name === "b")
+      setBreakdown((value) => value === "model" ? "day" : "model");
+    else if (key.name === "r")
+      refresh();
+    else if (["1", "2", "3", "4"].includes(key.name))
+      changeRange(RANGES[Number(key.name) - 1]);
+    else if (key.name === "left" || key.name === "right") {
+      const index = RANGES.indexOf(range);
+      const next = key.name === "left" ? Math.max(0, index - 1) : Math.min(RANGES.length - 1, index + 1);
+      changeRange(RANGES[next]);
+    }
+  });
+  const dashboard = useMemo2(() => dataset == null ? null : buildDashboard(dataset, range, metric), [dataset, range, metric]);
+  const compact = width < 100;
+  const wide = width >= 112;
+  const contentWidth = Math.max(40, width - 4);
+  const summaryWidth = wide ? Math.min(45, Math.floor(contentWidth * 0.34)) : contentWidth;
+  const chartWidth = wide ? contentWidth - summaryWidth - 3 : contentWidth;
+  return /* @__PURE__ */ jsx11(ThemeProvider, {
+    theme,
+    children: /* @__PURE__ */ jsxs8("box", {
+      width: "100%",
+      height: "100%",
+      flexDirection: "column",
+      backgroundColor: theme.bg,
+      children: [
+        dashboard == null ? /* @__PURE__ */ jsx11("box", {
+          flexGrow: 1,
+          width: "100%",
+          height: "100%",
+          paddingX: 2,
+          paddingTop: 1,
+          children: error == null ? /* @__PURE__ */ jsx11(ScanBoot, {
+            completed: scanCompleted,
+            total: SOURCE_ORDER.length,
+            width: contentWidth
+          }) : /* @__PURE__ */ jsx11("text", {
+            fg: theme.error,
+            children: `Error: ${error}`
+          })
+        }) : /* @__PURE__ */ jsx11("scrollbox", {
+          flexGrow: 1,
+          width: "100%",
+          paddingX: 2,
+          paddingTop: 1,
+          scrollY: true,
+          viewportCulling: true,
+          scrollbarOptions: {
+            trackOptions: { backgroundColor: theme.bg, foregroundColor: theme.muted },
+            arrowOptions: { backgroundColor: theme.bg, foregroundColor: theme.muted }
+          },
+          children: /* @__PURE__ */ jsxs8("box", {
+            flexDirection: "column",
+            width: "100%",
+            gap: 2,
+            children: [
+              /* @__PURE__ */ jsx11(Header, {
+                metric,
+                range,
+                days: dashboard.days,
+                compact,
+                onMetricChange: setMetric,
+                onRangeChange: changeRange,
+                onRefresh: () => void refresh()
+              }),
+              dashboard.records.length === 0 ? /* @__PURE__ */ jsx11("text", {
+                fg: theme.muted,
+                children: "No local usage found"
+              }) : /* @__PURE__ */ jsxs8(Fragment, {
+                children: [
+                  /* @__PURE__ */ jsxs8("box", {
+                    flexDirection: wide ? "row" : "column",
+                    width: "100%",
+                    gap: 3,
+                    children: [
+                      /* @__PURE__ */ jsx11("box", {
+                        width: wide ? summaryWidth : "100%",
+                        children: /* @__PURE__ */ jsx11(Summary, {
+                          dashboard,
+                          metric,
+                          visibleSources,
+                          onToggleSource: toggleSource
+                        })
+                      }),
+                      /* @__PURE__ */ jsx11("box", {
+                        width: wide ? chartWidth : "100%",
+                        children: /* @__PURE__ */ jsx11(Chart, {
+                          dashboard,
+                          metric,
+                          width: chartWidth,
+                          height: wide ? 11 : 8,
+                          visibleSources,
+                          selectedDay,
+                          onSelectDay: selectDay
+                        })
+                      })
+                    ]
+                  }),
+                  /* @__PURE__ */ jsx11(Totals, {
+                    dashboard,
+                    compact
+                  }),
+                  /* @__PURE__ */ jsx11(Breakdown, {
+                    dashboard,
+                    mode: breakdown,
+                    metric,
+                    width: contentWidth,
+                    selectedDay,
+                    onModeChange: setBreakdown,
+                    onSelectDay: selectDay
+                  })
+                ]
+              }),
+              dataset?.errors.length ? /* @__PURE__ */ jsx11("text", {
+                fg: theme.error,
+                children: dataset.errors.join(" \xB7 ")
+              }) : null,
+              /* @__PURE__ */ jsx11("box", {
+                height: 1
+              })
+            ]
+          })
+        }),
+        dashboard == null ? null : /* @__PURE__ */ jsx11(Footer, {
+          loading
+        })
+      ]
+    })
+  });
+}
+
+// src/index.tsx
+import { jsx as jsx12 } from "@opentui/react/jsx-runtime";
+var renderer = await createCliRenderer({
+  backgroundColor: RGBA2.defaultBackground("#1e1e1e"),
+  exitOnCtrlC: true,
+  targetFps: 30,
+  useMouse: true,
+  enableMouseMovement: true,
+  autoFocus: false
+});
+createRoot(renderer).render(/* @__PURE__ */ jsx12(App, {}));