cc-statusline-pro 1.0.0

package/QUICK_START.md

@@ -0,0 +1,190 @@
+# Quick Start - Claude Code Statusline
+
+Cài đặt statusline đẹp mắt cho Claude Code chỉ bằng 1 lệnh!
+
+## 🚀 Cài đặt nhanh
+
+### Cách 1: Sử dụng Node.js (Đa nền tảng)
+
+```bash
+cd your-project
+node /path/to/statusline-installer/cli.js init
+```
+
+**Ví dụ cụ thể:**
+```bash
+cd "D:\my-awesome-project"
+node "T:\My Downloads\exness-eafree-web\.claude\statusline-installer\cli.js" init
+```
+
+### Cách 2: PowerShell (Windows)
+
+```powershell
+cd your-project
+powershell -ExecutionPolicy Bypass -File "\path\to\statusline-installer\install.ps1"
+```
+
+**Ví dụ cụ thể:**
+```powershell
+cd "D:\my-awesome-project"
+powershell -ExecutionPolicy Bypass -File "T:\My Downloads\exness-eafree-web\.claude\statusline-installer\install.ps1"
+```
+
+### Cách 3: Bash (Linux/macOS)
+
+```bash
+cd your-project
+bash /path/to/statusline-installer/install.sh
+```
+
+---
+
+## 📦 Tạo alias để sử dụng dễ dàng
+
+### Windows (PowerShell Profile)
+
+Thêm vào PowerShell profile (`$PROFILE`):
+
+```powershell
+function Install-ClaudeStatusline {
+    node "T:\My Downloads\exness-eafree-web\.claude\statusline-installer\cli.js" init
+}
+
+Set-Alias -Name ccsl -Value Install-ClaudeStatusline
+```
+
+Sau đó sử dụng:
+```powershell
+cd your-project
+ccsl
+```
+
+### Linux/macOS (Bash/Zsh)
+
+Thêm vào `~/.bashrc` hoặc `~/.zshrc`:
+
+```bash
+alias ccsl='node /path/to/statusline-installer/cli.js init'
+```
+
+Sau đó sử dụng:
+```bash
+cd your-project
+ccsl
+```
+
+---
+
+## 🎯 Sau khi cài đặt
+
+Statusline sẽ tự động xuất hiện trong Claude Code với format:
+
+```
+Sonnet 4.5 | ▓▓░░░░░░░░ 18% | ⏱ 45m 30s | Plan: 37% used | Resets in 4h 12m | $1.0792 | +247 -15 | ⎇ main
+```
+
+### Thông tin hiển thị:
+
+✅ **Model name** - Claude model đang sử dụng (Bold Cyan)
+✅ **Context usage** - Thanh tiến trình + % (Green/Yellow/Red)
+✅ **Session time** - Thời gian session (Blue)
+✅ **Plan usage** - Mức sử dụng plan từ API (Green/Yellow/Red)
+✅ **Reset time** - Thời gian reset (Magenta)
+✅ **Cost** - Chi phí session (Yellow)
+✅ **Code changes** - Dòng thêm/xóa (Green/Red)
+✅ **Git branch** - Nhánh hiện tại (Cyan)
+
+---
+
+## 🔧 Cấu trúc files sau khi cài đặt
+
+```
+your-project/
+├── .claude/
+│   ├── statusline.js       # Script statusline
+│   └── settings.json       # Cấu hình Claude Code
+```
+
+**`.claude/settings.json`:**
+```json
+{
+  "statusLine": {
+    "type": "command",
+    "command": "node \"T:\\absolute\\path\\to\\project\\.claude\\statusline.js\"",
+    "padding": 0
+  }
+}
+```
+
+**Lưu ý**: Installer tự động sử dụng đường dẫn tuyệt đối để đảm bảo statusline hoạt động chính xác.
+
+---
+
+## 📚 Tính năng nâng cao
+
+### 1. Plan Usage Limits
+
+Hiển thị usage limits thời gian thực từ Anthropic API. Yêu cầu:
+- Đã đăng nhập Claude Code
+- Credentials tồn tại tại:
+  - **Windows**: `C:\Users\YourName\.claude\.credentials.json`
+  - **Linux/macOS**: `~/.claude/.credentials.json`
+
+### 2. Dynamic Colors
+
+Màu sắc thay đổi dựa trên giá trị:
+- **Context < 40%**: Green (an toàn)
+- **Context 40-70%**: Yellow (cảnh báo)
+- **Context > 70%**: Red (nguy hiểm)
+
+### 3. Caching
+
+Usage limits được cache trong 5 phút để:
+- Tránh gọi API quá nhiều
+- Giảm latency
+- Tiết kiệm API quota
+
+---
+
+## 🐛 Troubleshooting
+
+### Statusline không hiển thị
+
+1. Kiểm tra `.claude/statusline.js` tồn tại
+2. Kiểm tra `.claude/settings.json` có config đúng
+3. Restart Claude Code
+
+### Plan usage không hiển thị
+
+1. Kiểm tra đã đăng nhập Claude Code
+2. Kiểm tra credentials file:
+   ```bash
+   # Windows
+   type "%USERPROFILE%\.claude\.credentials.json"
+
+   # Linux/macOS
+   cat ~/.claude/.credentials.json
+   ```
+
+### Màu sắc không hiển thị
+
+Đảm bảo terminal hỗ trợ ANSI colors (hầu hết terminal hiện đại đều hỗ trợ).
+
+---
+
+## 📖 Tài liệu thêm
+
+- [README.md](./README.md) - Tài liệu đầy đủ
+- [Claude Code Docs](https://code.claude.com/docs) - Tài liệu chính thức
+
+---
+
+## 💡 Tips
+
+1. **Backup settings**: Installer tự động backup file cũ nếu đã tồn tại
+2. **Multiple projects**: Chạy lại lệnh install cho mỗi project mới
+3. **Update**: Chạy lại lệnh install để cập nhật lên version mới
+
+---
+
+**Enjoy your beautiful statusline! 🎨**

package/README.md

@@ -0,0 +1,118 @@
+# Claude Code Statusline
+
+Beautiful, feature-rich statusline for Claude Code with real-time usage limits, context tracking, and colorful display.
+
+## Features
+
+- 🎨 **Beautiful colors** - ANSI colors for better readability
+- 📊 **Usage limits** - Real-time plan usage from Anthropic API
+- 📈 **Context tracking** - Visual progress bar for context window
+- ⏱️ **Session time** - Track how long you've been coding
+- 💰 **Cost tracking** - Monitor your session costs
+- 📝 **Code changes** - Lines added and removed
+- 🌿 **Git branch** - Current branch display
+
+## Quick Install
+
+### Method 1: Using npx (Recommended)
+
+```bash
+cd your-project
+npx claude-code-statusline init
+```
+
+### Method 2: Using local path
+
+```bash
+cd your-project
+node /path/to/statusline-installer/cli.js init
+```
+
+### Method 3: Simple curl install
+
+```bash
+cd your-project
+curl -o .claude/statusline.js https://raw.githubusercontent.com/your-repo/statusline.js
+```
+
+## What you'll see
+
+```
+Sonnet 4.5 | ▓▓░░░░░░░░ 18% | ⏱ 45m 30s | Plan: 37% used | Resets in 4h 12m | $1.0792 | +247 -15 | ⎇ main
+```
+
+### Color Breakdown
+
+- **Model name**: Bold Cyan
+- **Context bar**: Green (< 40%) / Yellow (40-70%) / Red (> 70%)
+- **Session time**: Blue
+- **Plan usage**: Green (< 50%) / Yellow (50-80%) / Red (> 80%)
+- **Reset time**: Magenta
+- **Cost**: Yellow
+- **Lines added**: Green
+- **Lines removed**: Red
+- **Git branch**: Cyan
+
+## Requirements
+
+- Node.js >= 14.0.0
+- Claude Code CLI installed
+- Logged in to Claude Code (for usage limits feature)
+
+## How it works
+
+1. Reads session data from Claude Code via stdin (JSON format)
+2. Fetches usage limits from Anthropic API (with 5-minute cache)
+3. Formats everything with beautiful ANSI colors
+4. Outputs a single-line statusline
+
+## Configuration
+
+After installation, your `.claude/settings.json` will contain:
+
+```json
+{
+  "statusLine": {
+    "type": "command",
+    "command": "node \"T:\\absolute\\path\\to\\project\\.claude\\statusline.js\"",
+    "padding": 0
+  }
+}
+```
+
+**Note**: The installer automatically uses absolute paths to ensure the statusline works correctly across all projects.
+
+## Troubleshooting
+
+### Statusline not showing
+
+1. Check that `.claude/statusline.js` exists
+2. Check that `.claude/settings.json` has the statusLine config
+3. Restart Claude Code
+
+### Usage limits not showing
+
+1. Check that you're logged in to Claude Code
+2. Check that credentials exist in `~/.claude/.credentials.json` (Linux/macOS) or `%USERPROFILE%\.claude\.credentials.json` (Windows)
+3. The feature requires authentication with Anthropic API
+
+### Colors not working
+
+Make sure your terminal supports ANSI colors. Most modern terminals do.
+
+## Uninstall
+
+Remove the statusline configuration from `.claude/settings.json`:
+
+```bash
+# Or manually edit .claude/settings.json to remove statusLine config
+```
+
+## License
+
+MIT
+
+## Credits
+
+- Inspired by [codelynx.dev's statusline](https://codelynx.dev/posts/claude-code-usage-limits-statusline)
+- Built for the Claude Code community