pi-claude-style-tools
Claude Code-style tool rows for pi with Ctrl+O image previews and consistent built-in, MCP, and custom tool rendering
Package details
Install pi-claude-style-tools from npm and Pi will load the resources declared by the package manifest.
$ pi install npm:pi-claude-style-tools- Package
pi-claude-style-tools- Version
1.0.25- Published
- May 12, 2026
- Downloads
- 2,807/mo · 347/wk
- Author
- leftwinglautus
- License
- MIT
- Types
- extension
- Size
- 190.4 KB
- Dependencies
- 2 dependencies · 3 peers
Pi manifest JSON
{
"extensions": [
"./extensions/index.ts",
"./extensions/spinner.ts"
]
}Security note
Pi packages can execute code and influence agent behavior. Review the source before installing third-party packages.
README
pi-claude-style-tools
Claude Code inspired tool rendering for Pi — Shiki-powered diffs, status dots, branch connectors, file icons, and configurable output modes.
Features
- Compact built-in tool rendering for
read,bash,grep,find,ls,edit, andwrite - Claude-style OpenAI tool rendering for
apply_patchplus common Pi/OpenAI-style tools likewebfetch,web_search,fetch_content, task tools, and context tools apply_patchdiff previews that render parsed file patches in the call phase, similar toedit/write- Adaptive edit/write diffs with split or unified layouts, syntax highlighting, and inline word-level emphasis
- Diff stat bar with colored add/remove summary and hunk metadata
- Progressive collapsed diff hints that shorten on narrow terminals
- Thinking labels during streaming and final messages, with context sanitization
- MCP-aware rendering with hidden, summary, and preview modes
- Configurable output modes for read, search, bash, and MCP results
- Transparent tool backgrounds in
transparentorbordermode - Theme-adaptive palette — borders, branch connectors, dim text, spinner accent, and diff backgrounds automatically follow the active pi theme (set
themeAdaptive: falseto keep the fixed Claude-style palette) - Transparent edit/write diffs with universal red/green diff colors
- Global border patch for all tool rows, including unknown/custom tools
Configuration
Set in .pi/settings.json or ~/.pi/settings.json:
{
"toolBackground": "border",
"readOutputMode": "preview",
"searchOutputMode": "preview",
"mcpOutputMode": "preview",
"previewLines": 8,
"bashOutputMode": "opencode",
"bashCollapsedLines": 10,
"diffCollapsedLines": 24,
"themeAdaptive": true,
"diffTheme": "github-dark"
}
Theme integration
When themeAdaptive is true (default), the following colors are derived from the active pi theme on every render and re-derived whenever the theme changes:
| Element | Derived from |
|---|---|
| Tool outline borders (top/bottom rules) | borderMuted |
Branch connectors (├─, └─, │) |
dim (fallback: muted) |
| "✻ Worked for Ns" line | muted |
| Thinking-block italic gray | muted |
| Diff add/remove accents | toolDiffAdded / toolDiffRemoved |
| Diff background tints | mixed against toolSuccessBg base |
Spinner verb text (Working…) |
borderAccent (fallback: accent) |
| Spinner status text | muted |
User-supplied diffTheme presets and diffColors overrides always win over theme-derived defaults. File-type icons (e.g. ts, py, rs) keep their language-identity colors and are not theme-derived.
Set themeAdaptive: false to keep the original fixed Claude-style palette regardless of the active pi theme.
Toggle at runtime with /cc-theme
/cc-theme # show current setting + theme name
/cc-theme status # show current setting + color preview (incl. spinner)
/cc-theme on # follow pi theme
/cc-theme off # keep fixed Claude palette
/cc-theme toggle # flip the current value
The selection is persisted to ~/.pi/settings.json and applied to the next rendered tool row. No restart required.
Repaint the spinner with /cc-spinner
The spinner glyph itself is still colored by pi's loader using accent, while the verb text (e.g. Cooking…) follows borderAccent by default so it stays lively without being the exact same color as the glyph. The status suffix (e.g. (thinking · ↓ 10 tokens · 2s)) follows muted. Use /cc-spinner to bind either text element to any other theme color key:
/cc-spinner preview # list every common theme key with a colored sample
/cc-spinner verb <key> # change the verb color (e.g. thinkingHigh, mdHeading)
/cc-spinner status <key> # change the status suffix color
/cc-spinner reset # restore defaults (verb=borderAccent, status=muted)
The selection is persisted as spinnerVerbColor / spinnerStatusColor in ~/.pi/settings.json and applied on the next spinner tick.
Tool background modes
| Value | Behavior |
|---|---|
default |
Standard Pi tool backgrounds |
transparent |
Transparent tool backgrounds |
border |
Transparent backgrounds with top/bottom border lines |
Output modes
| Setting | Values | Default |
|---|---|---|
readOutputMode |
hidden, summary, preview |
preview |
searchOutputMode |
hidden, count, preview |
preview |
mcpOutputMode |
hidden, summary, preview |
preview |
bashOutputMode |
opencode, summary, preview |
opencode |
Numeric settings
| Setting | Default | Description |
|---|---|---|
previewLines |
8 |
Lines shown in collapsed preview mode |
expandedPreviewMaxLines |
4000 |
Max lines when fully expanded |
bashCollapsedLines |
10 |
Lines for collapsed bash output |
diffCollapsedLines |
24 |
Diff lines before collapsing |
Notes
This package targets recent Pi versions where tool renderers use:
renderCall(args, theme, context)renderResult(result, { expanded, isPartial }, theme, context)
Unknown/custom tools do not have a public global renderer hook in Pi, so this package patches container rendering to add top/bottom borders for all tool executions in border mode.
Credits
This project builds upon and was inspired by the excellent work of:
- @heyhuynhgiabuu/pi-pretty by huynhgiabuu — Pretty terminal output with syntax-highlighted file reads, colored bash output, and tree-view directory listings
- @heyhuynhgiabuu/pi-diff by huynhgiabuu — Shiki-powered terminal diff renderer with word-level diffs in split and unified views
- pi-tool-display by MasuRii — Compact tool call rendering, diff visualization, and output truncation