docx-diff-editor 1.0.9 → 1.0.10

package/dist/index.js

@@ -723,6 +723,72 @@ var DocxDiffEditor = react.forwardRef(
       }
       readyRef.current = false;
     }, []);
+    const convertHtmlToDocxBlob = react.useCallback(
+      async (html) => {
+        if (!SuperDocRef.current) {
+          throw new Error("SuperDoc not loaded");
+        }
+        const hiddenContainer = document.createElement("div");
+        hiddenContainer.id = `dde-hidden-${Date.now()}`;
+        hiddenContainer.style.cssText = "position:absolute;top:-9999px;left:-9999px;width:800px;height:600px;visibility:hidden;pointer-events:none;";
+        document.body.appendChild(hiddenContainer);
+        return new Promise((resolve, reject) => {
+          let tempSuperdoc = null;
+          let timeoutId;
+          const cleanup = () => {
+            clearTimeout(timeoutId);
+            try {
+              tempSuperdoc?.destroy?.();
+            } catch {
+            }
+            hiddenContainer.parentNode?.removeChild(hiddenContainer);
+          };
+          try {
+            tempSuperdoc = new SuperDocRef.current({
+              selector: `#${hiddenContainer.id}`,
+              html,
+              documentMode: "editing",
+              rulers: false,
+              user: { name: "Converter", email: "converter@local" },
+              // eslint-disable-next-line @typescript-eslint/no-explicit-any
+              onReady: async ({ superdoc: sd }) => {
+                try {
+                  const json = sd?.activeEditor?.getJSON() || { type: "doc", content: [] };
+                  if (!sd?.activeEditor?.exportDocx) {
+                    cleanup();
+                    reject(new Error("exportDocx method not available"));
+                    return;
+                  }
+                  const blob = await sd.activeEditor.exportDocx({ isFinalDoc: false });
+                  if (!blob) {
+                    cleanup();
+                    reject(new Error("Export returned no data"));
+                    return;
+                  }
+                  cleanup();
+                  resolve({ blob, json });
+                } catch (err) {
+                  cleanup();
+                  reject(err);
+                }
+              },
+              onException: ({ error: err }) => {
+                cleanup();
+                reject(err);
+              }
+            });
+            timeoutId = setTimeout(() => {
+              cleanup();
+              reject(new Error("HTML to DOCX conversion timed out"));
+            }, TIMEOUTS.PARSE_TIMEOUT);
+          } catch (err) {
+            cleanup();
+            reject(err);
+          }
+        });
+      },
+      []
+    );
     const createSuperdoc = react.useCallback(
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       async (options) => {
@@ -732,16 +798,31 @@ var DocxDiffEditor = react.forwardRef(
         if (!containerRef.current) {
           throw new Error("Container not available");
         }
+        containerRef.current.innerHTML = "";
+        if (toolbarRef.current) {
+          toolbarRef.current.innerHTML = "";
+        }
         containerRef.current.id = editorId;
         if (toolbarRef.current) {
           toolbarRef.current.id = toolbarId;
         }
+        let documentFile;
+        if (options.document) {
+          if (options.document instanceof File) {
+            documentFile = options.document;
+          } else {
+            documentFile = new File([options.document], "document.docx", {
+              type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
+            });
+          }
+        }
         return new Promise((resolve, reject) => {
+          let resolved = false;
           try {
             const superdoc = new SuperDocRef.current({
               selector: `#${editorId}`,
               toolbar: showToolbar ? `#${toolbarId}` : void 0,
-              document: options.document,
+              document: documentFile,
               html: options.html,
               documentMode: "editing",
               role: "editor",
@@ -751,6 +832,8 @@ var DocxDiffEditor = react.forwardRef(
               // Enable comments module for track changes sidebar
               modules: { comments: {} },
               onReady: ({ superdoc: sd }) => {
+                if (resolved) return;
+                resolved = true;
                 superdocRef.current = sd;
                 readyRef.current = true;
                 let json = { type: "doc", content: [] };
@@ -764,18 +847,24 @@ var DocxDiffEditor = react.forwardRef(
                 resolve({ superdoc: sd, json });
               },
               onException: ({ error: err }) => {
+                if (resolved) return;
+                resolved = true;
                 console.error("SuperDoc error:", err);
                 reject(err);
               }
             });
             superdocRef.current = superdoc;
             setTimeout(() => {
-              if (!readyRef.current) {
+              if (!resolved) {
+                resolved = true;
                 reject(new Error("SuperDoc initialization timed out"));
               }
             }, TIMEOUTS.PARSE_TIMEOUT);
           } catch (err) {
-            reject(err);
+            if (!resolved) {
+              resolved = true;
+              reject(err);
+            }
           }
         });
       },
@@ -799,12 +888,15 @@ var DocxDiffEditor = react.forwardRef(
         const { SuperDoc } = await import('superdoc');
         SuperDocRef.current = SuperDoc;
         let initOptions = {};
+        let extractedJson = null;
         if (initialSource) {
           const contentType = detectContentType(initialSource);
           if (contentType === "file") {
             initOptions = { document: initialSource };
           } else if (contentType === "html") {
-            initOptions = { html: initialSource };
+            const { blob, json: htmlJson } = await convertHtmlToDocxBlob(initialSource);
+            initOptions = { document: blob };
+            extractedJson = htmlJson;
           } else if (contentType === "json") {
             initOptions = templateDocx ? { document: templateDocx } : {};
           }
@@ -819,8 +911,9 @@ var DocxDiffEditor = react.forwardRef(
             onSourceLoaded?.(initialSource);
           }
         } else {
-          setSourceJson(json);
-          onSourceLoaded?.(json);
+          const finalJson = extractedJson || json;
+          setSourceJson(finalJson);
+          onSourceLoaded?.(finalJson);
         }
         setIsLoading(false);
         onReady?.();
@@ -839,6 +932,7 @@ var DocxDiffEditor = react.forwardRef(
       onSourceLoaded,
       destroySuperdoc,
       createSuperdoc,
+      convertHtmlToDocxBlob,
       setEditorContent,
       handleError
     ]);
@@ -854,7 +948,11 @@ var DocxDiffEditor = react.forwardRef(
       ref,
       () => ({
         /**
-         * Set the source/base document
+         * Set the source/base document.
+         * 
+         * For HTML content, we convert to DOCX first using a hidden SuperDoc instance.
+         * This is critical because SuperDoc's track change infrastructure (including
+         * track bubbles) is only properly initialized when loading from a DOCX file.
          */
         async setSource(content) {
           if (!SuperDocRef.current) {
@@ -870,8 +968,15 @@ var DocxDiffEditor = react.forwardRef(
               const result = await createSuperdoc({ document: content });
               json = result.json;
             } else if (contentType === "html") {
-              const result = await createSuperdoc({ html: content });
-              json = result.json;
+              const { blob, json: extractedJson } = await convertHtmlToDocxBlob(content);
+              const result = await createSuperdoc({ document: blob });
+              json = extractedJson;
+              if (result.superdoc?.activeEditor) {
+                const editorJson = result.superdoc.activeEditor.getJSON();
+                if (!extractedJson.content || extractedJson.content.length === 0) {
+                  json = editorJson;
+                }
+              }
             } else {
               const result = await createSuperdoc(templateDocx ? { document: templateDocx } : {});
               if (result.superdoc?.activeEditor && isProseMirrorJSON(content)) {
@@ -966,9 +1071,6 @@ var DocxDiffEditor = react.forwardRef(
             const merged = mergeDocuments(sourceJson, newJson, diff, author);
             setMergedJson(merged);
             if (superdocRef.current?.activeEditor) {
-              if (superdocRef.current.setDocumentMode) {
-                superdocRef.current.setDocumentMode("suggesting");
-              }
               setEditorContent(superdocRef.current.activeEditor, merged);
               enableReviewMode(superdocRef.current);
             }
@@ -1061,6 +1163,7 @@ var DocxDiffEditor = react.forwardRef(
         author,
         destroySuperdoc,
         createSuperdoc,
+        convertHtmlToDocxBlob,
         setEditorContent,
         enableReviewMode,
         setEditingMode,