docx-diff-editor 1.0.44 → 1.0.46

package/dist/index.d.mts

@@ -436,6 +436,8 @@ declare function isProseMirrorJSON(content: unknown): boolean;
  * 3. Select all content and delete it (start fresh)
  * 4. Use editor.view.pasteHTML(html) - this uses the paste path which preserves styles
  * 5. Return the resulting JSON
+ *
+ * Falls back to the standard import approach if paste fails.
  */
 declare function parseHtmlToJson(html: string, SuperDoc: SuperDocConstructor): Promise<ProseMirrorJSON>;
 /**

package/dist/index.d.ts

@@ -436,6 +436,8 @@ declare function isProseMirrorJSON(content: unknown): boolean;
  * 3. Select all content and delete it (start fresh)
  * 4. Use editor.view.pasteHTML(html) - this uses the paste path which preserves styles
  * 5. Return the resulting JSON
+ *
+ * Falls back to the standard import approach if paste fails.
  */
 declare function parseHtmlToJson(html: string, SuperDoc: SuperDocConstructor): Promise<ProseMirrorJSON>;
 /**

package/dist/index.js

@@ -453,6 +453,170 @@ var TIMEOUTS = {
   CLEANUP_DELAY: 100
 };
 
+// src/services/runPropertiesSync.ts
+var PT_TO_TWIPS = 20;
+function ptToTwips(ptValue) {
+  return Math.round(ptValue * PT_TO_TWIPS);
+}
+function stripHashFromColor(color) {
+  return color.replace(/^#/, "");
+}
+function parseFontSizeToPoints(fontSize) {
+  if (typeof fontSize === "number") {
+    return fontSize;
+  }
+  const value = parseFloat(fontSize);
+  if (isNaN(value)) {
+    return null;
+  }
+  if (fontSize.toLowerCase().includes("px")) {
+    return value * 0.75;
+  }
+  return value;
+}
+function cleanFontFamily(fontFamily) {
+  return fontFamily.split(",")[0].trim().replace(/^["']|["']$/g, "");
+}
+function marksToRunProperties(marks) {
+  const runProperties = {};
+  if (!marks || !Array.isArray(marks)) {
+    return runProperties;
+  }
+  for (const mark of marks) {
+    const type = mark.type;
+    const attrs = mark.attrs || {};
+    switch (type) {
+      // Boolean marks: bold, italic, strike
+      case "bold":
+      case "italic":
+      case "strike": {
+        const isNegated = attrs.value === "0" || attrs.value === false;
+        runProperties[type] = !isNegated;
+        break;
+      }
+      // Underline with optional type and color
+      case "underline": {
+        const underlineAttrs = {};
+        if (attrs.underlineType) {
+          underlineAttrs["w:val"] = String(attrs.underlineType);
+        } else {
+          underlineAttrs["w:val"] = "single";
+        }
+        if (attrs.underlineColor) {
+          underlineAttrs["w:color"] = stripHashFromColor(String(attrs.underlineColor));
+        }
+        if (Object.keys(underlineAttrs).length > 0) {
+          runProperties.underline = underlineAttrs;
+        }
+        break;
+      }
+      // Highlight (background color)
+      case "highlight": {
+        if (attrs.color) {
+          const color = String(attrs.color).toLowerCase();
+          if (color === "transparent") {
+            runProperties.highlight = { "w:val": "none" };
+          } else {
+            runProperties.highlight = { "w:val": color };
+          }
+        }
+        break;
+      }
+      // textStyle contains multiple style attributes
+      case "textStyle": {
+        if (attrs.color != null) {
+          runProperties.color = {
+            val: stripHashFromColor(String(attrs.color))
+          };
+        }
+        if (attrs.fontSize != null) {
+          const points = parseFontSizeToPoints(attrs.fontSize);
+          if (points !== null) {
+            runProperties.fontSize = points * 2;
+          }
+        }
+        if (attrs.fontFamily != null) {
+          const cleanedFont = cleanFontFamily(String(attrs.fontFamily));
+          runProperties.fontFamily = {
+            ascii: cleanedFont,
+            eastAsia: cleanedFont,
+            hAnsi: cleanedFont,
+            cs: cleanedFont
+          };
+        }
+        if (attrs.letterSpacing != null) {
+          const ptValue = parseFloat(String(attrs.letterSpacing));
+          if (!isNaN(ptValue)) {
+            runProperties.letterSpacing = ptToTwips(ptValue);
+          }
+        }
+        if (attrs.textTransform != null) {
+          runProperties.textTransform = String(attrs.textTransform);
+        }
+        break;
+      }
+    }
+  }
+  return runProperties;
+}
+function collectMarksRecursively(node, allMarks) {
+  if (node.type === "text" && node.marks && Array.isArray(node.marks)) {
+    allMarks.push(...node.marks);
+  }
+  if (node.content && Array.isArray(node.content)) {
+    for (const child of node.content) {
+      collectMarksRecursively(child, allMarks);
+    }
+  }
+}
+function collectMarksFromRunChildren(runNode) {
+  const allMarks = [];
+  if (!runNode.content || !Array.isArray(runNode.content)) {
+    return allMarks;
+  }
+  for (const child of runNode.content) {
+    collectMarksRecursively(child, allMarks);
+  }
+  const marksByType = /* @__PURE__ */ new Map();
+  for (const mark of allMarks) {
+    marksByType.set(mark.type, mark);
+  }
+  return Array.from(marksByType.values());
+}
+function normalizeNode(node) {
+  if (node.type === "run") {
+    const marks = collectMarksFromRunChildren(node);
+    if (marks.length > 0) {
+      const runPropsFromMarks = marksToRunProperties(marks);
+      const existingRunProps = node.attrs?.runProperties || {};
+      const mergedRunProps = {
+        ...existingRunProps,
+        ...runPropsFromMarks
+      };
+      return {
+        ...node,
+        attrs: {
+          ...node.attrs,
+          runProperties: mergedRunProps
+        },
+        // Also recursively process children (though runs usually just have text)
+        content: node.content?.map(normalizeNode)
+      };
+    }
+  }
+  if (node.content && Array.isArray(node.content)) {
+    return {
+      ...node,
+      content: node.content.map(normalizeNode)
+    };
+  }
+  return node;
+}
+function normalizeRunProperties(doc) {
+  const cloned = JSON.parse(JSON.stringify(doc));
+  return normalizeNode(cloned);
+}
+
 // src/services/contentResolver.ts
 function detectContentType(content) {
   if (content instanceof File) {
@@ -490,6 +654,91 @@ async function parseHtmlToJson(html, SuperDoc) {
         }
       }, TIMEOUTS.CLEANUP_DELAY);
     };
+    const createMockPasteEvent = (htmlContent) => {
+      const dataTransfer = new DataTransfer();
+      dataTransfer.setData("text/html", htmlContent);
+      dataTransfer.setData("text/plain", "");
+      const event = new ClipboardEvent("paste", {
+        bubbles: true,
+        cancelable: true,
+        clipboardData: dataTransfer
+      });
+      return event;
+    };
+    const tryPasteApproach = (sd, onSuccess, onFail) => {
+      try {
+        const editor = sd?.activeEditor;
+        if (!editor?.view?.pasteHTML) {
+          onFail();
+          return;
+        }
+        editor.commands.focus?.();
+        if (editor.commands.selectAll && editor.commands.deleteSelection) {
+          editor.commands.selectAll();
+          editor.commands.deleteSelection();
+        }
+        const mockEvent = createMockPasteEvent(html);
+        editor.view.pasteHTML(html, mockEvent);
+        setTimeout(() => {
+          try {
+            const json = editor.getJSON();
+            if (json?.content?.length > 0) {
+              const normalizedJson = normalizeRunProperties(json);
+              onSuccess(normalizedJson);
+            } else {
+              onFail();
+            }
+          } catch {
+            onFail();
+          }
+        }, 100);
+      } catch (err) {
+        console.warn("[parseHtmlToJson] Paste approach error:", err);
+        onFail();
+      }
+    };
+    const fallbackToImport = () => {
+      if (superdoc) {
+        try {
+          superdoc.destroy?.();
+        } catch {
+        }
+        superdoc = null;
+      }
+      superdoc = new SuperDoc({
+        selector: container,
+        html,
+        // Use the actual HTML content
+        documentMode: "viewing",
+        rulers: false,
+        user: { name: "Parser", email: "parser@local" },
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        onReady: ({ superdoc: sd }) => {
+          if (resolved) return;
+          try {
+            const editor = sd?.activeEditor;
+            if (!editor) {
+              throw new Error("No active editor found");
+            }
+            const json = editor.getJSON();
+            const normalizedJson = normalizeRunProperties(json);
+            resolved = true;
+            cleanup();
+            resolve(normalizedJson);
+          } catch (err) {
+            resolved = true;
+            cleanup();
+            reject(err);
+          }
+        },
+        onException: ({ error: err }) => {
+          if (resolved) return;
+          resolved = true;
+          cleanup();
+          reject(err);
+        }
+      });
+    };
     setTimeout(async () => {
       if (resolved) return;
       try {
@@ -504,42 +753,27 @@ async function parseHtmlToJson(html, SuperDoc) {
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
           onReady: ({ superdoc: sd }) => {
             if (resolved) return;
-            try {
-              const editor = sd?.activeEditor;
-              if (!editor) {
-                throw new Error("No active editor found");
-              }
-              const view = editor.view;
-              if (!view) {
-                throw new Error("No editor view found");
-              }
-              editor.commands.selectAll();
-              editor.commands.deleteSelection();
-              view.pasteHTML(html);
-              setTimeout(() => {
+            tryPasteApproach(
+              sd,
+              // Success callback
+              (json) => {
                 if (resolved) return;
-                try {
-                  const json = editor.getJSON();
-                  resolved = true;
-                  cleanup();
-                  resolve(json);
-                } catch (err) {
-                  resolved = true;
-                  cleanup();
-                  reject(err);
-                }
-              }, 50);
-            } catch (err) {
-              resolved = true;
-              cleanup();
-              reject(err);
-            }
+                resolved = true;
+                cleanup();
+                resolve(json);
+              },
+              // Fail callback - try fallback
+              () => {
+                if (resolved) return;
+                console.warn("[parseHtmlToJson] Paste approach failed, falling back to import");
+                fallbackToImport();
+              }
+            );
           },
           onException: ({ error: err }) => {
             if (resolved) return;
-            resolved = true;
-            cleanup();
-            reject(err);
+            console.warn("[parseHtmlToJson] Paste approach exception, falling back:", err);
+            fallbackToImport();
           }
         });
         setTimeout(() => {
@@ -550,8 +784,12 @@ async function parseHtmlToJson(html, SuperDoc) {
           }
         }, TIMEOUTS.PARSE_TIMEOUT);
       } catch (err) {
-        cleanup();
-        reject(err);
+        try {
+          fallbackToImport();
+        } catch (fallbackErr) {
+          cleanup();
+          reject(fallbackErr);
+        }
       }
     }, 50);
   });
@@ -2789,9 +3027,10 @@ var DocxDiffEditor = react.forwardRef(
               }
               newJson = content;
             }
+            const normalizedNewJson = normalizeRunProperties(newJson);
             const structuralResult = mergeWithStructuralAwareness(
               sourceJson,
-              newJson,
+              normalizedNewJson,
               author
             );
             const merged = structuralResult.mergedDoc;