tokmon 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 David Ilie
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,69 @@
+# tokmon
+
+Terminal dashboard for Claude Code usage and costs. Refreshes every 2 seconds like `watch`.
+
+Built with [Ink](https://github.com/vadimdemedes/ink), TypeScript.
+
+```
+  ◉ tokmon  ·  refreshing every 2s
+
+  ┃ Claude
+  ┃
+  ┃ Today              $122.78     179.9M tokens
+  ┃ This Week          $356.47     535.4M tokens
+  ┃ This Month        $1293.71       2.1B tokens
+
+  ┃ Active Block  35m remaining
+  ┃
+  ┃ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━──── 88%
+  ┃
+  ┃ $271.05 spent  ·  ~$306.63 proj  ·  $61.33/hr
+
+  ──────────────────────────────────────────────────
+  Total $1293.71                         12:54:49 AM
+```
+
+## Install
+
+```bash
+npm install -g tokmon
+```
+
+## Usage
+
+```bash
+tokmon
+```
+
+Press `Ctrl+C` to exit.
+
+## What It Shows
+
+- **Today / This Week / This Month** — cost and token totals from Claude Code JSONL logs
+- **Active Block** — current 5-hour window with burn rate, projected cost, and time remaining
+- Auto-refreshes every 2 seconds with mtime-based file caching
+
+## How It Works
+
+Reads Claude Code's JSONL session logs directly from `~/.claude/projects/`. Calculates costs using Claude model pricing (Opus, Sonnet, Haiku). Caches file reads by mtime so subsequent refreshes are near-instant.
+
+## Requirements
+
+- Node.js 20+
+- [Claude Code](https://docs.anthropic.com/en/docs/claude-code) (generates usage data in `~/.claude/projects/`)
+
+## Tech Stack
+
+| Tool | Purpose |
+|------|---------|
+| Ink 5 | React terminal UI |
+| TypeScript 5.7+ | Strict mode |
+| tsup | Build |
+
+## Author
+
+By [David Ilie](https://davidilie.com)
+
+## License
+
+[MIT](LICENSE)

package/dist/cli.js

@@ -0,0 +1,328 @@
+#!/usr/bin/env node
+
+// src/cli.tsx
+import { render } from "ink";
+
+// src/app.tsx
+import { useState, useEffect } from "react";
+import { Box, Text } from "ink";
+
+// src/data.ts
+import { readdir, stat as fsStat } from "fs/promises";
+import { createReadStream } from "fs";
+import { createInterface } from "readline";
+import { join } from "path";
+import { homedir } from "os";
+
+// src/format.ts
+function currency(value) {
+  return `$${value.toFixed(2)}`;
+}
+function tokens(value) {
+  if (value >= 1e9) return `${(value / 1e9).toFixed(1)}B`;
+  if (value >= 1e6) return `${(value / 1e6).toFixed(1)}M`;
+  if (value >= 1e3) return `${(value / 1e3).toFixed(1)}K`;
+  return String(value);
+}
+function time(date) {
+  return date.toLocaleTimeString(void 0, {
+    hour: "2-digit",
+    minute: "2-digit",
+    second: "2-digit"
+  });
+}
+function minutes(mins) {
+  const h = Math.floor(mins / 60);
+  const m = Math.round(mins % 60);
+  return h > 0 ? `${h}h ${m}m` : `${m}m`;
+}
+
+// src/data.ts
+var PRICING = {
+  "claude-opus-4": { i: 5e-6, o: 25e-6, cc: 625e-8, cr: 5e-7 },
+  "claude-sonnet-4": { i: 3e-6, o: 15e-6, cc: 375e-8, cr: 3e-7 },
+  "claude-haiku-4": { i: 1e-6, o: 5e-6, cc: 125e-8, cr: 1e-7 }
+};
+var FALLBACK = PRICING["claude-opus-4"];
+var fileCache = /* @__PURE__ */ new Map();
+function getClaudeDirs() {
+  const home = homedir();
+  const dirs = [join(home, ".claude", "projects")];
+  if (process.env.XDG_CONFIG_HOME) {
+    dirs.push(join(process.env.XDG_CONFIG_HOME, "claude", "projects"));
+  } else if (process.platform !== "win32") {
+    dirs.push(join(home, ".config", "claude", "projects"));
+  }
+  if (process.env.APPDATA) {
+    dirs.push(join(process.env.APPDATA, "claude", "projects"));
+  }
+  if (process.env.CLAUDE_CONFIG_DIR) {
+    for (const p of process.env.CLAUDE_CONFIG_DIR.split(process.platform === "win32" ? ";" : ",")) {
+      dirs.push(join(p.trim(), "projects"));
+    }
+  }
+  return dirs;
+}
+function priceFor(model) {
+  for (const [prefix, p] of Object.entries(PRICING)) {
+    if (model.startsWith(prefix)) return p;
+  }
+  return FALLBACK;
+}
+function costOf(model, u) {
+  const p = priceFor(model);
+  return (u.input_tokens ?? 0) * p.i + (u.output_tokens ?? 0) * p.o + (u.cache_creation_input_tokens ?? 0) * p.cc + (u.cache_read_input_tokens ?? 0) * p.cr;
+}
+async function parseFile(path, since) {
+  const entries = [];
+  const rl = createInterface({ input: createReadStream(path), crlfDelay: Infinity });
+  for await (const line of rl) {
+    if (!line.includes('"usage"')) continue;
+    try {
+      const obj = JSON.parse(line);
+      if (obj.type !== "assistant" || !obj.message?.usage) continue;
+      const ts = new Date(obj.timestamp ?? 0).getTime();
+      if (ts < since) continue;
+      const u = obj.message.usage;
+      entries.push({
+        ts,
+        cost: costOf(obj.message.model ?? "", u),
+        tokens: (u.input_tokens ?? 0) + (u.output_tokens ?? 0) + (u.cache_creation_input_tokens ?? 0) + (u.cache_read_input_tokens ?? 0)
+      });
+    } catch {
+    }
+  }
+  return entries;
+}
+async function loadEntries(since) {
+  const all = [];
+  const seen = /* @__PURE__ */ new Set();
+  for (const dir of getClaudeDirs()) {
+    let listing;
+    try {
+      listing = await readdir(dir, { recursive: true });
+    } catch {
+      continue;
+    }
+    const files = listing.filter((f) => f.endsWith(".jsonl"));
+    await Promise.all(files.map(async (f) => {
+      const path = join(dir, f);
+      if (seen.has(path)) return;
+      seen.add(path);
+      try {
+        const s = await fsStat(path);
+        if (s.mtimeMs < since) return;
+        const cached = fileCache.get(path);
+        if (cached && cached.mtimeMs === s.mtimeMs) {
+          all.push(...cached.data);
+          return;
+        }
+        const data = await parseFile(path, since);
+        fileCache.set(path, { mtimeMs: s.mtimeMs, data });
+        all.push(...data);
+      } catch {
+      }
+    }));
+  }
+  return all;
+}
+function sum(entries) {
+  let cost = 0, tokens2 = 0;
+  for (const e of entries) {
+    cost += e.cost;
+    tokens2 += e.tokens;
+  }
+  return { cost, tokens: tokens2 };
+}
+async function fetchUsage() {
+  const now = Date.now();
+  const d = /* @__PURE__ */ new Date();
+  const monthStart = new Date(d.getFullYear(), d.getMonth(), 1).getTime();
+  const todayStart = new Date(d.getFullYear(), d.getMonth(), d.getDate()).getTime();
+  const weekDay = d.getDay();
+  const weekStart = new Date(d.getFullYear(), d.getMonth(), d.getDate() - (weekDay === 0 ? 6 : weekDay - 1)).getTime();
+  const entries = await loadEntries(monthStart);
+  const fiveHoursAgo = now - 5 * 36e5;
+  const blockEntries = entries.filter((e) => e.ts >= fiveHoursAgo);
+  let block = null;
+  if (blockEntries.length > 0) {
+    const spent = blockEntries.reduce((s, e) => s + e.cost, 0);
+    const oldest = Math.min(...blockEntries.map((e) => e.ts));
+    const elapsedHrs = (now - oldest) / 36e5;
+    const burnRate = elapsedHrs > 0 ? spent / elapsedHrs : 0;
+    const remainMs = Math.max(0, oldest + 5 * 36e5 - now);
+    const percent = Math.min(100, (now - oldest) / (5 * 36e5) * 100);
+    block = { spent, projected: burnRate * 5, burnRate, percent, remaining: minutes(remainMs / 6e4) };
+  }
+  return {
+    today: sum(entries.filter((e) => e.ts >= todayStart)),
+    week: sum(entries.filter((e) => e.ts >= weekStart)),
+    month: sum(entries),
+    block
+  };
+}
+
+// src/app.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var INTERVAL = 2e3;
+function App() {
+  const [data, setData] = useState(null);
+  const [error, setError] = useState(null);
+  const [updated, setUpdated] = useState(/* @__PURE__ */ new Date());
+  useEffect(() => {
+    let active = true;
+    const load = async () => {
+      try {
+        const result = await fetchUsage();
+        if (active) {
+          setData(result);
+          setError(null);
+          setUpdated(/* @__PURE__ */ new Date());
+        }
+      } catch (e) {
+        if (active) setError(e instanceof Error ? e.message : String(e));
+      }
+    };
+    load();
+    const id = setInterval(load, INTERVAL);
+    return () => {
+      active = false;
+      clearInterval(id);
+    };
+  }, []);
+  if (error) return /* @__PURE__ */ jsx(Box, { padding: 1, children: /* @__PURE__ */ jsx(Text, { color: "red", children: error }) });
+  if (!data) return /* @__PURE__ */ jsx(Box, { padding: 1, children: /* @__PURE__ */ jsx(Text, { dimColor: true, children: "Loading..." }) });
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
+    /* @__PURE__ */ jsx(Header, {}),
+    /* @__PURE__ */ jsx(Box, { height: 1 }),
+    /* @__PURE__ */ jsx(UsageSection, { color: "green", title: "Claude", data }),
+    data.block && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Box, { height: 1 }),
+      /* @__PURE__ */ jsx(BlockSection, { block: data.block })
+    ] }),
+    /* @__PURE__ */ jsx(Box, { height: 1 }),
+    /* @__PURE__ */ jsx(Divider, {}),
+    /* @__PURE__ */ jsx(Footer, { cost: data.month.cost, updated })
+  ] });
+}
+function Header() {
+  return /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsxs(Text, { bold: true, color: "greenBright", children: [
+      "\u25C9",
+      " tokmon"
+    ] }),
+    /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+      "  \xB7  refreshing every ",
+      INTERVAL / 1e3,
+      "s"
+    ] })
+  ] });
+}
+function UsageSection({ color, title, data }) {
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      flexDirection: "column",
+      paddingLeft: 1,
+      borderStyle: "bold",
+      borderColor: color,
+      borderRight: false,
+      borderTop: false,
+      borderBottom: false,
+      children: [
+        /* @__PURE__ */ jsx(Text, { bold: true, children: title }),
+        /* @__PURE__ */ jsx(Box, { height: 1 }),
+        /* @__PURE__ */ jsx(Row, { label: "Today", summary: data.today }),
+        /* @__PURE__ */ jsx(Row, { label: "This Week", summary: data.week }),
+        /* @__PURE__ */ jsx(Row, { label: "This Month", summary: data.month })
+      ]
+    }
+  );
+}
+function BlockSection({ block }) {
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      flexDirection: "column",
+      paddingLeft: 1,
+      borderStyle: "bold",
+      borderColor: "yellow",
+      borderRight: false,
+      borderTop: false,
+      borderBottom: false,
+      children: [
+        /* @__PURE__ */ jsxs(Box, { children: [
+          /* @__PURE__ */ jsx(Text, { bold: true, children: "Active Block" }),
+          /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+            "  ",
+            block.remaining,
+            " remaining"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(Box, { height: 1 }),
+        /* @__PURE__ */ jsxs(Box, { children: [
+          /* @__PURE__ */ jsx(Bar, { percent: block.percent, width: 36 }),
+          /* @__PURE__ */ jsx(Text, { children: " " }),
+          /* @__PURE__ */ jsxs(Text, { bold: true, children: [
+            Math.round(block.percent),
+            "%"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(Box, { marginTop: 1, children: [
+          /* @__PURE__ */ jsx(Text, { color: "yellow", children: currency(block.spent) }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: " spent" }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "  \xB7  " }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "~" }),
+          /* @__PURE__ */ jsx(Text, { children: currency(block.projected) }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: " proj" }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "  \xB7  " }),
+          /* @__PURE__ */ jsx(Text, { color: "red", children: currency(block.burnRate) }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "/hr" })
+        ] })
+      ]
+    }
+  );
+}
+function Row({ label, summary }) {
+  return /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsx(Box, { width: 14, children: /* @__PURE__ */ jsx(Text, { dimColor: true, children: label }) }),
+    /* @__PURE__ */ jsx(Box, { width: 12, justifyContent: "flex-end", children: /* @__PURE__ */ jsx(Text, { bold: true, color: "yellow", children: currency(summary.cost) }) }),
+    /* @__PURE__ */ jsx(Box, { width: 18, justifyContent: "flex-end", children: /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+      tokens(summary.tokens),
+      " tokens"
+    ] }) })
+  ] });
+}
+function Bar({ percent, width = 36 }) {
+  const filled = Math.round(percent / 100 * width);
+  return /* @__PURE__ */ jsxs(Text, { children: [
+    /* @__PURE__ */ jsx(Text, { color: "greenBright", children: "\u2501".repeat(filled) }),
+    /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\u2500".repeat(width - filled) })
+  ] });
+}
+function Divider() {
+  return /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\u2500".repeat(50) });
+}
+function Footer({ cost, updated }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(Box, { justifyContent: "space-between", width: 50, children: [
+      /* @__PURE__ */ jsxs(Box, { children: [
+        /* @__PURE__ */ jsx(Text, { dimColor: true, children: "Total " }),
+        /* @__PURE__ */ jsx(Text, { bold: true, color: "yellowBright", children: currency(cost) })
+      ] }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: time(updated) })
+    ] }),
+    /* @__PURE__ */ jsxs(Box, { marginTop: 1, children: [
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: "by " }),
+      /* @__PURE__ */ jsx(Text, { children: "David Ilie" }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: " (" }),
+      /* @__PURE__ */ jsx(Text, { color: "cyan", children: "davidilie.com" }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: ")" })
+    ] })
+  ] });
+}
+
+// src/cli.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var { waitUntilExit } = render(/* @__PURE__ */ jsx2(App, {}));
+await waitUntilExit();

package/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "tokmon",
+  "version": "0.1.0",
+  "description": "Terminal dashboard for Claude Code usage and costs",
+  "type": "module",
+  "bin": {
+    "tokmon": "dist/cli.js"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsx src/cli.tsx"
+  },
+  "dependencies": {
+    "ink": "^5.0.0",
+    "react": "^18.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.0.0",
+    "tsup": "^8.0.0",
+    "tsx": "^4.0.0",
+    "typescript": "^5.7.0"
+  },
+  "engines": {
+    "node": ">=20"
+  },
+  "author": "David Ilie <david@davidilie.com> (https://davidilie.com)",
+  "homepage": "https://github.com/DavidIlie/tokmon",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/DavidIlie/tokmon.git"
+  },
+  "keywords": [
+    "claude",
+    "claude-code",
+    "usage",
+    "tokens",
+    "cost",
+    "terminal",
+    "dashboard",
+    "cli"
+  ],
+  "license": "MIT"
+}