Conversation Graph

Talk to Claude Code on a canvas instead of a single top-to-bottom chat.

Every round of question and answer is a box you can drag. Ask a follow-up and it runs to the right. Select a sentence inside an answer and ask about that, and the new question hangs below it. Nothing is ever appended to a single thread, so going back to something you asked twenty turns ago and taking it somewhere else costs one click.

Why the shape matters

Each Node forks its own Claude Code session. A parent's session tip stays pinned to the parent forever, so you can branch from any Node at any time — including one that already has three children — and the new branch sees only what its ancestors saw.

That is why edges cannot be dragged. An edge is not a wire you route; it is the context a Node actually had. Moving one would mean a different answer, so "ask this again under another Node" runs it properly and leaves the original where it was.

What it can do

• Everything Claude Code can. Tools, permission prompts, slash commands, @file references. Permission is asked inside the Node that wants it, and names the files the call would write to before it runs.
• Several Nodes at once. Branch three ways and let all three work.
• Markdown, LaTeX, highlighted code in every answer.
• Reader mode. Enter opens one Node at a readable width; h j k l or the arrow keys move between Nodes, on the canvas and in the reader.
• Isolated branches. A branch that edits code can take its own git worktree, so two branches working on the same file stop reading each other's changes.
• Import an existing Claude Code conversation onto the canvas.
• Per-Node model and permissions, inherited from the parent Node.

Requirements

Claude Code must be installed and on your PATH. The extension does not ship a copy — it would add 207 MB and duplicate what you already have. Set conversationGraph.claudeExecutable if it lives somewhere unusual.

Usage goes through your own Claude subscription or API account, the same as Claude Code itself. Each Node shows what it cost.

Getting started

Run New Conversation Graph from the command palette, or create a file ending in .ccgraph.json and open it.

Developing

npm install
npm run build

Then press F5, which opens a second window on fixtures/ with a sample Graph.

• npm run watch — rebuild on change (reload the second window to pick it up)
• npm run typecheck — tsc --noEmit over the extension and the webview
• npm run icon — regenerate the Marketplace icon
• npm run package — build a .vsix

Read CONTEXT.md for the vocabulary before changing anything, and the decision records for the three things the design rests on:

• Fork a session for every Node
• Edges are history, not dataflow
• Isolate a branch with a git worktree

Layout

Runs live on the extension host, not in the webview: VS Code tears a webview down when its tab is hidden, and a Run has to survive that.

License

MIT