Modes and read-only access
Switch between source and reading presentations in one instance, preserving content and history.
Three modes
| Mode | Use case |
|---|---|
source | Show all Markdown with a code-editor input experience |
live | Display a reading presentation over source, revealing syntax when entering the relevant range |
locked | Read, select, and copy with document editing disabled |
Change some text, switch modes, and return to Live to undo. All modes share the same document.
Independent read-only access
setReadOnly(true) makes Source or Live read-only. Editing permission is independent of presentation: you can keep the complete source visible while preventing edits.
editor.setMode('source')
editor.setReadOnly(true)
// Restore editing in Source mode.
editor.setReadOnly(false)
Input and focus
Changing mode does not recreate the instance or take focus away from toolbar controls. Presentation changes are deferred during composition to avoid interrupting input methods. The host can explicitly call focus() when the user should resume typing.
Presentation and permission are separate axes
| Mode | readOnly | Behavior |
|---|---|---|
| source | false | Edit raw syntax |
| live | false | Native editing with inactive previews |
| source / live | true | Retain presentation and prohibit writes |
| locked | Either | Reading and copying without writes |
Returning from locked to live retains the explicit host readonly setting. Theme changes affect neither axis. Mode changes may defer during composition; editor.mode reports the actual mode, not simply the latest request.
Custom controls
NodeView and preview readOnly props describe effective permission. Folding, finding and copying can remain available. Language, field, replacement and deletion actions must respect writing permission. Commands perform the final check; disabled UI alone is insufficient.
Custom projections default to live/locked. Source mode should reveal original syntax. Additional host mode UI must reflect actual state and handle composition-delayed changes. See Projection layers.