Canvas is AgentGrid.io's visual editor. It works with app artifacts built as HTML or React projects that AgentGrid.io can load in the visual editor. Markdown documents and stored files are not Canvas artifacts. Use Preview to open the saved app. Use Canvas to select and change supported elements before saving the result.
Which artifacts Canvas supports
Canvas is available only when AgentGrid.io can load the app's HTML or React project structure for visual editing. An app with an unsupported project structure stays Preview-only. Markdown documents and stored files cannot use Canvas. Historical versions are read-only.
Enter Canvas and edit
- Open a supported HTML or React app artifact and switch from Preview to Canvas.
- On first entry, wait for Canvas to initialize the editable view.
- Select supported elements and make the available visual changes.
- Review the draft before saving. Switch between saved and Draft preview where that choice is shown.
- Use Save or
⌘Sto commit the reviewed result. - Confirm the new entry in Version history.
A draft is Canvas work that has not been saved. The saved state is the current artifact content that has reached AgentGrid.io. Do not assume a draft survives a reload, a reopened editing session, or an agent edit. Treat agents as working on the saved state unless the product explicitly shows otherwise.
Warnings and conflicts
Read partial-write warnings before saving: a visual operation may update only part of a project. A page is stale when the artifact changed elsewhere and the open page no longer shows the latest saved version. If this happens, stop and reload the current saved version before continuing. Do not overwrite a newer version merely to preserve an unsaved draft.
If a saved result is wrong, use History to compare or restore an earlier version. Historical previews cannot be edited or published from the historical view.
Canvas and Edit with AI
Canvas is for direct visual changes. Edit with AI uses a connected assistant or Anima Playground to change the saved artifact. Review the current saved state before switching between the two workflows.
Troubleshooting
If Canvas is unavailable, initialization fails, or the app is preview-only, use Edit with AI or a connected agent. For repeated failures, see Troubleshooting.
Questions and answers
Why is Canvas unavailable for this artifact? Canvas works only for supported HTML or React app projects. Markdown, stored files, historical versions, and unsupported app structures cannot use it.
When do Canvas changes reach the artifact?
Only after you review the draft and use Save or ⌘S; confirm the new History entry.
What should I do if the artifact changed elsewhere? Stop and reload the latest saved state. Do not overwrite a newer version to preserve an unsaved draft.
Can I recover a bad Canvas save? Yes. Compare or restore an earlier version in History.