Your agent in midcode

midcode has no AI of its own and sells no model usage. The Agent panel runs the coding agent you already use, in your project’s folder, with your own account. What midcode adds is the canvas: you point at an element instead of describing it, the agent’s changes show on every breakpoint as they land, and each one is an edit you can undo and publish like your own.

The small things (a color, a line of copy, a padding) you still change by hand on the canvas. The agent is for what’s faster to ask for.

Chat or Terminal

The panel shows the agent in one of two ways. The button in the panel’s header switches between them (“Show as a terminal” / “Show as a chat”), and midcode remembers which one you left.

• –

  Chat, the default, is midcode’s own conversation with the agent, over the Agent Client Protocol. midcode starts the agent as a process in your project’s folder, shows its replies, plans, tool calls and diffs, and records every file it changes.

• –

  Terminal is the agent’s own command-line program in a real terminal, exactly as you’d run it yourself. midcode only pastes context into it.

Pick the agent in the “Agent” menu at the top left of the panel. One that’s missing says what to install, with a button to check again. Each agent’s page says what has to be installed and signed in first.

Where the panel is

In the Design view the agent is the “Agent” tab of the left panel, next to “Layers” and “Assets”. The panel gets wider while that tab is open, and you can drag its edge.

The agent also stays beside everything that takes the canvas’s place: the Code view, an element’s code, the CMS, Translations and Site settings (and, in the next release, the Database and Store views). Beside the Code view it starts open. Beside the others it starts put away, as a thin rail with one button, “Show the agent”. The collapse button in the header puts it away again, and the agent keeps running meanwhile.

The prompt

Write what you want and press Enter. ⇧Enter adds a line. Esc stops a turn that’s running, and so does the “Stop” button.

• –

  Files. The “+” button, then “Photos & files”, or drop files on the prompt. An image goes to the agent as an image when the agent accepts them, a small file can go in whole, and anything else goes as a link to the file.

• –

  Context. Type @, or use “+”: “Selected element” (its reference, see below), “Open comments” (every open comment with the element it points at) and “This page” (the file and route open on the canvas). Each becomes a chip above the text that you can remove before sending.

• –

  The crosshair. Click it, then click what you mean. The next thing you click goes into the prompt as a chip: an element on the canvas or in a code preview, a collection, item or field in the CMS, a text in Translations. Esc cancels.

• –

  Commands. Type / as the first character to list the agent’s own commands, as the agent reports them.

• –

  Mode, model and effort. The pickers under the text are the agent’s own session options. midcode shows what the agent offers and adds none. It remembers the model and effort you chose for each agent.

“New chat” in the header starts over with the same agent. There is one conversation per project and agent.

The thread

The agent’s replies are rendered as Markdown. Its thinking folds away (“Thought for 12s”). Tool calls are grouped, and each one opens to show what it did: the command it ran, the output, or the diff of the file it edited. A plan the agent makes shows as a “Plan” card that ticks off as it goes.

When a turn ends, the files it changed are listed under the reply with their added and removed lines. Click one to open it in the Code view.

Permission cards

When the agent asks before it does something (run a command, write a file), the thread shows a card, “Allow this?”, with the command or the diff and the agent’s own choices as buttons: usually allow once, always allow, or reject. Which actions need asking is decided by the agent and the mode you put it in, not by midcode. Stopping the turn cancels any card still waiting.

Teaching the agent midcodeNext release

The button with the graduation cap, in the panel’s header in both views, adds the midcode skill to the selected agent: what midcode’s files are, how to write styles, components and content that stay editable on the canvas, where your comments are. It goes into the agent’s own skills folder on your Mac (~/.claude/skills/midcode for Claude Code), not into your project.

How the agent’s edits are recorded

In the Chat view, every file the agent edits inside your project goes into midcode’s history and into Publish:

• –

  One ⌘Z takes back one tool call, whether it touched one file or several. A file the agent created is deleted by undoing it.

• –

  The Publish list names each change after the agent, for example “Claude Code: edit Hero.tsx”.

• –

  The canvas shows the change as soon as your dev server reloads it, on every breakpoint.

Undo only writes when the file is still as that edit left it. If you or the agent changed it again since, midcode says “The file changed outside midcode, so that edit can’t be undone” and leaves the file alone.

Your own edits on the canvas and the agent’s are in the same history, in the order they happened.

What the agent can reach

The agent runs in your project’s folder with your user’s permissions and your login shell’s PATH. When it reads or writes a file through midcode, midcode answers only for paths inside the project and refuses anything outside it. What the agent’s own tools can reach (its shell, its network access) is the agent’s business: its permission mode and the cards above are the control.

The conversation goes from the agent to its provider, not through midcode. See Privacy and security.

The Terminal view

The Terminal view opens a login shell in the project’s folder and types the agent’s command into it, so your PATH, your shell setup and the agent’s own sign-in are what they are in your terminal. If the agent exits, the shell is still there. The header has three buttons of its own:

• –

  “Send the selection to the agent” pastes the selected element’s reference into the agent’s prompt, without sending it.

• –

  “Send the open comments to the agent” pastes every open comment.

• –

  “Restart the agent” closes the session and starts a new one.

What the agent changes shows on the canvas and in Publish’s list of changed files. It is not in midcode’s ⌘Z, and not in Publish’s “Done in midcode” list: in a terminal the agent writes files by itself, so use its own undo, or git. A file it creates is listed in Publish without a tick.

Handing things to the agent

The same reference travels everywhere: what the element is, what it says, and where it’s written.

<h1> "Built to outlast"
written at src/components/Hero.tsx:14:7
inside src/app/page.tsx:9:5 › src/app/layout.tsx:21:7
page / · Desktop 1440px

The first line has the layer’s name if you gave it one, the tag, the component and the text. file:line:col is where the element’s opening tag is (How midcode works says how it knows). “inside” lists the nearest ancestors written in other files. An element drawn by a component that passes its props on adds rendered by <Card> at …, an item of a list adds item 3 of a list, and in component mode there is a line for the component, variant and state.

Comments are also files: .midcode/comments.json in your project, which any agent can read without midcode. See Comments.

From the databaseNext release

The crosshair also takes a table (its columns, never its rows) or one row from the Database view. And where a change is code that has to fit your project, midcode writes the request instead of the code, with “Send to the agent” and “Copy”: “Show on a page…” and “Save to a table…” (Database), a table change in a project that uses Drizzle or a framework’s migrations (Changing tables), and “Add sign-in”, “Add a way to sign in” and “Protect pages” (Sign-in and users).

“Send to the agent” puts the brief in the chat’s prompt. With the Terminal view, use “Copy” and paste it.

Limits

• –

  Cursor has no Chat view: it runs in the Terminal view, or in its own window beside midcode.

• –

  Closing the project’s tab or quitting midcode stops the agent. Conversations aren’t saved: the next chat is a new session, and the agent doesn’t remember the last one.

• –

  In the Chat view, a file the agent deletes, or changes by running a shell command instead of an edit, isn’t an undo step. It still shows as a changed file in Publish.

• –

  The crosshair and the @ menu are the Chat view’s. The Terminal view has its two send buttons.

• –

  midcode doesn’t choose or limit models: the pickers are what your agent and account offer.

Troubleshooting

The agent doesn’t start. The panel shows why, often with the agent’s own last line. Signed out is the usual reason: run the agent once in a terminal and sign in. The first start can take a minute, because Claude Code’s and Codex’s adapters are downloaded then. After four minutes midcode stops waiting.

“The agent hasn’t answered in a while.” It may be retrying. Check your connection, and the agent’s key or sign-in.

It was installed but midcode says it isn’t. midcode looks for the command on your login shell’s PATH, which it reads when it first needs it. Open a new terminal and check that the command runs there, then press “Check again”. If installing it added a new folder to your PATH, quit midcode and open it again.

To write code that stays editable on the canvas, give your agent Code that midcode can edit, or install the midcode skill.