41 lines
1.1 KiB
TypeScript
41 lines
1.1 KiB
TypeScript
|
import {basicSetup} from "codemirror"
|
||
|
|
import {EditorView, keymap} from "@codemirror/view"
|
||
|
|
import {indentWithTab} from "@codemirror/commands"
|
||
|
|
import {markdown} from "@codemirror/lang-markdown"
|
||
|
|
|
||
|
|
export function makeEditor(divSelector, value) {
|
||
|
|
let div = document.querySelector(divSelector);
|
||
|
|
|
||
|
|
let documentTheme = EditorView.theme({
|
||
|
|
"&": {
|
||
|
|
"background-color": "white",
|
||
|
|
},
|
||
|
|
".cm-editor": {
|
||
|
|
"height": "100%",
|
||
|
|
},
|
||
|
|
".cm-scroller": {overflow: "auto"}
|
||
|
|
}, {})
|
||
|
|
|
||
|
|
// add a hidden textarea inside the div for form submission
|
||
|
|
let textarea = document.createElement("textarea");
|
||
|
|
textarea.setAttribute("name", "content");
|
||
|
|
textarea.style.display = "none";
|
||
|
|
div.appendChild(textarea);
|
||
|
|
|
||
|
|
let extensions = [
|
||
|
|
basicSetup,
|
||
|
|
keymap.of([indentWithTab]),
|
||
|
|
markdown(),
|
||
|
|
documentTheme,
|
||
|
|
EditorView.lineWrapping,
|
||
|
|
];
|
||
|
|
|
||
|
|
let view = new EditorView({parent: div, doc: value, extensions})
|
||
|
|
|
||
|
|
textarea.form.addEventListener("submit", () => {
|
||
|
|
textarea.value = view.state.doc.toString()
|
||
|
|
})
|
||
|
|
|
||
|
|
return view
|
||
|
|
}
|