overleaf/services/web/frontend/js/features/source-editor/extensions/editable.ts
Alf Eaton e025088065 Merge pull request #13241 from overleaf/ae-extensions-documentation
Add documentation for CodeMirror extensions

GitOrigin-RevId: e5f07084173f201919272f9d46dcdaef4b817874
2023-07-17 10:28:53 +00:00

29 lines
933 B
TypeScript

import { Compartment, EditorState, TransactionSpec } from '@codemirror/state'
import { EditorView } from '@codemirror/view'
const readOnlyConf = new Compartment()
/**
* A custom extension which determines whether the content is editable, by setting the value of the EditorState.readOnly and EditorView.editable facets.
* Commands and extensions read the EditorState.readOnly facet to decide whether they should be applied.
* EditorView.editable determines whether the DOM can be focused, by changing the value of the contenteditable attribute.
*/
export const editable = () => {
return [
readOnlyConf.of([
EditorState.readOnly.of(true),
EditorView.editable.of(false),
]),
]
}
export const setEditable = (value = true): TransactionSpec => {
return {
effects: [
readOnlyConf.reconfigure([
EditorState.readOnly.of(!value),
EditorView.editable.of(value),
]),
],
}
}