Claude Canvas

A TUI toolkit that gives AI coding agents their own display. Spawn interactive terminal interfaces for calendars, documents, flight bookings, and more.

Note: This is a proof of concept and is unsupported.

Supported Platforms

Platform	Location	Requirements
Claude Code	.claude-plugin/	tmux, Bun
Pi Coding Agent	pi-extension/	None (native TUI)

---

Claude Code Installation

Requires Bun and tmux — canvases spawn in split panes.

# Add marketplace
/plugin marketplace add dvdsgl/claude-canvas

# Install plugin
/plugin install canvas@claude-canvas

---

Pi Coding Agent Installation

The Pi extension uses native TUI rendering — no tmux or Bun required!

# Clone to pi extensions directory
git clone https://github.com/jyaunches/pi-canvas.git ~/.pi/agent/extensions/pi-canvas

# Restart pi to load

Or install just the pi-extension folder:

# Clone and copy only pi-extension
git clone https://github.com/jyaunches/pi-canvas.git /tmp/pi-canvas
cp -r /tmp/pi-canvas/pi-extension ~/.pi/agent/extensions/pi-canvas

See pi-extension/README.md for full documentation.

Pi Extension Features

• 📅 Calendar Canvas - Week view with event display and time slot selection
• 📄 Document Canvas - Text viewer with navigation and selection
• ✈️ Flight Canvas - Flight search results with comparison

Pi Extension Tools

Tool	Description
canvas_calendar	Interactive calendar TUI
canvas_document	Document viewer with selection
canvas_flights	Flight comparison and selection

---

Architecture Comparison

Feature	Claude Code Plugin	Pi Extension
Runtime	tmux + Bun	Native pi TUI
Rendering	Separate process + IPC	Inline ctx.ui.custom()
Components	React/Ink	Pi TUI components
Data Source	LLM provides JSON	LLM provides JSON

Both versions are display layers only — the LLM fetches data from other tools/skills and provides it to the canvas.

---

License

MIT