@modusoperandi/licit 0.13.3 → 0.13.20

package/dist/client/CollabConnector.js

@@ -71,7 +71,11 @@ class CollabConnector extends _SimpleConnector.default {
     });
 
     _defineProperty(this, "updateSchema", (schema, data) => {
-      this._connection.updateSchema(schema, data);
+      this._connection.updateSchema(schema, data, this._dataDefined);
+    });
+
+    _defineProperty(this, "updateContent", data => {
+      this._connection.start(data, this._dataDefined);
     });
 
     const {

package/dist/client/CollabConnector.js.flow

@@ -14,7 +14,7 @@ type IdStrict = string;
 class CollabConnector extends SimpleConnector {
   _clientID: string;
   _connected: boolean;
-  _connection: any;
+  _connection: EditorConnection;
   _docID: IdStrict;
   _stepKeys: Object;
 
@@ -79,7 +79,11 @@ class CollabConnector extends SimpleConnector {
   // FS IRAD-1040 2020-09-02
   // Send the modified schema to server
   updateSchema = (schema: Schema, data: any) => {
-    this._connection.updateSchema(schema, data);
+    this._connection.updateSchema(schema, data, this._dataDefined);
+  };
+
+  updateContent = (data: any) => {
+    this._connection.start(data, this._dataDefined);
   };
 }
 

package/dist/client/EditorConnection.js

@@ -158,8 +158,9 @@ class EditorConnection {
   } // Load the document from the server and start up
 
 
-  start() {
-    this.run((0, _http.GET)(this.url)).then(data => {
+  start(input, dataDefined) {
+    const query = '?dataDefined=' + dataDefined;
+    this.run(input ? (0, _http.PUT)(this.url + query, JSON.stringify(input), 'application/json') : (0, _http.GET)(this.url, 'application/json')).then(data => {
       data = JSON.parse(data);
       this.report.success();
       this.backOff = 0;
@@ -266,14 +267,14 @@ class EditorConnection {
   // Send the modified schema to server
 
 
-  updateSchema(schema, input) {
+  updateSchema(schema, input, dataDefined) {
     // to avoid cyclic reference error, use flatted string.
     const schemaFlatted = (0, _flatted.stringify)(schema);
     this.run((0, _http.POST)(this.url + '/schema/', schemaFlatted, 'text/plain')).then(data => {
       console.log("collab server's schema updated"); // [FS] IRAD-1040 2020-09-08
 
       this.schema = schema;
-      this.start(input);
+      this.start(input, dataDefined);
     }, err => {
       this.report.failure(err);
     });

package/dist/client/EditorConnection.js.flow

@@ -10,7 +10,7 @@ import { Plugin, EditorState } from 'prosemirror-state';
 import { Step } from 'prosemirror-transform';
 import { EditorView } from 'prosemirror-view';
 import uuid from '../uuid';
-import { GET, POST } from './http';
+import { GET, POST, PUT } from './http';
 // [FS] IRAD-1040 2020-09-02
 import { Schema } from 'prosemirror-model';
 import { stringify } from 'flatted';
@@ -144,8 +144,13 @@ class EditorConnection {
   }
 
   // Load the document from the server and start up
-  start(): void {
-    this.run(GET(this.url)).then(
+  start(input: any, dataDefined: boolean): void {
+    const query = '?dataDefined=' + dataDefined;
+    this.run(
+      input
+        ? PUT(this.url + query, JSON.stringify(input), 'application/json')
+        : GET(this.url, 'application/json')
+    ).then(
       (data) => {
         data = JSON.parse(data);
         this.report.success();
@@ -253,7 +258,7 @@ class EditorConnection {
 
   // [FS] IRAD-1040 2020-09-02
   // Send the modified schema to server
-  updateSchema(schema: Schema, input: any) {
+  updateSchema(schema: Schema, input: any, dataDefined: boolean) {
     // to avoid cyclic reference error, use flatted string.
     const schemaFlatted = stringify(schema);
     this.run(POST(this.url + '/schema/', schemaFlatted, 'text/plain')).then(
@@ -261,7 +266,7 @@ class EditorConnection {
         console.log("collab server's schema updated");
         // [FS] IRAD-1040 2020-09-08
         this.schema = schema;
-        this.start(input);
+        this.start(input, dataDefined);
       },
       (err) => {
         this.report.failure(err);

package/dist/client/Licit.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = exports.DataType = void 0;
 
 var _prosemirrorState = require("prosemirror-state");
 
@@ -45,6 +45,8 @@ var _EditorMarks = _interopRequireDefault(require("../EditorMarks"));
 
 var _EditorNodes = _interopRequireDefault(require("../EditorNodes"));
 
+var _convertFromHTML = _interopRequireDefault(require("../convertFromHTML"));
+
 var _Types = require("../Types");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -55,8 +57,10 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-const ATTR_OBJID = 'objectId';
-const ATTR_OBJMETADATA = 'objectMetaData';
+const DataType = Object.freeze({
+  JSON: Symbol('json'),
+  HTML: Symbol('html')
+});
 /**
  * LICIT properties:
  *  docID {string} [] Collaborative Doument ID
@@ -69,12 +73,15 @@ const ATTR_OBJMETADATA = 'objectMetaData';
  *      @param data {JSON} Modified document data.
  *  onReady {@callback} [null] Fires when the editor is fully ready.
  *      @param ref {LICIT} Rerefence of the editor.
- *  data {JSON} [null] Document data to be loaded into the editor.
+ *  data {JSON|HTML} [null] Document data to be loaded into the editor.
+ *  dataType {JSON|HTML} [JSON] Document data to be loaded into the editor.
  *  disabled {boolean} [false] Disable the editor.
  *  embedded {boolean} [false] Disable/Enable inline behaviour.
  *  plugins [plugins] External Plugins into the editor.
  */
 
+exports.DataType = DataType;
+
 class Licit extends React.Component {
   // This will be handy in updating document's content.
   // Flag to decide whether to skip shouldComponentUpdate
@@ -114,17 +121,21 @@ class Licit extends React.Component {
 
     _defineProperty(this, "setContent", function () {
       let content = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      // [FS] IRAD-1571 2021-09-27
+      let dataType = arguments.length > 1 ? arguments[1] : undefined;
+      _this.skipDataTypeCheck = false; // [FS] IRAD-1571 2021-09-27
       // dispatch a transaction that MUST start from the view’s current state;
+
       const editorState = _this._editorView.state;
       const {
-        doc,
-        schema
+        doc
       } = editorState;
       let {
         tr
       } = editorState;
-      const document = schema.nodeFromJSON(content ? content : _createEmptyEditorState.EMPTY_DOC_JSON); // [FS] IRAD-1593 2021-10-12
+
+      const document = _this.getDocument(content, editorState, dataType);
+
+      _this.skipDataTypeCheck = true; // [FS] IRAD-1593 2021-10-12
       // Reset lastKeyCode since the content is set dynamically and so lastKeyCode is invalid now.
 
       _this._editorView.lastKeyCode = null;
@@ -133,9 +144,11 @@ class Licit extends React.Component {
 
       tr = tr.setSelection(selection).replaceSelectionWith(document, false); // [FS] IRAD-1092 2020-12-03
       // set the value for object metadata  and objectId
+      // Should update all document attributes.
 
-      tr = _this.isNodeHasAttribute(document, ATTR_OBJMETADATA) ? tr.step(new _licitDocAttrsStep.SetDocAttrStep(ATTR_OBJMETADATA, document.attrs.objectMetaData)) : tr;
-      tr = _this.isNodeHasAttribute(document, ATTR_OBJID) ? tr.step(new _licitDocAttrsStep.SetDocAttrStep(ATTR_OBJID, document.attrs.objectId)) : tr;
+      Object.keys(document.attrs).forEach(attr => {
+        tr = tr.step(new _licitDocAttrsStep.SetDocAttrStep(attr, document.attrs[attr]));
+      });
       _this._skipSCU = true;
 
       _this._editorView.dispatch(tr);
@@ -243,9 +256,10 @@ class Licit extends React.Component {
         propsCopy.readOnly = false;
         delete propsCopy.data;
         this.setState(propsCopy);
-      } // Need to go through shouldComponentUpdate lifecycle here, when updated from outside,
-      // so that content is modified gracefully using transaction so that undo/redo works too.
+      }
 
+      this.skipDataTypeCheck = false; // Need to go through shouldComponentUpdate lifecycle here, when updated from outside,
+      // so that content is modified gracefully using transaction so that undo/redo works too.
 
       this._skipSCU = false;
       this.setState(props);
@@ -278,33 +292,32 @@ class Licit extends React.Component {
     const onChangeCB = typeof props.onChange === 'function' ? props.onChange : noop;
     const onReadyCB = typeof props.onReady === 'function' ? props.onReady : noop;
     const readOnly = props.readOnly || false;
-    const data = props.data || null;
+    let data = props.data || null;
+    const dataType = props.dataType || DataType.JSON;
     const disabled = props.disabled || false;
     const embedded = props.embedded || false; // [FS] IRAD-996 2020-06-30
     // [FS] 2020-07-03
     // Handle Image Upload from Angular App
 
     const runtime = props.runtime || null;
-    const plugins = props.plugins || null;
+    const plugins = props.plugins || null; // This flag decides whether DataType.HTML check is needed when
+    // changing document. If it forcefully done, it is not needed, otherwise needed.
+
+    this.skipDataTypeCheck = false;
     this._defaultEditorSchema = new _prosemirrorModel.Schema({
       nodes: _EditorNodes.default,
       marks: _EditorMarks.default
     });
     this._defaultEditorPlugins = new _buildEditorPlugins.default(this._defaultEditorSchema).get();
-    let editorState = (0, _convertFromJSON.default)(data, null, this._defaultEditorSchema, plugins, this._defaultEditorPlugins); // [FS] IRAD-1067 2020-09-19
-    // The editorState will return null if the doc Json is mal-formed
-
-    if (null === editorState) {
-      editorState = (0, _convertFromJSON.default)(_createEmptyEditorState.EMPTY_DOC_JSON, null, this._defaultEditorSchema, plugins, this._defaultEditorPlugins);
-      this.showAlert();
-    }
-
+    const editorState = this.initEditorState(plugins, dataType, data);
+    data = editorState.doc;
     const setState = this.setState.bind(this);
     this._connector = collaborative ? new _CollabConnector.default(editorState, setState, {
       docID,
       collabServiceURL
     }, this._defaultEditorSchema, this._defaultEditorPlugins, // [FS] IRAD-1578 2021-09-27
-    this.onReady.bind(this)) : new _SimpleConnector.default(editorState, setState); // FS IRAD-989 2020-18-06
+    this.onReady.bind(this)) : new _SimpleConnector.default(editorState, setState);
+    this._connector._dataDefined = !!props.data; // FS IRAD-989 2020-18-06
     // updating properties should automatically render the changes
 
     this.state = {
@@ -320,7 +333,8 @@ class Licit extends React.Component {
       debug,
       disabled,
       embedded,
-      runtime
+      runtime,
+      dataType
     }; // FS IRAD-1040 2020-26-08
     // Get the modified schema from editorstate and send it to collab server
 
@@ -328,6 +342,50 @@ class Licit extends React.Component {
       // Use known editorState to update schema.
       this._connector.updateSchema(editorState.schema, data);
     }
+  }
+
+  initEditorState(plugins, dataType, data) {
+    let editorState = null;
+    const effectivePlugins = this.getEffectivePlugins(this._defaultEditorSchema, this._defaultEditorPlugins, plugins);
+
+    if (DataType.JSON === dataType) {
+      editorState = (0, _convertFromJSON.default)(data, null, effectivePlugins.schema, effectivePlugins.plugins); // [FS] IRAD-1067 2020-09-19
+      // The editorState will return null if the doc Json is mal-formed
+
+      if (null === editorState) {
+        editorState = (0, _convertFromJSON.default)(_createEmptyEditorState.EMPTY_DOC_JSON, null, effectivePlugins.schema, effectivePlugins.plugins);
+        this.showAlert();
+      }
+    } else {
+      editorState = (0, _convertFromHTML.default)(data, effectivePlugins.schema, effectivePlugins.plugins);
+    }
+
+    return editorState;
+  }
+
+  getEffectivePlugins(schema, defaultPlugins, plugins) {
+    const effectivePlugins = defaultPlugins;
+
+    if (plugins) {
+      for (const p of plugins) {
+        if (!effectivePlugins.includes(p)) {
+          effectivePlugins.push(p);
+
+          if (p.getEffectiveSchema) {
+            schema = p.getEffectiveSchema(schema);
+          }
+
+          if (p.initKeyCommands) {
+            effectivePlugins.push(p.initKeyCommands());
+          }
+        }
+      }
+    }
+
+    return {
+      plugins: effectivePlugins,
+      schema
+    };
   } // [FS] IRAD-1578 2021-09-27
 
 
@@ -426,7 +484,23 @@ class Licit extends React.Component {
     return node.attrs && node.attrs[attrName];
   }
 
-  hasDataChanged(nextData) {
+  getDocument(content, editorState, dataType) {
+    let document = null;
+    const {
+      schema
+    } = editorState;
+
+    if (DataType.JSON === dataType || this.skipDataTypeCheck) {
+      document = schema.nodeFromJSON(content ? content : _createEmptyEditorState.EMPTY_DOC_JSON);
+    } else {
+      const tempEState = (0, _convertFromHTML.default)(content ? content : '', schema, editorState.plugins);
+      document = tempEState.doc;
+    }
+
+    return document;
+  }
+
+  hasDataChanged(nextData, nextDataType) {
     let dataChanged = false; // [FS] IRAD-1571 2021-09-27
     // dispatch a transaction that MUST start from the view’s current state;
     // [FS] IRAD-1589 2021-10-04
@@ -434,19 +508,19 @@ class Licit extends React.Component {
 
     if ((0, _flatted.stringify)(this.state.data) !== (0, _flatted.stringify)(nextData)) {
       const editorState = this._editorView.state;
-      const nextDoc = editorState.schema.nodeFromJSON(nextData ? nextData : _createEmptyEditorState.EMPTY_DOC_JSON);
+      const nextDoc = this.getDocument(nextData, editorState, nextDataType);
       dataChanged = !nextDoc.eq(editorState.doc);
     }
 
     return dataChanged;
   }
 
-  changeContent(data) {
-    if (this.hasDataChanged(data)) {
+  changeContent(data, dataType) {
+    if (this.hasDataChanged(data, dataType)) {
       // FS IRAD-1592 2021-11-10
       // Release here quickly, so that update doesn't care about at this point.
       // data changed, so update document content
-      setTimeout(this.setContent.bind(this, data), 1);
+      setTimeout(this.setContent.bind(this, data, dataType), 1);
     }
   }
 
@@ -454,13 +528,14 @@ class Licit extends React.Component {
     // Only interested if properties are set from outside.
     if (!this._skipSCU) {
       this._skipSCU = false;
-      this.changeContent(nextState.data);
+      this.changeContent(nextState.data, nextState.dataType);
 
       if (this.state.docID !== nextState.docID) {
         setTimeout(this.setDocID.bind(this, nextState), 1);
       }
     }
 
+    this.skipDataTypeCheck = true;
     return true;
   }
 

package/dist/client/Licit.js.flow

@@ -1,6 +1,6 @@
 // @flow
 import { EditorState, TextSelection, Plugin } from 'prosemirror-state';
-import { Node } from 'prosemirror-model';
+import { Node, Schema } from 'prosemirror-model';
 import { Transform } from 'prosemirror-transform';
 import { EditorView } from 'prosemirror-view';
 import * as React from 'react';
@@ -14,18 +14,23 @@ import SimpleConnector from './SimpleConnector';
 import CollabConnector from './CollabConnector';
 import { EMPTY_DOC_JSON } from '../createEmptyEditorState';
 import type { EditorRuntime } from '../Types';
-import { createPopUp } from '@modusoperandi/licit-ui-commands';
-import { atViewportCenter } from '@modusoperandi/licit-ui-commands';
+import {
+  createPopUp,
+  atViewportCenter,
+} from '@modusoperandi/licit-ui-commands';
 import AlertInfo from '../ui/AlertInfo';
 import { SetDocAttrStep } from '@modusoperandi/licit-doc-attrs-step';
 import './licit.css';
 import DefaultEditorPlugins from '../buildEditorPlugins';
-import { Schema } from 'prosemirror-model';
 import EditorMarks from '../EditorMarks';
 import EditorNodes from '../EditorNodes';
+import convertFromHTML from '../convertFromHTML';
+
+export const DataType = Object.freeze({
+  JSON: Symbol('json'),
+  HTML: Symbol('html'),
+});
 
-const ATTR_OBJID = 'objectId';
-const ATTR_OBJMETADATA = 'objectMetaData';
 /**
  * LICIT properties:
  *  docID {string} [] Collaborative Doument ID
@@ -38,14 +43,15 @@ const ATTR_OBJMETADATA = 'objectMetaData';
  *      @param data {JSON} Modified document data.
  *  onReady {@callback} [null] Fires when the editor is fully ready.
  *      @param ref {LICIT} Rerefence of the editor.
- *  data {JSON} [null] Document data to be loaded into the editor.
+ *  data {JSON|HTML} [null] Document data to be loaded into the editor.
+ *  dataType {JSON|HTML} [JSON] Document data to be loaded into the editor.
  *  disabled {boolean} [false] Disable the editor.
  *  embedded {boolean} [false] Disable/Enable inline behaviour.
  *  plugins [plugins] External Plugins into the editor.
  */
 class Licit extends React.Component<any, any> {
   _runtime: EditorRuntime;
-  _connector: any;
+  _connector: SimpleConnector;
   _clientID: string;
   _editorView: EditorView; // This will be handy in updating document's content.
   _skipSCU: boolean; // Flag to decide whether to skip shouldComponentUpdate
@@ -93,13 +99,17 @@ class Licit extends React.Component<any, any> {
     const onReadyCB =
       typeof props.onReady === 'function' ? props.onReady : noop;
     const readOnly = props.readOnly || false;
-    const data = props.data || null;
+    let data = props.data || null;
+    const dataType = props.dataType || DataType.JSON;
     const disabled = props.disabled || false;
     const embedded = props.embedded || false; // [FS] IRAD-996 2020-06-30
     // [FS] 2020-07-03
     // Handle Image Upload from Angular App
     const runtime = props.runtime || null;
     const plugins = props.plugins || null;
+    // This flag decides whether DataType.HTML check is needed when
+    // changing document. If it forcefully done, it is not needed, otherwise needed.
+    this.skipDataTypeCheck = false;
 
     this._defaultEditorSchema = new Schema({
       nodes: EditorNodes,
@@ -109,25 +119,8 @@ class Licit extends React.Component<any, any> {
       this._defaultEditorSchema
     ).get();
 
-    let editorState = convertFromJSON(
-      data,
-      null,
-      this._defaultEditorSchema,
-      plugins,
-      this._defaultEditorPlugins
-    );
-    // [FS] IRAD-1067 2020-09-19
-    // The editorState will return null if the doc Json is mal-formed
-    if (null === editorState) {
-      editorState = convertFromJSON(
-        EMPTY_DOC_JSON,
-        null,
-        this._defaultEditorSchema,
-        plugins,
-        this._defaultEditorPlugins
-      );
-      this.showAlert();
-    }
+    const editorState = this.initEditorState(plugins, dataType, data);
+    data = editorState.doc;
 
     const setState = this.setState.bind(this);
     this._connector = collaborative
@@ -145,6 +138,8 @@ class Licit extends React.Component<any, any> {
         )
       : new SimpleConnector(editorState, setState);
 
+    this._connector._dataDefined = !!props.data;
+
     // FS IRAD-989 2020-18-06
     // updating properties should automatically render the changes
 
@@ -162,6 +157,7 @@ class Licit extends React.Component<any, any> {
       disabled,
       embedded,
       runtime,
+      dataType,
     };
 
     // FS IRAD-1040 2020-26-08
@@ -172,6 +168,66 @@ class Licit extends React.Component<any, any> {
     }
   }
 
+  initEditorState(plugins: Array<Plugin>, dataType: DataType, data: any) {
+    let editorState = null;
+    const effectivePlugins = this.getEffectivePlugins(
+      this._defaultEditorSchema,
+      this._defaultEditorPlugins,
+      plugins
+    );
+    if (DataType.JSON === dataType) {
+      editorState = convertFromJSON(
+        data,
+        null,
+        effectivePlugins.schema,
+        effectivePlugins.plugins
+      );
+      // [FS] IRAD-1067 2020-09-19
+      // The editorState will return null if the doc Json is mal-formed
+      if (null === editorState) {
+        editorState = convertFromJSON(
+          EMPTY_DOC_JSON,
+          null,
+          effectivePlugins.schema,
+          effectivePlugins.plugins
+        );
+        this.showAlert();
+      }
+    } else {
+      editorState = convertFromHTML(
+        data,
+        effectivePlugins.schema,
+        effectivePlugins.plugins
+      );
+    }
+
+    return editorState;
+  }
+
+  getEffectivePlugins(
+    schema: Schema,
+    defaultPlugins: Array<Plugin>,
+    plugins: Array<Plugin>
+  ): { plugins: Array<Plugin>, schema: Schema } {
+    const effectivePlugins = defaultPlugins;
+
+    if (plugins) {
+      for (const p of plugins) {
+        if (!effectivePlugins.includes(p)) {
+          effectivePlugins.push(p);
+          if (p.getEffectiveSchema) {
+            schema = p.getEffectiveSchema(schema);
+          }
+
+          if (p.initKeyCommands) {
+            effectivePlugins.push(p.initKeyCommands());
+          }
+        }
+      }
+    }
+    return { plugins: effectivePlugins, schema };
+  }
+
   // [FS] IRAD-1578 2021-09-27
   onReady(state: EditorState) {
     const collabEditing = this.state.docID !== '';
@@ -263,13 +319,33 @@ class Licit extends React.Component<any, any> {
     return node.attrs && node.attrs[attrName];
   }
 
-  setContent = (content: any = {}): void => {
+  getDocument(content: any, editorState: EditorState, dataType: DataType) {
+    let document = null;
+    const { schema } = editorState;
+
+    if (DataType.JSON === dataType || this.skipDataTypeCheck) {
+      document = schema.nodeFromJSON(content ? content : EMPTY_DOC_JSON);
+    } else {
+      const tempEState = convertFromHTML(
+        content ? content : '',
+        schema,
+        editorState.plugins
+      );
+      document = tempEState.doc;
+    }
+
+    return document;
+  }
+
+  setContent = (content: any = {}, dataType: DataType): void => {
+    this.skipDataTypeCheck = false;
     // [FS] IRAD-1571 2021-09-27
     // dispatch a transaction that MUST start from the view’s current state;
     const editorState = this._editorView.state;
-    const { doc, schema } = editorState;
+    const { doc } = editorState;
     let { tr } = editorState;
-    const document = schema.nodeFromJSON(content ? content : EMPTY_DOC_JSON);
+    const document = this.getDocument(content, editorState, dataType);
+    this.skipDataTypeCheck = true;
 
     // [FS] IRAD-1593 2021-10-12
     // Reset lastKeyCode since the content is set dynamically and so lastKeyCode is invalid now.
@@ -280,20 +356,16 @@ class Licit extends React.Component<any, any> {
     tr = tr.setSelection(selection).replaceSelectionWith(document, false);
     // [FS] IRAD-1092 2020-12-03
     // set the value for object metadata  and objectId
-    tr = this.isNodeHasAttribute(document, ATTR_OBJMETADATA)
-      ? tr.step(
-          new SetDocAttrStep(ATTR_OBJMETADATA, document.attrs.objectMetaData)
-        )
-      : tr;
-    tr = this.isNodeHasAttribute(document, ATTR_OBJID)
-      ? tr.step(new SetDocAttrStep(ATTR_OBJID, document.attrs.objectId))
-      : tr;
+    // Should update all document attributes.
+    Object.keys(document.attrs).forEach((attr) => {
+      tr = tr.step(new SetDocAttrStep(attr, document.attrs[attr]));
+    });
 
     this._skipSCU = true;
     this._editorView.dispatch(tr);
   };
 
-  hasDataChanged(nextData: any) {
+  hasDataChanged(nextData: any, nextDataType: DataType) {
     let dataChanged = false;
 
     // [FS] IRAD-1571 2021-09-27
@@ -302,21 +374,19 @@ class Licit extends React.Component<any, any> {
     // Do a proper circular JSON comparison.
     if (stringify(this.state.data) !== stringify(nextData)) {
       const editorState = this._editorView.state;
-      const nextDoc = editorState.schema.nodeFromJSON(
-        nextData ? nextData : EMPTY_DOC_JSON
-      );
+      const nextDoc = this.getDocument(nextData, editorState, nextDataType);
       dataChanged = !nextDoc.eq(editorState.doc);
     }
 
     return dataChanged;
   }
 
-  changeContent(data: any) {
-    if (this.hasDataChanged(data)) {
+  changeContent(data: any, dataType: DataType) {
+    if (this.hasDataChanged(data, dataType)) {
       // FS IRAD-1592 2021-11-10
       // Release here quickly, so that update doesn't care about at this point.
       // data changed, so update document content
-      setTimeout(this.setContent.bind(this, data), 1);
+      setTimeout(this.setContent.bind(this, data, dataType), 1);
     }
   }
 
@@ -325,13 +395,15 @@ class Licit extends React.Component<any, any> {
     if (!this._skipSCU) {
       this._skipSCU = false;
 
-      this.changeContent(nextState.data);
+      this.changeContent(nextState.data, nextState.dataType);
 
       if (this.state.docID !== nextState.docID) {
         setTimeout(this.setDocID.bind(this, nextState), 1);
       }
     }
 
+    this.skipDataTypeCheck = true;
+
     return true;
   }
 
@@ -582,6 +654,7 @@ class Licit extends React.Component<any, any> {
       delete propsCopy.data;
       this.setState(propsCopy);
     }
+    this.skipDataTypeCheck = false;
     // Need to go through shouldComponentUpdate lifecycle here, when updated from outside,
     // so that content is modified gracefully using transaction so that undo/redo works too.
     this._skipSCU = false;