diff --git a/dashboard/src/lib/CodeEditor.svelte b/dashboard/src/lib/CodeEditor.svelte index bae940d..fe2de69 100644 --- a/dashboard/src/lib/CodeEditor.svelte +++ b/dashboard/src/lib/CodeEditor.svelte @@ -25,12 +25,18 @@ value = $bindable(''), language = 'rhai' as Language, placeholder = '', - minHeight = '12rem' + minHeight = '12rem', + readOnly = false }: { value?: string; language?: Language; placeholder?: string; minHeight?: string; + /** When true the editor renders without a cursor and rejects + * keystrokes. Parent-driven `value` changes still apply via + * the dispatch path below — this only blocks user edits. + * Not reactive after mount; re-mount via `{#key}` if needed. */ + readOnly?: boolean; } = $props(); let host: HTMLDivElement | null = null; @@ -48,6 +54,12 @@ keymap.of([indentWithTab]), dashboardSyntaxHighlighting, dashboardTheme, + // readOnly + editable together: readOnly blocks the + // underlying transactions, editable suppresses the caret + // + selection visuals so the user can see it's not + // editable. + EditorState.readOnly.of(readOnly), + EditorView.editable.of(!readOnly), EditorView.updateListener.of((update) => { if (update.docChanged && !pushingFromOutside) { value = update.state.doc.toString();