The toolbar
Controls & modes
The floating bar is how you switch between editing and using the app, batch changes, and undo mistakes. Everything below is local to your browser — nothing is sent to a remote service.
Master on / off
The switch next to the brand turns the whole tool on or off. When off:
- No outlines, chips, panels, or edit handlers
- The toolbar collapses to brand + switch
- The page behaves like a normal
next devsession
Preference is stored in localStorage as nextcanvas:enabled (defaults on).
Buttons — edit mode vs live mode
The Buttons toggle is separate from the master switch. It only gates whether the page is interactive while nextcanvas stays active.
| Buttons | What happens |
|---|---|
| Off (default) | Edit mode. Clicks and pointer-downs don't navigate or fire app / Motion handlers — including Next Links like a CTA to another page. Single-click selects for styles; double-click edits text. A small blocker installs as soon as the overlay component mounts, so a fast click can't race the overlay script download. |
| On | Live mode. Links, buttons, and onClick handlers work normally. Single-click does not select. Hover outlines, the attribute chip, and double-click editing still work. |
Why this exists. Without it, a stamped
<a href="#section"> would scroll the page out from under you while you try to select or edit. Flip Buttons on when you need to click through the real UI.Autosave vs Manual
- Autosave — text and attribute commits write to source immediately.
- Manual — those commits stage locally. The Save button shows a badge for dirty staged edits; click Save to flush them all. Switching back to Autosave also flushes.
Style panel changes always write immediately today, even in Manual mode.
Undo / redo
Use the toolbar buttons or:
- ⌘Z / Ctrl+Z — undo
- ⌘⇧Z / Ctrl+⇧Z — redo
Undo re-applies the reverse write (including bound-text value matching against the current source).
Hide & dismiss
- – collapses the bar to a small FAB. Click the FAB to bring it back.
- ✕ dismisses the toolbar for this page load and turns Buttons on so the page is fully interactive again. Reload to restore the toolbar.
Committing text edits
- Enter — commit
- Escape — cancel and revert
- Click outside the field — commit