@wiris/mathtype-ckeditor5 8.14.0 → 8.15.1

package/dist/browser/index.umd.js

@@ -5,7 +5,7 @@
 })(this, (function (exports, ckeditor5) { 'use strict';
 
   var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
-  /*! @license DOMPurify 3.3.0 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.3.0/LICENSE */
+  /*! @license DOMPurify 3.3.1 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.3.1/LICENSE */
 
   const {
     entries,
@@ -303,7 +303,7 @@
   function createDOMPurify() {
     let window = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : getGlobal();
     const DOMPurify = root => createDOMPurify(root);
-    DOMPurify.version = '3.3.0';
+    DOMPurify.version = '3.3.1';
     DOMPurify.removed = [];
     if (!window || !window.document || window.document.nodeType !== NODE_TYPE.document || !window.Element) {
       // Not running in a browser, provide a factory function
@@ -649,6 +649,12 @@
         }
         addToSet(FORBID_CONTENTS, cfg.FORBID_CONTENTS, transformCaseFunc);
       }
+      if (cfg.ADD_FORBID_CONTENTS) {
+        if (FORBID_CONTENTS === DEFAULT_FORBID_CONTENTS) {
+          FORBID_CONTENTS = clone(FORBID_CONTENTS);
+        }
+        addToSet(FORBID_CONTENTS, cfg.ADD_FORBID_CONTENTS, transformCaseFunc);
+      }
       /* Add #text in case KEEP_CONTENT is set to true */
       if (KEEP_CONTENT) {
         ALLOWED_TAGS['#text'] = true;
@@ -4026,6 +4032,27 @@
                   if (mathML == null) {
                       mathML = imgObject.getAttribute("alt");
                   }
+                  // WARNING: This code is needed for CKEditor 5 Track Changes compatibility.
+                  // Preserve Track Changes attributes when converting image back to MathML.
+                  // This ensures change tracking information is maintained during the roundtrip conversion
+                  // (MathML → Image → MathML) in collaborative editing scenarios.
+                  const TRACK_CHANGES_ATTRIBUTE_PREFIXES = [
+                      "data-suggestion-",
+                      "data-comment-"
+                  ];
+                  const preservedAttributes = {};
+                  // Extract Track Changes attributes from the image element
+                  for (const { name: attributeName, value: attributeValue } of imgObject.attributes){
+                      const isTrackChangesAttribute = TRACK_CHANGES_ATTRIBUTE_PREFIXES.some((prefix)=>attributeName.startsWith(prefix));
+                      if (isTrackChangesAttribute) {
+                          preservedAttributes[attributeName] = attributeValue;
+                      }
+                  }
+                  // If Track Changes attributes were found, inject them into the MathML opening tag
+                  if (Object.keys(preservedAttributes).length > 0) {
+                      const attributesString = Object.keys(preservedAttributes).map((name)=>` ${name}="${Util.htmlEntities(preservedAttributes[name])}"`).join("");
+                      mathML = mathML.replace(/(<math)/i, `$1${attributesString}`);
+                  }
                   if (convertToSafeXml) {
                       const safeMathML = MathML.safeXmlEncode(mathML);
                       return safeMathML;
@@ -4772,6 +4799,29 @@
               mathmlSubstring = mathmlSubstring.substring(4, mathmlSubstring.length);
               imgObject.setAttribute(Configuration.get("imageCustomEditorName"), mathmlSubstring);
           }
+          // WARNING: This code is needed for CKEditor 5 Track Changes compatibility.
+          // Preserve Track Changes attributes (suggestions and comments) when converting MathML to image.
+          // These attributes are needed to maintain change tracking information in collaborative editing scenarios.
+          // They are extracted from the input MathML and transferred to the output image element.
+          const TRACK_CHANGES_ATTRIBUTE_PREFIXES = [
+              "data-suggestion-",
+              "data-comment-"
+          ];
+          const attributePattern = /([\w-]+)="([^"]*)"/g;
+          let attributeMatch;
+          // Parse only the opening <math> tag to extract attributes
+          const mathOpeningTagEnd = mathml.indexOf(">");
+          if (mathOpeningTagEnd !== -1) {
+              const mathOpeningTag = mathml.substring(0, mathOpeningTagEnd);
+              while((attributeMatch = attributePattern.exec(mathOpeningTag)) !== null){
+                  const [, attributeName, attributeValue] = attributeMatch;
+                  // Transfer Track Changes attributes from MathML to image
+                  const isTrackChangesAttribute = TRACK_CHANGES_ATTRIBUTE_PREFIXES.some((prefix)=>attributeName.startsWith(prefix));
+                  if (isTrackChangesAttribute) {
+                      imgObject.setAttribute(attributeName, Util.htmlEntitiesDecode(attributeValue));
+                  }
+              }
+          }
           // Performance enabled.
           if (Configuration.get("wirisPluginPerformance") && (Configuration.get("saveMode") === "xml" || Configuration.get("saveMode") === "safeXml")) {
               let result = JSON.parse(Parser.createShowImageSrc(data, language));
@@ -9742,6 +9792,8 @@
      * Opens formula editor to editing an existing formula. Can be overwritten in order to make some
      * actions from integration part before the formula is edited.
      */ openExistingFormulaEditor() {
+          // Recover owner integration instance.
+          WirisPlugin.currentInstance = this;
           if (window.navigator.onLine) {
               this.core.editionProperties.isNewElement = false;
               this.core.openModalDialog(this.target, this.isIframe);
@@ -11263,7 +11315,9 @@
                   // Remove selection
                   if (!viewSelection.isCollapsed) {
                       for (const range of viewSelection.getRanges()){
-                          writer.remove(this.editorObject.editing.mapper.toModelRange(range));
+                          const modelRange = this.editorObject.editing.mapper.toModelRange(range);
+                          const modelSelection = this.editorObject.model.createSelection(modelRange);
+                          this.editorObject.model.deleteContent(modelSelection);
                       }
                   }
                   // Set carret after the formula
@@ -11279,7 +11333,7 @@
                   if (mathml) {
                       this.editorObject.model.insertObject(modelElementNew, position);
                   }
-                  writer.remove(modelElementOld);
+                  this.editorObject.model.deleteContent(this.editorObject.model.createSelection(modelElementOld, 'on'));
               }
               // eslint-disable-next-line consistent-return
               return modelElementNew;
@@ -11323,6 +11377,14 @@
               returnObject.node = windowTarget.document.createTextNode(`$$${returnObject.latex}$$`);
               this.editorObject.model.change((writer)=>{
                   const { latexRange } = this.core.editionProperties;
+                  // Add null check for latexRange.
+                  // When the editor is initialized in a textarea element, latexRange may not be set on initial load.
+                  // This check ensures formulas can still be inserted by falling back to MathML insertion if latexRange is not available.
+                  if (!latexRange) {
+                      // Fallback to regular MathML insertion if latexRange is not available
+                      this.insertMathml(mathml);
+                      return;
+                  }
                   const startNode = this.findText(latexRange.startContainer);
                   const endNode = this.findText(latexRange.endContainer);
                   let startPosition = writer.createPositionAt(startNode.parent, startNode.startOffset + latexRange.startOffset);
@@ -11350,7 +11412,8 @@
                           range = writer.createRange(startPosition, endPosition);
                       }
                   }
-                  writer.remove(range);
+                  const modelSelection = this.editorObject.model.createSelection(range);
+                  this.editorObject.model.deleteContent(modelSelection);
                   writer.insertText(`$$${returnObject.latex}$$`, startNode.getAttributes(), startPosition);
               });
           } else {
@@ -11471,7 +11534,7 @@
 
   var chemIcon = "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<!-- Generator: Adobe Illustrator 22.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->\n<svg version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n\t viewBox=\"0 0 40.3 49.5\" style=\"enable-background:new 0 0 40.3 49.5;\" xml:space=\"preserve\">\n<style type=\"text/css\">\n\t.st0{fill:#A4CF61;}\n</style>\n<path class=\"st0\" d=\"M39.2,12.1c0-1.9-1.1-3.6-2.7-4.4L24.5,0.9l0,0c-0.7-0.4-1.5-0.6-2.4-0.6c-0.9,0-1.7,0.2-2.4,0.6l0,0L2.3,10.8\n\tl0,0C0.9,11.7,0,13.2,0,14.9h0v19.6h0c0,1.7,0.9,3.3,2.3,4.1l0,0l17.4,9.9l0,0c0.7,0.4,1.5,0.6,2.4,0.6c0.9,0,1.7-0.2,2.4-0.6l0,0\n\tl12.2-6.9h0c1.5-0.8,2.6-2.5,2.6-4.3c0-2.7-2.2-4.9-4.9-4.9c-0.9,0-1.8,0.3-2.5,0.7l0,0l-9.7,5.6l-12.3-7V17.8l12.3-7l9.9,5.7l0,0\n\tc0.7,0.4,1.5,0.6,2.4,0.6C37,17,39.2,14.8,39.2,12.1\"/>\n</svg>\n";
 
-  var version = "8.14.0";
+  var version = "8.15.1";
   var packageInfo = {
   	version: version};
 
@@ -11491,7 +11554,9 @@
           const integration = this._addIntegration();
           currentInstance = integration;
           // Add the MathType and ChemType commands to the editor
-          this._addCommands();
+          this._addCommands(integration);
+          // Add the track changes feature integration
+          this._addTrackChangesIntegration(integration);
           // Add the buttons for MathType and ChemType
           this._addViews(integration);
           // Registers the <mathml> element in the schema
@@ -11811,7 +11876,8 @@
                   imgElement = htmlDataProcessor.toView(htmlContent).getChild(0);
               } else if (formula) {
                   const mathString = formula.replaceAll('ref="<"', 'ref="&lt;"');
-                  const imgHtml = Parser.initParse(mathString, integration.getLanguage());
+                  const lang = integration?.getLanguage() || "en"; // Safe fallback to 'en' in case integration is undefined.
+                  const imgHtml = Parser.initParse(mathString, lang);
                   imgElement = htmlDataProcessor.toView(imgHtml).getChild(0);
                   // Add HTML element (<img>) to model
                   viewWriter.setAttribute("htmlContent", imgHtml, modelItem);
@@ -11869,13 +11935,63 @@
           editor.editing.mapper.on("viewToModelPosition", ckeditor5.viewToModelPositionOutsideModelElement(editor.model, (viewElement)=>viewElement.hasClass("ck-math-widget")));
           // Keep a reference to the original get and set function.
           const { get, set } = editor.data;
+          // Listen to the preview command execution to set a flag in localStorage.
+          // This flag will be used in the getData() to prevent converting formulas while generating the preview.
+          // This is necessary because the preview command uses editor.getData() multiple times internally.
+          const previewCommand = editor.commands.get("previewFinalContent");
+          if (previewCommand) {
+              this.listenTo(previewCommand, "execute", ()=>{
+                  localStorage.setItem("isGeneratingPreview", true);
+                  setTimeout(()=>{
+                      localStorage.setItem("isGeneratingPreview", false);
+                  }, 1000);
+              }, {
+                  priority: "high"
+              });
+          }
           /**
-       * Hack to transform $$latex$$ into <math> in editor.getData()'s output.
+       * Listener for getData() that handles Track Changes and semantics cleanup.
+       *
+       * This listener intercepts the getData() call and processes the output differently
+       * depending on whether we're generating a preview or performing a save operation:
+       *
+       * - Preview Mode: Removes deleted formulas (marked with Track Changes deletion attributes)
+       *   while preserving formula images for visual representation.
+       * - Save Mode: Converts formulas to clean MathML by removing semantic annotations
+       *   and handwritten data, ensuring clean storage format.
        */ editor.data.on("get", (e)=>{
               const output = e.return;
+              // Check if we're in preview mode (flag set by previewFinalContent command)
+              const isGeneratingPreview = localStorage.getItem("isGeneratingPreview");
+              if (isGeneratingPreview === "true") {
+                  // Wrap a <span> around all img elements to preserve Track Changes visibility for formulas.
+                  // Span must contain all the img attributes to avoid render issues.
+                  const attributesToPreserve = [
+                      "data-suggestion-",
+                      "data-comment-"
+                  ];
+                  const previewOutput = output.replace(/<img([^>]*class="Wirisformula"[^>]*)>/g, (match, attributes)=>{
+                      // Extract Track Changes attributes
+                      const trackChangesAttrs = [];
+                      attributesToPreserve.forEach((prefix)=>{
+                          const regex = new RegExp(`(${prefix}[^=]*="[^"]*")`, "g");
+                          let attrMatch;
+                          while((attrMatch = regex.exec(attributes)) !== null){
+                              trackChangesAttrs.push(attrMatch[1]);
+                          }
+                      });
+                      const spanAttrs = trackChangesAttrs.length > 0 ? ` ${trackChangesAttrs.join(" ")}` : "";
+                      return `<span${spanAttrs}>${match}</span>`;
+                  });
+                  // Cleans all the semantics tag for safexml
+                  // including the handwritten data points
+                  e.return = MathML.removeSafeXMLSemantics(previewOutput);
+                  return;
+              }
+              // In save mode, convert formula images back to clean MathML
               const parsedResult = Parser.endParse(output);
-              // Cleans all the semantics tag for safexml
-              // including the handwritten data points
+              // Remove all semantic annotations (including handwritten data points)
+              // to ensure clean, standard MathML format for storage
               e.return = MathML.removeSafeXMLSemantics(parsedResult);
           }, {
               priority: "low"
@@ -11931,6 +12047,18 @@
               Latex
           };
       }
+      _addTrackChangesIntegration(integration) {
+          const { editor } = this;
+          if (editor.plugins.has("TrackChangesEditing")) {
+              const trackChangesEditing = editor.plugins.get("TrackChangesEditing");
+              // Makes MathType and ChemType buttons available when editor is in the track changes mode
+              trackChangesEditing.enableCommand("MathType");
+              trackChangesEditing.enableCommand("ChemType");
+              // Adds custom label replacing the default 'mathml'.
+              // Handles both singular and plural forms.
+              trackChangesEditing.descriptionFactory.registerElementLabel("mathml", (quantity)=>(quantity > 1 ? `${quantity} ` : "") + StringManager.get(quantity > 1 ? "formulas" : "formula", integration?.getLanguage() || "en"));
+          }
+      }
   }
 
   exports.CKEditor5Integration = CKEditor5Integration;