The inline code editor is a Pro feature and requires an active Pro subscription. Saving edits without a Pro subscription returns a
403 error from the API ({ "error": "Pro is required" }).Opening the editor
In any project view, switch to the Code tab (the</> icon next to the preview toggle). A file explorer panel opens on the left listing every file the agent generated.
Click a file in the tree to open it in the editor pane on the right. You can switch between files freely — unsaved changes to each file are kept in memory until you save or navigate away.
Editing files
The editor provides:- Syntax highlighting for TypeScript, JavaScript, JSON, CSS, YAML, and Markdown
- TypeScript support — JSX syntax, ES2020 target, and module resolution are pre-configured so
.tsxfiles work correctly - Word wrap — long lines wrap automatically; no horizontal scrolling
- VS Code theme (
vs-dark) for comfortable reading
Saving changes
When you’re ready to apply your changes, click the save icon in the toolbar above the editor. This sends aPATCH request to /api/fragments/:fragmentId with your modified files.
The API handler writes the updated file content directly to the E2B sandbox, so the running dev server picks up the changes via hot reload — the live preview updates within seconds.
Only files you have modified are sent in the patch request. Unchanged files are not re-written to the sandbox.