cc-statusline-pro 1.0.0

package/cli.js

@@ -0,0 +1,476 @@
+#!/usr/bin/env node
+
+const fs = require('fs');
+const path = require('path');
+
+const command = process.argv[2];
+
+if (command === 'init') {
+  initStatusline();
+} else {
+  showHelp();
+}
+
+function showHelp() {
+  console.log(`
+Claude Code Statusline Installer
+=================================
+
+Usage:
+  npx claude-code-statusline init
+
+Commands:
+  init    Install statusline to current project
+
+Features:
+  - Beautiful colors and progress bars
+  - Real-time usage limits from Anthropic API
+  - Context window tracking
+  - Session time and cost tracking
+  - Code changes (lines added/removed)
+  - Git branch display
+
+Example:
+  cd your-project
+  npx claude-code-statusline init
+`);
+}
+
+function initStatusline() {
+  const cwd = process.cwd();
+  const claudeDir = path.join(cwd, '.claude');
+  const statuslineFile = path.join(claudeDir, 'statusline.js');
+  const settingsFile = path.join(claudeDir, 'settings.json');
+
+  console.log('');
+  console.log('🚀 Installing Claude Code Statusline...');
+  console.log('');
+
+  // Step 1: Create .claude directory if not exists
+  if (!fs.existsSync(claudeDir)) {
+    console.log('📁 Creating .claude directory...');
+    fs.mkdirSync(claudeDir, { recursive: true });
+    console.log('   ✓ Created .claude/');
+  } else {
+    console.log('📁 .claude directory already exists');
+  }
+
+  // Step 2: Copy statusline.js
+  console.log('');
+  console.log('📝 Installing statusline.js...');
+
+  const statuslineContent = getStatuslineTemplate();
+
+  if (fs.existsSync(statuslineFile)) {
+    console.log('   ⚠️  statusline.js already exists');
+    console.log('   💾 Creating backup: statusline.js.backup');
+    fs.copyFileSync(statuslineFile, statuslineFile + '.backup');
+  }
+
+  fs.writeFileSync(statuslineFile, statuslineContent);
+
+  // Make executable on Unix systems
+  try {
+    fs.chmodSync(statuslineFile, '755');
+  } catch (e) {
+    // Windows doesn't need chmod
+  }
+
+  console.log('   ✓ Installed .claude/statusline.js');
+
+  // Step 3: Update settings.json
+  console.log('');
+  console.log('⚙️  Updating settings.json...');
+
+  let settings = {};
+
+  if (fs.existsSync(settingsFile)) {
+    try {
+      const content = fs.readFileSync(settingsFile, 'utf8');
+      settings = JSON.parse(content);
+      console.log('   ✓ Found existing settings.json');
+    } catch (e) {
+      console.log('   ⚠️  Could not parse settings.json, creating new one');
+    }
+  }
+
+  // Add or update statusLine config with absolute path
+  const absoluteStatuslinePath = path.resolve(statuslineFile);
+  const command = process.platform === 'win32'
+    ? `node "${absoluteStatuslinePath}"`
+    : absoluteStatuslinePath;
+
+  settings.statusLine = {
+    type: 'command',
+    command: command,
+    padding: 0
+  };
+
+  fs.writeFileSync(settingsFile, JSON.stringify(settings, null, 2));
+  console.log('   ✓ Updated .claude/settings.json');
+  console.log(`   ✓ Command: ${command}`);
+
+  // Step 4: Success message
+  console.log('');
+  console.log('✅ Installation complete!');
+  console.log('');
+  console.log('Your statusline will display:');
+  console.log('  • Model name (bold cyan)');
+  console.log('  • Context usage with progress bar (green/yellow/red)');
+  console.log('  • Session time (blue)');
+  console.log('  • Plan usage limits from Anthropic API (green/yellow/red)');
+  console.log('  • Cost tracking (yellow)');
+  console.log('  • Code changes - lines added/removed (green/red)');
+  console.log('  • Git branch (cyan)');
+  console.log('');
+  console.log('The statusline will automatically appear in Claude Code!');
+  console.log('');
+}
+
+function getStatuslineTemplate() {
+  // Read from the template file in the same directory
+  const templatePath = path.join(__dirname, 'statusline-template.js');
+
+  if (fs.existsSync(templatePath)) {
+    return fs.readFileSync(templatePath, 'utf8');
+  }
+
+  // Fallback: return inline template
+  return `#!/usr/bin/env node
+
+const { execSync } = require('child_process');
+const fs = require('fs');
+const path = require('path');
+const https = require('https');
+const os = require('os');
+
+// ANSI Color Codes
+const colors = {
+  reset: '\\x1b[0m',
+  bold: '\\x1b[1m',
+
+  // Regular colors
+  red: '\\x1b[31m',
+  green: '\\x1b[32m',
+  yellow: '\\x1b[33m',
+  blue: '\\x1b[34m',
+  magenta: '\\x1b[35m',
+  cyan: '\\x1b[36m',
+
+  // Bright colors
+  brightRed: '\\x1b[91m',
+  brightGreen: '\\x1b[92m',
+  brightYellow: '\\x1b[93m',
+  brightCyan: '\\x1b[96m',
+
+  // Combined styles
+  boldCyan: '\\x1b[1;36m',
+};
+
+// Cache for usage limits (5 minutes)
+const CACHE_DURATION = 5 * 60 * 1000;
+let usageLimitsCache = {
+  data: null,
+  timestamp: 0
+};
+
+// Read input JSON from stdin
+let inputData = '';
+process.stdin.on('data', chunk => {
+  inputData += chunk;
+});
+
+process.stdin.on('end', async () => {
+  try {
+    const data = JSON.parse(inputData);
+    const statusLine = await buildStatusLine(data);
+    process.stdout.write(statusLine);
+  } catch (error) {
+    process.stdout.write('Claude Code');
+  }
+});
+
+async function buildStatusLine(data) {
+  const parts = [];
+
+  // 1. Model name
+  const modelName = getModelDisplayName(data);
+  parts.push(modelName);
+
+  // 2. Context usage
+  const contextInfo = getContextUsage(data);
+  if (contextInfo) parts.push(contextInfo);
+
+  // 3. Session time
+  const sessionTime = getSessionTime(data);
+  if (sessionTime) parts.push(sessionTime);
+
+  // 4. Usage limits
+  const usageLimits = await getUsageLimits();
+  if (usageLimits) parts.push(usageLimits);
+
+  // 5. Cost
+  const costInfo = getCostInfo(data);
+  if (costInfo) parts.push(costInfo);
+
+  // 6. Code changes
+  const codeChanges = getCodeChanges(data);
+  if (codeChanges) parts.push(codeChanges);
+
+  // 7. Git branch
+  const gitBranch = getGitBranch(data);
+  if (gitBranch) parts.push(gitBranch);
+
+  return parts.join(' | ');
+}
+
+function getModelDisplayName(data) {
+  const name = data.model?.display_name || 'Claude';
+  return \`\${colors.boldCyan}\${name}\${colors.reset}\`;
+}
+
+function getContextUsage(data) {
+  if (!data.context_window?.current_usage) return null;
+
+  const usage = data.context_window.current_usage;
+  const windowSize = data.context_window.context_window_size;
+
+  const currentTokens = (usage.input_tokens || 0) +
+                        (usage.cache_creation_input_tokens || 0) +
+                        (usage.cache_read_input_tokens || 0);
+
+  const percentage = Math.round((currentTokens / windowSize) * 100);
+
+  const barColor = percentage < 40 ? colors.green :
+                   percentage < 70 ? colors.yellow : colors.red;
+  const percentColor = barColor;
+
+  const barLength = 10;
+  const filled = Math.round((percentage / 100) * barLength);
+  const empty = barLength - filled;
+
+  const bar = \`\${barColor}\${'▓'.repeat(filled)}\${colors.reset}\${'░'.repeat(empty)}\`;
+
+  return \`\${bar} \${percentColor}\${percentage}%\${colors.reset}\`;
+}
+
+function getSessionTime(data) {
+  if (!data.session_id || !data.transcript_path) return null;
+
+  try {
+    const stats = fs.statSync(data.transcript_path);
+    const startTime = stats.birthtimeMs || stats.ctimeMs;
+    const elapsed = Math.floor((Date.now() - startTime) / 1000);
+
+    const hours = Math.floor(elapsed / 3600);
+    const minutes = Math.floor((elapsed % 3600) / 60);
+    const seconds = elapsed % 60;
+
+    let timeStr;
+    if (hours > 0) {
+      timeStr = \`⏱ \${hours}h \${minutes}m\`;
+    } else if (minutes > 0) {
+      timeStr = \`⏱ \${minutes}m \${seconds}s\`;
+    } else {
+      timeStr = \`⏱ \${seconds}s\`;
+    }
+
+    return \`\${colors.blue}\${timeStr}\${colors.reset}\`;
+  } catch (error) {
+    return null;
+  }
+}
+
+function getCostInfo(data) {
+  if (!data.cost?.total_cost_usd) return null;
+  const cost = data.cost.total_cost_usd.toFixed(4);
+  return \`\${colors.yellow}$\${cost}\${colors.reset}\`;
+}
+
+function getCodeChanges(data) {
+  if (!data.cost) return null;
+
+  const added = data.cost.total_lines_added || 0;
+  const removed = data.cost.total_lines_removed || 0;
+
+  if (added === 0 && removed === 0) return null;
+
+  const parts = [];
+  if (added > 0) parts.push(\`\${colors.green}+\${added}\${colors.reset}\`);
+  if (removed > 0) parts.push(\`\${colors.red}-\${removed}\${colors.reset}\`);
+
+  return parts.join(' ');
+}
+
+async function getUsageLimits() {
+  const now = Date.now();
+  if (usageLimitsCache.data && (now - usageLimitsCache.timestamp) < CACHE_DURATION) {
+    return formatUsageLimits(usageLimitsCache.data);
+  }
+
+  const usage = await fetchUsageLimitsFromAPI();
+
+  if (usage) {
+    usageLimitsCache.data = usage;
+    usageLimitsCache.timestamp = now;
+    return formatUsageLimits(usage);
+  }
+
+  return null;
+}
+
+function getAccessToken() {
+  const platform = os.platform();
+
+  try {
+    if (platform === 'darwin') {
+      const token = execSync(
+        'security find-generic-password -s "Claude Code-credentials" -w',
+        { encoding: 'utf8', stdio: ['pipe', 'pipe', 'pipe'] }
+      ).trim();
+
+      const parsed = JSON.parse(token);
+      if (parsed.claudeAiOauth?.accessToken) {
+        return parsed.claudeAiOauth.accessToken;
+      }
+      return token;
+    } else if (platform === 'win32' || platform === 'linux') {
+      const appDataPaths = [
+        path.join(os.homedir(), '.claude', '.credentials.json'),
+        path.join(process.env.APPDATA || '', 'Claude Code', 'credentials'),
+        path.join(process.env.LOCALAPPDATA || '', 'Claude Code', 'credentials'),
+        path.join(os.homedir(), '.claude', 'credentials'),
+      ];
+
+      for (const credPath of appDataPaths) {
+        if (fs.existsSync(credPath)) {
+          const content = fs.readFileSync(credPath, 'utf8');
+          try {
+            const parsed = JSON.parse(content);
+            if (parsed.claudeAiOauth?.accessToken) {
+              return parsed.claudeAiOauth.accessToken;
+            }
+            if (parsed.access_token || parsed.token) {
+              return parsed.access_token || parsed.token;
+            }
+          } catch (e) {
+            return content.trim();
+          }
+        }
+      }
+    }
+  } catch (error) {
+    return null;
+  }
+
+  return null;
+}
+
+async function fetchUsageLimitsFromAPI() {
+  return new Promise((resolve) => {
+    const accessToken = getAccessToken();
+    if (!accessToken) {
+      resolve(null);
+      return;
+    }
+
+    const options = {
+      hostname: 'api.anthropic.com',
+      path: '/api/oauth/usage',
+      method: 'GET',
+      headers: {
+        'Authorization': \`Bearer \${accessToken}\`,
+        'anthropic-beta': 'oauth-2025-04-20',
+        'User-Agent': 'claude-code/2.0.76'
+      },
+      timeout: 2000
+    };
+
+    const req = https.request(options, (res) => {
+      let data = '';
+      res.on('data', (chunk) => { data += chunk; });
+      res.on('end', () => {
+        try {
+          if (res.statusCode === 200) {
+            resolve(JSON.parse(data));
+          } else {
+            resolve(null);
+          }
+        } catch (error) {
+          resolve(null);
+        }
+      });
+    });
+
+    req.on('error', () => resolve(null));
+    req.on('timeout', () => { req.destroy(); resolve(null); });
+    req.end();
+  });
+}
+
+function formatUsageLimits(usage) {
+  if (!usage?.five_hour) return null;
+
+  const utilization = usage.five_hour.utilization;
+  const resetsAt = usage.five_hour.resets_at;
+
+  if (utilization === undefined || !resetsAt) return null;
+
+  const usageColor = utilization < 50 ? colors.green :
+                     utilization < 80 ? colors.yellow : colors.red;
+
+  const parts = [];
+  parts.push(\`\${usageColor}Plan: \${Math.round(utilization)}% used\${colors.reset}\`);
+
+  const resetTime = new Date(resetsAt);
+  const diff = resetTime - new Date();
+
+  if (diff > 0) {
+    const hours = Math.floor(diff / (1000 * 60 * 60));
+    const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
+
+    let resetStr;
+    if (hours > 0) {
+      resetStr = \`Resets in \${hours}h \${minutes}m\`;
+    } else if (minutes > 0) {
+      resetStr = \`Resets in \${minutes}m\`;
+    } else {
+      resetStr = \`Resets soon\`;
+    }
+
+    parts.push(\`\${colors.magenta}\${resetStr}\${colors.reset}\`);
+  }
+
+  return parts.join(' | ');
+}
+
+function getGitBranch(data) {
+  try {
+    const cwd = data.workspace?.project_dir || data.workspace?.current_dir || process.cwd();
+    const gitDir = path.join(cwd, '.git');
+
+    if (!fs.existsSync(gitDir)) return null;
+
+    const branch = execSync('git rev-parse --abbrev-ref HEAD', {
+      cwd: cwd,
+      encoding: 'utf8',
+      stdio: ['pipe', 'pipe', 'ignore'],
+      env: { ...process.env, GIT_OPTIONAL_LOCKS: '0' }
+    }).trim();
+
+    if (branch && branch !== 'HEAD') {
+      return \`\${colors.cyan}⎇ \${branch}\${colors.reset}\`;
+    }
+
+    return null;
+  } catch (error) {
+    return null;
+  }
+}
+`;
+}
+
+// Run init if this is the main module
+if (require.main === module) {
+  initStatusline();
+}

package/install.ps1

@@ -0,0 +1,92 @@
+# PowerShell install script for Claude Code Statusline
+# Usage: .\install.ps1
+
+Write-Host ""
+Write-Host "🚀 Installing Claude Code Statusline..." -ForegroundColor Cyan
+Write-Host ""
+
+# Check if .claude directory exists
+if (-not (Test-Path ".claude")) {
+    Write-Host "📁 Creating .claude directory..." -ForegroundColor Yellow
+    New-Item -ItemType Directory -Path ".claude" | Out-Null
+    Write-Host "   ✓ Created .claude/" -ForegroundColor Green
+} else {
+    Write-Host "📁 .claude directory already exists" -ForegroundColor Yellow
+}
+
+# Backup existing statusline if it exists
+if (Test-Path ".claude\statusline.js") {
+    Write-Host ""
+    Write-Host "⚠️  Backing up existing statusline.js..." -ForegroundColor Yellow
+    Copy-Item ".claude\statusline.js" ".claude\statusline.js.backup"
+    Write-Host "   ✓ Backed up to .claude\statusline.js.backup" -ForegroundColor Green
+}
+
+# Copy statusline.js
+Write-Host ""
+Write-Host "📝 Installing statusline.js..." -ForegroundColor Yellow
+
+$scriptDir = Split-Path -Parent $MyInvocation.MyCommand.Path
+$templatePath = Join-Path $scriptDir "statusline-template.js"
+
+if (Test-Path $templatePath) {
+    Copy-Item $templatePath ".claude\statusline.js"
+    Write-Host "   ✓ Installed from local template" -ForegroundColor Green
+} else {
+    Write-Host "   ❌ Template not found. Please run from installer directory." -ForegroundColor Red
+    exit 1
+}
+
+# Update settings.json
+Write-Host ""
+Write-Host "⚙️  Updating settings.json..." -ForegroundColor Yellow
+
+$settingsFile = ".claude\settings.json"
+
+# Get absolute path for statusline.js
+$absolutePath = Resolve-Path ".claude\statusline.js" | Select-Object -ExpandProperty Path
+$command = "node `"$absolutePath`""
+
+if (Test-Path $settingsFile) {
+    # Read and parse existing settings
+    $settings = Get-Content $settingsFile | ConvertFrom-Json
+
+    # Add or update statusLine
+    $settings | Add-Member -MemberType NoteProperty -Name "statusLine" -Value @{
+        type = "command"
+        command = $command
+        padding = 0
+    } -Force
+
+    # Write back to file
+    $settings | ConvertTo-Json -Depth 10 | Set-Content $settingsFile
+    Write-Host "   ✓ Updated existing settings.json" -ForegroundColor Green
+} else {
+    # Create new settings.json
+    @{
+        statusLine = @{
+            type = "command"
+            command = $command
+            padding = 0
+        }
+    } | ConvertTo-Json -Depth 10 | Set-Content $settingsFile
+    Write-Host "   ✓ Created .claude\settings.json" -ForegroundColor Green
+}
+
+Write-Host "   ✓ Command: $command" -ForegroundColor Green
+
+# Success message
+Write-Host ""
+Write-Host "✅ Installation complete!" -ForegroundColor Green
+Write-Host ""
+Write-Host "Your statusline will display:" -ForegroundColor Cyan
+Write-Host "  • Model name (bold cyan)"
+Write-Host "  • Context usage with progress bar (green/yellow/red)"
+Write-Host "  • Session time (blue)"
+Write-Host "  • Plan usage limits from Anthropic API (green/yellow/red)"
+Write-Host "  • Cost tracking (yellow)"
+Write-Host "  • Code changes - lines added/removed (green/red)"
+Write-Host "  • Git branch (cyan)"
+Write-Host ""
+Write-Host "The statusline will automatically appear in Claude Code!" -ForegroundColor Green
+Write-Host ""

package/install.sh

@@ -0,0 +1,106 @@
+#!/bin/bash
+
+# Simple install script for Claude Code Statusline
+# Usage: curl -sSL https://your-url/install.sh | bash
+
+set -e
+
+echo ""
+echo "🚀 Installing Claude Code Statusline..."
+echo ""
+
+# Check if .claude directory exists
+if [ ! -d ".claude" ]; then
+    echo "📁 Creating .claude directory..."
+    mkdir -p .claude
+    echo "   ✓ Created .claude/"
+else
+    echo "📁 .claude directory already exists"
+fi
+
+# Backup existing statusline if it exists
+if [ -f ".claude/statusline.js" ]; then
+    echo ""
+    echo "⚠️  Backing up existing statusline.js..."
+    cp .claude/statusline.js .claude/statusline.js.backup
+    echo "   ✓ Backed up to .claude/statusline.js.backup"
+fi
+
+# Download or copy statusline.js
+echo ""
+echo "📝 Installing statusline.js..."
+
+# If running from local directory
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+if [ -f "$SCRIPT_DIR/statusline-template.js" ]; then
+    cp "$SCRIPT_DIR/statusline-template.js" .claude/statusline.js
+    chmod +x .claude/statusline.js
+    echo "   ✓ Installed from local template"
+else
+    # Download from URL (if hosted)
+    # curl -sSL https://your-url/statusline.js -o .claude/statusline.js
+    echo "   ❌ Template not found. Please run from installer directory."
+    exit 1
+fi
+
+# Update settings.json
+echo ""
+echo "⚙️  Updating settings.json..."
+
+SETTINGS_FILE=".claude/settings.json"
+
+# Get absolute path for statusline.js
+ABSOLUTE_PATH="$(cd "$(dirname ".claude/statusline.js")" && pwd)/$(basename ".claude/statusline.js")"
+
+# For macOS/Linux, use the absolute path directly (shebang will handle node)
+# For better compatibility, prefix with node command
+COMMAND="node \"$ABSOLUTE_PATH\""
+
+if [ -f "$SETTINGS_FILE" ]; then
+    # Check if jq is available
+    if command -v jq &> /dev/null; then
+        # Use jq to update JSON
+        jq --arg cmd "$COMMAND" '.statusLine = {"type": "command", "command": $cmd, "padding": 0}' "$SETTINGS_FILE" > "$SETTINGS_FILE.tmp"
+        mv "$SETTINGS_FILE.tmp" "$SETTINGS_FILE"
+        echo "   ✓ Updated existing settings.json"
+    else
+        echo "   ⚠️  jq not found. Please manually add statusLine config to settings.json"
+        echo ""
+        echo "   Add this to your .claude/settings.json:"
+        echo '   "statusLine": {'
+        echo '     "type": "command",'
+        echo "     \"command\": \"$COMMAND\","
+        echo '     "padding": 0'
+        echo '   }'
+    fi
+else
+    # Create new settings.json
+    cat > "$SETTINGS_FILE" << EOF
+{
+  "statusLine": {
+    "type": "command",
+    "command": "$COMMAND",
+    "padding": 0
+  }
+}
+EOF
+    echo "   ✓ Created .claude/settings.json"
+fi
+
+echo "   ✓ Command: $COMMAND"
+
+# Success message
+echo ""
+echo "✅ Installation complete!"
+echo ""
+echo "Your statusline will display:"
+echo "  • Model name (bold cyan)"
+echo "  • Context usage with progress bar (green/yellow/red)"
+echo "  • Session time (blue)"
+echo "  • Plan usage limits from Anthropic API (green/yellow/red)"
+echo "  • Cost tracking (yellow)"
+echo "  • Code changes - lines added/removed (green/red)"
+echo "  • Git branch (cyan)"
+echo ""
+echo "The statusline will automatically appear in Claude Code!"
+echo ""

package/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "cc-statusline-pro",
+  "version": "1.0.0",
+  "description": "Beautiful statusline for Claude Code with usage limits, context tracking, and colors",
+  "main": "index.js",
+  "bin": {
+    "cc-statusline": "cli.js"
+  },
+  "scripts": {
+    "test": "node test.js"
+  },
+  "keywords": [
+    "claude-code",
+    "statusline",
+    "cli",
+    "anthropic"
+  ],
+  "author": "Your Name",
+  "license": "MIT",
+  "engines": {
+    "node": ">=14.0.0"
+  }
+}