tokenleak 0.1.0 → 0.3.0

package/README.md

@@ -1,160 +1,337 @@
 # Tokenleak
 
-A CLI tool that surfaces your AI coding-assistant token usage as beautiful heatmaps, terminal dashboards, and shareable cards. Supports **Claude Code**, **Codex**, and **Open Code**.
+See where your AI tokens actually go. Tokenleak reads local usage logs from **Claude Code**, **Codex**, and **Open Code**, then renders heatmaps, dashboards, and shareable cards — all from your terminal.
 
-## Features
+## Install
 
-- Heatmap visualisation of daily token usage (contribution-graph style)
-- Terminal dashboard with ANSI colours and Unicode block characters
-- SVG and PNG image export for sharing
-- JSON export for downstream tooling
-- Streak tracking (current and longest)
-- Cost estimation with per-model pricing
-- Rolling 30-day window statistics
-- Day-of-week usage breakdown
-- Multi-provider support with automatic detection
-- Configuration file support (`~/.tokenleakrc`)
-
-## Quick Start
+Tokenleak requires [Bun](https://bun.sh) (v1.0+).
 
 ```bash
-# Install globally with bun
 bun install -g tokenleak
+```
+
+After installing, run `tokenleak` in your terminal. It will automatically detect which AI coding tools you have installed and display your usage.
+
+### From source
 
-# Or clone and build from source
+```bash
 git clone https://github.com/ya-nsh/tokenleak.git
 cd tokenleak
 bun install
 bun run build
+bun run bundle
 
-# Run
-bun run packages/cli/dist/cli.js
+# Run directly
+bun dist/tokenleak.js
 ```
 
 ## Usage
 
 ```bash
-# Terminal dashboard (default)
+# Show a terminal dashboard of your token usage (default)
 tokenleak
 
-# JSON output
+# Output as JSON
 tokenleak --format json
 
-# SVG heatmap
+# Export an SVG heatmap
 tokenleak --format svg --output usage.svg
 
-# PNG heatmap
+# Export a PNG image
 tokenleak --format png --output usage.png
 
-# Filter to last 90 days
-tokenleak --days 90
+# Save to a file (format is inferred from the extension)
+tokenleak -o report.json
+tokenleak -o heatmap.svg
+tokenleak -o card.png
+```
+
+### Date filtering
+
+By default, Tokenleak shows the last **90 days** of usage.
 
-# Custom date range
-tokenleak --since 2025-01-01 --until 2025-12-31
+```bash
+# Last 30 days
+tokenleak --days 30
+
+# Specific date range
+tokenleak --since 2025-06-01 --until 2025-12-31
+
+# Everything since a date (until defaults to today)
+tokenleak --since 2025-01-01
+
+# --since takes priority over --days when both are provided
+```
+
+### Provider filtering
 
-# Filter to a specific provider
+Tokenleak auto-detects all installed providers. You can filter to specific ones:
+
+```bash
+# Only Claude Code
 tokenleak --provider claude-code
 
-# Compare two date ranges
-tokenleak --compare 2025-01-01..2025-06-30
+# Only Codex
+tokenleak --provider codex
 
-# Dark theme (default) / light theme
+# Multiple providers (comma-separated)
+tokenleak --provider claude-code,codex
+```
+
+### Compare mode
+
+Compare your usage across two time periods to see how your token consumption has changed:
+
+```bash
+# Auto-compare: splits your date range in half
+# (e.g. with --days 60, compares last 30 days vs. previous 30 days)
+tokenleak --compare auto
+
+# Compare against a specific previous period
+tokenleak --compare 2025-01-01..2025-03-31
+
+# Compare outputs deltas for total tokens, cost, streaks, etc.
+tokenleak --compare auto --format json
+```
+
+Compare mode outputs a JSON object with `currentPeriod`, `previousPeriod`, and `deltas` showing the difference between the two periods (positive = increase, negative = decrease).
+
+### Themes
+
+```bash
+# Dark theme (default)
+tokenleak --theme dark
+
+# Light theme
 tokenleak --theme light
+```
+
+### Terminal options
+
+```bash
+# Set terminal width (affects heatmap and dashboard layout)
+tokenleak --width 120
 
-# Disable ANSI colours
+# Disable ANSI colours (useful for piping output)
 tokenleak --no-color
 
-# Write output to a file (format inferred from extension)
-tokenleak --output report.json
+# Hide the insights panel
+tokenleak --no-insights
+```
+
+### Sharing
+
+```bash
+# Copy rendered output to clipboard
+tokenleak --format json --clipboard
+
+# Open the output file in your default application after saving
+tokenleak -o usage.svg --open
+
+# Upload to a GitHub Gist (requires gh CLI to be authenticated)
+tokenleak --format json --upload gist
 ```
 
-### All Flags
-
-| Flag | Alias | Description |
-|------|-------|-------------|
-| `--format` | `-f` | Output format: `json`, `svg`, `png`, `terminal` |
-| `--theme` | `-t` | Colour theme: `dark`, `light` |
-| `--since` | `-s` | Start date (`YYYY-MM-DD`) |
-| `--until` | `-u` | End date (`YYYY-MM-DD`), defaults to today |
-| `--days` | `-d` | Number of days to look back (default: 365) |
-| `--output` | `-o` | Output file path |
-| `--width` | `-w` | Terminal width (default: 80) |
-| `--no-color` | | Disable ANSI colours in terminal output |
-| `--no-insights` | | Hide the insights panel |
-| `--compare` | | Compare two date ranges (`YYYY-MM-DD..YYYY-MM-DD`) |
-| `--provider` | `-p` | Filter to specific provider(s), comma-separated |
-| `--version` | `-v` | Print version |
-| `--help` | `-h` | Print usage information |
-
-## Supported Providers
+## All flags
+
+| Flag | Alias | Default | Description |
+|------|-------|---------|-------------|
+| `--format` | `-f` | `terminal` | Output format: `json`, `svg`, `png`, `terminal` |
+| `--theme` | `-t` | `dark` | Colour theme: `dark`, `light` |
+| `--since` | `-s` | | Start date (`YYYY-MM-DD`). Overrides `--days` |
+| `--until` | `-u` | today | End date (`YYYY-MM-DD`) |
+| `--days` | `-d` | `90` | Number of days to look back |
+| `--output` | `-o` | stdout | Output file path. Format is inferred from extension |
+| `--width` | `-w` | `80` | Terminal width for dashboard layout |
+| `--no-color` | | `false` | Strip ANSI escape codes from terminal output |
+| `--no-insights` | | `false` | Hide the insights panel |
+| `--compare` | | | Compare two date ranges. Use `auto` or `YYYY-MM-DD..YYYY-MM-DD` |
+| `--provider` | `-p` | all | Filter to specific provider(s), comma-separated |
+| `--clipboard` | | `false` | Copy output to clipboard after rendering |
+| `--open` | | `false` | Open output file in default app (requires `--output`) |
+| `--upload` | | | Upload output to a service. Supported: `gist` |
+| `--version` | | | Print version number |
+| `--help` | | | Print usage information |
+
+## Supported providers
 
 ### Claude Code
 
-Reads JSONL conversation logs from the Claude Code configuration directory.
+Reads JSONL conversation logs from the Claude Code projects directory. Each assistant message with a `usage` field is parsed for input/output/cache token counts.
 
-- **macOS/Linux**: `~/.claude/projects/*/`
-- **Custom**: Set `CLAUDE_CONFIG_DIR` environment variable
+| | |
+|---|---|
+| **Data location** | `~/.claude/projects/*/*.jsonl` |
+| **Override** | Set `CLAUDE_CONFIG_DIR` environment variable |
+| **Provider name** | `claude-code` |
 
 ### Codex
 
-Reads JSONL session logs from the Codex home directory.
+Reads JSONL session logs from the Codex sessions directory. Parses `response` events for token usage with cumulative delta extraction.
 
-- **Default**: `~/.codex/sessions/`
-- **Custom**: Set `CODEX_HOME` environment variable
+| | |
+|---|---|
+| **Data location** | `~/.codex/sessions/*.jsonl` |
+| **Override** | Set `CODEX_HOME` environment variable |
+| **Provider name** | `codex` |
 
 ### Open Code
 
-Reads usage data from the Open Code SQLite database or legacy JSON files.
+Reads usage data from the Open Code SQLite database. Falls back to legacy JSON session files if no database is found.
+
+| | |
+|---|---|
+| **Data location** | `~/.opencode/sessions.db` (primary) or `~/.opencode/sessions/*.json` (fallback) |
+| **Provider name** | `open-code` |
+
+## Output formats
+
+### `terminal` (default)
+
+A full-width dashboard rendered in your terminal with:
+
+- GitHub-style heatmap using Unicode block characters (`░▒▓█`)
+- Stats panel: current streak, longest streak, total tokens, total cost, 30-day rolling totals, daily averages, cache hit rate
+- Day-of-week breakdown showing which days you code most
+- Top models ranked by token usage
+- Insights: peak day, most active day, top model, top provider
+
+Falls back to a compact one-liner when terminal width is under 40 characters.
+
+### `json`
+
+Structured JSON output containing:
+
+```jsonc
+{
+  "schemaVersion": 1,
+  "generated": "2025-12-01T00:00:00.000Z",
+  "dateRange": { "since": "2025-09-01", "until": "2025-12-01" },
+  "providers": [
+    {
+      "name": "claude-code",
+      "displayName": "Claude Code",
+      "daily": [
+        {
+          "date": "2025-11-30",
+          "inputTokens": 15000,
+          "outputTokens": 5000,
+          "cacheReadTokens": 2000,
+          "cacheWriteTokens": 500,
+          "totalTokens": 22500,
+          "cost": 0.0825
+        }
+        // ...
+      ],
+      "models": [
+        { "model": "claude-sonnet-4", "inputTokens": 10000, "outputTokens": 3000, "totalTokens": 13000, "cost": 0.075 }
+      ],
+      "totalTokens": 22500,
+      "totalCost": 0.0825
+    }
+  ],
+  "aggregated": {
+    "currentStreak": 12,
+    "longestStreak": 45,
+    "totalTokens": 1500000,
+    "totalCost": 52.50,
+    // ... rolling windows, peaks, averages, day-of-week, top models
+  }
+}
+```
+
+### `svg`
 
-- **Default**: `~/.opencode/opencode.db`
+A self-contained SVG image with:
 
-## Configuration
+- Heatmap grid (7 rows x N weeks) with quantile-based colour intensity
+- Month labels and day-of-week labels
+- Stats panel and insights panel
+- Supports `dark` and `light` themes
 
-Create a `~/.tokenleakrc` file with JSON to set defaults:
+### `png`
+
+Same layout as SVG, rendered to a PNG image via [sharp](https://sharp.pixelplumbing.com/). Useful for embedding in documents or sharing on platforms that don't support SVG.
+
+## Configuration file
+
+Create `~/.tokenleakrc` to set persistent defaults:
 
 ```json
 {
   "format": "terminal",
   "theme": "dark",
-  "days": 365,
+  "days": 90,
   "width": 120,
   "noColor": false,
   "noInsights": false
 }
 ```
 
-CLI flags always override configuration file values.
+**Priority order** (highest wins): CLI flags > environment variables > config file > built-in defaults.
+
+All fields are optional. Only include the ones you want to override.
 
-## Environment Variables
+## Environment variables
 
 | Variable | Default | Description |
 |----------|---------|-------------|
-| `TOKENLEAK_FILE_PROCESS_CONCURRENCY` | `4` | Number of files to process concurrently |
-| `TOKENLEAK_MAX_JSONL_RECORD_BYTES` | `67108864` (64 MB) | Maximum size of a single JSONL record |
-| `TOKENLEAK_PRICING_OVERRIDE` | | Path to a custom pricing JSON file |
+| `TOKENLEAK_FORMAT` | `terminal` | Default output format |
+| `TOKENLEAK_THEME` | `dark` | Default colour theme |
+| `TOKENLEAK_DAYS` | `90` | Default lookback period in days |
+| `TOKENLEAK_MAX_JSONL_RECORD_BYTES` | `10485760` (10 MB) | Max size of a single JSONL record before it is rejected |
 | `CLAUDE_CONFIG_DIR` | `~/.claude` | Claude Code configuration directory |
 | `CODEX_HOME` | `~/.codex` | Codex home directory |
 
-## Output Formats
+## What Tokenleak tracks
+
+Tokenleak reads your **local** log files only. It never sends data anywhere (unless you explicitly use `--upload`).
+
+For each day of usage, it tracks:
+
+- **Input tokens** — tokens sent to the model
+- **Output tokens** — tokens generated by the model
+- **Cache read tokens** — tokens served from prompt cache
+- **Cache write tokens** — tokens written to prompt cache
+- **Cost** — estimated USD cost based on per-model pricing
+
+It then computes:
+
+- **Streaks** — consecutive days with any token usage
+- **Rolling 30-day totals** — tokens and cost over a sliding window
+- **Peak day** — the single day with the highest token usage
+- **Day-of-week breakdown** — which days of the week you use AI most
+- **Cache hit rate** — percentage of input tokens served from cache
+- **Top models** — models ranked by total token consumption
+- **Daily averages** — mean tokens and cost per day
+
+### Supported models and pricing
+
+Tokenleak includes pricing for these model families:
+
+| Family | Models |
+|--------|--------|
+| Claude 3 | `claude-3-haiku`, `claude-3-sonnet`, `claude-3-opus` |
+| Claude 3.5 | `claude-3.5-haiku`, `claude-3.5-sonnet` |
+| Claude 4 | `claude-sonnet-4`, `claude-opus-4` |
+| GPT-4o | `gpt-4o`, `gpt-4o-mini` |
+| o-series | `o1`, `o1-mini`, `o3`, `o3-mini`, `o4-mini` |
 
-| Format | Description |
-|--------|-------------|
-| `terminal` | ANSI dashboard with heatmap and stats, rendered in the shell |
-| `json` | Structured JSON export with daily data, insights, and aggregated stats |
-| `svg` | SVG heatmap with stats and insights panels |
-| `png` | PNG heatmap rendered via `@napi-rs/canvas` |
+Model names with date suffixes (e.g. `claude-sonnet-4-20250514`) are automatically normalised. Unknown models show `$0.00` cost but tokens are still tracked.
 
-## Project Structure
+## Project structure
 
 ```
 tokenleak/
   packages/
-    cli/           -- Main CLI entrypoint
-    core/          -- Data types, aggregation engine
-    registry/      -- Provider parsers (Claude Code, Codex, Open Code)
-    renderers/     -- JSON, SVG, PNG, terminal renderers
-  tooling/
-    typescript-config/
+    core/           Shared types, constants, aggregation engine
+    registry/       Provider parsers and model pricing
+    renderers/      JSON, SVG, PNG, and terminal output
+    cli/            CLI entrypoint and config handling
+  scripts/
+    build-npm.ts    Bundles CLI for npm publishing
+  dist/
+    tokenleak.js    Bundled CLI (generated)
 ```
 
 ## Contributing

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tokenleak",
-  "version": "0.1.0",
+  "version": "0.3.0",
   "description": "Visualise your AI coding-assistant token usage across providers — heatmaps, dashboards, and shareable cards.",
   "type": "module",
   "bin": {

package/tokenleak.js

@@ -695,7 +695,7 @@ function computePreviousPeriod(current) {
   };
 }
 // packages/core/dist/index.js
-var VERSION = "0.1.0";
+var VERSION = "0.2.0";
 
 // packages/registry/dist/models/normalizer.js
 var DATE_SUFFIX_PATTERN = /-\d{8}$/;
@@ -735,18 +735,48 @@ var MODEL_PRICING = {
     cacheRead: 0.3,
     cacheWrite: 3.75
   },
+  "claude-haiku-4-5": {
+    input: 0.8,
+    output: 4,
+    cacheRead: 0.08,
+    cacheWrite: 1
+  },
+  "claude-sonnet-4-5": {
+    input: 3,
+    output: 15,
+    cacheRead: 0.3,
+    cacheWrite: 3.75
+  },
+  "claude-opus-4-5": {
+    input: 15,
+    output: 75,
+    cacheRead: 1.5,
+    cacheWrite: 18.75
+  },
   "claude-sonnet-4": {
     input: 3,
     output: 15,
     cacheRead: 0.3,
     cacheWrite: 3.75
   },
+  "claude-sonnet-4-6": {
+    input: 3,
+    output: 15,
+    cacheRead: 0.3,
+    cacheWrite: 3.75
+  },
   "claude-opus-4": {
     input: 15,
     output: 75,
     cacheRead: 1.5,
     cacheWrite: 18.75
   },
+  "claude-opus-4-6": {
+    input: 15,
+    output: 75,
+    cacheRead: 1.5,
+    cacheWrite: 18.75
+  },
   "gpt-4o": {
     input: 2.5,
     output: 10,
@@ -867,17 +897,17 @@ async function* splitJsonlRecords(filePath) {
   let lineNumber = 0;
   for (const line of lines) {
     lineNumber++;
-    if (line.trim() === "") {
+    if (line.trim() === "" || /^\x00+$/.test(line) || !/[^\x00]/.test(line)) {
       continue;
     }
     const byteLength = new TextEncoder().encode(line).byteLength;
     if (byteLength > maxBytes) {
-      throw new Error(`Oversized JSONL record in ${filePath} at line ${lineNumber}: ${byteLength} bytes exceeds limit of ${maxBytes} bytes`);
+      continue;
     }
     try {
       yield JSON.parse(line);
     } catch {
-      throw new Error(`Malformed JSON in ${filePath} at line ${lineNumber}: unable to parse`);
+      continue;
     }
   }
 }
@@ -1027,11 +1057,15 @@ class ClaudeCodeProvider {
     const files = collectJsonlFiles(this.baseDir);
     const allRecords = [];
     for (const file of files) {
-      for await (const record of splitJsonlRecords(file)) {
-        const usage = extractUsage(record);
-        if (usage !== null && isInRange(usage.date, range)) {
-          allRecords.push(usage);
+      try {
+        for await (const record of splitJsonlRecords(file)) {
+          const usage = extractUsage(record);
+          if (usage !== null && isInRange(usage.date, range)) {
+            allRecords.push(usage);
+          }
         }
+      } catch {
+        continue;
       }
     }
     const daily = buildDailyUsage(allRecords);
@@ -1120,41 +1154,45 @@ class CodexProvider {
     }
     for (const file of files) {
       const filePath = join2(this.sessionsDir, file);
-      for await (const record of splitJsonlRecords(filePath)) {
-        const event = parseResponseEvent(record);
-        if (!event) {
-          continue;
-        }
-        const date = extractDate(event.timestamp);
-        if (!date || !isInRange2(date, range)) {
-          continue;
-        }
-        const normalizedModel = normalizeModelName(compactModelDateSuffix(event.model));
-        const inputTokens = event.usage.input_tokens;
-        const outputTokens = event.usage.output_tokens;
-        const cacheReadTokens = 0;
-        const cacheWriteTokens = 0;
-        const cost = estimateCost(normalizedModel, inputTokens, outputTokens, cacheReadTokens, cacheWriteTokens);
-        if (!dailyMap.has(date)) {
-          dailyMap.set(date, new Map);
+      try {
+        for await (const record of splitJsonlRecords(filePath)) {
+          const event = parseResponseEvent(record);
+          if (!event) {
+            continue;
+          }
+          const date = extractDate(event.timestamp);
+          if (!date || !isInRange2(date, range)) {
+            continue;
+          }
+          const normalizedModel = normalizeModelName(compactModelDateSuffix(event.model));
+          const inputTokens = event.usage.input_tokens;
+          const outputTokens = event.usage.output_tokens;
+          const cacheReadTokens = 0;
+          const cacheWriteTokens = 0;
+          const cost = estimateCost(normalizedModel, inputTokens, outputTokens, cacheReadTokens, cacheWriteTokens);
+          if (!dailyMap.has(date)) {
+            dailyMap.set(date, new Map);
+          }
+          const modelMap = dailyMap.get(date);
+          if (!modelMap.has(normalizedModel)) {
+            modelMap.set(normalizedModel, {
+              model: normalizedModel,
+              inputTokens: 0,
+              outputTokens: 0,
+              cacheReadTokens: 0,
+              cacheWriteTokens: 0,
+              totalTokens: 0,
+              cost: 0
+            });
+          }
+          const breakdown = modelMap.get(normalizedModel);
+          breakdown.inputTokens += inputTokens;
+          breakdown.outputTokens += outputTokens;
+          breakdown.totalTokens += inputTokens + outputTokens;
+          breakdown.cost += cost;
         }
-        const modelMap = dailyMap.get(date);
-        if (!modelMap.has(normalizedModel)) {
-          modelMap.set(normalizedModel, {
-            model: normalizedModel,
-            inputTokens: 0,
-            outputTokens: 0,
-            cacheReadTokens: 0,
-            cacheWriteTokens: 0,
-            totalTokens: 0,
-            cost: 0
-          });
-        }
-        const breakdown = modelMap.get(normalizedModel);
-        breakdown.inputTokens += inputTokens;
-        breakdown.outputTokens += outputTokens;
-        breakdown.totalTokens += inputTokens + outputTokens;
-        breakdown.cost += cost;
+      } catch {
+        continue;
       }
     }
     const daily = [...dailyMap.entries()].sort(([a], [b]) => a.localeCompare(b)).map(([date, modelMap]) => {
@@ -1613,9 +1651,10 @@ function buildInsights(stats, providers) {
   if (stats.topModels.length > 0) {
     const top = stats.topModels[0];
     if (top) {
+      const pct = top.percentage < 1 ? top.percentage * 100 : top.percentage;
       items.push({
         label: "Top Model",
-        value: `${top.model} (${top.percentage.toFixed(1)}%)`
+        value: `${top.model} (${pct.toFixed(1)}%)`
       });
     }
   }
@@ -1710,7 +1749,8 @@ function renderModelChart(topModels2, theme) {
     if (barWidth > 0) {
       children.push(rect(BAR_LABEL_WIDTH, y, barWidth, BAR_HEIGHT, theme.accentSecondary, 3));
     }
-    const valueStr = `${formatNumber(entry.tokens)} (${entry.percentage.toFixed(1)}%)`;
+    const pct = entry.percentage < 1 ? entry.percentage * 100 : entry.percentage;
+    const valueStr = `${formatNumber(entry.tokens)} (${pct.toFixed(1)}%)`;
     children.push(text(BAR_LABEL_WIDTH + barAreaWidth + 8, y + BAR_HEIGHT - 4, valueStr, {
       fill: theme.foreground,
       "font-size": FONT_SIZE_SMALL,
@@ -1723,13 +1763,15 @@ function renderModelChart(topModels2, theme) {
 }
 
 // packages/renderers/dist/svg/svg-renderer.js
+var MIN_SVG_WIDTH = 520;
+
 class SvgRenderer {
   format = "svg";
   async render(output, options) {
     const theme = getTheme(options.theme);
-    const contentWidth = options.width - PADDING * 2;
     let y = PADDING;
     const sections = [];
+    const sectionWidths = [];
     sections.push(group([
       text(PADDING, y + FONT_SIZE_TITLE + 4, "Tokenleak", {
         fill: theme.foreground,
@@ -1767,6 +1809,7 @@ class SvgRenderer {
         endDate: output.dateRange.until
       });
       sections.push(group([heatmap.svg], `translate(${PADDING}, ${y})`));
+      sectionWidths.push(heatmap.width);
       y += heatmap.height + SECTION_GAP;
     }
     sections.push(text(PADDING, y, "Statistics", {
@@ -1778,6 +1821,7 @@ class SvgRenderer {
     y += 16;
     const stats = renderStatsPanel(output.aggregated, theme);
     sections.push(group([stats.svg], `translate(${PADDING}, ${y})`));
+    sectionWidths.push(stats.width);
     y += stats.height + SECTION_GAP;
     if (output.aggregated.dayOfWeek.length > 0) {
       sections.push(text(PADDING, y, "Day of Week", {
@@ -1789,6 +1833,7 @@ class SvgRenderer {
       y += 16;
       const dowChart = renderDayOfWeekChart(output.aggregated.dayOfWeek, theme);
       sections.push(group([dowChart.svg], `translate(${PADDING}, ${y})`));
+      sectionWidths.push(dowChart.width);
       y += dowChart.height + SECTION_GAP;
     }
     if (output.aggregated.topModels.length > 0) {
@@ -1801,6 +1846,7 @@ class SvgRenderer {
       y += 16;
       const modelChart = renderModelChart(output.aggregated.topModels, theme);
       sections.push(group([modelChart.svg], `translate(${PADDING}, ${y})`));
+      sectionWidths.push(modelChart.width);
       y += modelChart.height + SECTION_GAP;
     }
     if (options.showInsights) {
@@ -1813,12 +1859,15 @@ class SvgRenderer {
       y += 16;
       const insights = renderInsightsPanel(output.aggregated, output.providers, theme);
       sections.push(group([insights.svg], `translate(${PADDING}, ${y})`));
+      sectionWidths.push(insights.width);
       y += insights.height + SECTION_GAP;
     }
     const totalHeight = y + PADDING;
+    const maxContentWidth = sectionWidths.length > 0 ? Math.max(...sectionWidths) : MIN_SVG_WIDTH - PADDING * 2;
+    const svgWidth = Math.max(maxContentWidth + PADDING * 2, MIN_SVG_WIDTH);
     const svgContent = [
-      `<svg xmlns="http://www.w3.org/2000/svg" width="${options.width}" height="${totalHeight}" viewBox="0 0 ${options.width} ${totalHeight}">`,
-      rect(0, 0, options.width, totalHeight, theme.background, 8),
+      `<svg xmlns="http://www.w3.org/2000/svg" width="${svgWidth}" height="${totalHeight}" viewBox="0 0 ${svgWidth} ${totalHeight}">`,
+      rect(0, 0, svgWidth, totalHeight, theme.background, 8),
       ...sections,
       "</svg>"
     ].join(`
@@ -1849,6 +1898,340 @@ var CODES = {
   dim: `${ESC}2m`,
   reset: `${ESC}0m`
 };
+function colorize(text2, color, noColor2) {
+  if (noColor2) {
+    return text2;
+  }
+  return `${CODES[color]}${text2}${CODES.reset}`;
+}
+var HEATMAP_BLOCKS = {
+  FULL: "\u2588",
+  DARK: "\u2593",
+  MEDIUM: "\u2592",
+  LIGHT: "\u2591",
+  EMPTY: " "
+};
+function intensityBlock(value, max) {
+  if (max <= 0 || value <= 0)
+    return HEATMAP_BLOCKS.EMPTY;
+  const ratio = value / max;
+  if (ratio >= 0.75)
+    return HEATMAP_BLOCKS.FULL;
+  if (ratio >= 0.5)
+    return HEATMAP_BLOCKS.DARK;
+  if (ratio >= 0.25)
+    return HEATMAP_BLOCKS.MEDIUM;
+  return HEATMAP_BLOCKS.LIGHT;
+}
+function intensityColor(value, max) {
+  if (max <= 0 || value <= 0)
+    return "dim";
+  const ratio = value / max;
+  if (ratio >= 0.75)
+    return "green";
+  if (ratio >= 0.5)
+    return "yellow";
+  if (ratio >= 0.25)
+    return "cyan";
+  return "dim";
+}
+
+// packages/renderers/dist/terminal/heatmap.js
+var DAY_LABELS3 = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+var MONTH_LABELS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+var DAY_LABEL_WIDTH2 = 4;
+var LEGEND_TEXT = "Less";
+var LEGEND_TEXT_MORE = "More";
+function buildUsageMap(daily) {
+  const map = new Map;
+  for (const entry of daily) {
+    map.set(entry.date, (map.get(entry.date) ?? 0) + entry.totalTokens);
+  }
+  return map;
+}
+function renderTerminalHeatmap(daily, options) {
+  if (daily.length === 0) {
+    return "  No usage data available.";
+  }
+  const usageMap = buildUsageMap(daily);
+  const maxTokens = Math.max(...usageMap.values(), 0);
+  const dates = daily.map((d) => d.date).sort();
+  const startDate = new Date(dates[0]);
+  const endDate = new Date(dates[dates.length - 1]);
+  const alignedStart = new Date(startDate);
+  alignedStart.setDate(alignedStart.getDate() - alignedStart.getDay());
+  const weeks = [];
+  const current = new Date(alignedStart);
+  while (current <= endDate) {
+    const week = [];
+    for (let d = 0;d < 7; d++) {
+      week.push(new Date(current));
+      current.setDate(current.getDate() + 1);
+    }
+    weeks.push(week);
+  }
+  const availableWidth = options.width - DAY_LABEL_WIDTH2;
+  const maxWeeks = Math.min(weeks.length, availableWidth);
+  const displayWeeks = weeks.slice(Math.max(0, weeks.length - maxWeeks));
+  const lines = [];
+  let monthHeader = " ".repeat(DAY_LABEL_WIDTH2);
+  let lastMonth = -1;
+  for (const week of displayWeeks) {
+    const month = week[0].getMonth();
+    if (month !== lastMonth) {
+      monthHeader += MONTH_LABELS[month];
+      lastMonth = month;
+      const labelLen = MONTH_LABELS[month].length;
+    } else {
+      monthHeader += " ";
+    }
+  }
+  if (monthHeader.length > options.width) {
+    monthHeader = monthHeader.slice(0, options.width);
+  }
+  lines.push(monthHeader);
+  for (let dayIdx = 0;dayIdx < 7; dayIdx++) {
+    const label = dayIdx % 2 === 1 ? DAY_LABELS3[dayIdx] : "   ";
+    let line = label + " ";
+    line = line.slice(0, DAY_LABEL_WIDTH2);
+    for (const week of displayWeeks) {
+      const date = week[dayIdx];
+      if (!date || date > endDate || date < startDate) {
+        line += " ";
+        continue;
+      }
+      const dateStr = formatDate(date);
+      const tokens = usageMap.get(dateStr) ?? 0;
+      const block = intensityBlock(tokens, maxTokens);
+      const color = intensityColor(tokens, maxTokens);
+      line += colorize(block, color, options.noColor);
+    }
+    lines.push(line);
+  }
+  const legendBlocks = [
+    HEATMAP_BLOCKS.EMPTY,
+    HEATMAP_BLOCKS.LIGHT,
+    HEATMAP_BLOCKS.MEDIUM,
+    HEATMAP_BLOCKS.DARK,
+    HEATMAP_BLOCKS.FULL
+  ];
+  const legend = `${" ".repeat(DAY_LABEL_WIDTH2)}${LEGEND_TEXT} ${legendBlocks.join("")} ${LEGEND_TEXT_MORE}`;
+  lines.push(legend);
+  return lines.join(`
+`);
+}
+function formatDate(date) {
+  const y = date.getFullYear();
+  const m = String(date.getMonth() + 1).padStart(2, "0");
+  const d = String(date.getDate()).padStart(2, "0");
+  return `${y}-${m}-${d}`;
+}
+
+// packages/renderers/dist/terminal/dashboard.js
+var BOX_H = "\u2500";
+var BOX_V = "\u2502";
+var BOX_TL = "\u250C";
+var BOX_TR = "\u2510";
+var BOX_BL = "\u2514";
+var BOX_BR = "\u2518";
+var DAY_NAMES2 = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+var BAR_CHAR = "\u2588";
+var MAX_BAR_LENGTH = 20;
+function formatTokens(count) {
+  if (count >= 1e6) {
+    return `${(count / 1e6).toFixed(1)}M`;
+  }
+  if (count >= 1000) {
+    return `${(count / 1000).toFixed(0)}K`;
+  }
+  return String(count);
+}
+function formatCost2(cost) {
+  return `$${cost.toFixed(2)}`;
+}
+function formatPercent2(rate) {
+  return `${(rate * 100).toFixed(1)}%`;
+}
+function divider(width) {
+  return BOX_H.repeat(width);
+}
+function boxedHeader(title, width, noColor2) {
+  const inner = width - 2;
+  const padded = ` ${title} `;
+  const remaining = Math.max(0, inner - padded.length);
+  const left = Math.floor(remaining / 2);
+  const right = remaining - left;
+  const content = `${BOX_H.repeat(left)}${padded}${BOX_H.repeat(right)}`;
+  const top = `${BOX_TL}${BOX_H.repeat(inner)}${BOX_TR}`;
+  const headerLine = `${BOX_V}${colorize(content, "bold", noColor2)}${BOX_V}`;
+  const bottom = `${BOX_BL}${BOX_H.repeat(inner)}${BOX_BR}`;
+  return [top, headerLine, bottom].join(`
+`);
+}
+function dayBar(tokens, maxTokens, noColor2) {
+  if (maxTokens <= 0)
+    return "";
+  const length = Math.round(tokens / maxTokens * MAX_BAR_LENGTH);
+  const bar = BAR_CHAR.repeat(length);
+  return colorize(bar, "green", noColor2);
+}
+function renderStats(stats, width, noColor2) {
+  const lines = [];
+  const labelWidth = 20;
+  const entries = [
+    ["Current Streak", `${stats.currentStreak}d`],
+    ["Longest Streak", `${stats.longestStreak}d`],
+    ["Total Tokens", formatTokens(stats.totalTokens)],
+    ["Total Cost", formatCost2(stats.totalCost)],
+    ["30d Tokens", formatTokens(stats.rolling30dTokens)],
+    ["30d Cost", formatCost2(stats.rolling30dCost)],
+    ["7d Tokens", formatTokens(stats.rolling7dTokens)],
+    ["7d Cost", formatCost2(stats.rolling7dCost)],
+    ["Avg Daily Tokens", formatTokens(stats.averageDailyTokens)],
+    ["Avg Daily Cost", formatCost2(stats.averageDailyCost)],
+    ["Cache Hit Rate", formatPercent2(stats.cacheHitRate)],
+    ["Active Days", `${stats.activeDays} / ${stats.totalDays}`]
+  ];
+  if (stats.peakDay) {
+    entries.push(["Peak Day", `${stats.peakDay.date} (${formatTokens(stats.peakDay.tokens)})`]);
+  }
+  for (const [label, value] of entries) {
+    const line = `  ${label.padEnd(labelWidth)} ${colorize(value, "cyan", noColor2)}`;
+    lines.push(line.length > width ? line.slice(0, width) : line);
+  }
+  return lines.join(`
+`);
+}
+function renderDayOfWeek(stats, width, noColor2) {
+  const lines = [];
+  const maxTokens = Math.max(...stats.dayOfWeek.map((d) => d.tokens), 0);
+  for (const entry of stats.dayOfWeek) {
+    const label = DAY_NAMES2[entry.day] ?? `Day${entry.day}`;
+    const bar = dayBar(entry.tokens, maxTokens, noColor2);
+    const tokenStr = formatTokens(entry.tokens);
+    const line = `  ${label}  ${bar} ${tokenStr}`;
+    lines.push(line.length > width ? line.slice(0, width) : line);
+  }
+  return lines.join(`
+`);
+}
+function renderTopModels(stats, width, noColor2) {
+  const lines = [];
+  for (const model of stats.topModels.slice(0, 5)) {
+    const pct = formatPercent2(model.percentage);
+    const tokens = formatTokens(model.tokens);
+    const line = `  ${colorize(model.model, "yellow", noColor2)}  ${tokens}  ${pct}`;
+    lines.push(line.length > width ? line.slice(0, width) : line);
+  }
+  return lines.join(`
+`);
+}
+function renderInsights(stats, noColor2) {
+  const insights = [];
+  if (stats.currentStreak > 7) {
+    insights.push(`You have a ${stats.currentStreak}-day coding streak going!`);
+  }
+  if (stats.cacheHitRate > 0.5) {
+    insights.push(`Cache hit rate is ${formatPercent2(stats.cacheHitRate)} - good cache reuse.`);
+  }
+  if (stats.cacheHitRate < 0.1 && stats.totalTokens > 0) {
+    insights.push("Cache hit rate is low - consider enabling prompt caching.");
+  }
+  if (stats.peakDay) {
+    insights.push(`Peak usage was on ${stats.peakDay.date} with ${formatTokens(stats.peakDay.tokens)} tokens.`);
+  }
+  if (insights.length === 0)
+    return "";
+  return insights.map((i) => `  ${colorize("*", "green", noColor2)} ${i}`).join(`
+`);
+}
+function renderProviderSection(provider, stats, width, noColor2, showInsights) {
+  const sections = [];
+  sections.push(boxedHeader(provider.displayName, width, noColor2));
+  sections.push("");
+  sections.push(colorize("  Heatmap", "bold", noColor2));
+  sections.push(renderTerminalHeatmap(provider.daily, { width, noColor: noColor2 }));
+  sections.push("");
+  sections.push(colorize("  Stats", "bold", noColor2));
+  sections.push(renderStats(stats, width, noColor2));
+  if (stats.dayOfWeek.length > 0) {
+    sections.push("");
+    sections.push(colorize("  Day of Week", "bold", noColor2));
+    sections.push(renderDayOfWeek(stats, width, noColor2));
+  }
+  if (stats.topModels.length > 0) {
+    sections.push("");
+    sections.push(colorize("  Top Models", "bold", noColor2));
+    sections.push(renderTopModels(stats, width, noColor2));
+  }
+  if (showInsights) {
+    const insightsText = renderInsights(stats, noColor2);
+    if (insightsText) {
+      sections.push("");
+      sections.push(colorize("  Insights", "bold", noColor2));
+      sections.push(insightsText);
+    }
+  }
+  return sections.join(`
+`);
+}
+function renderDashboard(output, options) {
+  const width = options.width;
+  const noColor2 = options.noColor;
+  const sections = [];
+  sections.push(boxedHeader("Tokenleak", width, noColor2));
+  sections.push("");
+  if (output.providers.length === 0) {
+    sections.push("  No provider data available.");
+    return sections.join(`
+`);
+  }
+  for (let i = 0;i < output.providers.length; i++) {
+    const provider = output.providers[i];
+    sections.push(renderProviderSection(provider, output.aggregated, width, noColor2, options.showInsights));
+    if (i < output.providers.length - 1) {
+      sections.push("");
+      sections.push(divider(width));
+      sections.push("");
+    }
+  }
+  if (output.providers.length > 1) {
+    sections.push("");
+    sections.push(divider(width));
+    sections.push("");
+    sections.push(boxedHeader("Overall", width, noColor2));
+    sections.push("");
+    sections.push(renderStats(output.aggregated, width, noColor2));
+  }
+  return sections.join(`
+`);
+}
+
+// packages/renderers/dist/terminal/oneliner.js
+function renderOneliner(output, _options) {
+  const streak = output.aggregated.currentStreak;
+  const tokens = formatTokens(output.aggregated.totalTokens);
+  const cost = formatCost2(output.aggregated.totalCost);
+  const providerCount = output.providers.length;
+  return `\uD83D\uDD25 ${streak}d streak | ${tokens} tokens | ${cost} | ${providerCount} provider${providerCount !== 1 ? "s" : ""}`;
+}
+
+// packages/renderers/dist/terminal/terminal-renderer.js
+var MIN_DASHBOARD_WIDTH = 40;
+
+class TerminalRenderer {
+  format = "terminal";
+  async render(output, options) {
+    const effectiveOptions = {
+      ...options,
+      noColor: options.noColor
+    };
+    if (effectiveOptions.width < MIN_DASHBOARD_WIDTH) {
+      return renderOneliner(output, effectiveOptions);
+    }
+    return renderDashboard(output, effectiveOptions);
+  }
+}
 // packages/cli/src/config.ts
 import { readFileSync as readFileSync2 } from "fs";
 import { join as join4 } from "path";
@@ -2129,8 +2512,14 @@ function getRenderer(format) {
   switch (format) {
     case "json":
       return new JsonRenderer;
+    case "svg":
+      return new SvgRenderer;
+    case "terminal":
+      return new TerminalRenderer;
+    case "png":
+      return new PngRenderer;
     default:
-      throw new TokenleakError(`Format "${format}" is not yet supported. Available formats: json`);
+      throw new TokenleakError(`Format "${format}" is not supported. Available formats: json, svg, png, terminal`);
   }
 }
 async function loadAndAggregate(range, providers) {