BookStack Code Mirror - bookstack/blob - resources/js/editor/ProseMirrorView.js

   1 import {EditorState} from "prosemirror-state";
   2 import {EditorView} from "prosemirror-view";
   3 import {exampleSetup} from "prosemirror-example-setup";
   4
   5 import {DOMParser} from "prosemirror-model";
   6
   7 import schema from "./schema";
   8 import menu from "./menu";
   9 import nodeViews from "./node-views";
  10 import {stateToHtml} from "./util";
  11
  12 class ProseMirrorView {
  13     constructor(target, content) {
  14
  15         // Build DOM from content
  16         const renderDoc = document.implementation.createHTMLDocument();
  17         renderDoc.body.innerHTML = content;
  18
  19         this.view = new EditorView(target, {
  20             state: EditorState.create({
  21                 doc: DOMParser.fromSchema(schema).parse(renderDoc.body),
  22                 plugins: [
  23                     ...exampleSetup({schema, menuBar: false}),
  24                     menu,
  25                 ]
  26             }),
  27             nodeViews,
  28         });
  29     }
  30
  31     get content() {
  32         return stateToHtml(this.view.state);
  33     }
  34
  35     focus() {
  36         this.view.focus()
  37     }
  38
  39     destroy() {
  40         this.view.destroy()
  41     }
  42 }
  43
  44 export default ProseMirrorView;