@2112-lab/central-plant 0.3.5 → 0.3.6

package/dist/esm/src/managers/scene/sceneOperationsManager.js

@@ -1,9 +1,8 @@
-import { createClass as _createClass, objectSpread2 as _objectSpread2, construct as _construct, toConsumableArray as _toConsumableArray, objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, classCallCheck as _classCallCheck, createForOfIteratorHelper as _createForOfIteratorHelper, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator, typeof as _typeof } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { createClass as _createClass, objectSpread2 as _objectSpread2, construct as _construct, toConsumableArray as _toConsumableArray, objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, classCallCheck as _classCallCheck, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator, typeof as _typeof } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import * as THREE from 'three';
 import { loadTextureSet } from '../environment/textureConfig.js';
 import { ModelManager } from './modelManager.js';
 import { SceneClearingUtility } from '../../utils/sceneClearingUtility.js';
-import { computeFilteredBoundingBox, computeIODeviceBoundingBoxes } from '../../utils/boundingBoxUtils.js';
 
 var _excluded = ["direction"],
   _excluded2 = ["direction"];
@@ -623,123 +622,52 @@ var SceneOperationsManager = /*#__PURE__*/function () {
     }
 
     /**
-     * Helper function to compute world bounding boxes
-     * For components: uses filtered bbox (excludes io-device and connector subtrees)
-     * For io-devices: computes separate bounding boxes and injects them as children
+     * Sync world-space positions and isDeclared flags for gateways and connectors
+     * into the scene JSON data so the pathfinder can read them.
+     *
+     * Bounding boxes for components and segments are intentionally NOT computed here.
+     * They are computed (with matrix-hash caching) by
+     * PathfindingManager._enrichSceneDataWithBoundingBoxes(), which runs after GLB
+     * models are fully loaded and therefore produces correct values.
      */
   }, {
-    key: "computeWorldBoundingBoxes",
-    value: function computeWorldBoundingBoxes(data) {
-      var component = this.sceneViewer;
-      component.scene.traverse(function (object) {
-        if (object.isMesh) {
-          // Find the corresponding JSON object
-          var jsonObject = null;
-          var _findJsonObject = function findJsonObject(children) {
-            var _iterator = _createForOfIteratorHelper(children),
-              _step;
-            try {
-              for (_iterator.s(); !(_step = _iterator.n()).done;) {
-                var _object$userData, _child$userData4;
-                var child = _step.value;
-                // Enhanced matching logic with hardcoded UUID priority
-
-                // Strategy 1: Direct hardcoded UUID match (HIGHEST PRIORITY)
-                if (child.uuid === object.uuid || child.uuid === ((_object$userData = object.userData) === null || _object$userData === void 0 ? void 0 : _object$userData.originalUuid) || object.uuid === ((_child$userData4 = child.userData) === null || _child$userData4 === void 0 ? void 0 : _child$userData4.originalUuid)) {
-                  return child;
-                }
-
-                // Recursively search children
-                if (child.children) {
-                  var found = _findJsonObject(child.children);
-                  if (found) return found;
-                }
-              }
-            } catch (err) {
-              _iterator.e(err);
-            } finally {
-              _iterator.f();
-            }
-            return null;
-          };
-          jsonObject = _findJsonObject(data.scene.children);
-          if (jsonObject) {
-            // Store in JSON userData for pathfinder (skip for gateways - they're just routing points)
-            if (!jsonObject.userData) jsonObject.userData = {};
-            if (jsonObject.userData.objectType === 'component') {
-              // For components: compute filtered bounding box (excludes io-device and connector subtrees)
-              var filteredBBox = computeFilteredBoundingBox(object, ['io-device', 'connector']);
-              jsonObject.userData.worldBoundingBox = {
-                min: filteredBBox.min.toArray(),
-                max: filteredBBox.max.toArray()
-              };
-              console.log("Added filtered world bounding box for component:", jsonObject.userData.worldBoundingBox);
-
-              // Compute and inject separate io-device bounding boxes as children
-              var ioDeviceBBoxes = computeIODeviceBoundingBoxes(object);
-              if (ioDeviceBBoxes.length > 0) {
-                if (!jsonObject.children) jsonObject.children = [];
-                ioDeviceBBoxes.forEach(function (deviceBBox) {
-                  var existingIndex = jsonObject.children.findIndex(function (c) {
-                    return c.uuid === deviceBBox.uuid;
-                  });
-                  if (existingIndex >= 0) {
-                    // Update existing entry
-                    if (!jsonObject.children[existingIndex].userData) jsonObject.children[existingIndex].userData = {};
-                    jsonObject.children[existingIndex].userData.objectType = 'io-device';
-                    jsonObject.children[existingIndex].userData.worldBoundingBox = deviceBBox.worldBoundingBox;
-                  } else {
-                    // Create new entry
-                    jsonObject.children.push({
-                      uuid: deviceBBox.uuid,
-                      userData: _objectSpread2(_objectSpread2({}, deviceBBox.userData), {}, {
-                        worldBoundingBox: deviceBBox.worldBoundingBox
-                      }),
-                      children: []
-                    });
-                  }
-                });
-                console.log("\uD83D\uDCE6 Injected ".concat(ioDeviceBBoxes.length, " io-device bbox(es) for component ").concat(jsonObject.uuid));
-              }
-            } else if (jsonObject.userData.objectType !== 'gateway') {
-              // For non-component, non-gateway objects: standard bounding box
-              var boundingBox = new THREE.Box3().setFromObject(object);
-              jsonObject.userData.worldBoundingBox = {
-                min: boundingBox.min.toArray(),
-                max: boundingBox.max.toArray()
-              };
-              console.log("Added world bounding box:", jsonObject.userData.worldBoundingBox);
-            }
-
-            // For gateways and connectors, ensure userData.position exists in scene data
-            // This is REQUIRED for pathfinder compatibility
-            if (jsonObject.userData.objectType === 'gateway' || jsonObject.userData.objectType === 'connector') {
-              // Use the object's world position (from Three.js mesh)
-              var worldPos = new THREE.Vector3();
-              object.getWorldPosition(worldPos);
-
-              // ALWAYS update userData.position with world position
-              // This is critical for manual segment connectors which start with local positions
-              jsonObject.userData.position = [worldPos.x, worldPos.y, worldPos.z];
-              console.log("\u2705 Set userData.position for ".concat(jsonObject.userData.objectType, " ").concat(jsonObject.uuid, ": [").concat(worldPos.x.toFixed(2), ", ").concat(worldPos.y.toFixed(2), ", ").concat(worldPos.z.toFixed(2), "]"));
-
-              // For gateways, ensure isDeclared flag is in scene data
-              if (jsonObject.userData.objectType === 'gateway') {
-                if (jsonObject.userData.isDeclared === undefined) {
-                  jsonObject.userData.isDeclared = true;
-                }
-              }
-
-              // For manual segment connectors, ensure isDeclared is set in scene data
-              if (jsonObject.userData.objectType === 'segment-connector' && jsonObject.userData.isDeclared === undefined) {
-                jsonObject.userData.isDeclared = true;
-                console.log("\u2705 Set isDeclared=true for manual segment connector in scene data: ".concat(jsonObject.uuid));
-              }
-
-              // Also sync the mesh's userData.position (belt and suspenders approach)
-              object.userData.position = [worldPos.x, worldPos.y, worldPos.z];
-            }
+    key: "_syncPositionsForPathfinding",
+    value: function _syncPositionsForPathfinding(data) {
+      var scene = this.sceneViewer.scene;
+      var worldPos = new THREE.Vector3();
+      var syncPosition = function syncPosition(jsonObject) {
+        var _jsonObject$userData;
+        var object = scene.getObjectByProperty('uuid', jsonObject.uuid) || scene.getObjectByProperty('uuid', (_jsonObject$userData = jsonObject.userData) === null || _jsonObject$userData === void 0 ? void 0 : _jsonObject$userData.originalUuid);
+        if (!object) return;
+        object.getWorldPosition(worldPos);
+        var pos = [worldPos.x, worldPos.y, worldPos.z];
+        jsonObject.userData.position = pos;
+        object.userData.position = pos;
+      };
+      data.scene.children.forEach(function (jsonObject) {
+        var _jsonObject$userData2;
+        var type = (_jsonObject$userData2 = jsonObject.userData) === null || _jsonObject$userData2 === void 0 ? void 0 : _jsonObject$userData2.objectType;
+        if (type === 'gateway') {
+          syncPosition(jsonObject);
+          if (jsonObject.userData.isDeclared === undefined) {
+            jsonObject.userData.isDeclared = true;
           }
+        } else if (type === 'connector') {
+          syncPosition(jsonObject);
+        } else if (type === 'segment-connector') {
+          syncPosition(jsonObject);
+          if (jsonObject.userData.isDeclared === undefined) {
+            jsonObject.userData.isDeclared = true;
+          }
+        } else if (type === 'component' && Array.isArray(jsonObject.children)) {
+          // Connectors are injected as JSON children by _injectConnectorChildrenFromDictionary
+          // and their Three.js objects exist in the scene, created recursively by createSceneObject
+          jsonObject.children.forEach(function (childJson) {
+            var _childJson$userData;
+            if (((_childJson$userData = childJson.userData) === null || _childJson$userData === void 0 ? void 0 : _childJson$userData.objectType) === 'connector') {
+              syncPosition(childJson);
+            }
+          });
         }
       });
     }
@@ -904,10 +832,10 @@ var SceneOperationsManager = /*#__PURE__*/function () {
       var componentsProcessed = 0;
       var connectorsInjected = 0;
       data.scene.children.forEach(function (child) {
-        var _child$userData5, _child$userData6, _child$userData7;
-        var childType = ((_child$userData5 = child.userData) === null || _child$userData5 === void 0 ? void 0 : _child$userData5.objectType) || ((_child$userData6 = child.userData) === null || _child$userData6 === void 0 ? void 0 : _child$userData6.objectType);
+        var _child$userData4, _child$userData5, _child$userData6;
+        var childType = ((_child$userData4 = child.userData) === null || _child$userData4 === void 0 ? void 0 : _child$userData4.objectType) || ((_child$userData5 = child.userData) === null || _child$userData5 === void 0 ? void 0 : _child$userData5.objectType);
         // Only process components with libraryId
-        if (childType === 'component' && (_child$userData7 = child.userData) !== null && _child$userData7 !== void 0 && _child$userData7.libraryId) {
+        if (childType === 'component' && (_child$userData6 = child.userData) !== null && _child$userData6 !== void 0 && _child$userData6.libraryId) {
           var libraryId = child.userData.libraryId;
           var dictEntry = componentDictionary[libraryId];
 
@@ -1064,23 +992,25 @@ var SceneOperationsManager = /*#__PURE__*/function () {
               geometries = this.createSceneGeometries(data, componentDictionary); // Create basic objects and track GLB replacements
               libraryObjectsToReplace = [];
               data.scene.children.forEach(function (child, index) {
-                var _child$userData8, _child$userData9;
+                var _child$userData7, _child$userData8;
                 var createdObject = _this4.createSceneObject(child, geometries, materials, componentDictionary);
                 _this4.sceneViewer.scene.add(createdObject);
 
                 // Track objects that need GLB model replacement
-                if ((_child$userData8 = child.userData) !== null && _child$userData8 !== void 0 && _child$userData8.libraryId && componentDictionary[(_child$userData9 = child.userData) === null || _child$userData9 === void 0 ? void 0 : _child$userData9.libraryId]) {
-                  var _child$userData0;
+                if ((_child$userData7 = child.userData) !== null && _child$userData7 !== void 0 && _child$userData7.libraryId && componentDictionary[(_child$userData8 = child.userData) === null || _child$userData8 === void 0 ? void 0 : _child$userData8.libraryId]) {
+                  var _child$userData9;
                   libraryObjectsToReplace.push({
                     basicObject: createdObject,
                     jsonData: child,
-                    componentData: componentDictionary[(_child$userData0 = child.userData) === null || _child$userData0 === void 0 ? void 0 : _child$userData0.libraryId]
+                    componentData: componentDictionary[(_child$userData9 = child.userData) === null || _child$userData9 === void 0 ? void 0 : _child$userData9.libraryId]
                   });
                 }
               });
 
-              // Compute bounding boxes for pathfinding
-              this.computeWorldBoundingBoxes(data);
+              // Sync gateway/connector world positions into JSON before pathfinding.
+              // Bounding boxes are computed later by PathfindingManager._enrichSceneDataWithBoundingBoxes
+              // (after GLB models are loaded), so no bbox work is done here.
+              this._syncPositionsForPathfinding(data);
               this._saveOriginalWorldMatrices(this.sceneViewer.scene);
               return _context6.a(2, {
                 componentDictionary: componentDictionary,
@@ -1226,8 +1156,8 @@ var SceneOperationsManager = /*#__PURE__*/function () {
       var instanceBehaviors = [];
       if (Array.isArray(data === null || data === void 0 || (_data$scene3 = data.scene) === null || _data$scene3 === void 0 ? void 0 : _data$scene3.children)) {
         data.scene.children.forEach(function (child) {
-          var _child$userData1, _compData$defaultBeha;
-          var libraryId = (_child$userData1 = child.userData) === null || _child$userData1 === void 0 ? void 0 : _child$userData1.libraryId;
+          var _child$userData0, _compData$defaultBeha;
+          var libraryId = (_child$userData0 = child.userData) === null || _child$userData0 === void 0 ? void 0 : _child$userData0.libraryId;
           if (!libraryId) return;
           var instanceUuid = child.uuid;
           // Skip instances whose defaults were already resolved by Step A
@@ -1423,8 +1353,8 @@ var SceneOperationsManager = /*#__PURE__*/function () {
     key: "_saveOriginalWorldMatrices",
     value: function _saveOriginalWorldMatrices(scene) {
       scene.traverse(function (object) {
-        var _object$userData2;
-        if ((_object$userData2 = object.userData) !== null && _object$userData2 !== void 0 && _object$userData2.direction) {
+        var _object$userData;
+        if ((_object$userData = object.userData) !== null && _object$userData !== void 0 && _object$userData.direction) {
           var originalMatrix = new THREE.Matrix4();
           originalMatrix.copy(object.matrixWorld);
         }
@@ -1628,8 +1558,8 @@ var SceneOperationsManager = /*#__PURE__*/function () {
         // Process children (connectors, etc.) if they exist
         if (componentModel.children && componentModel.children.length > 0) {
           componentModel.children.forEach(function (child) {
-            var _child$userData10, _child$userData11;
-            var childType = ((_child$userData10 = child.userData) === null || _child$userData10 === void 0 ? void 0 : _child$userData10.objectType) || ((_child$userData11 = child.userData) === null || _child$userData11 === void 0 ? void 0 : _child$userData11.objectType);
+            var _child$userData1, _child$userData10;
+            var childType = ((_child$userData1 = child.userData) === null || _child$userData1 === void 0 ? void 0 : _child$userData1.objectType) || ((_child$userData10 = child.userData) === null || _child$userData10 === void 0 ? void 0 : _child$userData10.objectType);
             if (childType === 'connector') {
               var _child$geometry;
               var childBoundingBox = new THREE.Box3().setFromObject(child);
@@ -1714,8 +1644,8 @@ var SceneOperationsManager = /*#__PURE__*/function () {
       if (segment.children && segment.children.length > 0) {
         var childrenToRemove = _toConsumableArray(segment.children);
         childrenToRemove.forEach(function (child) {
-          var _child$userData12;
-          if ((_child$userData12 = child.userData) !== null && _child$userData12 !== void 0 && _child$userData12.isPipeElbow) {
+          var _child$userData11;
+          if ((_child$userData11 = child.userData) !== null && _child$userData11 !== void 0 && _child$userData11.isPipeElbow) {
             console.log("\uD83D\uDDD1\uFE0F Removing elbow child from segment before manualization: ".concat(child.uuid));
             segment.remove(child);
             if (child.geometry) child.geometry.dispose();

package/dist/esm/src/managers/scene/viewport2DManager.js

@@ -87,6 +87,18 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
     // Map of viewport instances by viewType or custom key
     _this2.viewports = new Map();
 
+    // Per-refresh-cycle bbox cache: keyed by object.uuid, cleared each refresh()
+    // so each component bbox is computed once per cycle regardless of viewport count
+    _this2._bboxCache = new Map();
+
+    // Per-refresh-cycle component list cache: eliminates redundant scene traversals
+    // when all 3 viewports render in the same cycle
+    _this2._componentListCache = null;
+
+    // rAF debounce flag — prevents multiple same-frame refresh() calls from
+    // stacking up independent renderComponents() runs
+    _this2._refreshPending = false;
+
     // Event listener reference for cleanup
     _this2._objectTransformedListener = null;
     console.log('🔲 Viewport2DManager initialized (multi-instance support)');
@@ -108,7 +120,6 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
 
       // Listen for object transformations to refresh all viewports
       this._objectTransformedListener = function (eventData) {
-        console.log('🔲 Viewport2DManager detected object transformation, refreshing all viewports');
         _this3.refresh(); // Refresh all viewports
       };
 
@@ -174,6 +185,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
             case 3:
               // Create new viewport instance
               viewport = new Viewport2DInstance(this.sceneViewer, this.Konva, viewType, container);
+              viewport._instanceKey = key;
               this.viewports.set(key, viewport);
 
               // Initialize the stage for this viewport
@@ -351,9 +363,9 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
         viewport.stage.width(width);
         viewport.stage.height(height);
 
-        // Redraw content
+        // Redraw grid immediately; schedule debounced component render
         this.drawGrid(viewport);
-        this.renderComponents(viewport);
+        this.refresh(viewport._instanceKey);
       }
     }
 
@@ -536,7 +548,6 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
         worldDepth = _this$getComponentDim.worldDepth,
         worldHeight = _this$getComponentDim.worldHeight,
         bboxCenter = _this$getComponentDim.bboxCenter;
-      console.log("[2D] ".concat(component.name, " | w=").concat(worldWidth.toFixed(3), " d=").concat(worldDepth.toFixed(3), " h=").concat(worldHeight.toFixed(3), " | center=(").concat(bboxCenter.x.toFixed(2), ",").concat(bboxCenter.y.toFixed(2), ",").concat(bboxCenter.z.toFixed(2), ")"));
 
       // Project 3D bbox center to 2D based on view type
       var _this$project3DTo2D = this.project3DTo2D(viewport, bboxCenter, worldWidth, worldDepth, worldHeight),
@@ -603,21 +614,45 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
   }, {
     key: "_getOrComputeWorldBoundingBox",
     value: function _getOrComputeWorldBoundingBox(object) {
-      // computeFilteredBoundingBox with no exclusions = full object bbox
+      var _object$userData, _object$userData2;
+      // Fast path: offset the stored world bbox by the position delta since load time.
+      // Translation only shifts the bbox center — extents stay identical — so this is O(1)
+      // instead of O(meshes × vertices) from a full geometry traversal.
+      var stored = (_object$userData = object.userData) === null || _object$userData === void 0 ? void 0 : _object$userData.worldBoundingBox;
+      var basePos = (_object$userData2 = object.userData) === null || _object$userData2 === void 0 ? void 0 : _object$userData2._wbbBasePosition;
+      if (stored && basePos) {
+        var dx = object.position.x - basePos.x;
+        var dy = object.position.y - basePos.y;
+        var dz = object.position.z - basePos.z;
+        if (dx === 0 && dy === 0 && dz === 0) return stored;
+        return {
+          min: [stored.min[0] + dx, stored.min[1] + dy, stored.min[2] + dz],
+          max: [stored.max[0] + dx, stored.max[1] + dy, stored.max[2] + dz]
+        };
+      }
+
+      // Slow path: full vertex-accurate traversal (fallback when userData not populated)
+      if (this._bboxCache.has(object.uuid)) {
+        return this._bboxCache.get(object.uuid);
+      }
       var box = computeFilteredBoundingBox(object, []);
+      var result;
       if (box.isEmpty()) {
         // Object has no geometry; fall back to a point at world position
         var wp = new THREE.Vector3();
         object.getWorldPosition(wp);
-        return {
+        result = {
           min: [wp.x, wp.y, wp.z],
           max: [wp.x, wp.y, wp.z]
         };
+      } else {
+        result = {
+          min: [box.min.x, box.min.y, box.min.z],
+          max: [box.max.x, box.max.y, box.max.z]
+        };
       }
-      return {
-        min: [box.min.x, box.min.y, box.min.z],
-        max: [box.max.x, box.max.y, box.max.z]
-      };
+      this._bboxCache.set(object.uuid, result);
+      return result;
     }
 
     /**
@@ -626,11 +661,12 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
   }, {
     key: "getComponentDimensions",
     value: function getComponentDimensions(component) {
-      var _component$userData$w, _component$userData, _component$getWorldPo;
-      // Prefer worldBoundingBox already stored on the object — set after GLB loading
-      // by modelManager.replaceWithGLBModels using computeFilteredBoundingBox.
-      // Fall back to computing live if not yet available (e.g. first render before GLB load).
-      var wbb = (_component$userData$w = (_component$userData = component.userData) === null || _component$userData === void 0 ? void 0 : _component$userData.worldBoundingBox) !== null && _component$userData$w !== void 0 ? _component$userData$w : this._getOrComputeWorldBoundingBox(component);
+      var _component$getWorldPo;
+      // Always recompute from the live Three.js object so that the rect reflects
+      // the current world position after translate/drag operations.
+      // userData.worldBoundingBox is a load-time snapshot and goes stale whenever
+      // the object moves, so we cannot rely on it here.
+      var wbb = this._getOrComputeWorldBoundingBox(component);
       if (wbb !== null && wbb !== void 0 && wbb.min && wbb !== null && wbb !== void 0 && wbb.max) {
         var _wbb$min = _slicedToArray(wbb.min, 3),
           minX = _wbb$min[0],
@@ -741,7 +777,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
           rect.stroke('#007bff');
           rect.strokeWidth(3);
           viewport.stage.container().style.cursor = 'grab';
-          viewport.componentLayer.draw();
+          viewport.componentLayer.batchDraw();
         }
       });
       rect.on('mouseleave', function () {
@@ -750,7 +786,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
           rect.stroke(colors.stroke);
           rect.strokeWidth(2);
           viewport.stage.container().style.cursor = 'default';
-          viewport.componentLayer.draw();
+          viewport.componentLayer.batchDraw();
         }
       });
 
@@ -794,7 +830,7 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
         // Snap to grid
         var snappedPos = _this6.snapScreenToGrid(viewport, currentPos.x, currentPos.y, scale, worldOriginX, worldOriginY);
         componentGroup.position(snappedPos);
-        viewport.componentLayer.draw();
+        viewport.componentLayer.batchDraw();
       });
 
       // DRAG END
@@ -967,18 +1003,20 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
   }, {
     key: "getSceneComponents",
     value: function getSceneComponents() {
+      if (this._componentListCache) return this._componentListCache;
       if (!this.sceneViewer || !this.sceneViewer.scene) {
         return [];
       }
       var components = [];
       this.sceneViewer.scene.traverse(function (object) {
-        var _object$userData, _object$userData2;
+        var _object$userData3, _object$userData4;
         // Only match the ROOT component object — must have both objectType:'component'
         // AND libraryId (inner GLB mesh nodes don't have libraryId)
-        if (((_object$userData = object.userData) === null || _object$userData === void 0 ? void 0 : _object$userData.objectType) === 'component' && (_object$userData2 = object.userData) !== null && _object$userData2 !== void 0 && _object$userData2.libraryId) {
+        if (((_object$userData3 = object.userData) === null || _object$userData3 === void 0 ? void 0 : _object$userData3.objectType) === 'component' && (_object$userData4 = object.userData) !== null && _object$userData4 !== void 0 && _object$userData4.libraryId) {
           components.push(object);
         }
       });
+      this._componentListCache = components;
       return components;
     }
 
@@ -1084,35 +1122,45 @@ var Viewport2DManager = /*#__PURE__*/function (_BaseDisposable2) {
     }
 
     /**
-     * Refresh a specific viewport or all viewports
+     * Refresh a specific viewport or all viewports.
+     * Debounced via requestAnimationFrame so multiple calls within the same
+     * frame (e.g. from Viewport2D mount + refreshAll2DViews) collapse into one.
      * @param {string} key - Optional viewport key. If not provided, refreshes all viewports
      */
   }, {
     key: "refresh",
     value: function refresh() {
+      var _this7 = this;
       var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-      if (key) {
-        var viewport = this.viewports.get(key);
-        if (viewport && viewport.isReady) {
-          this.renderComponents(viewport);
-        }
-      } else {
-        // Refresh all viewports
-        var _iterator = _createForOfIteratorHelper(this.viewports.values()),
-          _step;
-        try {
-          for (_iterator.s(); !(_step = _iterator.n()).done;) {
-            var _viewport = _step.value;
-            if (_viewport.isReady) {
-              this.renderComponents(_viewport);
+      if (this._refreshPending) return;
+      this._refreshPending = true;
+      requestAnimationFrame(function () {
+        _this7._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()),
+            _step;
+          try {
+            for (_iterator.s(); !(_step = _iterator.n()).done;) {
+              var _viewport = _step.value;
+              if (_viewport.isReady) {
+                _this7.renderComponents(_viewport);
+              }
             }
+          } catch (err) {
+            _iterator.e(err);
+          } finally {
+            _iterator.f();
           }
-        } catch (err) {
-          _iterator.e(err);
-        } finally {
-          _iterator.f();
         }
-      }
+      });
     }
 
     /**

package/dist/esm/src/utils/sceneClearingUtility.js

@@ -222,10 +222,10 @@ var SceneClearingUtility = /*#__PURE__*/function () {
               throw new Error('Scene not available for clearing');
             case 1:
               componentsToRemove = [];
-              scene = this.sceneViewer.scene; // Collect only component objects
+              scene = this.sceneViewer.scene; // Collect component, segment, and gateway objects
               scene.traverse(function (child) {
                 if (child === scene) return;
-                var isComponent = child.userData && (child.userData.objectType === 'component' || child.userData.objectType === 'component');
+                var isComponent = child.userData && (child.userData.objectType === 'component' || child.userData.objectType === 'segment' || child.userData.objectType === 'gateway' || child.userData.objectType === 'connector');
                 var isDirectChild = child.parent === scene;
                 if (isComponent && isDirectChild) {
                   componentsToRemove.push(child);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@2112-lab/central-plant",
-  "version": "0.3.5",
+  "version": "0.3.6",
   "description": "Utility modules for the Central Plant Application",
   "main": "dist/bundle/index.js",
   "module": "dist/esm/src/index.js",