@beyondwork/docx-react-component 1.0.32 → 1.0.33

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@beyondwork/docx-react-component",
   "publisher": "beyondwork",
-  "version": "1.0.32",
+  "version": "1.0.33",
   "description": "Embeddable React Word (docx) editor with review, comments, tracked changes, and round-trip OOXML fidelity.",
   "type": "module",
   "sideEffects": [

package/src/ui-tailwind/editor-surface/pm-decorations.ts

@@ -261,6 +261,7 @@ export function buildDecorations(
   revisionModel: RevisionDecorationModel | undefined,
   markupDisplay: MarkupDisplay,
   showTrackedChanges = true,
+  suggestionsEnabled = false,
   workflowScopes?: readonly WorkflowScope[],
   activeStory: EditorStoryTarget = MAIN_STORY_TARGET,
   workflowCandidates?: readonly WorkflowCandidateRange[],
@@ -324,6 +325,47 @@ export function buildDecorations(
       // Skip visual styling when tracked changes display is off
       if (!showTrackedChanges) continue;
 
+      const pmFrom = positionMap.runtimeToPm(rev.from);
+      const pmTo = positionMap.runtimeToPm(rev.to);
+      if (pmFrom >= pmTo) continue;
+
+      if (suggestionsEnabled) {
+        if (rev.kind === "insertion") {
+          decorations.push(
+            Decoration.inline(pmFrom, pmTo, {
+              class: "text-insert",
+              "data-revision-id": rev.revisionId,
+            }),
+          );
+          decorations.push(
+            Decoration.widget(pmFrom, () => {
+              const el = document.createElement("span");
+              el.textContent = "[";
+              el.className = "text-insert";
+              el.setAttribute("contenteditable", "false");
+              return el;
+            }, { side: -1, key: `${rev.revisionId}-open` }),
+          );
+          decorations.push(
+            Decoration.widget(pmTo, () => {
+              const el = document.createElement("span");
+              el.textContent = "]";
+              el.className = "text-insert";
+              el.setAttribute("contenteditable", "false");
+              return el;
+            }, { side: 1, key: `${rev.revisionId}-close` }),
+          );
+        } else if (rev.kind === "deletion") {
+          decorations.push(
+            Decoration.inline(pmFrom, pmTo, {
+              class: "text-danger line-through decoration-danger/80 decoration-1",
+              "data-revision-id": rev.revisionId,
+            }),
+          );
+        }
+        continue;
+      }
+
       const cls = getRevisionHighlightClass(
         revisionModel,
         rev.from,
@@ -332,16 +374,12 @@ export function buildDecorations(
       );
       if (!cls) continue;
 
-      const pmFrom = positionMap.runtimeToPm(rev.from);
-      const pmTo = positionMap.runtimeToPm(rev.to);
-      if (pmFrom < pmTo) {
-        decorations.push(
-          Decoration.inline(pmFrom, pmTo, {
-            class: cls,
-            "data-revision-id": rev.revisionId,
-          }),
-        );
-      }
+      decorations.push(
+        Decoration.inline(pmFrom, pmTo, {
+          class: cls,
+          "data-revision-id": rev.revisionId,
+        }),
+      );
     }
   }
 

package/src/ui-tailwind/editor-surface/tw-prosemirror-surface.tsx

@@ -80,6 +80,7 @@ export interface TwProseMirrorSurfaceProps {
   activeRevisionId?: string;
   activeSelectionToolKind?: ActiveSelectionToolModel["kind"] | null;
   showTrackedChanges?: boolean;
+  suggestionsEnabled?: boolean;
   /** When true, the surface renders inside the page workspace (vs canvas). */
   isPageWorkspace?: boolean;
   onFocus: FocusEventHandler<HTMLDivElement>;
@@ -196,6 +197,7 @@ export const TwProseMirrorSurface = forwardRef<
     [snapshot.comments],
   );
   const showTrackedChanges = props.showTrackedChanges !== false;
+  const suggestionsEnabled = props.suggestionsEnabled ?? false;
   // Always create the revision model — needed for deletion hiding in clean mode
   // even when the tracked changes display toggle is off.
   const revisionModel = useMemo(
@@ -280,6 +282,7 @@ export const TwProseMirrorSurface = forwardRef<
         revisionModel,
         markupDisplay,
         showTrackedChanges,
+        suggestionsEnabled,
         props.workflowScopes,
         snapshot.activeStory,
         props.workflowCandidates,
@@ -311,6 +314,7 @@ export const TwProseMirrorSurface = forwardRef<
       props.workflowScopes,
       revisionModel,
       showTrackedChanges,
+      suggestionsEnabled,
     ],
   );
 
@@ -337,6 +341,7 @@ export const TwProseMirrorSurface = forwardRef<
       revisionModel,
       markupDisplay,
       showTrackedChanges,
+      suggestionsEnabled,
       props.workflowScopes,
       snapshot.activeStory,
       props.workflowCandidates,