@2112-lab/central-plant 0.3.11 → 0.3.13

package/dist/bundle/index.js

@@ -3497,7 +3497,12 @@ function computeFilteredBoundingBox(object) {
 
   // Build a Set for O(1) lookups
   var excludeSet = new Set(excludeTypes);
-  object.updateWorldMatrix(false, true);
+
+  // Force matrix updates to ensure world-space coordinates are accurate.
+  // Using force=true ensures matrices are updated even if matrixWorldNeedsUpdate is false,
+  // which can happen after positioning a model before the render loop runs.
+  object.updateMatrix();
+  object.updateMatrixWorld(true);
   object.traverse(function (child) {
     // Only process nodes with geometry (Mesh, SkinnedMesh, etc.)
     if (!child.geometry) return;
@@ -29818,6 +29823,15 @@ var ModelManager = /*#__PURE__*/function () {
                 var jsonData = _ref2.jsonData,
                   glbModel = _ref2.glbModel;
                 if (!glbModel) return;
+
+                // CRITICAL: Force matrix updates before computing bbox.
+                // After loadLibraryModel positions the model, the world matrices may not be
+                // invalidated yet. computeFilteredBoundingBox uses updateWorldMatrix(false, true)
+                // which only updates if matrixWorldNeedsUpdate is true. Force the update here
+                // to ensure the bbox is computed with correct world-space coordinates.
+                glbModel.updateMatrix();
+                glbModel.updateMatrixWorld(true);
+
                 // Use filtered bbox (excludes connectors + io-devices) so it matches
                 // what pathfindingManager._enrichSceneDataWithBoundingBoxes produces
                 var filteredBox = computeFilteredBoundingBox(glbModel, ['io-device', 'connector']);
@@ -35440,6 +35454,9 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
     // stacking up independent renderComponents() runs
     _this2._refreshPending = false;
 
+    // Set of viewport keys pending refresh (collects keys across multiple refresh() calls in same frame)
+    _this2._pendingRefreshKeys = new Set();
+
     // Event listener reference for cleanup
     _this2._objectTransformedListener = null;
     console.log('🔲 Viewport2DManager initialized (multi-instance support)');
@@ -35529,8 +35546,10 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
               viewport._instanceKey = key;
               this.viewports.set(key, viewport);
 
-              // Initialize the stage for this viewport
-              this.initializeStage(viewport);
+              // Initialize the stage for this viewport (waits for DOM layout to settle)
+              _context.n = 4;
+              return this.initializeStage(viewport);
+            case 4:
               return _context.a(2, viewport.isReady);
           }
         }, _callee, this);
@@ -35624,50 +35643,67 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
     /**
      * Initialize Konva stage for a specific viewport instance
      * @param {Viewport2DInstance} viewport - The viewport instance to initialize
+     * @returns {Promise<void>} Resolves when viewport is fully ready
      */
     )
   }, {
     key: "initializeStage",
     value: function initializeStage(viewport) {
-      if (!this.Konva || !viewport.container) {
-        console.error('❌ Cannot initialize stage: Konva or container missing');
-        return;
-      }
-
-      // Get container dimensions
-      var rect = viewport.container.getBoundingClientRect();
-      var width = rect.width || 800;
-      var height = rect.height || 600;
-      console.log("\uD83D\uDCD0 Initializing Konva stage (".concat(viewport.viewType, "): ").concat(width, "x").concat(height));
-
-      // Create Konva stage for this viewport
-      viewport.stage = new this.Konva.Stage({
-        container: viewport.container,
-        width: width,
-        height: height
-      });
-
-      // Create separate layers for grid and components
-      viewport.gridLayer = new this.Konva.Layer();
-      viewport.componentLayer = new this.Konva.Layer();
-
-      // Add layers to stage in order (grid first, then components)
-      viewport.stage.add(viewport.gridLayer);
-      viewport.stage.add(viewport.componentLayer);
-
-      // Setup resize handling
-      this.setupResizeListener(viewport);
+      var _this4 = this;
+      return new Promise(function (resolve) {
+        if (!_this4.Konva || !viewport.container) {
+          console.error('❌ Cannot initialize stage: Konva or container missing');
+          resolve();
+          return;
+        }
 
-      // Setup zoom and pan handlers
-      this.setupZoomAndPanHandlers(viewport);
+        // Get container dimensions
+        var rect = viewport.container.getBoundingClientRect();
+        var width = rect.width || 800;
+        var height = rect.height || 600;
+        console.log("\uD83D\uDCD0 Initializing Konva stage (".concat(viewport.viewType, "): ").concat(width, "x").concat(height));
 
-      // Draw initial content
-      this.drawGrid(viewport);
-      this.renderComponents(viewport);
+        // Create Konva stage for this viewport
+        viewport.stage = new _this4.Konva.Stage({
+          container: viewport.container,
+          width: width,
+          height: height
+        });
 
-      // Mark as ready
-      viewport.isReady = true;
-      console.log("\u2705 Viewport2DManager stage initialized (".concat(viewport.viewType, ")"));
+        // Create separate layers for grid and components
+        viewport.gridLayer = new _this4.Konva.Layer();
+        viewport.componentLayer = new _this4.Konva.Layer();
+
+        // Add layers to stage in order (grid first, then components)
+        viewport.stage.add(viewport.gridLayer);
+        viewport.stage.add(viewport.componentLayer);
+
+        // Setup resize handling
+        _this4.setupResizeListener(viewport);
+
+        // Setup zoom and pan handlers
+        _this4.setupZoomAndPanHandlers(viewport);
+
+        // Draw initial grid (lightweight, safe to do immediately)
+        _this4.drawGrid(viewport);
+
+        // Defer component rendering to next frame to ensure DOM layout is finalized.
+        // Without this, getBoundingClientRect() may return stale/zero dimensions
+        // if the container hasn't been fully laid out by CSS yet.
+        requestAnimationFrame(function () {
+          // Re-check container dimensions after layout settles
+          var finalRect = viewport.container.getBoundingClientRect();
+          if (finalRect.width > 0 && finalRect.height > 0) {
+            viewport.stage.width(finalRect.width);
+            viewport.stage.height(finalRect.height);
+            _this4.drawGrid(viewport);
+          }
+          _this4.renderComponents(viewport);
+          viewport.isReady = true;
+          console.log("\u2705 Viewport2DManager stage initialized (".concat(viewport.viewType, ")"));
+          resolve();
+        });
+      });
     }
 
     /**
@@ -35677,12 +35713,12 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
   }, {
     key: "setupResizeListener",
     value: function setupResizeListener(viewport) {
-      var _this4 = this;
+      var _this5 = this;
       if (typeof window === 'undefined' || !window.ResizeObserver || !viewport.container) {
         return;
       }
       viewport._resizeObserver = new ResizeObserver(function () {
-        _this4.resizeStage(viewport);
+        _this5.resizeStage(viewport);
       });
       viewport._resizeObserver.observe(viewport.container);
     }
@@ -35717,6 +35753,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
   }, {
     key: "setupZoomAndPanHandlers",
     value: function setupZoomAndPanHandlers(viewport) {
+      var _this6 = this;
       if (!viewport.stage) return;
 
       // Mouse wheel zoom
@@ -35742,6 +35779,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
           y: pointer.y - mousePointTo.y * clampedScale
         };
         viewport.stage.position(newPos);
+        _this6.drawGrid(viewport);
         viewport.stage.batchDraw();
       });
 
@@ -35761,6 +35799,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
         viewport.stage.x(viewport.stage.x() + dx);
         viewport.stage.y(viewport.stage.y() + dy);
         viewport.lastPanPoint = pos;
+        _this6.drawGrid(viewport);
         viewport.stage.batchDraw();
       });
       viewport.stage.on('mouseup', function () {
@@ -35785,33 +35824,40 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
       var width = viewport.stage.width();
       var height = viewport.stage.height();
       var gridSize = viewport.PIXELS_PER_UNIT;
-
-      // Center of the viewport represents world origin (0,0,0)
-      var centerX = width / 2;
-      var centerY = height / 2;
+      var stageX = viewport.stage.x();
+      var stageY = viewport.stage.y();
+      var scale = viewport.stage.scaleX();
+
+      // World origin sits at (width/2, height/2) in stage-local coordinates
+      var originX = width / 2;
+      var originY = height / 2;
+
+      // Compute the visible area in stage-local coordinates, with 1-cell padding
+      var visLeft = -stageX / scale - gridSize;
+      var visTop = -stageY / scale - gridSize;
+      var visRight = (width - stageX) / scale + gridSize;
+      var visBottom = (height - stageY) / scale + gridSize;
       var gridGroup = new this.Konva.Group();
-
-      // Draw vertical lines centered at origin
-      var startX = centerX % gridSize - gridSize;
       var gridColor = '#dddddd';
-      for (var x = startX; x < width; x += gridSize) {
-        var distFromCenter = Math.abs(x - centerX);
-        var isOriginLine = distFromCenter < 1;
+
+      // Draw vertical lines — start at the first grid column left of the visible area
+      var firstX = Math.floor((visLeft - originX) / gridSize) * gridSize + originX;
+      for (var x = firstX; x <= visRight; x += gridSize) {
+        var isOriginLine = Math.abs(x - originX) < 0.5;
         gridGroup.add(new this.Konva.Line({
-          points: [x, 0, x, height],
+          points: [x, visTop, x, visBottom],
           stroke: gridColor,
           strokeWidth: isOriginLine ? 2 : 1,
           listening: false
         }));
       }
 
-      // Draw horizontal lines centered at origin
-      var startY = centerY % gridSize - gridSize;
-      for (var y = startY; y < height; y += gridSize) {
-        var _distFromCenter = Math.abs(y - centerY);
-        var _isOriginLine = _distFromCenter < 1;
+      // Draw horizontal lines — start at the first grid row above the visible area
+      var firstY = Math.floor((visTop - originY) / gridSize) * gridSize + originY;
+      for (var y = firstY; y <= visBottom; y += gridSize) {
+        var _isOriginLine = Math.abs(y - originY) < 0.5;
         gridGroup.add(new this.Konva.Line({
-          points: [0, y, width, y],
+          points: [visLeft, y, visRight, y],
           stroke: gridColor,
           strokeWidth: _isOriginLine ? 2 : 1,
           listening: false
@@ -35821,14 +35867,14 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
       // Draw center crosshair at world origin
       var crosshairSize = gridSize;
       gridGroup.add(new this.Konva.Line({
-        points: [centerX, centerY - crosshairSize, centerX, centerY + crosshairSize],
+        points: [originX, originY - crosshairSize, originX, originY + crosshairSize],
         stroke: '#333',
         strokeWidth: 1,
         listening: false,
         dash: [5, 5]
       }));
       gridGroup.add(new this.Konva.Line({
-        points: [centerX - crosshairSize, centerY, centerX + crosshairSize, centerY],
+        points: [originX - crosshairSize, originY, originX + crosshairSize, originY],
         stroke: '#333',
         strokeWidth: 1,
         listening: false,
@@ -35845,7 +35891,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
   }, {
     key: "renderComponents",
     value: function renderComponents(viewport) {
-      var _this5 = this;
+      var _this7 = this;
       if (!viewport.componentLayer || !viewport.stage || !this.sceneViewer) return;
       viewport.componentLayer.destroyChildren();
 
@@ -35856,19 +35902,18 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
         return;
       }
 
-      // Only log on significant changes
-      if (components.length !== viewport._lastComponentCount) {
-        console.log("\uD83D\uDCE6 Rendering ".concat(components.length, " components in 2D view (").concat(viewport.viewType, ")"));
-        viewport._lastComponentCount = components.length;
-      }
+      // Track render count for debugging
+      if (viewport._renderCount === undefined) viewport._renderCount = 0;
+      viewport._renderCount++;
       var width = viewport.stage.width();
       var height = viewport.stage.height();
       var centerX = width / 2;
       var centerY = height / 2;
       var scale = viewport.PIXELS_PER_UNIT;
+      console.log("\uD83C\uDFA8 RENDER #".concat(viewport._renderCount, " (").concat(viewport.viewType, "): ").concat(components.length, " components, stage=").concat(width, "x").concat(height, ", center=(").concat(centerX, ", ").concat(centerY, ")"));
       components.forEach(function (component) {
         try {
-          _this5.renderComponent(viewport, component, centerX, centerY, scale);
+          _this7.renderComponent(viewport, component, centerX, centerY, scale);
         } catch (err) {
           console.warn('⚠️ Error rendering component in 2D:', component.name, err);
         }
@@ -35899,6 +35944,11 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
       var screenX = centerX + posX * scale;
       var screenY = centerY - posY * scale; // Flip Y for screen coords
 
+      // Debug: Log ALL component positions on first render only
+      if (viewport._renderCount === 1) {
+        console.log("\uD83D\uDD0D [".concat(viewport.viewType, "] ").concat(component.name, ": bbox.z=").concat(bboxCenter.z.toFixed(2), ", posY=").concat(posY.toFixed(2), ", screenY=").concat(screenY.toFixed(0), ", centerY=").concat(centerY.toFixed(0)));
+      }
+
       // Generate unique color for this component
       var colors = this.generateComponentColor(component.id);
 
@@ -35928,18 +35978,19 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
         draggable: false
       });
 
-      // Add label
+      // Add label (hidden by default; shown on hover)
       var label = new this.Konva.Text({
         x: -rectWidth / 2,
         y: -rectHeight / 2 - 20,
         text: component.name || 'Component',
         fontSize: 12,
         fill: '#333',
-        listening: false
+        listening: false,
+        visible: false
       });
 
       // Add mouse event handlers
-      this.addComponentInteractions(viewport, rect, componentGroup, component, worldWidth, worldDepth, worldHeight, bboxCenter);
+      this.addComponentInteractions(viewport, rect, componentGroup, component, worldWidth, worldDepth, worldHeight, bboxCenter, label);
       componentGroup.add(rect);
       componentGroup.add(label);
       viewport.componentLayer.add(componentGroup);
@@ -35976,7 +36027,14 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
       if (this._bboxCache.has(object.uuid)) {
         return this._bboxCache.get(object.uuid);
       }
-      var box = computeFilteredBoundingBox(object, []);
+
+      // Force matrix updates before computing bbox to ensure world-space accuracy
+      object.updateMatrix();
+      object.updateMatrixWorld(true);
+
+      // Exclude io-devices and connectors to match the stored worldBoundingBox
+      // computed in modelManager.replaceWithGLBModels()
+      var box = computeFilteredBoundingBox(object, ['io-device', 'connector']);
       var result;
       if (box.isEmpty()) {
         // Object has no geometry; fall back to a point at world position
@@ -36106,8 +36164,8 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
      */
   }, {
     key: "addComponentInteractions",
-    value: function addComponentInteractions(viewport, rect, componentGroup, component, worldWidth, worldDepth, worldHeight, bboxCenter) {
-      var _this6 = this;
+    value: function addComponentInteractions(viewport, rect, componentGroup, component, worldWidth, worldDepth, worldHeight, bboxCenter, label) {
+      var _this8 = this;
       if (!this.Konva) return;
       var colors = this.generateComponentColor(component.id);
 
@@ -36118,6 +36176,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
           rect.stroke('#007bff');
           rect.strokeWidth(3);
           viewport.stage.container().style.cursor = 'grab';
+          if (label) label.visible(true);
           viewport.componentLayer.batchDraw();
         }
       });
@@ -36127,6 +36186,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
           rect.stroke(colors.stroke);
           rect.strokeWidth(2);
           viewport.stage.container().style.cursor = 'default';
+          if (label) label.visible(false);
           viewport.componentLayer.batchDraw();
         }
       });
@@ -36134,12 +36194,12 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
       // CLICK EVENT
       rect.on('click', function () {
         if (!viewport.isDragging) {
-          var _this6$sceneViewer;
+          var _this8$sceneViewer;
           console.log("\uD83C\uDFAF Component clicked: ".concat(component.name));
 
           // Use centralPlant API to select component
-          if ((_this6$sceneViewer = _this6.sceneViewer) !== null && _this6$sceneViewer !== void 0 && _this6$sceneViewer.centralPlant && component.uuid) {
-            _this6.sceneViewer.centralPlant.selectComponent(component.uuid);
+          if ((_this8$sceneViewer = _this8.sceneViewer) !== null && _this8$sceneViewer !== void 0 && _this8$sceneViewer.centralPlant && component.uuid) {
+            _this8.sceneViewer.centralPlant.selectComponent(component.uuid);
           }
         }
       });
@@ -36169,7 +36229,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
         var worldOriginY = stageHeight / 2;
 
         // Snap to grid
-        var snappedPos = _this6.snapScreenToGrid(viewport, currentPos.x, currentPos.y, scale, worldOriginX, worldOriginY);
+        var snappedPos = _this8.snapScreenToGrid(viewport, currentPos.x, currentPos.y, scale, worldOriginX, worldOriginY);
         componentGroup.position(snappedPos);
         viewport.componentLayer.batchDraw();
       });
@@ -36177,7 +36237,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
       // DRAG END
       componentGroup.on('dragend', function () {
         setTimeout(function () {
-          var _this6$sceneViewer2;
+          var _this8$sceneViewer2;
           viewport.isDragging = false;
           var finalPos = componentGroup.position();
           var stageWidth = viewport.stage.width();
@@ -36187,17 +36247,17 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
           var worldOriginY = stageHeight / 2;
 
           // Convert screen to world coordinates
-          var worldCoords = _this6.screenToWorldCoords(viewport, finalPos.x, finalPos.y, scale, worldOriginX, worldOriginY);
+          var worldCoords = _this8.screenToWorldCoords(viewport, finalPos.x, finalPos.y, scale, worldOriginX, worldOriginY);
 
           // Calculate new position: delta from old bbox center to new bbox center
           var currentPos = component.position;
-          var newPosition = _this6.worldCoordsToObjectPosition(viewport, worldCoords, currentPos, bboxCenter);
+          var newPosition = _this8.worldCoordsToObjectPosition(viewport, worldCoords, currentPos, bboxCenter);
 
           // Apply translation via centralPlant API
           var deltaX = newPosition.x - currentPos.x;
           var deltaY = newPosition.y - currentPos.y;
           var deltaZ = newPosition.z - currentPos.z;
-          if ((_this6$sceneViewer2 = _this6.sceneViewer) !== null && _this6$sceneViewer2 !== void 0 && _this6$sceneViewer2.centralPlant && component.uuid) {
+          if ((_this8$sceneViewer2 = _this8.sceneViewer) !== null && _this8$sceneViewer2 !== void 0 && _this8$sceneViewer2.centralPlant && component.uuid) {
             var success = true;
 
             // Suppress per-axis path updates so the pathfinder only runs once,
@@ -36205,32 +36265,32 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
             // Running updatePaths() after each individual axis (the default
             // translateComponent behaviour) produces intermediate wrong results on
             // the first drag because no cached fingerprint exists yet to skip them.
-            var wasAutoUpdate = _this6.sceneViewer.shouldUpdatePaths;
-            _this6.sceneViewer.shouldUpdatePaths = false;
+            var wasAutoUpdate = _this8.sceneViewer.shouldUpdatePaths;
+            _this8.sceneViewer.shouldUpdatePaths = false;
             try {
               if (Math.abs(deltaX) > 0.01) {
-                success = success && _this6.sceneViewer.centralPlant.translate(component.uuid, 'x', deltaX);
+                success = success && _this8.sceneViewer.centralPlant.translate(component.uuid, 'x', deltaX);
               }
               if (Math.abs(deltaY) > 0.01) {
-                success = success && _this6.sceneViewer.centralPlant.translate(component.uuid, 'y', deltaY);
+                success = success && _this8.sceneViewer.centralPlant.translate(component.uuid, 'y', deltaY);
               }
               if (Math.abs(deltaZ) > 0.01) {
-                success = success && _this6.sceneViewer.centralPlant.translate(component.uuid, 'z', deltaZ);
+                success = success && _this8.sceneViewer.centralPlant.translate(component.uuid, 'z', deltaZ);
               }
             } finally {
-              _this6.sceneViewer.shouldUpdatePaths = wasAutoUpdate;
+              _this8.sceneViewer.shouldUpdatePaths = wasAutoUpdate;
             }
-            if (!success && _this6.dragStartPosition) {
+            if (!success && _this8.dragStartPosition) {
               console.warn('⚠️ Failed to translate component, reverting position');
-              componentGroup.position(_this6.dragStartPosition);
+              componentGroup.position(_this8.dragStartPosition);
             } else {
               console.log("\u2705 Component ".concat(component.name, " translated successfully in 2D viewport"));
 
               // Single path update with the final combined position
-              if (wasAutoUpdate && _this6.sceneViewer) {
+              if (wasAutoUpdate && _this8.sceneViewer) {
                 console.log('🔄 Auto-updating paths after 2D viewport translation...');
                 try {
-                  _this6.sceneViewer.updatePaths();
+                  _this8.sceneViewer.updatePaths();
                   console.log('✅ Paths auto-updated successfully from 2D viewport');
                 } catch (error) {
                   console.error('❌ Error auto-updating paths from 2D viewport:', error);
@@ -36483,28 +36543,39 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
   }, {
     key: "refresh",
     value: function refresh() {
-      var _this7 = this;
+      var _this9 = this;
       var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+      // Collect viewport keys to refresh; null means "all viewports"
+      if (key) {
+        this._pendingRefreshKeys.add(key);
+      } else {
+        // null key means refresh all — mark with special sentinel
+        this._pendingRefreshKeys.add('__ALL__');
+      }
+
+      // If already scheduled, the rAF callback will process our newly-added key
       if (this._refreshPending) return;
       this._refreshPending = true;
       requestAnimationFrame(function () {
-        _this7._refreshPending = false;
+        _this9._refreshPending = false;
+
         // Clear per-cycle caches so each component is measured/traversed once per paint
-        _this7._bboxCache.clear();
-        _this7._componentListCache = null;
-        if (key) {
-          var viewport = _this7.viewports.get(key);
-          if (viewport && viewport.isReady) {
-            _this7.renderComponents(viewport);
-          }
-        } else {
-          var _iterator = _createForOfIteratorHelper(_this7.viewports.values()),
+        _this9._bboxCache.clear();
+        _this9._componentListCache = null;
+
+        // Check if we need to refresh all viewports
+        var refreshAll = _this9._pendingRefreshKeys.has('__ALL__');
+        var keysToRefresh = new Set(_this9._pendingRefreshKeys);
+        _this9._pendingRefreshKeys.clear();
+        if (refreshAll) {
+          // Refresh all viewports
+          var _iterator = _createForOfIteratorHelper(_this9.viewports.values()),
             _step;
           try {
             for (_iterator.s(); !(_step = _iterator.n()).done;) {
-              var _viewport = _step.value;
-              if (_viewport.isReady) {
-                _this7.renderComponents(_viewport);
+              var viewport = _step.value;
+              if (viewport.isReady) {
+                _this9.renderComponents(viewport);
               }
             }
           } catch (err) {
@@ -36512,6 +36583,23 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
           } finally {
             _iterator.f();
           }
+        } else {
+          // Refresh only the specific viewports that were requested
+          var _iterator2 = _createForOfIteratorHelper(keysToRefresh),
+            _step2;
+          try {
+            for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+              var viewportKey = _step2.value;
+              var _viewport = _this9.viewports.get(viewportKey);
+              if (_viewport && _viewport.isReady) {
+                _this9.renderComponents(_viewport);
+              }
+            }
+          } catch (err) {
+            _iterator2.e(err);
+          } finally {
+            _iterator2.f();
+          }
         }
       });
     }
@@ -36532,20 +36620,20 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
       }
 
       // Dispose all viewport instances
-      var _iterator2 = _createForOfIteratorHelper(this.viewports.entries()),
-        _step2;
+      var _iterator3 = _createForOfIteratorHelper(this.viewports.entries()),
+        _step3;
       try {
-        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-          var _step2$value = _slicedToArray(_step2.value, 2),
-            key = _step2$value[0],
-            viewport = _step2$value[1];
+        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+          var _step3$value = _slicedToArray(_step3.value, 2),
+            key = _step3$value[0],
+            viewport = _step3$value[1];
           console.log("\uD83D\uDDD1\uFE0F Disposing viewport: ".concat(key));
           viewport.dispose();
         }
       } catch (err) {
-        _iterator2.e(err);
+        _iterator3.e(err);
       } finally {
-        _iterator2.f();
+        _iterator3.f();
       }
       this.viewports.clear();
       this.Konva = null;
@@ -37946,7 +38034,7 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
    * Initialize the CentralPlant manager
    * 
    * @constructor
-   * @version 0.3.11
+   * @version 0.3.13
    * @updated 2025-10-22
    * 
    * @description Creates a new CentralPlant instance and initializes internal managers and utilities.

package/dist/cjs/src/core/centralPlant.js

@@ -35,7 +35,7 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
    * Initialize the CentralPlant manager
    * 
    * @constructor
-   * @version 0.3.11
+   * @version 0.3.13
    * @updated 2025-10-22
    * 
    * @description Creates a new CentralPlant instance and initializes internal managers and utilities.

package/dist/cjs/src/managers/scene/modelManager.js

@@ -585,6 +585,15 @@ var ModelManager = /*#__PURE__*/function () {
                 var jsonData = _ref2.jsonData,
                   glbModel = _ref2.glbModel;
                 if (!glbModel) return;
+
+                // CRITICAL: Force matrix updates before computing bbox.
+                // After loadLibraryModel positions the model, the world matrices may not be
+                // invalidated yet. computeFilteredBoundingBox uses updateWorldMatrix(false, true)
+                // which only updates if matrixWorldNeedsUpdate is true. Force the update here
+                // to ensure the bbox is computed with correct world-space coordinates.
+                glbModel.updateMatrix();
+                glbModel.updateMatrixWorld(true);
+
                 // Use filtered bbox (excludes connectors + io-devices) so it matches
                 // what pathfindingManager._enrichSceneDataWithBoundingBoxes produces
                 var filteredBox = boundingBoxUtils.computeFilteredBoundingBox(glbModel, ['io-device', 'connector']);