Diagrams in Your Developer Tools

Draw in a canvas inside your developer tool, signed in, and talk to your agent about what you select.

A workbench is a developer tool that shows a livediagram canvas live beside a coding agent. You draw in the editor right there, everything reaches livediagram at once, and when you type a message to your agent, the tool attaches what you had selected so the agent reads exactly those elements.

The editor in a workbench is signed in as you, for one canvas at a time. It has the canvas, the tab bar, the palette and the panels; account settings, sharing and your canvas library stay in livediagram itself, one click away through Open in livediagram.

Building a tool of your own? Building a Workbench has the full integration contract.

Pair a Workbench Once

A workbench opens your canvases through your CLI sign-in, and only after you have allowed it. The first time, the tool asks you to approve it, or you can pair it yourself:

livediagram workbench pair --origin https://127.0.0.1:5175 --name "Acme Editor"

The command prints a link and, in a terminal, opens it in your browser: a page headed Allow this workbench?, asking Allow Acme Editor at https://127.0.0.1:5175 to open your canvases with the token livediagram CLI? Check the address: it is what livediagram enforces, while the name is only a label. Choose Allow, and the command finishes by itself. Don't allow pairs nothing.

Pairing belongs to one CLI sign-in and one address. If someone obtained your token, it would still open nothing in a tool you never allowed.

Open a Canvas

The workbench does this for you when you open a diagram in it. By hand:

livediagram workbench open "Home screen" --origin https://127.0.0.1:5175 --json

It prints a link that works once, within a minute, and only inside the workbench at that address. Opened anywhere else, the page shows This view opens only inside the workbench's address and does nothing.

Open Your Whole Workspace

A workbench can also keep your Explorer beside your code: Home, your folders, your teams' canvases, the Inbox, Recent and the Trash, with every canvas opening in the same view and a Back to where you were. New Canvas makes the canvas right there. Your account stays out of it: no Settings, no API tokens, no team administration.

The whole workspace is a second approval, even for a tool you already paired:

livediagram workbench pair --origin https://127.0.0.1:5175 --name "Acme Editor" --workspace
livediagram folder ls
livediagram workbench open --workspace --folder Minigames --origin https://127.0.0.1:5175 --json

The page asks Allow Acme Editor at https://127.0.0.1:5175 to open your whole workspace, and to create, move, share and trash canvases and folders in it, with the token livediagram CLI? A token made read-only gives a workspace that browses and reads. livediagram folder create <name> [--in <folder>] makes a folder for a project and prints its id.

Talk to Your Agent About a Selection

Select elements, then type your message. The workbench adds a short block to it, naming the canvas, the tab and each selected element, for example:

[livediagram] "Home screen" › tab "Wireframe" (doc 3h9x2a, tab 0b34, rev 41)
selected: button 146b "Play", frame e4a8 "Game grid"
read: livediagram tab view 3h9x2a --tab 0b34 --view show --ref 146b

With nothing selected, it names the whole tab. The block is plain text in your message, nothing hidden. Your agent reads the elements with the CLI and its changes appear in the editor as you watch, with an Undo on each.

Stop or Unpair

A workbench session lasts a working day and renews itself while the tool is open. To stop a tool for good, go to Settings, then API Tokens under Account: it lists your Paired workbenches, each with what it may open (One canvas at a time or Whole workspace), and Unpair turns their open diagrams read-only straight away. Revoking the token does the same for every tool it paired.

Was this article helpful?