@limetech/lime-elements 37.34.1 → 37.36.0

package/dist/esm/limel-prosemirror-adapter.entry.js

@@ -24743,6 +24743,9 @@ const ProsemirrorAdapter = class {
         },
       });
       this.menuCommandFactory = new MenuCommandFactory(mySchema);
+      if (this.value) {
+        this.updateView(this.value);
+      }
     };
     this.handleActionBarItem = (event) => {
       event.preventDefault();
@@ -24761,6 +24764,13 @@ const ProsemirrorAdapter = class {
     this.view = undefined;
     this.actionBarItems = [];
   }
+  watchValue(newValue) {
+    if (!this.view ||
+      newValue === this.contentConverter.serialize(this.view, schema$1)) {
+      return;
+    }
+    this.updateView(newValue);
+  }
   componentWillLoad() {
     if (this.contentType === 'markdown') {
       this.contentConverter = new markdownConverter();
@@ -24781,6 +24791,16 @@ const ProsemirrorAdapter = class {
       h("limel-action-bar", { accessibleLabel: "Toolbar", actions: this.actionBarItems, onItemSelected: this.handleActionBarItem }),
     ];
   }
+  async updateView(content) {
+    const html = await this.contentConverter.parseAsHTML(content, schema$1);
+    const prosemirrorDOMparser = DOMParser.fromSchema(this.view.state.schema);
+    const domParser = new window.DOMParser();
+    const doc = domParser.parseFromString(html, 'text/html');
+    const prosemirrorDoc = prosemirrorDOMparser.parse(doc.body);
+    const tr = this.view.state.tr;
+    tr.replaceWith(0, tr.doc.content.size, prosemirrorDoc.content);
+    this.view.dispatch(tr);
+  }
   executeCommand(command) {
     const { state } = this.view;
     const selection = state.selection;
@@ -24795,6 +24815,9 @@ const ProsemirrorAdapter = class {
     this.view.focus();
   }
   get host() { return getElement(this); }
+  static get watchers() { return {
+    "value": ["watchValue"]
+  }; }
 };
 ProsemirrorAdapter.style = prosemirrorAdapterCss;