@dtducas/wh-forge-viewer 2.0.0-beta.1 → 2.0.0-beta.2

package/dist/index.js

@@ -2552,6 +2552,14 @@ var MarkupConverterService = /*#__PURE__*/function () {
       if (shape === null || shape === void 0 ? void 0 : shape.text) {
         attrs += " text=\"".concat(this.escapeXml(shape.text), "\"");
       }
+      // Add text-data for stamp/image types.
+      // Forge's MarkupStamp.loadSvgData() reads style['text-data'] as the image SVG source.
+      // Without this, Forge creates a blank (invisible) stamp when loadMarkups() + enterEditMode()
+      // is used to restore stamps into the edit canvas (used by reloadEditCanvasWithMergedMarkups).
+      if (forgeType === 'stamp' && (shape === null || shape === void 0 ? void 0 : shape.imageData)) {
+        var svgData = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 1 1\" width=\"1\" height=\"1\"><image width=\"1\" height=\"1\" href=\"".concat(shape.imageData, "\"/></svg>");
+        attrs += " text-data=\"".concat(this.escapeXml(svgData), "\"");
+      }
       // Add font attributes.
       // CRITICAL: The <metadata><markup_element font-size="..."/> is parsed by Forge's
       // loadMarkups() as a COORDINATE-SPACE value (model units), NOT SVG pixel units.
@@ -2777,7 +2785,12 @@ var MarkupConverterService = /*#__PURE__*/function () {
               var _h3 = size[1];
               var x = -_w2 / 2;
               var y = -_h3 / 2;
-              return "<image href=\"".concat(imgData, "\" x=\"").concat(x, "\" y=\"").concat(y, "\" width=\"").concat(_w2, "\" height=\"").concat(_h3, "\" transform=\"").concat(transform, "\"/>") + "<rect id=\"hitarea\" fill=\"transparent\" stroke=\"transparent\" x=\"".concat(x, "\" y=\"").concat(y, "\" width=\"").concat(_w2, "\" height=\"").concat(_h3, "\" transform=\"").concat(transform, "\"/>");
+              // Forge's markup SVG canvas uses a Y-up coordinate system.
+              // Raster <image> pixels are always Y-down (screen space), so they appear
+              // upside-down without a counter-flip.  Append scale(1,-1) to flip the image
+              // content back to the correct screen orientation for User B's overlay.
+              // The hitarea rect does not need a flip — it is transparent and just tracks hits.
+              return "<image href=\"".concat(imgData, "\" x=\"").concat(x, "\" y=\"").concat(y, "\" width=\"").concat(_w2, "\" height=\"").concat(_h3, "\" transform=\"").concat(transform, " scale(1,-1)\"/>") + "<rect id=\"hitarea\" fill=\"transparent\" stroke=\"transparent\" x=\"".concat(x, "\" y=\"").concat(y, "\" width=\"").concat(_w2, "\" height=\"").concat(_h3, "\" transform=\"").concat(transform, "\"/>");
             }
             if (imgData === '__pending__') {
               // Render a placeholder rectangle while image chunks are still arriving
@@ -34106,33 +34119,81 @@ function updateShapeAttributes(svgElement, element) {
 }
 // ========== Shape Creation Functions ==========
 /**
- * Create arrow SVG element
+ * Create arrow SVG element matching Forge Viewer's native arrow format.
+ *
+ * Forge Viewer renders arrows as a single filled <path> (shaft + arrowhead merged)
+ * centered at the midpoint of the two endpoints and rotated to the correct angle.
+ * This matches the native SVG:
+ *   <path d="M -hl -hh l (2hl-al) 0 l -ni -(ahh-hh) l (al+ni) ahh l -(al+ni) ahh l ni -(ahh-hh) l -(2hl-al) 0 z"
+ *         transform="translate(cx, cy) rotate(angleDeg)" stroke-width="sw" fill="strokeColor" stroke="strokeColor"/>
+ *
+ * Geometry constants (in Forge coordinate units):
+ *   sw  = stroke-width
+ *   hl  = totalLength / 2          (half the arrow length, placed symmetrically)
+ *   hh  = sw / 2                   (shaft half-height)
+ *   ahh = 1.5 * sw                 (arrowhead half-height)
+ *   al  = 3 * sw                   (arrowhead length along x-axis)
+ *   ni  = 0.3 * sw                 (neck inset — small notch where shaft meets arrowhead)
+ *
  * @private
  */
 function createArrowElement(element, ns) {
   var _a;
   var group = document.createElementNS(ns, 'g');
   group.setAttribute('class', 'markup-arrow');
-  // Create line
-  var line = document.createElementNS(ns, 'line');
+  group.setAttribute('cursor', 'inherit');
+  group.setAttribute('pointer-events', 'painted');
+  // Endpoint coordinates
+  var x1 = 0,
+    y1 = 0,
+    x2 = 1,
+    y2 = 0;
   if (((_a = element.shape) === null || _a === void 0 ? void 0 : _a.points) && element.shape.points.length >= 4) {
-    line.setAttribute('x1', String(element.shape.points[0]));
-    line.setAttribute('y1', String(element.shape.points[1]));
-    line.setAttribute('x2', String(element.shape.points[2]));
-    line.setAttribute('y2', String(element.shape.points[3]));
-  } else {
-    // Use size as fallback
-    line.setAttribute('x1', '0');
-    line.setAttribute('y1', '0');
-    line.setAttribute('x2', String(element.size[0]));
-    line.setAttribute('y2', String(element.size[1]));
-  }
-  line.setAttribute('stroke', element.style.sc || '#000000');
-  line.setAttribute('stroke-width', String(element.style.sw || 2));
-  line.setAttribute('marker-end', 'url(#arrowhead)');
-  group.appendChild(line);
-  // Create arrowhead marker if not exists
-  ensureArrowMarker(ns);
+    x1 = element.shape.points[0];
+    y1 = element.shape.points[1];
+    x2 = element.shape.points[2];
+    y2 = element.shape.points[3];
+  } else if (element.size) {
+    x2 = element.size[0];
+    y2 = element.size[1];
+  }
+  var sw = element.style.sw || 0.025;
+  var cx = (x1 + x2) / 2;
+  var cy = (y1 + y2) / 2;
+  var dx = x2 - x1;
+  var dy = y2 - y1;
+  var totalLength = Math.sqrt(dx * dx + dy * dy);
+  var angleDeg = Math.atan2(dy, dx) * (180 / Math.PI);
+  var hl = totalLength / 2;
+  var hh = sw / 2;
+  var ahh = 1.5 * sw;
+  var al = 3 * sw;
+  var ni = 0.3 * sw;
+  // Shaft length must be positive; guard against arrows shorter than the arrowhead
+  var shaftLen = Math.max(0, 2 * hl - al);
+  // Arrow path: horizontal, pointing right (+x), centered at origin.
+  // Apply transform="translate(cx,cy) rotate(angleDeg)" to position and orient.
+  var d = ["M ".concat(-hl, " ").concat(-hh), "l ".concat(shaftLen, " 0"), "l ".concat(-ni, " ").concat(-(ahh - hh)), "l ".concat(al + ni, " ").concat(ahh), "l ".concat(-(al + ni), " ").concat(ahh), "l ".concat(ni, " ").concat(-(ahh - hh)), "l ".concat(-shaftLen, " 0"), 'z'].join(' ');
+  var transform = "translate(".concat(cx, ", ").concat(cy, ") rotate(").concat(angleDeg, ")");
+  var strokeColor = element.style.sc || 'rgba(0,0,0,1)';
+  // Main arrow path (filled + stroked like native Forge Viewer arrow)
+  var markupPath = document.createElementNS(ns, 'path');
+  markupPath.setAttribute('id', 'markup');
+  markupPath.setAttribute('d', d);
+  markupPath.setAttribute('stroke-width', String(sw));
+  markupPath.setAttribute('stroke', strokeColor);
+  markupPath.setAttribute('fill', strokeColor);
+  markupPath.setAttribute('transform', transform);
+  group.appendChild(markupPath);
+  // Transparent hit area with larger stroke-width for easier selection
+  var hitPath = document.createElementNS(ns, 'path');
+  hitPath.setAttribute('id', 'hitarea');
+  hitPath.setAttribute('d', d);
+  hitPath.setAttribute('fill', 'transparent');
+  hitPath.setAttribute('stroke', 'transparent');
+  hitPath.setAttribute('stroke-width', String(sw * 6.86));
+  hitPath.setAttribute('transform', transform);
+  group.appendChild(hitPath);
   return group;
 }
 /**
@@ -34307,23 +34368,37 @@ function createCalloutElement(element, ns) {
   return group;
 }
 /**
- * Create stamp/image SVG element
- * Position is CENTER, so offset image
+ * Create stamp/image SVG element for collaborative rendering (User B).
+ *
+ * imageData is raw base64 (data URL) — no counter-transform needed here.
+ * Forge's markup canvas is Y-up, so a plain <image> would appear upside-down.
+ * We wrap it in a <g> and apply scale(1,-1) on the image to flip it into
+ * correct screen orientation, matching what MarkupStamp renders locally.
+ *
+ * Position is CENTER, so offset the image by -w/2, -h/2.
  * @private
  */
 function createStampElement(element, ns) {
   var _a;
+  var group = document.createElementNS(ns, 'g');
+  group.setAttribute('class', 'markup-stamp');
+  var w = element.size[0];
+  var h = element.size[1];
   var image = document.createElementNS(ns, 'image');
-  image.setAttribute('class', 'markup-stamp');
-  // Position is center, so offset by -w/2, -h/2
-  image.setAttribute('x', String(-element.size[0] / 2));
-  image.setAttribute('y', String(-element.size[1] / 2));
-  image.setAttribute('width', String(element.size[0]));
-  image.setAttribute('height', String(element.size[1]));
+  image.setAttribute('x', String(-w / 2));
+  image.setAttribute('y', String(-h / 2));
+  image.setAttribute('width', String(w));
+  image.setAttribute('height', String(h));
+  // scale(1,-1) flips the image content vertically in-place (the image is centered at
+  // the origin so scale(1,-1) keeps the bounding box in the same position while reversing
+  // the pixel rows).  This is needed because SVG <image> pixels are Y-down but Forge's
+  // markup canvas is Y-up — without the flip the image appears upside-down.
+  image.setAttribute('transform', "scale(1,-1)");
   if ((_a = element.shape) === null || _a === void 0 ? void 0 : _a.imageData) {
     image.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', element.shape.imageData);
   }
-  return image;
+  group.appendChild(image);
+  return group;
 }
 // ========== Helper Functions ==========
 /**
@@ -34410,36 +34485,6 @@ function generateCloudPath(width, height, arcCount) {
   d += ' Z';
   return d;
 }
-/**
- * Ensure arrowhead marker exists in SVG defs
- * @private
- */
-var arrowMarkerCreated = false;
-function ensureArrowMarker(ns) {
-  if (arrowMarkerCreated) return;
-  var svg = document.querySelector('svg.markups-svg');
-  if (!svg) return;
-  var defs = svg.querySelector('defs');
-  if (!defs) {
-    defs = document.createElementNS(ns, 'defs');
-    svg.insertBefore(defs, svg.firstChild);
-  }
-  if (!defs.querySelector('#arrowhead')) {
-    var marker = document.createElementNS(ns, 'marker');
-    marker.setAttribute('id', 'arrowhead');
-    marker.setAttribute('markerWidth', '10');
-    marker.setAttribute('markerHeight', '7');
-    marker.setAttribute('refX', '9');
-    marker.setAttribute('refY', '3.5');
-    marker.setAttribute('orient', 'auto');
-    var polygon = document.createElementNS(ns, 'polygon');
-    polygon.setAttribute('points', '0 0, 10 3.5, 0 7');
-    polygon.setAttribute('fill', 'inherit');
-    marker.appendChild(polygon);
-    defs.appendChild(marker);
-    arrowMarkerCreated = true;
-  }
-}
 
 /**
  * SVG Parser Utilities
@@ -36837,6 +36882,12 @@ var EditModeManager = /*#__PURE__*/function () {
     this.onEditModeChange = null;
     this.onClearCurrentTool = null;
     this.onExtensionReloaded = null;
+    // Tracks explicit user intent to be in edit mode.
+    // Immune to markupsCore.editMode being temporarily null during changeEditMode() transitions.
+    this.userIntendedEditMode = false;
+    // Set to true by refreshExtensionReferences() when MarkupsCore was fully reloaded.
+    // Consumed in enterEditMode() to restore savedMarkupsSvg into the fresh edit canvas.
+    this.extensionWasReloaded = false;
     // Track if page changed since last markup mode
     // Used to force extension reload when entering markup mode after page change
     this.pageChangedSinceLastMarkup = false;
@@ -36936,7 +36987,14 @@ var EditModeManager = /*#__PURE__*/function () {
     value: function handleEditModeChanged(event) {
       var _a;
       var wasInEditMode = this.editMode;
-      // Ensure editMode is always a boolean
+      // CRITICAL FIX: When switching tools, markupsCore.changeEditMode() fires
+      // EVENT_EDITMODE_CHANGED with active:false while markupsCore.editMode is temporarily null.
+      // Using userIntendedEditMode (set explicitly by enterEditMode/leaveEditMode) instead of
+      // markupsCore.editMode avoids the race condition where the guard fails during transitions.
+      if (event.active === false && this.userIntendedEditMode) {
+        console.log('[EditModeManager] Ignoring editMode=false: user intentionally in edit mode (tool-switch transition)');
+        return;
+      }
       var isActive = event.active === true || event.active !== false && !!((_a = this.context.markupsCore) === null || _a === void 0 ? void 0 : _a.editMode);
       this.editMode = isActive;
       console.log('[EditModeManager] handleEditModeChanged:', {
@@ -36965,10 +37023,16 @@ var EditModeManager = /*#__PURE__*/function () {
     key: "enterEditMode",
     value: function enterEditMode() {
       return __awaiter(this, void 0, void 0, /*#__PURE__*/_regenerator().m(function _callee2() {
-        var _t;
+        var savedSvg, layerId, editLayerId, _yield$import$catch, patchForgeMarkupStampRestore, loaded, _t, _t2;
         return _regenerator().w(function (_context2) {
           while (1) switch (_context2.p = _context2.n) {
             case 0:
+              // Mark explicit intent BEFORE any async work so the guard in handleEditModeChanged
+              // can filter out spurious active:false events fired during enterEditMode() itself.
+              this.userIntendedEditMode = true;
+              // CRITICAL: Re-fetch MarkupsCore extension reference before entering edit mode
+              // After page change, the extension might have been reset and we need fresh reference
+              // This is async because extension may need to be reloaded via loadExtension()
               _context2.n = 1;
               return this.refreshExtensionReferences();
             case 1:
@@ -36983,15 +37047,65 @@ var EditModeManager = /*#__PURE__*/function () {
               _context2.p = 3;
               // Unload existing markups from view-only layer before entering edit mode
               this.markupOpsManager.unloadMarkupsBeforeEditMode();
-              // Enter edit mode
+              // CRITICAL: Pre-load saved markups into a named layer BEFORE calling
+              // enterEditMode().  Forge's loadMarkups() explicitly rejects calls while
+              // duringEditMode===true, so loading must happen in view mode.  By passing
+              // the same layerId to enterEditMode(layerId) the pre-loaded markups become
+              // interactive in the edit canvas.
+              //
+              // Additionally, apply the Forge MarkupStamp patch so that when Forge's
+              // createMarkupFromSVG creates a MarkupStamp from the loaded SVG it can
+              // fall back to style['text-data'] (which we populate in setMetadata()) when
+              // scriptSvgData is a DOM element that DOMParser cannot parse.
+              savedSvg = this.markupOpsManager.getSavedMarkupsSvg();
+              layerId = this.markupOpsManager.getLayerId();
+              if (!(savedSvg && savedSvg.trim().length > 0)) {
+                _context2.n = 7;
+                break;
+              }
+              _context2.p = 4;
+              _context2.n = 5;
+              return Promise.resolve().then(function () { return StampMarkup; })["catch"](function () {
+                return {
+                  patchForgeMarkupStampRestore: null
+                };
+              });
+            case 5:
+              _yield$import$catch = _context2.v;
+              patchForgeMarkupStampRestore = _yield$import$catch.patchForgeMarkupStampRestore;
+              patchForgeMarkupStampRestore === null || patchForgeMarkupStampRestore === void 0 ? void 0 : patchForgeMarkupStampRestore();
+              // Ensure view mode is active (loadMarkups requires duringViewMode===true)
+              if (!this.context.markupsCore.duringViewMode) {
+                try {
+                  this.context.markupsCore.show();
+                } catch (_e) {
+                  /* ignore — enterEditMode() will call show() internally */
+                }
+              }
+              loaded = this.context.markupsCore.loadMarkups(savedSvg, layerId);
+              if (loaded) {
+                editLayerId = layerId;
+                console.log('[EditModeManager] Pre-loaded saved markups into layer:', layerId);
+              } else {
+                console.warn('[EditModeManager] loadMarkups returned false — will enter clean edit mode');
+              }
+              _context2.n = 7;
+              break;
+            case 6:
+              _context2.p = 6;
+              _t = _context2.v;
+              console.warn('[EditModeManager] Could not pre-load markups before edit mode:', _t);
+            case 7:
+              // Enter edit mode — with layerId when we pre-loaded (restores markups),
+              // or without to start a clean empty canvas.
               console.log('[EditModeManager] Calling markupsCore.enterEditMode()...');
-              _context2.n = 4;
-              return this.context.markupsCore.enterEditMode();
-            case 4:
+              _context2.n = 8;
+              return this.context.markupsCore.enterEditMode(editLayerId);
+            case 8:
               console.log('[EditModeManager] markupsCore.enterEditMode() completed, svg:', !!this.context.markupsCore.svg);
               // Verify that svg layer was created (can fail after page change)
               if (this.context.markupsCore.svg) {
-                _context2.n = 7;
+                _context2.n = 11;
                 break;
               }
               console.warn('[EditModeManager] svg layer is null after enterEditMode, retrying with delay...');
@@ -37002,29 +37116,32 @@ var EditModeManager = /*#__PURE__*/function () {
                 console.warn('[EditModeManager] Error leaving edit mode for retry:', e);
               }
               // Wait a bit for viewer to stabilize after page change
-              _context2.n = 5;
+              _context2.n = 9;
               return new Promise(function (resolve) {
                 return setTimeout(resolve, 100);
               });
-            case 5:
-              // Re-enter edit mode
+            case 9:
+              // Re-enter edit mode (use layerId again if we pre-loaded — the layer
+              // survives leaveEditMode() since it only removes the edit canvas node)
               console.log('[EditModeManager] Retrying enterEditMode after delay...');
-              _context2.n = 6;
-              return this.context.markupsCore.enterEditMode();
-            case 6:
+              _context2.n = 10;
+              return this.context.markupsCore.enterEditMode(editLayerId);
+            case 10:
               console.log('[EditModeManager] Retry completed, svg:', !!this.context.markupsCore.svg);
               if (this.context.markupsCore.svg) {
-                _context2.n = 7;
+                _context2.n = 11;
                 break;
               }
               console.error('[EditModeManager] Failed to create svg layer after retry');
               this.editMode = false;
+              this.userIntendedEditMode = false;
               return _context2.a(2);
-            case 7:
+            case 11:
               // Set editMode flag explicitly to true
               this.editMode = true;
               console.log('[EditModeManager] editMode flag set to true explicitly');
               console.log('[EditModeManager] svg layer exists:', !!this.context.markupsCore.svg);
+              this.extensionWasReloaded = false;
               // Notify presence manager of edit mode state
               if (this.onEditModeChange) {
                 this.onEditModeChange(true);
@@ -37033,17 +37150,18 @@ var EditModeManager = /*#__PURE__*/function () {
               this.toolbarVisManager.hideDefaultToolbar();
               this.eventBus.emit('drawing:editModeEntered');
               console.log('[EditModeManager] Entered edit mode');
-              _context2.n = 9;
+              _context2.n = 13;
               break;
-            case 8:
-              _context2.p = 8;
-              _t = _context2.v;
-              console.error('[EditModeManager] Failed to enter edit mode:', _t);
+            case 12:
+              _context2.p = 12;
+              _t2 = _context2.v;
+              console.error('[EditModeManager] Failed to enter edit mode:', _t2);
               this.editMode = false;
-            case 9:
+              this.userIntendedEditMode = false;
+            case 13:
               return _context2.a(2);
           }
-        }, _callee2, this, [[3, 8]]);
+        }, _callee2, this, [[4, 6], [3, 12]]);
       }));
     }
     /**
@@ -37058,7 +37176,7 @@ var EditModeManager = /*#__PURE__*/function () {
     key: "refreshExtensionReferences",
     value: function refreshExtensionReferences() {
       return __awaiter(this, void 0, void 0, /*#__PURE__*/_regenerator().m(function _callee3() {
-        var viewer, extensionWasReloaded, markupsCore, markupsGui, _t2, _t3, _t4, _t5, _t6;
+        var viewer, extensionWasReloaded, markupsCore, markupsGui, _t3, _t4, _t5, _t6, _t7;
         return _regenerator().w(function (_context3) {
           while (1) switch (_context3.p = _context3.n) {
             case 0:
@@ -37089,8 +37207,8 @@ var EditModeManager = /*#__PURE__*/function () {
               break;
             case 4:
               _context3.p = 4;
-              _t2 = _context3.v;
-              console.warn('[EditModeManager] Failed to unload stale MarkupsCore:', _t2);
+              _t3 = _context3.v;
+              console.warn('[EditModeManager] Failed to unload stale MarkupsCore:', _t3);
             case 5:
               if (markupsCore) {
                 _context3.n = 9;
@@ -37109,8 +37227,8 @@ var EditModeManager = /*#__PURE__*/function () {
               break;
             case 8:
               _context3.p = 8;
-              _t3 = _context3.v;
-              console.error('[EditModeManager] Failed to reload MarkupsCore extension:', _t3);
+              _t4 = _context3.v;
+              console.error('[EditModeManager] Failed to reload MarkupsCore extension:', _t4);
             case 9:
               if (markupsCore) {
                 this.context.markupsCore = markupsCore;
@@ -37133,8 +37251,8 @@ var EditModeManager = /*#__PURE__*/function () {
               break;
             case 12:
               _context3.p = 12;
-              _t4 = _context3.v;
-              console.warn('[EditModeManager] Failed to unload stale MarkupsGui:', _t4);
+              _t5 = _context3.v;
+              console.warn('[EditModeManager] Failed to unload stale MarkupsGui:', _t5);
             case 13:
               if (markupsGui) {
                 _context3.n = 17;
@@ -37152,8 +37270,8 @@ var EditModeManager = /*#__PURE__*/function () {
               break;
             case 16:
               _context3.p = 16;
-              _t5 = _context3.v;
-              console.error('[EditModeManager] Failed to reload MarkupsGui extension:', _t5);
+              _t6 = _context3.v;
+              console.error('[EditModeManager] Failed to reload MarkupsGui extension:', _t6);
             case 17:
               if (markupsGui) {
                 this.context.markupsGui = markupsGui;
@@ -37177,16 +37295,20 @@ var EditModeManager = /*#__PURE__*/function () {
             case 18:
               // Notify listeners that extension was reloaded
               // This allows ToolManager to reinitialize its ToolFactory with the new MarkupsCore
-              if (extensionWasReloaded && this.onExtensionReloaded) {
-                console.log('[EditModeManager] Notifying listeners of extension reload');
-                this.onExtensionReloaded();
+              if (extensionWasReloaded) {
+                // Persist flag so enterEditMode() can reload savedMarkupsSvg into the fresh canvas
+                this.extensionWasReloaded = true;
+                if (this.onExtensionReloaded) {
+                  console.log('[EditModeManager] Notifying listeners of extension reload');
+                  this.onExtensionReloaded();
+                }
               }
               _context3.n = 20;
               break;
             case 19:
               _context3.p = 19;
-              _t6 = _context3.v;
-              console.error('[EditModeManager] Failed to refresh extension references:', _t6);
+              _t7 = _context3.v;
+              console.error('[EditModeManager] Failed to refresh extension references:', _t7);
             case 20:
               return _context3.a(2);
           }
@@ -37200,19 +37322,24 @@ var EditModeManager = /*#__PURE__*/function () {
     key: "leaveEditMode",
     value: function leaveEditMode() {
       var _this3 = this;
+      this.userIntendedEditMode = false;
       if (!this.context.markupsCore) {
         console.warn('[EditModeManager] Cannot leave edit mode: MarkupsCore not available');
         return;
       }
       try {
-        // Save markups before leaving edit mode
-        this.markupOpsManager.saveAndReloadMarkupsOnLeave(function () {
+        // Step 1: Save current edit-mode markups while still in edit mode
+        this.markupOpsManager.saveMarkupsOnLeave(function () {
           var _a;
           return ((_a = _this3.context.markupsCore) === null || _a === void 0 ? void 0 : _a.generateData()) || '';
         });
-        // Leave edit mode (this clears all markups)
+        // Step 2: Leave edit mode (Forge clears its edit canvas)
         this.context.markupsCore.leaveEditMode();
         this.editMode = false;
+        // Step 3: Load saved markups into view-only layer AFTER leaving edit mode.
+        // CRITICAL: doing this BEFORE leaveEditMode() caused Forge to clear the
+        // loaded layer during the leaveEditMode() call, making markups disappear.
+        this.markupOpsManager.reloadMarkupsToViewLayer();
         // Notify presence manager of edit mode state
         if (this.onEditModeChange) {
           this.onEditModeChange(false);
@@ -37445,6 +37572,22 @@ var MarkupOperationsManager = /*#__PURE__*/function () {
         console.error('[MarkupOperationsManager] Failed to redo:', error);
       }
     }
+    /**
+     * Load savedMarkupsSvg into the view-only layer so markups are visible
+     * when NOT in edit mode.  Must be called AFTER markupsCore.leaveEditMode().
+     */
+  }, {
+    key: "reloadMarkupsToViewLayer",
+    value: function reloadMarkupsToViewLayer() {
+      if (!this.context.markupsCore) return;
+      if (!this.savedMarkupsSvg || this.savedMarkupsSvg.trim().length === 0) return;
+      try {
+        this.context.markupsCore.loadMarkups(this.savedMarkupsSvg, this.layerId);
+        console.log('[MarkupOperationsManager] Markups reloaded to view layer after leaveEditMode');
+      } catch (error) {
+        console.warn('[MarkupOperationsManager] Failed to reload markups to view layer:', error);
+      }
+    }
     /**
      * Unload markups from layer before entering edit mode
      */
@@ -37462,29 +37605,24 @@ var MarkupOperationsManager = /*#__PURE__*/function () {
       }
     }
     /**
-     * Save and reload markups when leaving edit mode
+     * Save markup SVG from edit mode into savedMarkupsSvg.
+     * Does NOT call loadMarkups — that must happen AFTER markupsCore.leaveEditMode().
+     * See reloadMarkupsToViewLayer().
      *
-     * @param generateData - Function to generate SVG data from edit mode
+     * @param generateData - Function that returns SVG from current edit mode state
      */
   }, {
-    key: "saveAndReloadMarkupsOnLeave",
-    value: function saveAndReloadMarkupsOnLeave(generateData) {
+    key: "saveMarkupsOnLeave",
+    value: function saveMarkupsOnLeave(generateData) {
       if (!this.context.markupsCore) return;
-      // Check if markupsCore is in a valid state (svg layer exists)
-      // This can be null if page changed or extension was reset
       if (!this.context.markupsCore.svg) {
         console.warn('[MarkupOperationsManager] MarkupsCore.svg is null, skipping save');
         return;
       }
       try {
-        // Save markups before leaving edit mode
         var svgString = generateData();
         this.savedMarkupsSvg = svgString || '';
-        // Load the saved markups back to display them in view-only mode
-        if (this.savedMarkupsSvg && this.savedMarkupsSvg.trim().length > 0) {
-          this.context.markupsCore.loadMarkups(this.savedMarkupsSvg, this.layerId);
-          console.log('[MarkupOperationsManager] Markups saved and reloaded to preserve them');
-        }
+        console.log('[MarkupOperationsManager] Markups saved on leave:', this.savedMarkupsSvg.length, 'chars');
       } catch (error) {
         console.warn('[MarkupOperationsManager] Error saving markups on leave:', error);
       }
@@ -45561,6 +45699,8 @@ function createMarkupStampClass() {
       _classCallCheck(this, MarkupStamp);
       _this = _callSuper(this, MarkupStamp, [id, editor, ['stroke-width', 'stroke-color', 'stroke-opacity', 'fill-color', 'fill-opacity']]);
       _this.type = 'stamp';
+      /** Raw base64 image data (data URL) for collaborative serialization */
+      _this.imageData = '';
       _this.type = 'stamp';
       _this.customSVG = customSVG;
       _this.addMarkupMetadata = avemcu.addMarkupMetadata.bind(_this);
@@ -45571,8 +45711,12 @@ function createMarkupStampClass() {
         _this$getDimensions2 = _slicedToArray(_this$getDimensions, 2),
         width = _this$getDimensions2[0],
         height = _this$getDimensions2[1];
-      _this.originalWidth = width;
-      _this.originalHeight = height;
+      // Extract raw base64 image data for collaborative serialization.
+      // MarkupsCore serializers read markup.imageData to pass via compact JSON
+      // to remote users (User B). Storing raw base64 (not the SVG wrapper)
+      // means createStampElement can render it directly without any transform issues.
+      var imgEl = customSVG.querySelector('image');
+      _this.imageData = (imgEl === null || imgEl === void 0 ? void 0 : imgEl.getAttribute('href')) || (imgEl === null || imgEl === void 0 ? void 0 : imgEl.getAttributeNS('http://www.w3.org/1999/xlink', 'href')) || '';
       // Copy SVG content
       _this.group.innerHTML = customSVG.innerHTML;
       // Create hit area for selection
@@ -45663,6 +45807,16 @@ function createMarkupStampClass() {
         metadata.position = [this.position.x, this.position.y].join(' ');
         metadata.size = [this.size.x, this.size.y].join(' ');
         metadata.rotation = String(this.rotation);
+        // Store image SVG as text-data so Forge's createMarkupFromSVG can restore
+        // the stamp image when loadMarkups() is called (e.g. on re-entry to edit mode).
+        // Forge's MarkupStamp.loadSvgData() reads style['text-data'] as fallback.
+        if (this.imageData) {
+          var _this$getDimensions3 = this.getDimensions(this.customSVG),
+            _this$getDimensions4 = _slicedToArray(_this$getDimensions3, 2),
+            w = _this$getDimensions4[0],
+            h = _this$getDimensions4[1];
+          metadata['text-data'] = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 ".concat(w, " ").concat(h, "\" width=\"").concat(w, "\" height=\"").concat(h, "\"><image width=\"").concat(w, "\" height=\"").concat(h, "\" href=\"").concat(this.imageData, "\"/></svg>");
+        }
         return this.addMarkupMetadata(this.shape, metadata);
       }
     }]);
@@ -45970,11 +46124,66 @@ function parseSVGString(svgString) {
 }
 /**
  * Create SVG element with embedded image (base64)
- * This format is compatible with MarkupsCore
+ * This format is compatible with MarkupsCore.
+ *
+ * NOTE: Do NOT apply a Y-flip transform to the <image> here.
+ * MarkupStamp.group already applies scale(1/W, -1/H) which handles the Y-axis
+ * flip for the Forge Y-up coordinate system.  Adding a pre-flip would double-flip
+ * the image causing it to appear upside-down for User A.
+ * The collaborative overlay (User B) applies its own scale(1,-1) separately
+ * via generateVisualElement() in MarkupConverterService.
  */
 function createImageSVG(base64Data, width, height) {
   return "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"".concat(width, "\" height=\"").concat(height, "\" viewBox=\"0 0 ").concat(width, " ").concat(height, "\">\n  <image width=\"").concat(width, "\" height=\"").concat(height, "\" href=\"").concat(base64Data, "\"/>\n</svg>");
 }
+/**
+ * Patch Forge's built-in MarkupStamp.prototype.loadSvgData so that when
+ * createMarkupFromSVG passes the full child DOM element as svgData (which
+ * cannot be parsed by DOMParser), the method falls back to style['text-data']
+ * instead.  Our setMetadata() stores the image SVG there so Forge can
+ * properly restore stamp images when loadMarkups() → enterEditMode() is used.
+ *
+ * Safe to call multiple times — guarded by a _patched flag.
+ */
+function patchForgeMarkupStampRestore() {
+  var _a, _b, _c;
+  var avemc = getMarkupsCore();
+  if (!avemc) return;
+  // The class may be exposed directly on the Core namespace
+  var ForgeMarkupStamp = avemc.MarkupStamp || ((_a = avemc.Classes) === null || _a === void 0 ? void 0 : _a.MarkupStamp) || ((_b = avemc.Markups) === null || _b === void 0 ? void 0 : _b.MarkupStamp);
+  if (!ForgeMarkupStamp || typeof ((_c = ForgeMarkupStamp.prototype) === null || _c === void 0 ? void 0 : _c.loadSvgData) !== 'function') return;
+  if (ForgeMarkupStamp.prototype.loadSvgData._patched) return;
+  var originalLoadSvgData = ForgeMarkupStamp.prototype.loadSvgData;
+  ForgeMarkupStamp.prototype.loadSvgData = function patchedLoadSvgData() {
+    var _a;
+    // When scriptSvgData is a DOM element (not a string), DOMParser cannot parse
+    // it — fall back to style['text-data'] which contains the real image SVG.
+    if (this.scriptSvgData && typeof this.scriptSvgData !== 'string') {
+      var textData = (_a = this.style) === null || _a === void 0 ? void 0 : _a['text-data'];
+      if (textData && typeof textData === 'string') {
+        var saved = this.scriptSvgData;
+        this.scriptSvgData = null; // force the fallback branch
+        originalLoadSvgData.call(this);
+        this.scriptSvgData = saved; // restore so other code (e.g. undo) still works
+        return;
+      }
+    }
+    originalLoadSvgData.call(this);
+  };
+  ForgeMarkupStamp.prototype.loadSvgData._patched = true;
+}
+
+var StampMarkup = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  createImageSVG: createImageSVG,
+  createMarkupStampClass: createMarkupStampClass,
+  getEditModeStampClass: getEditModeStampClass,
+  getStampCreateActionClass: getStampCreateActionClass,
+  getStampDeleteActionClass: getStampDeleteActionClass,
+  getStampUpdateActionClass: getStampUpdateActionClass,
+  parseSVGString: parseSVGString,
+  patchForgeMarkupStampRestore: patchForgeMarkupStampRestore
+});
 
 /**
  * Image tool for inserting images as markups
@@ -47341,7 +47550,6 @@ var DrawingManager = /*#__PURE__*/function () {
     var _this = this;
     var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
     _classCallCheck(this, DrawingManager);
-    this.eventBus = eventBus;
     // Initialize context
     this.context = {
       viewer: viewer,
@@ -47420,7 +47628,10 @@ var DrawingManager = /*#__PURE__*/function () {
   }, {
     key: "setupEventListeners",
     value: function setupEventListeners() {
-      this.eventBus.on('drawing:toggle', this.editModeManager.handleToggle.bind(this.editModeManager));
+      // NOTE: 'drawing:toggle' is handled exclusively by ViewerForgePDF (React layer)
+      // which orchestrates: enterEditMode() → setShowMarkupToolbar(true).
+      // Subscribing here caused double-call to enterEditMode(), resetting Forge Viewer
+      // to its default Arrow tool on every markup mode entry.
       if (this.context.markupsCore) {
         this.context.markupsCore.addEventListener('EVENT_EDITMODE_CHANGED', this.editModeManager.handleEditModeChanged.bind(this.editModeManager));
         this.context.markupsCore.addEventListener('EVENT_MARKUP_SELECTED', this.propertyManager.handleMarkupSelected.bind(this.propertyManager));
@@ -48043,7 +48254,6 @@ var DrawingManager = /*#__PURE__*/function () {
         this.collaborativeManager.destroy();
         this.presenceManager.destroy();
         // Remove event listeners
-        this.eventBus.off('drawing:toggle', this.editModeManager.handleToggle.bind(this.editModeManager));
         if (this.context.markupsCore) {
           this.context.markupsCore.removeEventListener('EVENT_EDITMODE_CHANGED', this.editModeManager.handleEditModeChanged.bind(this.editModeManager));
           this.context.markupsCore.removeEventListener('EVENT_MARKUP_SELECTED', this.propertyManager.handleMarkupSelected.bind(this.propertyManager));
@@ -48352,21 +48562,26 @@ var MarkupToolbar = function MarkupToolbar(_ref) {
     setActiveTool = _useState2[1];
   // Refs
   var toolbarRef = React.useRef(null);
-  var initializedRef = React.useRef(false);
-  // Auto-activate Pen tool when toolbar mounts
-  // Note: Edit mode is already entered by ViewerForgePDF before showing toolbar
+  // Activate Pen tool immediately on mount.
+  // Edit mode is guaranteed active — ViewerForgePDF awaits enterEditMode() before
+  // setting showMarkupToolbar=true, so no delay needed.
   React.useEffect(function () {
-    if (initializedRef.current) return;
-    initializedRef.current = true;
-    // Small delay to ensure edit mode is fully initialized
-    var timer = setTimeout(function () {
-      drawingManager.setActiveTool(MARKUP_TOOLS.PEN);
-      console.log('[MarkupToolbar] Auto-activated Pen tool on mount');
-    }, 50);
+    drawingManager.setActiveTool(MARKUP_TOOLS.PEN);
+    console.log('[MarkupToolbar] Activated Pen tool on mount');
+  }, [drawingManager]);
+  // Sync activeTool React state from Forge Viewer events.
+  // Keeps the toolbar highlight correct if the active tool changes externally.
+  React.useEffect(function () {
+    var eventBus = EventBus.getInstance();
+    var handleToolChanged = function handleToolChanged(_ref2) {
+      var tool = _ref2.tool;
+      setActiveTool(tool);
+    };
+    eventBus.on('drawing:toolChanged', handleToolChanged);
     return function () {
-      return clearTimeout(timer);
+      eventBus.off('drawing:toolChanged', handleToolChanged);
     };
-  }, [drawingManager]);
+  }, []);
   /**
    * Handle tool selection
    * Note: Edit mode is already managed by ViewerForgePDF, no need to check/enter here