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