open-index/open-npm huggingface dataset:
npm package: @ingredlabs/claude-status-line
Description: [Beta] Always-on-top Claude Code usage overlay — context %, 5h and 7d rate limits
Latest version: 1.0.8
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# Claude Status Line

An always-on-top floating overlay for [Claude Code](https://claude.ai/claude-code) that shows real-time usage metrics — context window, 5-hour rate limit, and 7-day rate limit — as progress bars directly on your screen.

![Claude Status Line screenshot](https://raw.githubusercontent.com/ingredlabs/claude-status-line/main/screenshot.png)

---

## Install

```
npx @ingredlabs/claude-status-line@latest
```

That's it. The installer handles everything:
- Copies hook files to `~/.claude/`
- Registers the Claude Code hooks in `settings.json`
- Creates the `/claude-status-line` launch command
- Asks if you want the overlay to auto-start with every Claude Code session

**Requirements:** [Node.js](https://nodejs.org/) and [Claude Code](https://claude.ai/claude-code)

---

## Usage

After installing, restart Claude Code. Then type in the Claude Code chat:

```
/claude-status-line
```

The overlay appears in the bottom-right corner of your screen, always on top.

| Action | How |
|--------|-----|
| Move | Drag the header bar |
| Resize | Drag the bottom-right corner |
| Quit | Click the close button (top-right on Windows, top-left on macOS) |

---

## What it shows

```
Sonnet 4.6                    IngredLabs
ctx  ████████████░░░░░░░  62%
5h   ███░░░░░░░░░░░░░░░░  14%
7d   ████████████████░░░  83%
          Resets in 1h 43m
```

| Metric | Description |
|--------|-------------|
| **ctx** | Context window used (0–200k tokens) |
| **5h** | 5-hour rate limit utilization |
| **7d** | 7-day rate limit utilization |

Colors: green → yellow → orange → red as usage increases.

---

## Auto-start

The installer asks during setup. If you said no and want to enable it later, re-run the installer:

```
npx @ingredlabs/claude-status-line@latest
```

---

## Update

```
npx @ingredlabs/claude-status-line@latest
```

Same command as install — safe to re-run anytime.

---

## How it works

Claude Code fires hooks on every response and tool use. The hooks write metrics to `~/.claude/status.json`. The overlay reads that file and also fetches 5h/7d utilization from the Claude API using your existing credentials.

| File | Role |
|------|------|
| `hooks/stop.js` | Stop hook — writes model, directory, ctx% after every response |
| `hooks/post-tool-use.js` | PostToolUse hook — writes ctx% after tool use |
| `statusline-command.js` | Status line command — writes metrics when using terminal Claude |
| `main.js` | Electron app — reads `status.json`, fetches 5h/7d from Claude API |
| `index.html` | Overlay UI — progress bars, colors, resize handle |