claude-contextline 2.0.1 → 2.1.0

package/README.md

@@ -23,8 +23,15 @@ Add to your Claude Code settings (`~/.claude/settings.json`):
 (main)            myproject
 ```
 
+Colors track your active [herdr](https://github.com/) theme, read from
+`~/.config/herdr/config.toml` (respects `$XDG_CONFIG_HOME` and
+`$HERDR_CONFIG_PATH`) on every render — including `[theme.custom]` overrides.
+All of herdr's built-in themes are supported (catppuccin, tokyo-night, dracula,
+nord, gruvbox, solarized, kanagawa, rosé-pine, vesper, …); if no config is found
+it falls back to Catppuccin Mocha.
+
 - **Line 1**: Context window battery bar (blue) with usage percentage, model name (red)
-- **Line 2**: Git branch (red), working directory (blue) aligned below the model
+- **Line 2**: Git branch (mauve), working directory (blue) aligned below the model
 
 ## Requirements
 

package/dist/index.js

@@ -85,16 +85,175 @@ function getUsedPercentage(hookData) {
   return null;
 }
 
+// src/theme.ts
+import { readFileSync } from "fs";
+import { homedir } from "os";
+import { join } from "path";
+var rgb = (r, g, b) => ({ kind: "rgb", r, g, b });
+var ansi = (code) => ({ kind: "ansi", code });
+var RESET_COLOR = { kind: "reset" };
+var PALETTES = {
+  catppuccin: { blue: rgb(137, 180, 250), red: rgb(243, 139, 168), mauve: rgb(203, 166, 247), overlay0: rgb(108, 112, 134) },
+  "catppuccin-latte": { blue: rgb(30, 102, 245), red: rgb(210, 15, 57), mauve: rgb(136, 57, 239), overlay0: rgb(156, 160, 176) },
+  terminal: { blue: ansi(34), red: ansi(91), mauve: ansi(37), overlay0: ansi(37) },
+  "tokyo-night": { blue: rgb(122, 162, 247), red: rgb(247, 118, 142), mauve: rgb(187, 154, 247), overlay0: rgb(86, 95, 137) },
+  "tokyo-night-day": { blue: rgb(46, 125, 233), red: rgb(245, 42, 101), mauve: rgb(120, 71, 189), overlay0: rgb(137, 144, 179) },
+  dracula: { blue: rgb(139, 233, 253), red: rgb(255, 85, 85), mauve: rgb(255, 121, 198), overlay0: rgb(98, 114, 164) },
+  nord: { blue: rgb(129, 161, 193), red: rgb(191, 97, 106), mauve: rgb(180, 142, 173), overlay0: rgb(76, 86, 106) },
+  gruvbox: { blue: rgb(131, 165, 152), red: rgb(251, 73, 52), mauve: rgb(211, 134, 155), overlay0: rgb(146, 131, 116) },
+  "gruvbox-light": { blue: rgb(7, 102, 120), red: rgb(157, 0, 6), mauve: rgb(143, 63, 113), overlay0: rgb(146, 131, 116) },
+  "one-dark": { blue: rgb(97, 175, 239), red: rgb(224, 108, 117), mauve: rgb(198, 120, 221), overlay0: rgb(92, 99, 112) },
+  "one-light": { blue: rgb(64, 120, 242), red: rgb(228, 86, 73), mauve: rgb(166, 38, 164), overlay0: rgb(160, 161, 167) },
+  solarized: { blue: rgb(38, 139, 210), red: rgb(220, 50, 47), mauve: rgb(211, 54, 130), overlay0: rgb(88, 110, 117) },
+  "solarized-light": { blue: rgb(38, 139, 210), red: rgb(220, 50, 47), mauve: rgb(211, 54, 130), overlay0: rgb(147, 161, 161) },
+  kanagawa: { blue: rgb(126, 156, 216), red: rgb(195, 64, 67), mauve: rgb(149, 127, 184), overlay0: rgb(114, 113, 105) },
+  "kanagawa-lotus": { blue: rgb(77, 105, 155), red: rgb(200, 64, 83), mauve: rgb(98, 76, 131), overlay0: rgb(160, 156, 172) },
+  "rose-pine": { blue: rgb(49, 116, 143), red: rgb(235, 111, 146), mauve: rgb(196, 167, 231), overlay0: rgb(110, 106, 134) },
+  "rose-pine-dawn": { blue: rgb(40, 105, 131), red: rgb(180, 99, 122), mauve: rgb(144, 122, 169), overlay0: rgb(152, 147, 165) },
+  vesper: { blue: rgb(176, 176, 176), red: rgb(255, 128, 128), mauve: rgb(255, 209, 168), overlay0: rgb(92, 92, 92) }
+};
+var ALIASES = {
+  "catppuccin-mocha": "catppuccin",
+  latte: "catppuccin-latte",
+  light: "catppuccin-latte",
+  tokyonight: "tokyo-night",
+  "tokyo-day": "tokyo-night-day",
+  "tokyonight-day": "tokyo-night-day",
+  "gruvbox-dark": "gruvbox",
+  onedark: "one-dark",
+  onelight: "one-light",
+  "solarized-dark": "solarized",
+  lotus: "kanagawa-lotus",
+  rosepine: "rose-pine",
+  "rosepine-dawn": "rose-pine-dawn",
+  dawn: "rose-pine-dawn"
+};
+var DEFAULT_THEME = "catppuccin";
+var NAMED_ANSI = {
+  black: 30,
+  red: 31,
+  green: 32,
+  yellow: 33,
+  blue: 34,
+  magenta: 35,
+  purple: 35,
+  cyan: 36,
+  gray: 37,
+  grey: 37,
+  white: 97,
+  darkgray: 90,
+  darkgrey: 90,
+  lightred: 91,
+  lightgreen: 92,
+  lightyellow: 93,
+  lightblue: 94,
+  lightmagenta: 95,
+  lightcyan: 96
+};
+function fg(color) {
+  switch (color.kind) {
+    case "rgb":
+      return `\x1B[38;2;${color.r};${color.g};${color.b}m`;
+    case "ansi":
+      return `\x1B[${color.code}m`;
+    case "reset":
+      return `\x1B[39m`;
+  }
+}
+function parseColor(input) {
+  const s = input.trim().toLowerCase();
+  if (s === "reset" || s === "default" || s === "none" || s === "transparent") {
+    return RESET_COLOR;
+  }
+  if (s.startsWith("#")) {
+    const hex = s.slice(1);
+    if (/^[0-9a-f]{6}$/.test(hex)) {
+      return rgb(parseInt(hex.slice(0, 2), 16), parseInt(hex.slice(2, 4), 16), parseInt(hex.slice(4, 6), 16));
+    }
+    if (/^[0-9a-f]{3}$/.test(hex)) {
+      return rgb(parseInt(hex[0], 16) * 17, parseInt(hex[1], 16) * 17, parseInt(hex[2], 16) * 17);
+    }
+  }
+  const rgbMatch = s.match(/^rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/);
+  if (rgbMatch) {
+    return rgb(Number(rgbMatch[1]), Number(rgbMatch[2]), Number(rgbMatch[3]));
+  }
+  if (s in NAMED_ANSI) {
+    return ansi(NAMED_ANSI[s]);
+  }
+  return ansi(36);
+}
+function configPaths() {
+  const override = process.env.HERDR_CONFIG_PATH;
+  if (override) return [override];
+  const base = process.env.XDG_CONFIG_HOME || join(homedir(), ".config");
+  return [join(base, "herdr", "config.toml"), join(base, "herdr-dev", "config.toml")];
+}
+function parseThemeSection(toml) {
+  const result = { custom: {} };
+  let section = "";
+  for (const rawLine of toml.split(/\r?\n/)) {
+    const line = rawLine.trim();
+    if (!line || line.startsWith("#")) continue;
+    const sectionMatch = line.match(/^\[([^\]]+)\]$/);
+    if (sectionMatch) {
+      section = sectionMatch[1].trim();
+      continue;
+    }
+    const eq = line.indexOf("=");
+    if (eq === -1) continue;
+    const key = line.slice(0, eq).trim();
+    let value = line.slice(eq + 1).trim();
+    if (value.startsWith('"') || value.startsWith("'")) {
+      const quote = value[0];
+      const end = value.indexOf(quote, 1);
+      if (end !== -1) value = value.slice(1, end);
+    } else {
+      const hash = value.indexOf("#");
+      if (hash !== -1) value = value.slice(0, hash).trim();
+    }
+    if (section === "theme" && key === "name") {
+      result.name = value;
+    } else if (section === "theme.custom") {
+      result.custom[key] = value;
+    }
+  }
+  return result;
+}
+function resolvePalette(name) {
+  const normalized = (name ?? DEFAULT_THEME).toLowerCase().replace(/[ _]/g, "-");
+  const canonical = ALIASES[normalized] ?? normalized;
+  return PALETTES[canonical] ?? PALETTES[DEFAULT_THEME];
+}
+function loadHerdrTheme() {
+  let parsed = { custom: {} };
+  for (const path of configPaths()) {
+    try {
+      parsed = parseThemeSection(readFileSync(path, "utf8"));
+      break;
+    } catch {
+    }
+  }
+  const palette = { ...resolvePalette(parsed.name) };
+  for (const token of ["blue", "red", "mauve", "overlay0"]) {
+    const override = parsed.custom[token];
+    if (override) palette[token] = parseColor(override);
+  }
+  return {
+    blue: fg(palette.blue),
+    red: fg(palette.red),
+    mauve: fg(palette.mauve),
+    overlay0: fg(palette.overlay0)
+  };
+}
+
 // src/renderer.ts
-var ESC = "\x1B";
-var RESET = `${ESC}[0m`;
-var BLUE = `${ESC}[38;5;69m`;
-var RED = `${ESC}[38;5;196m`;
-var GRAY = `${ESC}[38;5;243m`;
+var RESET = "\x1B[0m";
 var BAR_WIDTH = 10;
 var FILLED_CHAR = "\u2588";
 var EMPTY_CHAR = "\u2591";
 function render(envInfo) {
+  const { blue: BLUE, red: RED, mauve: MAUVE, overlay0: GRAY } = loadHerdrTheme();
   let out = "";
   let modelCol = 0;
   if (envInfo.usedPercentage != null) {
@@ -117,7 +276,7 @@ function render(envInfo) {
   out += "\n";
   if (envInfo.gitBranch) {
     const branchText = `(${envInfo.gitBranch})`;
-    out += `${RED}${branchText}`;
+    out += `${MAUVE}${branchText}`;
     const gap = Math.max(2, modelCol - branchText.length);
     out += " ".repeat(gap);
   } else {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-contextline",
-  "version": "2.0.1",
+  "version": "2.1.0",
   "description": "Two-line statusline for Claude Code showing context window usage",
   "type": "module",
   "main": "dist/index.js",