claude-contextline 2.0.0 → 2.0.1

package/dist/index.js

@@ -43,9 +43,8 @@ function getEnvironmentInfo(hookData) {
   return {
     directory: getDirectoryName(cwd),
     gitBranch: getGitBranch(cwd),
-    gitDirty: isGitDirty(cwd),
     model: getModelName(hookData),
-    contextPercent: getContextPercent(hookData)
+    usedPercentage: getUsedPercentage(hookData)
   };
 }
 function getDirectoryName(cwd) {
@@ -57,198 +56,84 @@ function getGitBranch(cwd) {
     const branch = execSync("git rev-parse --abbrev-ref HEAD", {
       cwd,
       encoding: "utf8",
-      stdio: ["pipe", "pipe", "pipe"]
+      stdio: ["pipe", "pipe", "pipe"],
+      env: { ...process.env, GIT_OPTIONAL_LOCKS: "0" }
     }).trim();
     if (branch === "HEAD") {
-      return execSync("git rev-parse --short HEAD", {
-        cwd,
-        encoding: "utf8",
-        stdio: ["pipe", "pipe", "pipe"]
-      }).trim();
+      return null;
     }
     return branch;
   } catch {
     return null;
   }
 }
-function isGitDirty(cwd) {
-  try {
-    const status = execSync("git status --porcelain", {
-      cwd,
-      encoding: "utf8",
-      stdio: ["pipe", "pipe", "pipe"]
-    });
-    return status.trim().length > 0;
-  } catch {
-    return false;
-  }
-}
 function getModelName(hookData) {
   const displayName = hookData.model?.display_name || "Claude";
   return displayName.replace(/^Claude\s+/, "");
 }
-function getContextPercent(hookData) {
+function getUsedPercentage(hookData) {
   const ctx = hookData.context_window;
-  if (!ctx?.current_usage || !ctx.context_window_size) {
-    return 0;
-  }
-  const usage = ctx.current_usage;
-  const totalTokens = (usage.input_tokens || 0) + (usage.cache_creation_input_tokens || 0) + (usage.cache_read_input_tokens || 0);
-  return Math.round(totalTokens / ctx.context_window_size * 100);
-}
-
-// src/utils/constants.ts
-var SYMBOLS = {
-  arrow: "\uE0B0",
-  // Powerline right arrow
-  branch: "\uE0A0",
-  // Git branch icon
-  model: "\u2731",
-  // Heavy asterisk ✱
-  context: "\u25EB",
-  // White square with vertical bisecting line ◫
-  dirty: "\u25CF"
-  // Dirty indicator
-};
-var TEXT_SYMBOLS = {
-  arrow: "",
-  branch: "",
-  model: "",
-  context: "",
-  dirty: "*"
-};
-
-// src/themes/index.ts
-var darkTheme = {
-  directory: { bg: "#8b4513", fg: "#ffffff" },
-  // Brown, white
-  git: { bg: "#404040", fg: "#ffffff" },
-  // Dark gray, white
-  model: { bg: "#2d2d2d", fg: "#ffffff" },
-  // Very dark gray, white
-  context: { bg: "#2a2a2a", fg: "#87ceeb" },
-  // Nearly black, sky blue
-  warning: { bg: "#d75f00", fg: "#ffffff" },
-  // Orange, white (80%+)
-  critical: { bg: "#af0000", fg: "#ffffff" }
-  // Red, white (100%+)
-};
-function hexToAnsi256(hex) {
-  const r = parseInt(hex.slice(1, 3), 16);
-  const g = parseInt(hex.slice(3, 5), 16);
-  const b = parseInt(hex.slice(5, 7), 16);
-  if (r === g && g === b) {
-    if (r < 8) return 16;
-    if (r > 248) return 231;
-    return Math.round((r - 8) / 247 * 24) + 232;
+  if (!ctx) return null;
+  if (ctx.used_percentage != null) {
+    return Math.floor(ctx.used_percentage);
   }
-  const ri = Math.round(r / 255 * 5);
-  const gi = Math.round(g / 255 * 5);
-  const bi = Math.round(b / 255 * 5);
-  return 16 + 36 * ri + 6 * gi + bi;
-}
-var ansi = {
-  fg: (hex) => `\x1B[38;5;${hexToAnsi256(hex)}m`,
-  bg: (hex) => `\x1B[48;5;${hexToAnsi256(hex)}m`,
-  reset: "\x1B[0m"
-};
-function getContextColors(percent) {
-  if (percent >= 100) {
-    return darkTheme.critical;
-  } else if (percent >= 80) {
-    return darkTheme.warning;
+  if (ctx.current_usage && ctx.context_window_size) {
+    const usage = ctx.current_usage;
+    const totalTokens = (usage.input_tokens || 0) + (usage.cache_creation_input_tokens || 0) + (usage.cache_read_input_tokens || 0);
+    return Math.floor(totalTokens / ctx.context_window_size * 100);
   }
-  return darkTheme.context;
+  return null;
 }
 
 // src/renderer.ts
-function detectNerdFontSupport() {
-  if (process.env.NERD_FONTS === "1") return true;
-  if (process.env.NERD_FONTS === "0") return false;
-  const termProgram = process.env.TERM_PROGRAM?.toLowerCase() ?? "";
-  const nerdFontTerminals = [
-    "warp",
-    "iterm",
-    "hyper",
-    "kitty",
-    "alacritty",
-    "ghostty"
-  ];
-  return nerdFontTerminals.some((t) => termProgram.includes(t));
-}
-var Renderer = class {
-  symbols = detectNerdFontSupport() ? SYMBOLS : TEXT_SYMBOLS;
-  noArrows;
-  constructor(options = {}) {
-    this.noArrows = options.noArrows ?? false;
+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 BAR_WIDTH = 10;
+var FILLED_CHAR = "\u2588";
+var EMPTY_CHAR = "\u2591";
+function render(envInfo) {
+  let out = "";
+  let modelCol = 0;
+  if (envInfo.usedPercentage != null) {
+    const pct = Math.max(0, envInfo.usedPercentage);
+    const pctStr = String(pct);
+    const nFilled = Math.min(
+      Math.floor(pct * BAR_WIDTH / 100),
+      BAR_WIDTH
+    );
+    const nEmpty = BAR_WIDTH - nFilled;
+    const filled = FILLED_CHAR.repeat(nFilled);
+    const empty = EMPTY_CHAR.repeat(nEmpty);
+    out += `${BLUE}[${filled}${GRAY}${empty}${BLUE}] ${pctStr}%`;
+    modelCol = 16 + pctStr.length;
   }
-  /**
-   * Render the complete statusline
-   */
-  render(envInfo) {
-    const segments = this.buildSegments(envInfo);
-    if (segments.length === 0) {
-      return "";
-    }
-    return this.renderPowerline(segments);
+  if (out.length > 0) {
+    out += "  ";
   }
-  /**
-   * Build segments based on environment info
-   */
-  buildSegments(envInfo) {
-    const segments = [];
-    segments.push({
-      text: ` ${envInfo.directory} `,
-      colors: darkTheme.directory
-    });
-    if (envInfo.gitBranch) {
-      const dirty = envInfo.gitDirty ? ` ${this.symbols.dirty}` : "";
-      segments.push({
-        text: ` ${this.symbols.branch} ${envInfo.gitBranch}${dirty} `,
-        colors: darkTheme.git
-      });
-    }
-    segments.push({
-      text: ` ${this.symbols.model} ${envInfo.model} `,
-      colors: darkTheme.model
-    });
-    const contextColors = getContextColors(envInfo.contextPercent);
-    segments.push({
-      text: ` ${this.symbols.context} ${envInfo.contextPercent}% `,
-      colors: contextColors
-    });
-    return segments;
+  out += `${RED}${envInfo.model}`;
+  out += "\n";
+  if (envInfo.gitBranch) {
+    const branchText = `(${envInfo.gitBranch})`;
+    out += `${RED}${branchText}`;
+    const gap = Math.max(2, modelCol - branchText.length);
+    out += " ".repeat(gap);
+  } else {
+    out += " ".repeat(modelCol);
   }
-  /**
-   * Render segments with powerline arrows
-   */
-  renderPowerline(segments) {
-    let output = "";
-    for (let i = 0; i < segments.length; i++) {
-      const seg = segments[i];
-      const nextColors = i < segments.length - 1 ? segments[i + 1].colors : null;
-      output += ansi.bg(seg.colors.bg) + ansi.fg(seg.colors.fg) + seg.text;
-      output += ansi.reset;
-      if (this.noArrows) {
-      } else if (nextColors) {
-        output += ansi.fg(seg.colors.bg) + ansi.bg(nextColors.bg) + this.symbols.arrow;
-      } else {
-        output += ansi.fg(seg.colors.bg) + this.symbols.arrow;
-      }
-    }
-    output += ansi.reset;
-    return output;
-  }
-};
+  out += `${BLUE}${envInfo.directory}`;
+  out += RESET;
+  return out;
+}
 
 // src/index.ts
 async function main() {
   try {
-    const noArrows = process.argv.includes("--no-arrows");
     const hookData = await readHookData();
     const envInfo = getEnvironmentInfo(hookData);
-    const renderer = new Renderer({ noArrows });
-    const output = renderer.render(envInfo);
+    const output = render(envInfo);
     process.stdout.write(output);
   } catch {
     process.exit(0);

package/package.json

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