@2112-lab/central-plant 0.3.26 → 0.3.28

package/dist/bundle/index.js

@@ -3611,6 +3611,34 @@ function computeIODeviceBoundingBoxes(componentObject) {
  * const helpers = createSelectionBoxHelpers(pumpModel, 0x00ff00)
  * helpers.forEach(h => scene.add(h))
  */
+/**
+ * Returns a filtered bounding box for `object`, using a cache stored on
+ * `object.userData._filteredBBoxCache`.  The cache key is the serialised
+ * world-matrix elements string; if the object has moved the cache is
+ * automatically invalidated and recomputed.
+ *
+ * This avoids the expensive full-traverse on every selection event for
+ * large smart components with many child meshes.
+ *
+ * @param {THREE.Object3D} object
+ * @param {string[]} excludeTypes
+ * @returns {THREE.Box3}
+ */
+function computeFilteredBoundingBoxCached(object, excludeTypes) {
+  object.updateMatrixWorld(true);
+  var matrixKey = object.matrixWorld.elements.join(',');
+  var cache = object.userData._filteredBBoxCache;
+  if (cache && cache.matrixKey === matrixKey) {
+    return new THREE__namespace.Box3(_construct(THREE__namespace.Vector3, _toConsumableArray(cache.min)), _construct(THREE__namespace.Vector3, _toConsumableArray(cache.max)));
+  }
+  var box = computeFilteredBoundingBox(object, excludeTypes);
+  object.userData._filteredBBoxCache = {
+    matrixKey: matrixKey,
+    min: box.min.toArray(),
+    max: box.max.toArray()
+  };
+  return box;
+}
 function createSelectionBoxHelpers(object) {
   var _object$children;
   var color = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0x00ff00;
@@ -3624,7 +3652,7 @@ function createSelectionBoxHelpers(object) {
   });
   if (hasIODevices) {
     // 1. Create filtered helper for the component body
-    var filteredBox = computeFilteredBoundingBox(object, excludeTypes);
+    var filteredBox = computeFilteredBoundingBoxCached(object, excludeTypes);
     var componentHelper = _createBoxHelperFromBox3(filteredBox, color);
     componentHelper.isHelper = true;
     componentHelper.userData = {
@@ -3634,33 +3662,6 @@ function createSelectionBoxHelpers(object) {
       excludeTypes: excludeTypes
     };
     helpers.push(componentHelper);
-
-    // 2. Create individual helpers for each io-device
-    var _iterator2 = _createForOfIteratorHelper(object.children),
-      _step2;
-    try {
-      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-        var _child$userData3;
-        var child = _step2.value;
-        if (((_child$userData3 = child.userData) === null || _child$userData3 === void 0 ? void 0 : _child$userData3.objectType) !== 'io-device') continue;
-        var deviceBox = new THREE__namespace.Box3().setFromObject(child);
-        if (deviceBox.isEmpty()) continue;
-        var deviceHelper = _createBoxHelperFromBox3(deviceBox, color);
-        deviceHelper.isHelper = true;
-        deviceHelper.userData = {
-          isBoundingBox: true,
-          sourceObjectUuid: child.uuid,
-          isFiltered: false,
-          isIODevice: true,
-          parentComponentUuid: object.uuid
-        };
-        helpers.push(deviceHelper);
-      }
-    } catch (err) {
-      _iterator2.e(err);
-    } finally {
-      _iterator2.f();
-    }
   } else {
     // Standard BoxHelper for non-smart objects
     var boxHelper = new THREE__namespace.BoxHelper(object, color);
@@ -3684,11 +3685,11 @@ function createSelectionBoxHelpers(object) {
  * @param {THREE.Scene} scene - The scene (for finding objects by uuid)
  */
 function updateSelectionBoxHelpers(helpers, selectedObjects, scene) {
-  var _iterator3 = _createForOfIteratorHelper(helpers),
-    _step3;
+  var _iterator2 = _createForOfIteratorHelper(helpers),
+    _step2;
   try {
     var _loop = function _loop() {
-      var helper = _step3.value;
+      var helper = _step2.value;
       var _helper$userData = helper.userData,
         sourceObjectUuid = _helper$userData.sourceObjectUuid,
         isFiltered = _helper$userData.isFiltered,
@@ -3711,25 +3712,21 @@ function updateSelectionBoxHelpers(helpers, selectedObjects, scene) {
       if (!sourceObject) return 1; // continue
       sourceObject.updateMatrixWorld(true);
       if (isFiltered && excludeTypes) {
-        // Recompute filtered bbox
-        var box = computeFilteredBoundingBox(sourceObject, excludeTypes);
+        // Recompute filtered bbox (uses cache when the object hasn't moved)
+        var box = computeFilteredBoundingBoxCached(sourceObject, excludeTypes);
         _updateBoxHelperPositions(helper, box);
-      } else if (isIODevice) {
-        // Recompute io-device bbox
-        var _box = new THREE__namespace.Box3().setFromObject(sourceObject);
-        _updateBoxHelperPositions(helper, _box);
       } else if (helper.update) {
         // Standard BoxHelper — use built-in update
         helper.update();
       }
     };
-    for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
       if (_loop()) continue;
     }
   } catch (err) {
-    _iterator3.e(err);
+    _iterator2.e(err);
   } finally {
-    _iterator3.f();
+    _iterator2.f();
   }
 }
 
@@ -3823,8 +3820,17 @@ var TransformControlsManager = /*#__PURE__*/function () {
       onModeChange: null,
       onObjectRemoved: null,
       onSelectionChanged: null,
-      onIODeviceClick: null
+      onIODeviceClick: null,
+      onIODeviceDrag: null,
+      onIODeviceDragEnd: null
     };
+
+    // IO device drag tracking state
+    this._ioDragMesh = null;
+    this._ioDragStartX = 0;
+    this._ioDragStartY = 0;
+    this._ioDragMoved = false;
+    this._suppressNextClick = false;
     this.init();
   }
 
@@ -3904,6 +3910,12 @@ var TransformControlsManager = /*#__PURE__*/function () {
       if (callbacks.onIODeviceClick) {
         this.callbacks.onIODeviceClick = callbacks.onIODeviceClick;
       }
+      if (callbacks.onIODeviceDrag) {
+        this.callbacks.onIODeviceDrag = callbacks.onIODeviceDrag;
+      }
+      if (callbacks.onIODeviceDragEnd) {
+        this.callbacks.onIODeviceDragEnd = callbacks.onIODeviceDragEnd;
+      }
       console.log('🔗 Transform controls callbacks registered');
     }
     /**
@@ -4110,6 +4122,11 @@ var TransformControlsManager = /*#__PURE__*/function () {
     value: function setupKeyboardControls() {
       var _this3 = this;
       this.eventHandlers.keydown = function (event) {
+        // Restore perspective camera when pressing Escape from ortho face view
+        if (event.code === 'Escape') {
+          _this3._restorePerspectiveCamera();
+        }
+
         // Only handle keys when transform controls are active
         if (!_this3.transformControls.enabled || _this3.transformState.isTransforming) {
           return;
@@ -4144,9 +4161,82 @@ var TransformControlsManager = /*#__PURE__*/function () {
       var raycaster = new THREE__namespace.Raycaster();
       var mouse = new THREE__namespace.Vector2();
 
-      // Click handler: first click selects (bounding box), second click on same object shows tooltip
+      // ── IO device drag ────────────────────────────────────────────────────
+      // Detect pointerdown on an IO device mesh and convert a drag gesture into
+      // state changes.  Up/right = positive direction, down/left = negative.
+      this.eventHandlers.pointerdown = function (event) {
+        if (_this4.transformState.isTransforming) return;
+        if (!_this4.callbacks.onIODeviceDrag) return;
+        _this4._calculateMousePosition(event, mouse);
+        raycaster.setFromCamera(mouse, _this4.camera);
+        var allIntersects = raycaster.intersectObjects(_this4.scene.children, true);
+        var ioDeviceObject = null;
+        var _iterator = _createForOfIteratorHelper(allIntersects),
+          _step;
+        try {
+          for (_iterator.s(); !(_step = _iterator.n()).done;) {
+            var hit = _step.value;
+            var obj = hit.object;
+            while (obj) {
+              var _obj$userData;
+              if (((_obj$userData = obj.userData) === null || _obj$userData === void 0 ? void 0 : _obj$userData.objectType) === 'io-device') {
+                ioDeviceObject = obj;
+                break;
+              }
+              obj = obj.parent;
+            }
+            if (ioDeviceObject) break;
+          }
+        } catch (err) {
+          _iterator.e(err);
+        } finally {
+          _iterator.f();
+        }
+        if (!ioDeviceObject) return;
+
+        // Begin session
+        _this4._ioDragMesh = ioDeviceObject;
+        _this4._ioDragStartX = event.clientX;
+        _this4._ioDragStartY = event.clientY;
+        _this4._ioDragMoved = false;
+        if (_this4.orbitControls) _this4.orbitControls.enabled = false;
+        _this4.callbacks.onIODeviceDrag(ioDeviceObject, 0, true);
+        var onMove = function onMove(e) {
+          var dx = e.clientX - _this4._ioDragStartX;
+          var dy = e.clientY - _this4._ioDragStartY;
+          if (Math.abs(dx) > 4 || Math.abs(dy) > 4) _this4._ioDragMoved = true;
+          // Up (−screenY) and right (+screenX) are positive
+          var signedDelta = _this4._ioDragStartY - e.clientY + (e.clientX - _this4._ioDragStartX);
+          _this4.callbacks.onIODeviceDrag(_this4._ioDragMesh, signedDelta, false);
+        };
+        var _onUp = function onUp() {
+          window.removeEventListener('pointermove', onMove);
+          window.removeEventListener('pointerup', _onUp);
+          if (_this4.orbitControls) _this4.orbitControls.enabled = true;
+          if (_this4._ioDragMoved) {
+            // Suppress the click event that will fire after this pointerup
+            _this4._suppressNextClick = true;
+          }
+          if (_this4.callbacks.onIODeviceDragEnd) {
+            _this4.callbacks.onIODeviceDragEnd(_this4._ioDragMesh);
+          }
+          _this4._ioDragMesh = null;
+        };
+        window.addEventListener('pointermove', onMove);
+        window.addEventListener('pointerup', _onUp);
+      };
+      this.renderer.domElement.addEventListener('pointerdown', this.eventHandlers.pointerdown);
+
+      // Click handler: left-click selects the object (bounding box + transform controls).
+      // Right-click on a component shows the tooltip.
       this.eventHandlers.click = function (event) {
         var _targetObject$userDat;
+        // Suppress click that follows an IO device drag
+        if (_this4._suppressNextClick) {
+          _this4._suppressNextClick = false;
+          return;
+        }
+
         // Skip if currently transforming
         if (_this4.transformState.isTransforming) {
           return;
@@ -4159,15 +4249,15 @@ var TransformControlsManager = /*#__PURE__*/function () {
         // Check for direct io-device mesh click (before bounding box selection)
         if (_this4.callbacks.onIODeviceClick) {
           var allIntersects = raycaster.intersectObjects(_this4.scene.children, true);
-          var _iterator = _createForOfIteratorHelper(allIntersects),
-            _step;
+          var _iterator2 = _createForOfIteratorHelper(allIntersects),
+            _step2;
           try {
-            for (_iterator.s(); !(_step = _iterator.n()).done;) {
-              var hit = _step.value;
+            for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+              var hit = _step2.value;
               var obj = hit.object;
               while (obj) {
-                var _obj$userData;
-                if (((_obj$userData = obj.userData) === null || _obj$userData === void 0 ? void 0 : _obj$userData.objectType) === 'io-device') {
+                var _obj$userData2;
+                if (((_obj$userData2 = obj.userData) === null || _obj$userData2 === void 0 ? void 0 : _obj$userData2.objectType) === 'io-device') {
                   _this4.callbacks.onIODeviceClick(obj);
                   return;
                 }
@@ -4175,9 +4265,9 @@ var TransformControlsManager = /*#__PURE__*/function () {
               }
             }
           } catch (err) {
-            _iterator.e(err);
+            _iterator2.e(err);
           } finally {
-            _iterator.f();
+            _iterator2.f();
           }
         }
 
@@ -4212,23 +4302,194 @@ var TransformControlsManager = /*#__PURE__*/function () {
           return;
         }
 
-        // Check if the clicked object is already selected
-        var isAlreadySelected = _this4.selectedObjects.length === 1 && _this4.selectedObjects[0] === targetObject;
-        if (isAlreadySelected) {
-          // Second click on already-selected object: Full selection including tooltips
-          _this4.selectObject(targetObject);
-        } else {
-          // First click on a new object: Transform controls and bounding box only
-          // Always deselect first (this clears tooltips via the callback)
+        // Left-click: select for transform only (bounding box, no tooltip)
+        if (!_this4.selectedObjects.includes(targetObject)) {
           _this4.deselectObject();
-
-          // Then select the new object if there is one (this shows transform controls and bounding box)
-          if (targetObject) {
-            _this4.selectObjectForTransformOnly(targetObject);
-          }
         }
+        _this4.selectObjectForTransformOnly(targetObject);
       };
       this.renderer.domElement.addEventListener('click', this.eventHandlers.click);
+
+      // Right-click handler: show tooltip for the clicked component.
+      this.eventHandlers.contextmenu = function (event) {
+        var _targetObject$userDat2;
+        event.preventDefault();
+        if (_this4.transformState.isTransforming) return;
+        _this4._calculateMousePosition(event, mouse);
+        raycaster.setFromCamera(mouse, _this4.camera);
+        var targetObject = _this4._findTargetObject(raycaster, objectFilter);
+        if (!targetObject) return;
+        var objectType = (_targetObject$userDat2 = targetObject.userData) === null || _targetObject$userDat2 === void 0 ? void 0 : _targetObject$userDat2.objectType;
+        if (objectType !== 'component' && objectType !== 'gateway' && objectType !== 'segment') return;
+
+        // Ensure the object is selected, then show the full tooltip.
+        if (!_this4.selectedObjects.includes(targetObject)) {
+          _this4.deselectObject();
+          _this4.selectObjectForTransformOnly(targetObject);
+        }
+        _this4.selectObject(targetObject);
+      };
+      this.renderer.domElement.addEventListener('contextmenu', this.eventHandlers.contextmenu);
+
+      // Double-click handler: switch to orthographic camera fixed to the clicked face.
+      // Press Escape to restore the perspective camera.
+      this.eventHandlers.dblclick = function (event) {
+        if (_this4.transformState.isTransforming) return;
+        var sv = _this4.sceneViewer;
+        if (!sv) return;
+        _this4._calculateMousePosition(event, mouse);
+        raycaster.setFromCamera(_this4.camera, _this4.camera); // ensure raycaster uses current camera
+        raycaster.setFromCamera(mouse, _this4.camera);
+
+        // Raycast directly against scene meshes to obtain the face normal
+        var allHits = raycaster.intersectObjects(_this4.scene.children, true).filter(function (h) {
+          var _h$object$userData, _h$object$userData2;
+          return !((_h$object$userData = h.object.userData) !== null && _h$object$userData !== void 0 && _h$object$userData.isTransformControls) && !((_h$object$userData2 = h.object.userData) !== null && _h$object$userData2 !== void 0 && _h$object$userData2.isBoundingBox);
+        });
+        if (!allHits.length || !allHits[0].face) return;
+        var hit = allHits[0];
+
+        // Walk up to find the component root
+        var componentObj = hit.object;
+        while (componentObj) {
+          var _componentObj$userDat;
+          if (((_componentObj$userDat = componentObj.userData) === null || _componentObj$userDat === void 0 ? void 0 : _componentObj$userDat.objectType) === 'component') break;
+          componentObj = componentObj.parent;
+        }
+        if (!componentObj) return;
+
+        // Transform face normal from local object space to world space
+        var normalMatrix = new THREE__namespace.Matrix3().getNormalMatrix(hit.object.matrixWorld);
+        var worldNormal = hit.face.normal.clone().applyMatrix3(normalMatrix).normalize();
+
+        // Snap to the closest cardinal axis (Z-up: ±X, ±Y, ±Z)
+        var cardinals = [new THREE__namespace.Vector3(1, 0, 0), new THREE__namespace.Vector3(-1, 0, 0), new THREE__namespace.Vector3(0, 1, 0), new THREE__namespace.Vector3(0, -1, 0), new THREE__namespace.Vector3(0, 0, 1), new THREE__namespace.Vector3(0, 0, -1)];
+        var faceDir = cardinals.reduce(function (best, c) {
+          return c.dot(worldNormal) > best.dot(worldNormal) ? c : best;
+        });
+
+        // Bounding box of the component
+        var bbox = new THREE__namespace.Box3().setFromObject(componentObj);
+        var center = bbox.getCenter(new THREE__namespace.Vector3());
+        var size = bbox.getSize(new THREE__namespace.Vector3());
+
+        // Ortho half-extents: axes perpendicular to the face direction
+        var isXFace = Math.abs(faceDir.x) > 0.5;
+        var isYFace = Math.abs(faceDir.y) > 0.5;
+        var halfW, halfH;
+        if (isXFace) {
+          halfW = size.y / 2;
+          halfH = size.z / 2;
+        } else if (isYFace) {
+          halfW = size.x / 2;
+          halfH = size.z / 2;
+        } else {
+          halfW = size.x / 2;
+          halfH = size.y / 2;
+        }
+        var padding = 1.6;
+        var domEl = sv.renderer.domElement;
+        var aspect = domEl.clientWidth / (domEl.clientHeight || 1);
+
+        // Frustum must satisfy both:
+        //   frustumHalfW >= halfW * padding   (object fits horizontally)
+        //   frustumHalfH >= halfH * padding   (object fits vertically)
+        //   frustumHalfW / frustumHalfH == aspect  (no squishing)
+        var minHalfH = halfH * padding;
+        var minHalfW = halfW * padding;
+        var frustumHalfH = Math.max(minHalfH, minHalfW / aspect);
+        var frustumHalfW = frustumHalfH * aspect;
+        var isZFace = Math.abs(faceDir.z) > 0.5;
+        var upVec = isZFace ? new THREE__namespace.Vector3(0, 1, 0) : new THREE__namespace.Vector3(0, 0, 1);
+
+        // Store the perspective camera snapshot on first entry
+        if (!sv._perspCameraSnapshot) {
+          var _sv$controls$target$c, _sv$controls, _sv$controls2, _sv$controls3, _sv$controls4;
+          sv._perspCameraSnapshot = {
+            camera: sv.camera,
+            controlsTarget: (_sv$controls$target$c = (_sv$controls = sv.controls) === null || _sv$controls === void 0 || (_sv$controls = _sv$controls.target) === null || _sv$controls === void 0 ? void 0 : _sv$controls.clone()) !== null && _sv$controls$target$c !== void 0 ? _sv$controls$target$c : new THREE__namespace.Vector3(),
+            controlsMinDist: (_sv$controls2 = sv.controls) === null || _sv$controls2 === void 0 ? void 0 : _sv$controls2.minDistance,
+            controlsMaxDist: (_sv$controls3 = sv.controls) === null || _sv$controls3 === void 0 ? void 0 : _sv$controls3.maxDistance,
+            controlsMaxPolar: (_sv$controls4 = sv.controls) === null || _sv$controls4 === void 0 ? void 0 : _sv$controls4.maxPolarAngle
+          };
+        }
+
+        // Build the orthographic camera
+        var ortho = new THREE__namespace.OrthographicCamera(-frustumHalfW, frustumHalfW, frustumHalfH, -frustumHalfH, 0.01, 1000);
+        ortho.up.copy(upVec);
+        var dist = Math.max(size.x, size.y, size.z) * 3;
+        ortho.position.copy(center).addScaledVector(faceDir, dist);
+        ortho.lookAt(center);
+        // Store half-extents for resize updates (pre-aspect values so resize can recompute)
+        ortho.userData._orthoHalfExtents = {
+          halfW: halfW * padding,
+          halfH: halfH * padding
+        };
+        ortho.updateProjectionMatrix();
+        sv.camera = ortho;
+        _this4.camera = ortho;
+        if (sv.controls) {
+          sv.controls.object = ortho;
+          sv.controls.target.copy(center);
+          sv.controls.minDistance = 0.1;
+          sv.controls.maxDistance = 500;
+          sv.controls.maxPolarAngle = Math.PI;
+          sv.controls.update();
+
+          // Exit ortho mode when the camera actually moves (orbit/pan/zoom).
+          // Using 'change' instead of 'start' so a simple click (e.g. io-device
+          // toggle) never triggers the exit — only real camera movement does.
+          // Skip the first 'change' that fires from controls.update() below.
+          var _skipChanges = 1;
+          var _onOrbitChange = function onOrbitChange() {
+            if (_skipChanges-- > 0) return;
+            sv.controls.removeEventListener('change', _onOrbitChange);
+            _this4._orthoOrbitStartListener = null;
+            _this4._restorePerspectiveCamera();
+          };
+          sv.controls.addEventListener('change', _onOrbitChange);
+          _this4._orthoOrbitStartListener = {
+            controls: sv.controls,
+            fn: _onOrbitChange
+          };
+        }
+        console.log('📐 Switched to orthographic face view:', faceDir);
+      };
+      this.renderer.domElement.addEventListener('dblclick', this.eventHandlers.dblclick);
+    }
+
+    /**
+     * Restore the perspective camera after an orthographic face view.
+     * Safe to call when not in ortho mode (no-op).
+     * @private
+     */
+  }, {
+    key: "_restorePerspectiveCamera",
+    value: function _restorePerspectiveCamera() {
+      var sv = this.sceneViewer;
+      if (!(sv !== null && sv !== void 0 && sv._perspCameraSnapshot)) return;
+
+      // Clean up any pending orbit-change listener
+      if (this._orthoOrbitStartListener) {
+        var _this$_orthoOrbitStar = this._orthoOrbitStartListener,
+          controls = _this$_orthoOrbitStar.controls,
+          fn = _this$_orthoOrbitStar.fn;
+        controls.removeEventListener('change', fn);
+        this._orthoOrbitStartListener = null;
+      }
+      var snap = sv._perspCameraSnapshot;
+      sv.camera = snap.camera;
+      this.camera = snap.camera;
+      if (sv.controls) {
+        sv.controls.object = snap.camera;
+        sv.controls.target.copy(snap.controlsTarget);
+        if (snap.controlsMinDist != null) sv.controls.minDistance = snap.controlsMinDist;
+        if (snap.controlsMaxDist != null) sv.controls.maxDistance = snap.controlsMaxDist;
+        if (snap.controlsMaxPolar != null) sv.controls.maxPolarAngle = snap.controlsMaxPolar;
+        sv.controls.update();
+      }
+      sv._perspCameraSnapshot = null;
+      console.log('📐 Restored perspective camera from ortho face view');
     }
 
     /**
@@ -4378,11 +4639,11 @@ var TransformControlsManager = /*#__PURE__*/function () {
       var isNewSegmentHorizontal = this._isSegmentHorizontal(segment);
 
       // Check if all existing segments have the same orientation
-      var _iterator2 = _createForOfIteratorHelper(existingSegments),
-        _step2;
+      var _iterator3 = _createForOfIteratorHelper(existingSegments),
+        _step3;
       try {
-        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-          var existingSegment = _step2.value;
+        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+          var existingSegment = _step3.value;
           var isExistingHorizontal = this._isSegmentHorizontal(existingSegment);
 
           // Disallow mixing horizontal and vertical
@@ -4391,9 +4652,9 @@ var TransformControlsManager = /*#__PURE__*/function () {
           }
         }
       } catch (err) {
-        _iterator2.e(err);
+        _iterator3.e(err);
       } finally {
-        _iterator2.f();
+        _iterator3.f();
       }
       return true;
     }
@@ -4845,12 +5106,12 @@ var TransformControlsManager = /*#__PURE__*/function () {
     value: function _applyDeltaToBoundingBoxHelpers() {
       if (!this._dragStartGroupPosition || this.boundingBoxHelpers.length === 0) return;
       var delta = this.multiSelectionGroup.position.clone().sub(this._dragStartGroupPosition);
-      var _iterator3 = _createForOfIteratorHelper(this.boundingBoxHelpers),
-        _step3;
+      var _iterator4 = _createForOfIteratorHelper(this.boundingBoxHelpers),
+        _step4;
       try {
-        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+        for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
           var _helper$geometry2;
-          var helper = _step3.value;
+          var helper = _step4.value;
           var startPositions = helper.userData._dragStartPositions;
           var posAttr = (_helper$geometry2 = helper.geometry) === null || _helper$geometry2 === void 0 || (_helper$geometry2 = _helper$geometry2.attributes) === null || _helper$geometry2 === void 0 ? void 0 : _helper$geometry2.position;
           if (!startPositions || !posAttr) continue;
@@ -4864,9 +5125,9 @@ var TransformControlsManager = /*#__PURE__*/function () {
           posAttr.needsUpdate = true;
         }
       } catch (err) {
-        _iterator3.e(err);
+        _iterator4.e(err);
       } finally {
-        _iterator3.f();
+        _iterator4.f();
       }
     }
 
@@ -5244,11 +5505,11 @@ var TransformControlsManager = /*#__PURE__*/function () {
       var objectFilter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
       var objectsWithBounds = this.getSelectableObjectsWithBounds(objectFilter);
       var intersections = [];
-      var _iterator4 = _createForOfIteratorHelper(objectsWithBounds),
-        _step4;
+      var _iterator5 = _createForOfIteratorHelper(objectsWithBounds),
+        _step5;
       try {
-        for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
-          var item = _step4.value;
+        for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
+          var item = _step5.value;
           var object = item.object,
             boundingBox = item.boundingBox;
 
@@ -5268,9 +5529,9 @@ var TransformControlsManager = /*#__PURE__*/function () {
 
         // Sort by distance (closest first)
       } catch (err) {
-        _iterator4.e(err);
+        _iterator5.e(err);
       } finally {
-        _iterator4.f();
+        _iterator5.f();
       }
       intersections.sort(function (a, b) {
         return a.distance - b.distance;
@@ -5656,8 +5917,8 @@ var TransformControlsManager = /*#__PURE__*/function () {
     key: "_updateSegmentReference",
     value: function _updateSegmentReference(oldSegment, newSegment, index) {
       var selectedIndex = this.selectedObjects.findIndex(function (obj) {
-        var _obj$userData2;
-        return obj.uuid === oldSegment.uuid || ((_obj$userData2 = obj.userData) === null || _obj$userData2 === void 0 ? void 0 : _obj$userData2.originalUuid) === oldSegment.uuid;
+        var _obj$userData3;
+        return obj.uuid === oldSegment.uuid || ((_obj$userData3 = obj.userData) === null || _obj$userData3 === void 0 ? void 0 : _obj$userData3.originalUuid) === oldSegment.uuid;
       });
       if (selectedIndex !== -1 && newSegment) {
         // Clear bounding box cache
@@ -6044,9 +6305,21 @@ var TransformControlsManager = /*#__PURE__*/function () {
       if (this.eventHandlers.keydown) {
         window.removeEventListener('keydown', this.eventHandlers.keydown);
       }
+      if (this.eventHandlers.pointerdown) {
+        this.renderer.domElement.removeEventListener('pointerdown', this.eventHandlers.pointerdown);
+      }
       if (this.eventHandlers.click) {
         this.renderer.domElement.removeEventListener('click', this.eventHandlers.click);
       }
+      if (this.eventHandlers.contextmenu) {
+        this.renderer.domElement.removeEventListener('contextmenu', this.eventHandlers.contextmenu);
+      }
+      if (this.eventHandlers.dblclick) {
+        this.renderer.domElement.removeEventListener('dblclick', this.eventHandlers.dblclick);
+      }
+
+      // Restore perspective camera if disposed while in ortho face view
+      this._restorePerspectiveCamera();
 
       // Remove sceneViewer event listener
       if (this._objectTransformedListener && this.sceneViewer && typeof this.sceneViewer.off === 'function') {
@@ -11555,40 +11828,14 @@ var SceneExportManager = /*#__PURE__*/function () {
         }
       });
 
-      // Helper function to extract behaviors from current scene data
-      var extractBehaviors = function extractBehaviors() {
-        var _this$sceneViewer, _this$sceneViewer2;
-        // Only export behaviors that are NOT re-derivable from a component's
-        // defaultBehaviors[].  All component/device default behaviors are
-        // reconstructed at load time by Step B of _processBehaviors() using the
-        // component dictionary, so writing compact behaviorRef entries for them
-        // would be redundant.  The scene JSON behaviors[] array is reserved for
-        // any future scene-level overrides that cannot be derived from the asset.
-        if ((_this$sceneViewer = _this.sceneViewer) !== null && _this$sceneViewer !== void 0 && (_this$sceneViewer = _this$sceneViewer.managers) !== null && _this$sceneViewer !== void 0 && _this$sceneViewer.behaviorManager) {
-          return _this.sceneViewer.managers.behaviorManager.getBehaviors().filter(function (b) {
-            return !b._isDefaultBehavior;
-          });
-        }
-        // Fallback when BehaviorManager is not available: exclude any entry that
-        // was already a behaviorRef (it was derivable from the component asset)
-        // and exclude the legacy _isDefaultBehavior marker if present.
-        return (((_this$sceneViewer2 = _this.sceneViewer) === null || _this$sceneViewer2 === void 0 || (_this$sceneViewer2 = _this$sceneViewer2.currentSceneData) === null || _this$sceneViewer2 === void 0 ? void 0 : _this$sceneViewer2.behaviors) || []).filter(function (b) {
-          return !b.behaviorRef && !b._isDefaultBehavior;
-        });
-      };
-
       // Build the complete export data structure (matching central-plant-input.json format)
-      var behaviors = extractBehaviors();
-      var exportData = _objectSpread2(_objectSpread2({
+      var exportData = {
         version: '2.3',
-        connections: extractConnections()
-      }, behaviors.length > 0 ? {
-        behaviors: behaviors
-      } : {}), {}, {
+        connections: extractConnections(),
         scene: {
           children: sceneChildren
         }
-      });
+      };
       console.log('✅ Scene export completed:', exportData);
       console.log("\uD83D\uDCCA Exported ".concat(sceneChildren.length, " components and ").concat(exportData.connections.length, " connections"));
       return exportData;
@@ -29545,407 +29792,6 @@ var PathFlowManager = /*#__PURE__*/function (_BaseDisposable) {
   }]);
 }(BaseDisposable);
 
-var BehaviorManager = /*#__PURE__*/function (_BaseDisposable) {
-  function BehaviorManager(sceneViewer) {
-    var _this;
-    _classCallCheck(this, BehaviorManager);
-    _this = _callSuper(this, BehaviorManager);
-    _this.sceneViewer = sceneViewer;
-
-    /** @type {Array<Object>} Raw behavior definitions from the scene JSON */
-    _this._behaviors = [];
-
-    /** @type {Map<string, THREE.Object3D>} Cache: attachmentId -> resolved Three.js object */
-    _this._resolvedOutputs = new Map();
-    return _this;
-  }
-
-  // ─────────────────────────────────────────────────────────────────────────
-  // PUBLIC API
-  // ─────────────────────────────────────────────────────────────────────────
-
-  /**
-   * Load and store behavior definitions, then resolve output objects.
-   * Should be called AFTER GLB models have been loaded so all meshes exist.
-   * @param {Array<Object>} behaviorsArray - Array of behavior definition objects
-   */
-  _inherits(BehaviorManager, _BaseDisposable);
-  return _createClass(BehaviorManager, [{
-    key: "loadBehaviors",
-    value: function loadBehaviors(behaviorsArray) {
-      if (!Array.isArray(behaviorsArray)) {
-        console.warn('⚠️ BehaviorManager.loadBehaviors(): expected an array, got', _typeof(behaviorsArray));
-        return;
-      }
-      this._behaviors = behaviorsArray;
-      this._resolvedOutputs.clear();
-      this._resolveOutputObjects();
-      console.log("\u2705 BehaviorManager: loaded ".concat(this._behaviors.length, " behavior(s)"));
-    }
-
-    /**
-     * Returns all stored behavior definitions.
-     * @returns {Array<Object>}
-     */
-  }, {
-    key: "getBehaviors",
-    value: function getBehaviors() {
-      return _toConsumableArray(this._behaviors);
-    }
-
-    /**
-     * Add a single behavior definition at runtime and resolve its output object.
-     * @param {Object} behaviorDef
-     */
-  }, {
-    key: "addBehavior",
-    value: function addBehavior(behaviorDef) {
-      if (!behaviorDef || !behaviorDef.id) {
-        console.warn('⚠️ BehaviorManager.addBehavior(): missing id', behaviorDef);
-        return false;
-      }
-      if (this._behaviors.find(function (b) {
-        return b.id === behaviorDef.id;
-      })) {
-        console.warn("\u26A0\uFE0F BehaviorManager.addBehavior(): id \"".concat(behaviorDef.id, "\" already exists"));
-        return false;
-      }
-      this._behaviors.push(behaviorDef);
-      this._resolveOutputForBehavior(behaviorDef);
-      console.log("\u2705 BehaviorManager: added behavior \"".concat(behaviorDef.id, "\""));
-      return true;
-    }
-
-    /**
-     * Remove a behavior definition by id.
-     * @param {string} behaviorId
-     * @returns {boolean}
-     */
-  }, {
-    key: "removeBehavior",
-    value: function removeBehavior(behaviorId) {
-      var idx = this._behaviors.findIndex(function (b) {
-        return b.id === behaviorId;
-      });
-      if (idx === -1) {
-        console.warn("\u26A0\uFE0F BehaviorManager.removeBehavior(): id \"".concat(behaviorId, "\" not found"));
-        return false;
-      }
-      this._behaviors.splice(idx, 1);
-      // We keep the resolved cache entry — it is harmless if no behaviors reference it
-      console.log("\u2705 BehaviorManager: removed behavior \"".concat(behaviorId, "\""));
-      return true;
-    }
-
-    /**
-     * Simulate an IO device state value arriving and evaluate all matching behaviors.
-     * Any behavior whose input.attachment + input.state matches will have its
-     * conditions tested and actions applied.
-     *
-     * @param {string} attachmentId - The attachment ID of the input io-device
-     * @param {string} stateId      - The state ID on that device
-     * @param {*}      value        - Current value of the state
-     * @param {string} [parentUuid] - UUID of the parent component instance (used to
-     *                                disambiguate clones that share the same attachmentId)
-     */
-  }, {
-    key: "triggerState",
-    value: function triggerState(attachmentId, stateId, value, parentUuid) {
-      var _this2 = this;
-      var matching = this._behaviors.filter(function (b) {
-        var _b$input, _b$input2, _b$input3;
-        if (((_b$input = b.input) === null || _b$input === void 0 ? void 0 : _b$input.attachment) !== attachmentId) return false;
-        if (((_b$input2 = b.input) === null || _b$input2 === void 0 ? void 0 : _b$input2.state) !== stateId) return false;
-        // If both the behavior and the caller carry a component UUID, they must match.
-        // If either side has no component context, fall back to attachment-only matching.
-        if ((_b$input3 = b.input) !== null && _b$input3 !== void 0 && _b$input3.component && parentUuid && b.input.component !== parentUuid) return false;
-        return true;
-      });
-      if (matching.length === 0) {
-        console.log("\u2139\uFE0F BehaviorManager.triggerState(): no behaviors for \"".concat(attachmentId, "/").concat(stateId, "\""));
-        return;
-      }
-      matching.forEach(function (behavior) {
-        _this2._evaluateBehavior(behavior, value);
-      });
-    }
-
-    // ─────────────────────────────────────────────────────────────────────────
-    // PRIVATE HELPERS
-    // ─────────────────────────────────────────────────────────────────────────
-
-    /**
-     * Walk all behaviors and resolve each output object once.
-     */
-  }, {
-    key: "_resolveOutputObjects",
-    value: function _resolveOutputObjects() {
-      var _this3 = this;
-      this._behaviors.forEach(function (b) {
-        return _this3._resolveOutputForBehavior(b);
-      });
-    }
-
-    /**
-     * Resolve a single behavior's output object and cache it by behavior id.
-     * Looks for an object in the scene whose userData.attachmentId matches
-     * behavior.output.attachment.  If behavior.output.child is also set, it
-     * then searches within that object for a descendant whose name matches.
-     *
-     * @param {Object} behavior
-     */
-  }, {
-    key: "_resolveOutputForBehavior",
-    value: function _resolveOutputForBehavior(behavior) {
-      var _this$sceneViewer, _behavior$output, _behavior$output2, _behavior$output3;
-      var cacheKey = this._outputCacheKey(behavior);
-      if (this._resolvedOutputs.has(cacheKey)) return; // already resolved
-
-      var scene = (_this$sceneViewer = this.sceneViewer) === null || _this$sceneViewer === void 0 ? void 0 : _this$sceneViewer.scene;
-      if (!scene) {
-        console.warn('⚠️ BehaviorManager: scene not available for output resolution');
-        return;
-      }
-      var attachmentId = (_behavior$output = behavior.output) === null || _behavior$output === void 0 ? void 0 : _behavior$output.attachment;
-      var childName = (_behavior$output2 = behavior.output) === null || _behavior$output2 === void 0 ? void 0 : _behavior$output2.child;
-      var componentUuid = (_behavior$output3 = behavior.output) === null || _behavior$output3 === void 0 ? void 0 : _behavior$output3.component;
-      if (!attachmentId) {
-        console.warn("\u26A0\uFE0F BehaviorManager: behavior \"".concat(behavior.id, "\" has no output.attachment"));
-        return;
-      }
-
-      // Find the attachment root in the scene, scoped to the correct component
-      // instance when a componentUuid is specified (prevents cross-clone bleed).
-      var attachmentRoot = null;
-      scene.traverse(function (obj) {
-        var _obj$userData, _obj$parent;
-        if (attachmentRoot) return;
-        if (((_obj$userData = obj.userData) === null || _obj$userData === void 0 ? void 0 : _obj$userData.attachmentId) !== attachmentId) return;
-        // If a component UUID is specified, the io-device's parent must match it
-        if (componentUuid && ((_obj$parent = obj.parent) === null || _obj$parent === void 0 ? void 0 : _obj$parent.uuid) !== componentUuid) return;
-        attachmentRoot = obj;
-      });
-      if (!attachmentRoot) {
-        console.warn("\u26A0\uFE0F BehaviorManager: could not find attachment \"".concat(attachmentId, "\" in scene"));
-        return;
-      }
-      var targetObject = attachmentRoot;
-
-      // If a specific child mesh name is specified, drill into it
-      if (childName) {
-        var foundChild = null;
-        attachmentRoot.traverse(function (obj) {
-          if (!foundChild && obj.name === childName) {
-            foundChild = obj;
-          }
-        });
-        if (!foundChild) {
-          console.warn("\u26A0\uFE0F BehaviorManager: child \"".concat(childName, "\" not found under attachment \"").concat(attachmentId, "\""));
-          return;
-        }
-        targetObject = foundChild;
-      } else {
-        // No child specified: if the root has no material (e.g. it's a Group),
-        // fall through to the first Mesh descendant so that material property
-        // actions (e.g. material.emissiveIntensity) work without needing an
-        // explicit child selection.
-        if (!attachmentRoot.isMesh) {
-          var firstMesh = null;
-          attachmentRoot.traverse(function (obj) {
-            if (!firstMesh && obj.isMesh) firstMesh = obj;
-          });
-          if (firstMesh) {
-            targetObject = firstMesh;
-            console.log("\uD83D\uDD17 BehaviorManager: no child specified \u2014 auto-resolved to first mesh \"".concat(firstMesh.name || firstMesh.uuid, "\" under \"").concat(attachmentId, "\""));
-          }
-        }
-      }
-      this._resolvedOutputs.set(cacheKey, targetObject);
-      console.log("\uD83D\uDD17 BehaviorManager: resolved output for \"".concat(behavior.id, "\" \u2192 ").concat(targetObject.name || targetObject.uuid));
-    }
-
-    /**
-     * Build a stable cache key for a behavior's output.
-     * @param {Object} behavior
-     * @returns {string}
-     */
-  }, {
-    key: "_outputCacheKey",
-    value: function _outputCacheKey(behavior) {
-      var _behavior$output4, _behavior$output5;
-      return "".concat(behavior.id, "::").concat((_behavior$output4 = behavior.output) === null || _behavior$output4 === void 0 ? void 0 : _behavior$output4.attachment, "::").concat(((_behavior$output5 = behavior.output) === null || _behavior$output5 === void 0 ? void 0 : _behavior$output5.child) || '');
-    }
-
-    /**
-     * Evaluate a behavior's conditions against the current data-point value
-     * and apply matching actions.
-     *
-     * @param {Object} behavior
-     * @param {*} value - Current data-point value
-     */
-  }, {
-    key: "_evaluateBehavior",
-    value: function _evaluateBehavior(behavior, value) {
-      var _this4 = this;
-      if (!Array.isArray(behavior.conditions) || behavior.conditions.length === 0) return;
-      var cacheKey = this._outputCacheKey(behavior);
-      var targetObject = this._resolvedOutputs.get(cacheKey);
-      if (!targetObject) {
-        // Attempt late resolution (model may have loaded after behavior was added)
-        this._resolveOutputForBehavior(behavior);
-        var resolved = this._resolvedOutputs.get(cacheKey);
-        if (!resolved) {
-          console.warn("\u26A0\uFE0F BehaviorManager: no resolved output for behavior \"".concat(behavior.id, "\" \u2014 skipping"));
-          return;
-        }
-      }
-      var output = this._resolvedOutputs.get(cacheKey);
-      behavior.conditions.forEach(function (condition) {
-        if (_this4._testCondition(condition.when, value)) {
-          if (Array.isArray(condition.actions)) {
-            condition.actions.forEach(function (action) {
-              _this4._applyAction(output, action.set, action.value, action.relative === true);
-            });
-          }
-        }
-      });
-    }
-
-    /**
-     * Safely test a condition expression against a value.
-     * Supports a fixed set of patterns — no arbitrary eval().
-     *
-     * Supported patterns:
-     *   "state.value === true"   → value === true
-     *   "state.value === false"  → value === false
-     *   "state.value === <num>"  → value === num
-     *   "state.value > <num>"    → value > num
-     *   "state.value < <num>"    → value < num
-     *   "state.value >= <num>"   → value >= num
-     *   "state.value <= <num>"   → value <= num
-     *
-     * @param {string} whenExpr
-     * @param {*} value
-     * @returns {boolean}
-     */
-  }, {
-    key: "_testCondition",
-    value: function _testCondition(whenExpr, value) {
-      if (typeof whenExpr !== 'string') return false;
-      var expr = whenExpr.trim();
-
-      // Strip the "state.value " prefix if present (also accept legacy "dataPoint.value" prefix)
-      var stripped = expr.replace(/^(state|dataPoint)\.value\s*/, '');
-
-      // Parse operator and RHS
-      var match = stripped.match(/^(===|!==|>=|<=|>|<)\s*(.+)$/);
-      if (!match) {
-        console.warn("\u26A0\uFE0F BehaviorManager: unrecognised condition expression: \"".concat(whenExpr, "\""));
-        return false;
-      }
-      var operator = match[1];
-      var rawRhs = match[2].trim();
-
-      // Parse RHS to the appropriate JS type
-      var rhs;
-      if (rawRhs === 'true') rhs = true;else if (rawRhs === 'false') rhs = false;else if (rawRhs === 'null') rhs = null;else if (!isNaN(rawRhs)) rhs = parseFloat(rawRhs);else rhs = rawRhs; // treat as string
-
-      switch (operator) {
-        case '===':
-          // Treat 0/1 as false/true when the RHS is a boolean (binary toggle)
-          if (typeof rhs === 'boolean') return Boolean(value) === rhs;
-          return value === rhs;
-        case '!==':
-          if (typeof rhs === 'boolean') return Boolean(value) !== rhs;
-          return value !== rhs;
-        case '>':
-          return value > rhs;
-        case '<':
-          return value < rhs;
-        case '>=':
-          return value >= rhs;
-        case '<=':
-          return value <= rhs;
-        default:
-          return false;
-      }
-    }
-
-    /**
-     * Apply a single action to a Three.js object by navigating a dot-notation path.
-     * Example: set = "material.emissiveIntensity", value = 1.0
-     *
-     * @param {THREE.Object3D} object
-     * @param {string} propertyPath - Dot-notation path relative to the object
-     * @param {*} value
-     */
-  }, {
-    key: "_applyAction",
-    value: function _applyAction(object, propertyPath, value) {
-      var relative = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
-      if (!object || typeof propertyPath !== 'string') return;
-      var parts = propertyPath.split('.');
-
-      // Clone shared material onto this mesh before mutating any material property.
-      // Three.js reuses the same Material instance across all meshes loaded from the
-      // same GLB, so without cloning a color/emissive change would bleed to every
-      // other component instance that shares the model.
-      if (parts[0] === 'material' && object.isMesh && object.material && !object.userData._behaviorMaterialCloned) {
-        object.material = object.material.clone();
-        object.userData._behaviorMaterialCloned = true;
-      }
-      var target = object;
-      for (var i = 0; i < parts.length - 1; i++) {
-        if (target == null) {
-          console.warn("\u26A0\uFE0F BehaviorManager._applyAction(): path \"".concat(propertyPath, "\" broken at \"").concat(parts[i], "\""));
-          return;
-        }
-        target = target[parts[i]];
-      }
-      var lastKey = parts[parts.length - 1];
-      if (target == null || !(lastKey in target)) {
-        console.warn("\u26A0\uFE0F BehaviorManager._applyAction(): property \"".concat(propertyPath, "\" not found on"), object);
-        return;
-      }
-
-      // If relative, capture the mesh's original value on first execution and offset from it.
-      if (relative) {
-        var baselineKey = "_baseline_".concat(propertyPath.replace(/\./g, '_'));
-        if (!(baselineKey in object.userData)) {
-          object.userData[baselineKey] = target[lastKey];
-        }
-        value = object.userData[baselineKey] + parseFloat(value);
-      }
-
-      // THREE.Color objects must be mutated via .set() rather than replaced
-      var existing = target[lastKey];
-      if (existing && existing.isColor && typeof value === 'string') {
-        existing.set(value);
-      } else {
-        // Coerce numeric strings to numbers for non-color properties
-        target[lastKey] = typeof value === 'string' && value !== '' && !isNaN(value) ? parseFloat(value) : value;
-      }
-      console.log("\u2705 BehaviorManager: applied \"".concat(propertyPath, "\" = ").concat(value, " on \"").concat(object.name || object.uuid, "\""));
-
-      // If we touched a material property, mark it needs update
-      if (parts[0] === 'material' && target.needsUpdate !== undefined) {
-        target.needsUpdate = true;
-      }
-    }
-
-    // ─────────────────────────────────────────────────────────────────────────
-    // DISPOSAL
-    // ─────────────────────────────────────────────────────────────────────────
-  }, {
-    key: "dispose",
-    value: function dispose() {
-      this._behaviors = [];
-      this._resolvedOutputs.clear();
-      _superPropGet(BehaviorManager, "dispose", this, 3)([]);
-    }
-  }]);
-}(BaseDisposable);
-
 /**
  * IO Device Utilities
  * Shared utility functions for attaching IO devices to smart components.
@@ -31463,7 +31309,7 @@ var ModelManager = /*#__PURE__*/function () {
     key: "loadLibraryModel",
     value: function () {
       var _loadLibraryModel = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(targetMesh, jsonEntry, componentData) {
-        var component, _jsonEntry$userData, _jsonEntry$userData2, _jsonEntry$userData3, originalProps, connectorChildren, gltfScene, libraryModel, _this$sceneViewer, ioAnimMgr, _loop, _i, _Object$entries, _jsonEntry$userData4, _t;
+        var component, _jsonEntry$userData, _jsonEntry$userData2, _jsonEntry$userData3, originalProps, connectorChildren, gltfScene, libraryModel, _this$sceneViewer, ioAnimMgr, _loop, _i, _Object$entries, warmFn, _jsonEntry$userData4, _t;
         return _regenerator().w(function (_context2) {
           while (1) switch (_context2.n) {
             case 0:
@@ -31560,6 +31406,20 @@ var ModelManager = /*#__PURE__*/function () {
             case 8:
               // Replace mesh in scene
               this._replaceMeshInScene(targetMesh, libraryModel, originalProps.parent, component);
+
+              // Pre-warm the filtered bounding-box cache for smart components so the
+              // first selection is instant.  Deferred to idle time so it does not
+              // block the current frame.
+              if (componentData.isSmart) {
+                warmFn = function warmFn() {
+                  return computeFilteredBoundingBoxCached(libraryModel, ['io-device', 'connector']);
+                };
+                if (typeof requestIdleCallback !== 'undefined') {
+                  requestIdleCallback(warmFn);
+                } else {
+                  setTimeout(warmFn, 0);
+                }
+              }
               console.log("\uD83C\uDF89 ".concat((_jsonEntry$userData3 = jsonEntry.userData) === null || _jsonEntry$userData3 === void 0 ? void 0 : _jsonEntry$userData3.libraryId, " GLB model successfully rendered in scene"));
               return _context2.a(2, libraryModel);
             case 9:
@@ -33478,13 +33338,8 @@ var SceneOperationsManager = /*#__PURE__*/function () {
               phaseStart = performance.now();
               this._finalizeScene(data, crosscubeTextureSet, isImported);
               timers.phase5_finalize = performance.now() - phaseStart;
-
-              // Phase 6: Load behaviors (after GLB models are present so output objects can be resolved)
-              phaseStart = performance.now();
-              this._processBehaviors(data);
-              timers.phase6_behaviors = performance.now() - phaseStart;
               totalTime = performance.now() - totalStart;
-              console.log("\u23F1\uFE0F Scene Loading Performance:\n   Phase 1 (Prepare)      : ".concat(timers.phase1_prepare.toFixed(0), "ms\n   Phase 2 (Create Objects): ").concat(timers.phase2_createObjects.toFixed(0), "ms\n   Phase 3 (GLB Models)    : ").concat(timers.phase3_glbModels.toFixed(0), "ms\n   Phase 4 (Pathfinding)   : ").concat(timers.phase4_pathfinding.toFixed(0), "ms\n   Phase 5 (Finalize)      : ").concat(timers.phase5_finalize.toFixed(0), "ms\n   Phase 6 (Behaviors)     : ").concat(timers.phase6_behaviors.toFixed(0), "ms\n   \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   Total                   : ").concat(totalTime.toFixed(0), "ms"));
+              console.log("\u23F1\uFE0F Scene Loading Performance:\n   Phase 1 (Prepare)      : ".concat(timers.phase1_prepare.toFixed(0), "ms\n   Phase 2 (Create Objects): ").concat(timers.phase2_createObjects.toFixed(0), "ms\n   Phase 3 (GLB Models)    : ").concat(timers.phase3_glbModels.toFixed(0), "ms\n   Phase 4 (Pathfinding)   : ").concat(timers.phase4_pathfinding.toFixed(0), "ms\n   Phase 5 (Finalize)      : ").concat(timers.phase5_finalize.toFixed(0), "ms\n   \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   Total                   : ").concat(totalTime.toFixed(0), "ms"));
               console.log('✅ Scene loaded successfully');
 
               // Notify UI components (e.g. SceneHierarchy) that the scene is fully loaded
@@ -33842,278 +33697,6 @@ var SceneOperationsManager = /*#__PURE__*/function () {
       }
     }
 
-    /**
-     * Process behaviors from the scene data, expand any defaultBehaviors defined
-     * on component dictionary entries, resolve behaviorRef entries against device
-     * assets, inject per-instance component UUIDs, and hand the flat resolved
-     * array to BehaviorManager.
-     *
-     * Resolution cascade:
-     *   1. Explicit behaviors in data.behaviors — passed through as-is (behaviorRef
-     *      entries are resolved against the component/device dictionaries).
-     *   2. defaultBehaviors[] on each placed smart component's dictionary entry —
-     *      expanded per instance with the instance UUID injected.  Compact
-     *      behaviorRef-derived entries are tagged _isDefaultBehavior:true (the
-     *      exporter can re-derive them); full L2 behavior objects are tagged false
-     *      so they are exported verbatim and survive round-trips.
-     *
-     * @param {Object} data - Scene JSON data
-     */
-  }, {
-    key: "_processBehaviors",
-    value: function _processBehaviors(data) {
-      var _this$sceneViewer2,
-        _this$sceneViewer$cen2,
-        _this5 = this,
-        _data$scene3;
-      var behaviorManager = (_this$sceneViewer2 = this.sceneViewer) === null || _this$sceneViewer2 === void 0 || (_this$sceneViewer2 = _this$sceneViewer2.managers) === null || _this$sceneViewer2 === void 0 ? void 0 : _this$sceneViewer2.behaviorManager;
-      if (!behaviorManager) {
-        console.warn('⚠️ _processBehaviors: BehaviorManager not available');
-        return;
-      }
-
-      // Obtain the component dictionary (extended = includes S3/smart components)
-      var componentDictionary = ((_this$sceneViewer$cen2 = this.sceneViewer.centralPlant) === null || _this$sceneViewer$cen2 === void 0 || (_this$sceneViewer$cen2 = _this$sceneViewer$cen2.managers) === null || _this$sceneViewer$cen2 === void 0 || (_this$sceneViewer$cen2 = _this$sceneViewer$cen2.componentDataManager) === null || _this$sceneViewer$cen2 === void 0 ? void 0 : _this$sceneViewer$cen2.componentDictionary) || {};
-
-      // ── Step A: Resolve any behaviorRef entries from data.behaviors ─────────
-      var explicitBehaviors = [];
-      if (Array.isArray(data === null || data === void 0 ? void 0 : data.behaviors)) {
-        data.behaviors.forEach(function (entry) {
-          if (entry.behaviorRef) {
-            var resolved = _this5._resolveBehaviorRef(entry, componentDictionary);
-            if (resolved) explicitBehaviors.push(resolved);
-          } else {
-            explicitBehaviors.push(entry);
-          }
-        });
-      }
-
-      // Build a set of explicit behavior ids for deduplication
-      var explicitIds = new Set(explicitBehaviors.map(function (b) {
-        return b.id;
-      }));
-
-      // Build a set of (component::attachment::state) tuples covered by explicit
-      // behaviors.  If an expanded default behavior would produce the SAME input
-      // tuple, the explicit behavior is treated as the intentional override and
-      // the default expansion is skipped.  This prevents a component's built-in
-      // switch→LED wiring from doubling-up when the user has deliberately authored
-      // cross-component behaviors that re-wire the same switch.
-      var explicitInputTuples = new Set(explicitBehaviors.filter(function (b) {
-        var _b$input, _b$input2, _b$input3;
-        return ((_b$input = b.input) === null || _b$input === void 0 ? void 0 : _b$input.component) && ((_b$input2 = b.input) === null || _b$input2 === void 0 ? void 0 : _b$input2.attachment) && ((_b$input3 = b.input) === null || _b$input3 === void 0 ? void 0 : _b$input3.state);
-      }).map(function (b) {
-        return "".concat(b.input.component, "::").concat(b.input.attachment, "::").concat(b.input.state);
-      }));
-
-      // Build a set of instanceUuids already covered by behaviorRef entries in
-      // data.behaviors (written by the exporter for smart component defaults).
-      // Step B skips these instances to avoid loading the same behaviors twice —
-      // once via Step A (resolved from data.behaviors refs) and once via Step B
-      // (auto-expanded from the component dictionary).
-      var coveredInstances = new Set();
-      if (Array.isArray(data === null || data === void 0 ? void 0 : data.behaviors)) {
-        data.behaviors.forEach(function (entry) {
-          if (entry.behaviorRef && entry.component) {
-            coveredInstances.add(entry.component);
-          }
-        });
-      }
-
-      // ── Step B: Walk placed components and expand their defaultBehaviors ─────
-      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$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
-          // (they have explicit behaviorRef entries in data.behaviors).
-          if (coveredInstances.has(instanceUuid)) return;
-          var compData = componentDictionary[libraryId];
-          if (!(compData !== null && compData !== void 0 && (_compData$defaultBeha = compData.defaultBehaviors) !== null && _compData$defaultBeha !== void 0 && _compData$defaultBeha.length)) return;
-          compData.defaultBehaviors.forEach(function (template) {
-            var _expanded$input, _expanded$input2, _expanded$input3;
-            var expanded = _this5._expandDefaultBehavior(template, instanceUuid, componentDictionary);
-            if (!expanded) return;
-            // Skip if an explicit scene behavior already covers this id
-            if (explicitIds.has(expanded.id)) return;
-            // Skip if an explicit scene behavior already covers the same
-            // (component, attachment, state) input tuple.  This prevents a
-            // component's built-in default wiring (e.g. switch → own LED) from
-            // double-firing when the user has authored a cross-component override
-            // that rewires the same switch to a different target.
-            if ((_expanded$input = expanded.input) !== null && _expanded$input !== void 0 && _expanded$input.component && (_expanded$input2 = expanded.input) !== null && _expanded$input2 !== void 0 && _expanded$input2.attachment && (_expanded$input3 = expanded.input) !== null && _expanded$input3 !== void 0 && _expanded$input3.state) {
-              var tuple = "".concat(expanded.input.component, "::").concat(expanded.input.attachment, "::").concat(expanded.input.state);
-              if (explicitInputTuples.has(tuple)) return;
-            }
-            // All component defaultBehaviors are re-derivable from the component
-            // asset at export time (via compact behaviorRef), so mark them all.
-            expanded._isDefaultBehavior = true;
-            instanceBehaviors.push(expanded);
-          });
-        });
-      }
-      var allBehaviors = [].concat(explicitBehaviors, instanceBehaviors);
-      if (allBehaviors.length === 0) return;
-      behaviorManager.loadBehaviors(allBehaviors);
-      console.log("\u2705 _processBehaviors: loaded ".concat(explicitBehaviors.length, " explicit + ").concat(instanceBehaviors.length, " default-expanded behavior(s)"));
-    }
-
-    /**
-     * Register the defaultBehaviors of a single newly placed component instance
-     * into the BehaviorManager.  Called from addComponent() (drag-drop), where
-     * _processBehaviors() (scene-load path) is not invoked.
-     *
-     * @param {Object} componentData - Entry from the component dictionary
-     * @param {string} instanceUuid  - UUID of the placed component (componentModel.uuid)
-     */
-  }, {
-    key: "registerBehaviorsForComponentInstance",
-    value: function registerBehaviorsForComponentInstance(componentData, instanceUuid) {
-      var _this$sceneViewer3,
-        _componentData$defaul,
-        _this$sceneViewer$cen3,
-        _this6 = this;
-      var behaviorManager = (_this$sceneViewer3 = this.sceneViewer) === null || _this$sceneViewer3 === void 0 || (_this$sceneViewer3 = _this$sceneViewer3.managers) === null || _this$sceneViewer3 === void 0 ? void 0 : _this$sceneViewer3.behaviorManager;
-      if (!behaviorManager) return;
-      if (!(componentData !== null && componentData !== void 0 && (_componentData$defaul = componentData.defaultBehaviors) !== null && _componentData$defaul !== void 0 && _componentData$defaul.length)) return;
-      var componentDictionary = ((_this$sceneViewer$cen3 = this.sceneViewer.centralPlant) === null || _this$sceneViewer$cen3 === void 0 || (_this$sceneViewer$cen3 = _this$sceneViewer$cen3.managers) === null || _this$sceneViewer$cen3 === void 0 || (_this$sceneViewer$cen3 = _this$sceneViewer$cen3.componentDataManager) === null || _this$sceneViewer$cen3 === void 0 ? void 0 : _this$sceneViewer$cen3.componentDictionary) || {};
-      var registered = 0;
-      componentData.defaultBehaviors.forEach(function (template) {
-        var expanded = _this6._expandDefaultBehavior(template, instanceUuid, componentDictionary);
-        if (!expanded) return;
-        expanded._isDefaultBehavior = true;
-        behaviorManager.addBehavior(expanded);
-        registered++;
-      });
-      if (registered > 0) {
-        console.log("\u2705 registerBehaviorsForComponentInstance: registered ".concat(registered, " behavior(s) for instance ").concat(instanceUuid));
-      }
-    }
-
-    /**
-     * Resolve a scene-level or component-level behaviorRef entry into a full
-     * behavior definition by looking up the referenced template in the device
-     * asset's defaultBehaviors[] and substituting 'self' with the real
-     * attachmentId.
-     *
-     * Ref shape: { behaviorRef, deviceId, attachment, component? }
-     *
-     * @param {Object} ref
-     * @param {Object} componentDictionary
-     * @returns {Object|null} Resolved behavior or null if not found
-     */
-  }, {
-    key: "_resolveBehaviorRef",
-    value: function _resolveBehaviorRef(ref, componentDictionary) {
-      var _resolved$input, _resolved$output;
-      if (!ref.behaviorRef) {
-        console.warn('⚠️ _resolveBehaviorRef: missing behaviorRef', ref);
-        return null;
-      }
-
-      // ── Component-level L2 ref: { behaviorRef, libraryId, component } ──────
-      // The full behavior template lives on the smart component's defaultBehaviors[].
-      // No 'self' substitution needed — attachment IDs are already real.
-      if (ref.libraryId) {
-        var compData = componentDictionary[ref.libraryId];
-        if (!compData) {
-          console.warn("\u26A0\uFE0F _resolveBehaviorRef: component \"".concat(ref.libraryId, "\" not in dictionary"));
-          return null;
-        }
-        var _template = (compData.defaultBehaviors || []).find(function (b) {
-          return b.id === ref.behaviorRef;
-        });
-        if (!_template) {
-          console.warn("\u26A0\uFE0F _resolveBehaviorRef: behavior \"".concat(ref.behaviorRef, "\" not found on component \"").concat(ref.libraryId, "\""));
-          return null;
-        }
-        var _resolved = JSON.parse(JSON.stringify(_template));
-        _resolved.id = "".concat(_resolved.id, "::").concat(ref.component);
-        if (ref.component) {
-          _resolved.input = _objectSpread2(_objectSpread2({}, _resolved.input), {}, {
-            component: ref.component
-          });
-          _resolved.output = _objectSpread2(_objectSpread2({}, _resolved.output), {}, {
-            component: ref.component
-          });
-        }
-        return _resolved;
-      }
-
-      // ── Device-level L1 ref: { behaviorRef, deviceId, attachment, component } ─
-      if (!ref.deviceId || !ref.attachment) {
-        console.warn('⚠️ _resolveBehaviorRef: incomplete ref', ref);
-        return null;
-      }
-      var deviceData = componentDictionary[ref.deviceId];
-      if (!deviceData) {
-        console.warn("\u26A0\uFE0F _resolveBehaviorRef: device \"".concat(ref.deviceId, "\" not in dictionary"));
-        return null;
-      }
-      var template = (deviceData.defaultBehaviors || []).find(function (b) {
-        return b.id === ref.behaviorRef;
-      });
-      if (!template) {
-        console.warn("\u26A0\uFE0F _resolveBehaviorRef: behavior \"".concat(ref.behaviorRef, "\" not found on device \"").concat(ref.deviceId, "\""));
-        return null;
-      }
-      // Deep clone and substitute 'self' -> real attachmentId
-      var resolved = JSON.parse(JSON.stringify(template));
-      resolved.id = "".concat(resolved.id, "::").concat(ref.attachment);
-      if (((_resolved$input = resolved.input) === null || _resolved$input === void 0 ? void 0 : _resolved$input.attachment) === 'self') resolved.input.attachment = ref.attachment;
-      if (((_resolved$output = resolved.output) === null || _resolved$output === void 0 ? void 0 : _resolved$output.attachment) === 'self') resolved.output.attachment = ref.attachment;
-      // Inject component UUID guard if the ref carries one
-      if (ref.component) {
-        resolved.input = _objectSpread2(_objectSpread2({}, resolved.input), {}, {
-          component: ref.component
-        });
-        resolved.output = _objectSpread2(_objectSpread2({}, resolved.output), {}, {
-          component: ref.component
-        });
-      }
-      return resolved;
-    }
-
-    /**
-     * Expand a single defaultBehaviors[] template entry for a specific component
-     * instance placed in the scene.
-     *
-     * If the entry is a behaviorRef, it is first resolved against the device
-     * library; otherwise it is treated as a full behavior definition.
-     * In both cases the instanceUuid is injected as input.component and
-     * output.component, and the behavior id is suffixed with ::instanceUuid.
-     *
-     * @param {Object} template - Entry from compData.defaultBehaviors[]
-     * @param {string} instanceUuid - UUID of the placed component instance
-     * @param {Object} componentDictionary
-     * @returns {Object|null}
-     */
-  }, {
-    key: "_expandDefaultBehavior",
-    value: function _expandDefaultBehavior(template, instanceUuid, componentDictionary) {
-      var base;
-      if (template.behaviorRef) {
-        // Resolve the device ref first (substitutes 'self' -> attachment)
-        base = this._resolveBehaviorRef(template, componentDictionary);
-        if (!base) return null;
-      } else {
-        base = JSON.parse(JSON.stringify(template));
-      }
-      // Suffix the id so each instance gets a unique behavior id
-      base.id = "".concat(base.id, "::").concat(instanceUuid);
-      // Inject the instance UUID as the component scope guard
-      base.input = _objectSpread2(_objectSpread2({}, base.input), {}, {
-        component: instanceUuid
-      });
-      base.output = _objectSpread2(_objectSpread2({}, base.output), {}, {
-        component: instanceUuid
-      });
-      return base;
-    }
-
     /**
      * Save original world matrices for direction calculations
      */
@@ -34182,7 +33765,7 @@ var SceneOperationsManager = /*#__PURE__*/function () {
     key: "loadSceneFromData",
     value: (function () {
       var _loadSceneFromData = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee9(data) {
-        var _data$scene4, _data$scene5, _data$scene6, _data$scene7;
+        var _data$scene3, _data$scene4, _data$scene5, _data$scene6;
         return _regenerator().w(function (_context9) {
           while (1) switch (_context9.n) {
             case 0:
@@ -34192,10 +33775,10 @@ var SceneOperationsManager = /*#__PURE__*/function () {
                 dataType: _typeof(data),
                 hasScene: !!(data !== null && data !== void 0 && data.scene),
                 sceneType: _typeof(data === null || data === void 0 ? void 0 : data.scene),
-                hasChildren: !!(data !== null && data !== void 0 && (_data$scene4 = data.scene) !== null && _data$scene4 !== void 0 && _data$scene4.children),
-                childrenType: data !== null && data !== void 0 && (_data$scene5 = data.scene) !== null && _data$scene5 !== void 0 && _data$scene5.children ? _typeof(data.scene.children) : 'undefined',
-                isArray: Array.isArray(data === null || data === void 0 || (_data$scene6 = data.scene) === null || _data$scene6 === void 0 ? void 0 : _data$scene6.children),
-                childrenLength: data === null || data === void 0 || (_data$scene7 = data.scene) === null || _data$scene7 === void 0 || (_data$scene7 = _data$scene7.children) === null || _data$scene7 === void 0 ? void 0 : _data$scene7.length,
+                hasChildren: !!(data !== null && data !== void 0 && (_data$scene3 = data.scene) !== null && _data$scene3 !== void 0 && _data$scene3.children),
+                childrenType: data !== null && data !== void 0 && (_data$scene4 = data.scene) !== null && _data$scene4 !== void 0 && _data$scene4.children ? _typeof(data.scene.children) : 'undefined',
+                isArray: Array.isArray(data === null || data === void 0 || (_data$scene5 = data.scene) === null || _data$scene5 === void 0 ? void 0 : _data$scene5.children),
+                childrenLength: data === null || data === void 0 || (_data$scene6 = data.scene) === null || _data$scene6 === void 0 || (_data$scene6 = _data$scene6.children) === null || _data$scene6 === void 0 ? void 0 : _data$scene6.length,
                 dataKeys: data ? Object.keys(data) : [],
                 sceneKeys: data !== null && data !== void 0 && data.scene ? Object.keys(data.scene) : []
               });
@@ -34326,8 +33909,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$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);
+            var _child$userData0, _child$userData1;
+            var childType = ((_child$userData0 = child.userData) === null || _child$userData0 === void 0 ? void 0 : _child$userData0.objectType) || ((_child$userData1 = child.userData) === null || _child$userData1 === void 0 ? void 0 : _child$userData1.objectType);
             if (childType === 'connector') {
               var _child$geometry;
               var childBoundingBox = new THREE__namespace.Box3().setFromObject(child);
@@ -34412,8 +33995,8 @@ var SceneOperationsManager = /*#__PURE__*/function () {
       if (segment.children && segment.children.length > 0) {
         var childrenToRemove = _toConsumableArray(segment.children);
         childrenToRemove.forEach(function (child) {
-          var _child$userData11;
-          if ((_child$userData11 = child.userData) !== null && _child$userData11 !== void 0 && _child$userData11.isPipeElbow) {
+          var _child$userData10;
+          if ((_child$userData10 = child.userData) !== null && _child$userData10 !== void 0 && _child$userData10.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();
@@ -34564,7 +34147,7 @@ var SceneOperationsManager = /*#__PURE__*/function () {
     value: function _convertConnectedGatewaysToManual(connectors, currentSceneData) {
       var _connectors$,
         _segment$userData2,
-        _this7 = this;
+        _this5 = this;
       console.log('🔍 Checking for connected gateways to convert to manual...');
       var sceneViewer = this.sceneViewer;
       var convertedGateways = [];
@@ -34601,7 +34184,7 @@ var SceneOperationsManager = /*#__PURE__*/function () {
             console.log("\uD83D\uDD27 Found computed gateway at endpoint: ".concat(endpointObject.uuid, " - converting to manual"));
 
             // Convert gateway to manual (declared) using manualizeGateway for consistency
-            _this7.manualizeGateway(endpointObject, currentSceneData);
+            _this5.manualizeGateway(endpointObject, currentSceneData);
             convertedGateways.push(endpointObject);
           } else if (((_endpointObject$userD5 = endpointObject.userData) === null || _endpointObject$userD5 === void 0 ? void 0 : _endpointObject$userD5.objectType) === 'gateway' && ((_endpointObject$userD6 = endpointObject.userData) === null || _endpointObject$userD6 === void 0 ? void 0 : _endpointObject$userD6.isDeclared) === true) {
             console.log("\u2139\uFE0F Gateway ".concat(endpointObject.uuid, " is already declared (manual), skipping conversion"));
@@ -34791,11 +34374,18 @@ var AnimationManager = /*#__PURE__*/function (_BaseDisposable) {
         sceneViewer.performanceMonitorManager.beginFrame();
       }
       try {
+        var _sceneViewer$managers;
         // Update controls
         sceneViewer.controls.update();
 
-        // Render the scene
-        sceneViewer.renderer.render(sceneViewer.scene, sceneViewer.camera);
+        // Render the scene — route through the outline manager when active so
+        // the mask pass and screen-space composite run after the main render.
+        var ioOutline = (_sceneViewer$managers = sceneViewer.managers) === null || _sceneViewer$managers === void 0 ? void 0 : _sceneViewer$managers.ioOutlineManager;
+        if (ioOutline !== null && ioOutline !== void 0 && ioOutline.isActive) {
+          ioOutline.render();
+        } else {
+          sceneViewer.renderer.render(sceneViewer.scene, sceneViewer.camera);
+        }
       } catch (renderError) {
         // Catch WebGL or rendering errors to prevent the animation loop from
         // producing a permanent white screen. Log once and continue so that
@@ -37030,7 +36620,7 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
   }, {
     key: "toggleIODeviceBinaryState",
     value: function toggleIODeviceBinaryState(ioDeviceObject) {
-      var _ref, _this$sceneViewer, _this$sceneViewer2;
+      var _ref, _this$sceneViewer;
       if (!ioDeviceObject || !this._stateAdapter) return;
       var ud = ioDeviceObject.userData;
       var attachmentId = ud === null || ud === void 0 ? void 0 : ud.attachmentId;
@@ -37064,11 +36654,172 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
       var currentVal = (_ref = storedVal !== null && storedVal !== void 0 ? storedVal : binaryState.defaultValue) !== null && _ref !== void 0 ? _ref : false;
       var newVal = !Boolean(currentVal);
       this._stateAdapter.setState(scopedAttachmentId, dpId, newVal);
-      (_this$sceneViewer = this.sceneViewer) === null || _this$sceneViewer === void 0 || (_this$sceneViewer = _this$sceneViewer.managers) === null || _this$sceneViewer === void 0 || (_this$sceneViewer = _this$sceneViewer.behaviorManager) === null || _this$sceneViewer === void 0 || _this$sceneViewer.triggerState(attachmentId, dpId, newVal, parentUuid);
-      (_this$sceneViewer2 = this.sceneViewer) === null || _this$sceneViewer2 === void 0 || (_this$sceneViewer2 = _this$sceneViewer2.managers) === null || _this$sceneViewer2 === void 0 || (_this$sceneViewer2 = _this$sceneViewer2.ioAnimationManager) === null || _this$sceneViewer2 === void 0 || _this$sceneViewer2.triggerState(attachmentId, dpId, newVal, parentUuid);
+      (_this$sceneViewer = this.sceneViewer) === null || _this$sceneViewer === void 0 || (_this$sceneViewer = _this$sceneViewer.managers) === null || _this$sceneViewer === void 0 || (_this$sceneViewer = _this$sceneViewer.ioAnimationManager) === null || _this$sceneViewer === void 0 || _this$sceneViewer.triggerState(attachmentId, dpId, newVal, parentUuid);
       console.log("\uD83D\uDD04 [IODevice] Toggled ".concat(scopedAttachmentId, ".").concat(dpId, ": ").concat(currentVal, " \u2192 ").concat(newVal));
     }
 
+    // ── IO device drag-to-state ─────────────────────────────────────────────
+
+    /**
+     * Begin tracking a drag gesture on an IO device mesh.
+     * Records the initial state of each animation data point so that
+     * `updateIODeviceDrag` can compute relative offsets from it.
+     *
+     * @param {THREE.Object3D} ioDeviceObject
+     */
+  }, {
+    key: "startIODeviceDrag",
+    value: function startIODeviceDrag(ioDeviceObject) {
+      var _this$sceneViewer2,
+        _this2 = this;
+      if (!ioDeviceObject || !this._stateAdapter) return;
+      var ud = ioDeviceObject.userData;
+      var attachmentId = ud === null || ud === void 0 ? void 0 : ud.attachmentId;
+      if (!attachmentId) return;
+      var parentUuid = null;
+      var obj = ioDeviceObject.parent;
+      while (obj) {
+        var _obj$userData2;
+        if (((_obj$userData2 = obj.userData) === null || _obj$userData2 === void 0 ? void 0 : _obj$userData2.objectType) === 'component') {
+          parentUuid = obj.uuid;
+          break;
+        }
+        obj = obj.parent;
+      }
+      var scopedAttachmentId = this._getScopedAttachmentKey(attachmentId, parentUuid);
+      var ioAnimMgr = (_this$sceneViewer2 = this.sceneViewer) === null || _this$sceneViewer2 === void 0 || (_this$sceneViewer2 = _this$sceneViewer2.managers) === null || _this$sceneViewer2 === void 0 ? void 0 : _this$sceneViewer2.ioAnimationManager;
+      var dataPoints = ((ioAnimMgr === null || ioAnimMgr === void 0 ? void 0 : ioAnimMgr.getAnimationDataPoints(parentUuid, attachmentId)) || []).concat((ud === null || ud === void 0 ? void 0 : ud.dataPoints) || [])
+      // deduplicate by id
+      .filter(function (dp, i, arr) {
+        return arr.findIndex(function (d) {
+          return d.id === dp.id;
+        }) === i;
+      });
+      var dpSessions = [];
+      var _iterator = _createForOfIteratorHelper(dataPoints),
+        _step;
+      try {
+        var _loop = function _loop() {
+          var _this2$_stateAdapter$;
+          var dp = _step.value;
+          var stateType = (dp.stateType || '').toLowerCase();
+          if (stateType !== 'binary' && stateType !== 'boolean' && stateType !== 'enum') return 1; // continue
+          var curVal = (_this2$_stateAdapter$ = _this2._stateAdapter.getState(scopedAttachmentId, dp.id)) !== null && _this2$_stateAdapter$ !== void 0 ? _this2$_stateAdapter$ : dp.defaultValue;
+          if (stateType === 'binary' || stateType === 'boolean') {
+            dpSessions.push({
+              dp: dp,
+              scopedAttachmentId: scopedAttachmentId,
+              attachmentId: attachmentId,
+              parentUuid: parentUuid,
+              stateType: 'binary',
+              lastApplied: curVal
+            });
+          } else {
+            var _dp$stateConfig;
+            var opts = ((_dp$stateConfig = dp.stateConfig) === null || _dp$stateConfig === void 0 ? void 0 : _dp$stateConfig.options) || [];
+            var curIdx = opts.findIndex(function (o) {
+              return String(o) === String(curVal);
+            });
+            dpSessions.push({
+              dp: dp,
+              scopedAttachmentId: scopedAttachmentId,
+              attachmentId: attachmentId,
+              parentUuid: parentUuid,
+              stateType: 'enum',
+              opts: opts,
+              startIdx: curIdx >= 0 ? curIdx : 0,
+              lastAppliedIdx: curIdx >= 0 ? curIdx : 0
+            });
+          }
+        };
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          if (_loop()) continue;
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+      this._ioDragSession = dpSessions.length ? {
+        dpSessions: dpSessions
+      } : null;
+    }
+
+    /**
+     * Update animated mesh state while a drag is in progress.
+     * Called continuously during pointermove.
+     *
+     * Sign convention: up/right = positive `signedDelta`.
+     * - Binary:  > +20 px → true/on state,  < −20 px → false/off state.
+     * - Enum:    each ±30 px step advances/retreats one option in the list.
+     *
+     * @param {number} signedDelta - Cumulative signed pixel displacement since drag start
+     */
+  }, {
+    key: "updateIODeviceDrag",
+    value: function updateIODeviceDrag(signedDelta) {
+      var session = this._ioDragSession;
+      if (!session) return;
+      var BINARY_THRESHOLD = 20;
+      var ENUM_STEP_PX = 30;
+      var _iterator2 = _createForOfIteratorHelper(session.dpSessions),
+        _step2;
+      try {
+        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+          var dps = _step2.value;
+          if (dps.stateType === 'binary') {
+            var newVal = void 0;
+            if (signedDelta > BINARY_THRESHOLD) {
+              newVal = true;
+            } else if (signedDelta < -BINARY_THRESHOLD) {
+              newVal = false;
+            } else {
+              continue; // dead zone
+            }
+            if (newVal === dps.lastApplied) continue;
+            dps.lastApplied = newVal;
+            this._applyDpState(dps, newVal);
+          } else if (dps.stateType === 'enum') {
+            var steps = Math.round(signedDelta / ENUM_STEP_PX);
+            var newIdx = Math.max(0, Math.min(dps.opts.length - 1, dps.startIdx + steps));
+            if (newIdx === dps.lastAppliedIdx) continue;
+            dps.lastAppliedIdx = newIdx;
+            this._applyDpState(dps, dps.opts[newIdx]);
+          }
+        }
+      } catch (err) {
+        _iterator2.e(err);
+      } finally {
+        _iterator2.f();
+      }
+    }
+
+    /**
+     * Clean up drag session state on pointerup.
+     */
+  }, {
+    key: "endIODeviceDrag",
+    value: function endIODeviceDrag() {
+      this._ioDragSession = null;
+    }
+
+    /**
+     * Apply a new value to a data point, updating Vuex state and firing behavior/animation triggers.
+     * @private
+     */
+  }, {
+    key: "_applyDpState",
+    value: function _applyDpState(_ref2, newVal) {
+      var _this$_stateAdapter, _this$sceneViewer3;
+      var scopedAttachmentId = _ref2.scopedAttachmentId,
+        attachmentId = _ref2.attachmentId,
+        parentUuid = _ref2.parentUuid,
+        dp = _ref2.dp;
+      var dpId = dp.id;
+      (_this$_stateAdapter = this._stateAdapter) === null || _this$_stateAdapter === void 0 || _this$_stateAdapter.setState(scopedAttachmentId, dpId, newVal);
+      (_this$sceneViewer3 = this.sceneViewer) === null || _this$sceneViewer3 === void 0 || (_this$sceneViewer3 = _this$sceneViewer3.managers) === null || _this$sceneViewer3 === void 0 || (_this$sceneViewer3 = _this$sceneViewer3.ioAnimationManager) === null || _this$sceneViewer3 === void 0 || _this$sceneViewer3.triggerState(attachmentId, dpId, newVal, parentUuid);
+    }
+
     /**
      * Should be called when an object is selected or deselected.
      * @param {THREE.Object3D|null} object
@@ -37182,18 +36933,18 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
   }, {
     key: "_getIODevices",
     value: function _getIODevices(object) {
-      var _this2 = this;
+      var _this3 = this;
       var devices = [];
       var parentUuid = object.uuid; // The component's own UUID
       object.traverse(function (child) {
         var _child$userData;
         if (((_child$userData = child.userData) === null || _child$userData === void 0 ? void 0 : _child$userData.objectType) === 'io-device') {
-          var _this2$sceneViewer$ma, _this2$sceneViewer;
+          var _this3$sceneViewer$ma, _this3$sceneViewer;
           var attachmentId = child.userData.attachmentId || '';
 
           // Use only data points from the animate window (animationConfig).
           // The static ioConfig.states[] snapshot on userData is intentionally ignored.
-          var dataPoints = (_this2$sceneViewer$ma = (_this2$sceneViewer = _this2.sceneViewer) === null || _this2$sceneViewer === void 0 || (_this2$sceneViewer = _this2$sceneViewer.managers) === null || _this2$sceneViewer === void 0 || (_this2$sceneViewer = _this2$sceneViewer.ioAnimationManager) === null || _this2$sceneViewer === void 0 ? void 0 : _this2$sceneViewer.getAnimationDataPoints(parentUuid, attachmentId)) !== null && _this2$sceneViewer$ma !== void 0 ? _this2$sceneViewer$ma : [];
+          var dataPoints = (_this3$sceneViewer$ma = (_this3$sceneViewer = _this3.sceneViewer) === null || _this3$sceneViewer === void 0 || (_this3$sceneViewer = _this3$sceneViewer.managers) === null || _this3$sceneViewer === void 0 || (_this3$sceneViewer = _this3$sceneViewer.ioAnimationManager) === null || _this3$sceneViewer === void 0 ? void 0 : _this3$sceneViewer.getAnimationDataPoints(parentUuid, attachmentId)) !== null && _this3$sceneViewer$ma !== void 0 ? _this3$sceneViewer$ma : [];
 
           // When data points come from animationConfig they already carry direction:'input'.
           // Pass null so _buildDataPointRow uses the per-dp direction instead of the
@@ -37203,7 +36954,7 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
             label: child.userData.attachmentLabel || child.name || child.userData.deviceId || 'Unknown Device',
             deviceId: child.userData.deviceId || '',
             attachmentId: attachmentId,
-            scopedAttachmentId: _this2._getScopedAttachmentKey(attachmentId, parentUuid),
+            scopedAttachmentId: _this3._getScopedAttachmentKey(attachmentId, parentUuid),
             dataPoints: dataPoints,
             direction: deviceDirection
           });
@@ -37219,7 +36970,7 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
   }, {
     key: "_buildTooltip",
     value: function _buildTooltip(object) {
-      var _this3 = this;
+      var _this4 = this;
       // Remove any existing tooltip first
       this.hide();
       // Re-assign selected object since hide() clears it
@@ -37290,7 +37041,7 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
           // Use scopedAttachmentId to ensure state is isolated per component instance
           if (device.scopedAttachmentId && device.dataPoints.length > 0) {
             device.dataPoints.forEach(function (dp) {
-              var row = _this3._buildDataPointRow(device.scopedAttachmentId, dp, device.direction, device.attachmentId);
+              var row = _this4._buildDataPointRow(device.scopedAttachmentId, dp, device.direction, device.attachmentId);
               list.appendChild(row);
             });
           }
@@ -37301,11 +37052,11 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
         // Hover expand/collapse
         trigger.addEventListener('mouseenter', function () {
           ioSection.classList.add('expanded');
-          _this3._ioExpanded = true;
+          _this4._ioExpanded = true;
         });
         ioSection.addEventListener('mouseleave', function () {
           ioSection.classList.remove('expanded');
-          _this3._ioExpanded = false;
+          _this4._ioExpanded = false;
         });
         card.appendChild(ioSection);
       } else {
@@ -37349,11 +37100,11 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
   }, {
     key: "_positionTooltip",
     value: function _positionTooltip() {
-      var _this$sceneViewer3, _this$sceneViewer4;
+      var _this$sceneViewer4, _this$sceneViewer5;
       if (!this.tooltipEl || !this.selectedObject) return;
       var container = this._getContainer();
-      var camera = (_this$sceneViewer3 = this.sceneViewer) === null || _this$sceneViewer3 === void 0 ? void 0 : _this$sceneViewer3.camera;
-      var renderer = (_this$sceneViewer4 = this.sceneViewer) === null || _this$sceneViewer4 === void 0 ? void 0 : _this$sceneViewer4.renderer;
+      var camera = (_this$sceneViewer4 = this.sceneViewer) === null || _this$sceneViewer4 === void 0 ? void 0 : _this$sceneViewer4.camera;
+      var renderer = (_this$sceneViewer5 = this.sceneViewer) === null || _this$sceneViewer5 === void 0 ? void 0 : _this$sceneViewer5.renderer;
       if (!container || !camera || !renderer) return;
 
       // Compute bounding box to position above the component
@@ -37390,8 +37141,8 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
   }, {
     key: "_getContainer",
     value: function _getContainer() {
-      var _this$sceneViewer5;
-      return ((_this$sceneViewer5 = this.sceneViewer) === null || _this$sceneViewer5 === void 0 || (_this$sceneViewer5 = _this$sceneViewer5.renderer) === null || _this$sceneViewer5 === void 0 || (_this$sceneViewer5 = _this$sceneViewer5.domElement) === null || _this$sceneViewer5 === void 0 ? void 0 : _this$sceneViewer5.parentElement) || null;
+      var _this$sceneViewer6;
+      return ((_this$sceneViewer6 = this.sceneViewer) === null || _this$sceneViewer6 === void 0 || (_this$sceneViewer6 = _this$sceneViewer6.renderer) === null || _this$sceneViewer6 === void 0 || (_this$sceneViewer6 = _this$sceneViewer6.domElement) === null || _this$sceneViewer6 === void 0 ? void 0 : _this$sceneViewer6.parentElement) || null;
     }
 
     // -----------------------------------------------------------------------
@@ -37413,10 +37164,10 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
   }, {
     key: "_buildDataPointRow",
     value: function _buildDataPointRow(scopedAttachmentId, dp, deviceDirection, originalAttachmentId) {
-      var _ref2,
+      var _ref3,
         _this$_stateAdapter$g,
-        _this$_stateAdapter,
-        _this4 = this;
+        _this$_stateAdapter2,
+        _this5 = this;
       var row = document.createElement('div');
       row.className = 'cp-tooltip__dp-row';
       var nameEl = document.createElement('span');
@@ -37428,18 +37179,13 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
       // Device-level direction takes precedence; fall back to per-dp direction
       var resolvedDirection = deviceDirection || dp.direction || 'output';
       var isInput = resolvedDirection === 'input' || resolvedDirection === 'bidirectional';
-      var currentVal = (_ref2 = (_this$_stateAdapter$g = (_this$_stateAdapter = this._stateAdapter) === null || _this$_stateAdapter === void 0 ? void 0 : _this$_stateAdapter.getState(scopedAttachmentId, dpId)) !== null && _this$_stateAdapter$g !== void 0 ? _this$_stateAdapter$g : dp.defaultValue) !== null && _ref2 !== void 0 ? _ref2 : null;
+      var currentVal = (_ref3 = (_this$_stateAdapter$g = (_this$_stateAdapter2 = this._stateAdapter) === null || _this$_stateAdapter2 === void 0 ? void 0 : _this$_stateAdapter2.getState(scopedAttachmentId, dpId)) !== null && _this$_stateAdapter$g !== void 0 ? _this$_stateAdapter$g : dp.defaultValue) !== null && _ref3 !== void 0 ? _ref3 : null;
       if (isInput) {
         var ctrl = this._buildInputControl(dp, currentVal, function (newVal) {
-          var _this4$_stateAdapter, _this4$selectedObject, _this4$sceneViewer, _this4$sceneViewer2;
-          (_this4$_stateAdapter = _this4._stateAdapter) === null || _this4$_stateAdapter === void 0 || _this4$_stateAdapter.setState(scopedAttachmentId, dpId, newVal);
-          // Also fire BehaviorManager so any wired behaviors react immediately.
-          // Pass the parent component UUID so behaviors scoped to a specific instance
-          // don't bleed across clones that share the same attachmentId.
-          // Use originalAttachmentId for behavior triggering as behaviors are keyed by original ID
-          var parentUuid = ((_this4$selectedObject = _this4.selectedObject) === null || _this4$selectedObject === void 0 ? void 0 : _this4$selectedObject.uuid) || null;
-          (_this4$sceneViewer = _this4.sceneViewer) === null || _this4$sceneViewer === void 0 || (_this4$sceneViewer = _this4$sceneViewer.managers) === null || _this4$sceneViewer === void 0 || (_this4$sceneViewer = _this4$sceneViewer.behaviorManager) === null || _this4$sceneViewer === void 0 || _this4$sceneViewer.triggerState(originalAttachmentId || scopedAttachmentId, dpId, newVal, parentUuid);
-          (_this4$sceneViewer2 = _this4.sceneViewer) === null || _this4$sceneViewer2 === void 0 || (_this4$sceneViewer2 = _this4$sceneViewer2.managers) === null || _this4$sceneViewer2 === void 0 || (_this4$sceneViewer2 = _this4$sceneViewer2.ioAnimationManager) === null || _this4$sceneViewer2 === void 0 || _this4$sceneViewer2.triggerState(originalAttachmentId || scopedAttachmentId, dpId, newVal, parentUuid);
+          var _this5$_stateAdapter, _this5$selectedObject, _this5$sceneViewer;
+          (_this5$_stateAdapter = _this5._stateAdapter) === null || _this5$_stateAdapter === void 0 || _this5$_stateAdapter.setState(scopedAttachmentId, dpId, newVal);
+          var parentUuid = ((_this5$selectedObject = _this5.selectedObject) === null || _this5$selectedObject === void 0 ? void 0 : _this5$selectedObject.uuid) || null;
+          (_this5$sceneViewer = _this5.sceneViewer) === null || _this5$sceneViewer === void 0 || (_this5$sceneViewer = _this5$sceneViewer.managers) === null || _this5$sceneViewer === void 0 || (_this5$sceneViewer = _this5$sceneViewer.ioAnimationManager) === null || _this5$sceneViewer === void 0 || _this5$sceneViewer.triggerState(originalAttachmentId || scopedAttachmentId, dpId, newVal, parentUuid);
         });
         row.appendChild(ctrl);
         this._stateElements.set(key, {
@@ -37448,9 +37194,9 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
           isInput: true
         });
       } else {
-        var _dp$stateConfig;
+        var _dp$stateConfig2;
         // unit suffix (optional, shown between name and badge)
-        var unit = (_dp$stateConfig = dp.stateConfig) === null || _dp$stateConfig === void 0 ? void 0 : _dp$stateConfig.unit;
+        var unit = (_dp$stateConfig2 = dp.stateConfig) === null || _dp$stateConfig2 === void 0 ? void 0 : _dp$stateConfig2.unit;
         if (unit) {
           var unitEl = document.createElement('span');
           unitEl.className = 'cp-tooltip__dp-unit';
@@ -37595,7 +37341,7 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
   }, {
     key: "_refreshStateDisplays",
     value: function _refreshStateDisplays() {
-      var _this5 = this;
+      var _this6 = this;
       if (!this._stateAdapter || !this._stateElements.size) return;
       this._stateElements.forEach(function (entry, key) {
         if (entry.isInput) return; // interactive controls are user-driven; don't overwrite
@@ -37604,8 +37350,8 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
         if (sepIdx === -1) return;
         var scopedAttachmentId = key.slice(0, sepIdx);
         var dataPointId = key.slice(sepIdx + 2);
-        var val = _this5._stateAdapter.getState(scopedAttachmentId, dataPointId);
-        _this5._applyBadgeValue(entry.el, val, entry.dp);
+        var val = _this6._stateAdapter.getState(scopedAttachmentId, dataPointId);
+        _this6._applyBadgeValue(entry.el, val, entry.dp);
       });
     }
   }]);
@@ -37828,6 +37574,26 @@ var IoAnimationManager = /*#__PURE__*/function (_BaseDisposable) {
       return dps;
     }
 
+    /**
+     * Return the Three.js mesh objects that are animated for a given attachment.
+     * Used by IoOutlineManager to include animated meshes in the outline.
+     *
+     * @param {string} parentUuid
+     * @param {string} attachmentId
+     * @returns {THREE.Object3D[]}
+     */
+  }, {
+    key: "getAnimatedMeshes",
+    value: function getAnimatedMeshes(parentUuid, attachmentId) {
+      var key = this._key(parentUuid, attachmentId);
+      var entries = this._entries.get(key);
+      if (!(entries !== null && entries !== void 0 && entries.length)) return [];
+      // Deduplicate — multiple animations can target the same mesh
+      return _toConsumableArray(new Set(entries.map(function (e) {
+        return e.mesh;
+      })));
+    }
+
     /**
      * Remove all animation entries associated with a given host component.
      * Call when a component is removed from the scene.
@@ -38059,7 +37825,10 @@ var IoAnimationManager = /*#__PURE__*/function (_BaseDisposable) {
     value: function _applyTranslation(mesh, origPos, transform) {
       var _transform$x, _transform$y, _transform$z;
       if (!transform) return;
-      mesh.position.set(origPos.x + ((_transform$x = transform.x) !== null && _transform$x !== void 0 ? _transform$x : 0), origPos.y + ((_transform$y = transform.y) !== null && _transform$y !== void 0 ? _transform$y : 0), origPos.z + ((_transform$z = transform.z) !== null && _transform$z !== void 0 ? _transform$z : 0));
+      // X and Y are negated to match the sign convention used in the AnimateDevicesDialog
+      // preview (_syncViewerTransform negates x and y before calling setMeshPreviewOffset).
+      // Z is added directly (no negation) — matching the dialog's z handling.
+      mesh.position.set(origPos.x - ((_transform$x = transform.x) !== null && _transform$x !== void 0 ? _transform$x : 0), origPos.y - ((_transform$y = transform.y) !== null && _transform$y !== void 0 ? _transform$y : 0), origPos.z + ((_transform$z = transform.z) !== null && _transform$z !== void 0 ? _transform$z : 0));
     }
 
     /**
@@ -38130,6 +37899,235 @@ var IoAnimationManager = /*#__PURE__*/function (_BaseDisposable) {
   }]);
 }(BaseDisposable);
 
+/**
+ * Three.js layer reserved exclusively for the outline mask pass.
+ * Layer 20 is high enough to be well clear of typical app layer usage.
+ */
+var OUTLINE_LAYER = 20;
+
+// ── Shaders ──────────────────────────────────────────────────────────────────
+
+var VERT_SHADER = /* glsl */"\nvarying vec2 vUv;\nvoid main() {\n  vUv = uv;\n  gl_Position = vec4(position.xy, 0.0, 1.0);\n}\n";
+
+/**
+ * Screen-space outline shader.
+ *
+ * Samples in a circular kernel to find the nearest filled (silhouette) pixel.
+ * Applies a smooth alpha falloff at the outer edge using smoothstep so the
+ * outline fades cleanly rather than cutting off hard.
+ *
+ * RADIUS  — maximum distance in pixels from the silhouette edge to draw.
+ * SAMPLES — kernel half-extent; must be an integer ≥ ceil(RADIUS).
+ */
+var FRAG_SHADER = /* glsl */"\nuniform sampler2D tMask;\nuniform vec2 uInvSize;\nvarying vec2 vUv;\n\nconst float RADIUS  = 3.0;   // total outline width in pixels\nconst int   SAMPLES = 4;     // kernel half-extent (\u2265 ceil(RADIUS))\n\nvoid main() {\n  float center = texture2D(tMask, vUv).r;\n\n  // Pixels inside the silhouette: the main render already drew them.\n  if (center > 0.5) discard;\n\n  // Find the closest filled neighbour within the circular kernel.\n  float minDist = 99.0;\n  for (int x = -SAMPLES; x <= SAMPLES; x++) {\n    for (int y = -SAMPLES; y <= SAMPLES; y++) {\n      float dist = length(vec2(float(x), float(y)));\n      if (dist > RADIUS + 1.0) continue;   // skip corners outside circle\n      vec2 offset = vec2(float(x), float(y)) * uInvSize;\n      if (texture2D(tMask, vUv + offset).r > 0.5) {\n        minDist = min(minDist, dist);\n      }\n    }\n  }\n\n  if (minDist > RADIUS + 0.5) discard;\n\n  // Smooth alpha: full opacity near the edge, fades to 0 at RADIUS pixels out.\n  float alpha = 1.0 - smoothstep(RADIUS - 1.0, RADIUS + 0.5, minDist);\n  gl_FragColor = vec4(1.0, 1.0, 1.0, alpha);\n}\n";
+var IoOutlineManager = /*#__PURE__*/function (_BaseDisposable) {
+  function IoOutlineManager(sceneViewer) {
+    var _this;
+    _classCallCheck(this, IoOutlineManager);
+    _this = _callSuper(this, IoOutlineManager);
+    _this.sceneViewer = sceneViewer;
+    _this._maskTarget = null;
+    _this._maskMat = null;
+    _this._overlayScene = null;
+    _this._overlayCamera = null;
+    _this._overlayMat = null;
+
+    /**
+     * Meshes that have been moved onto OUTLINE_LAYER, stored with their
+     * original layers.mask so they can be restored on clearance.
+     * @type {{ mesh: THREE.Mesh, originalMask: number }[]}
+     */
+    _this._layeredMeshes = [];
+
+    /** @type {boolean} Whether an outline is currently active. */
+    _this.isActive = false;
+    return _this;
+  }
+
+  // ─────────────────────────────────────────────────────────────────────────
+  // PUBLIC API
+  // ─────────────────────────────────────────────────────────────────────────
+
+  /**
+   * Set the objects to outline.  Pass an empty array (or call with no args)
+   * to remove the outline.
+   * @param {THREE.Object3D[]} objects
+   */
+  _inherits(IoOutlineManager, _BaseDisposable);
+  return _createClass(IoOutlineManager, [{
+    key: "setTargets",
+    value: function setTargets() {
+      var _this2 = this;
+      var objects = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+      this._clearLayeredMeshes();
+      if (!objects.length) {
+        this.isActive = false;
+        return;
+      }
+      objects.forEach(function (obj) {
+        obj.traverse(function (child) {
+          if (!child.isMesh) return;
+          var originalMask = child.layers.mask;
+          child.layers.enable(OUTLINE_LAYER);
+          _this2._layeredMeshes.push({
+            mesh: child,
+            originalMask: originalMask
+          });
+        });
+      });
+      this.isActive = this._layeredMeshes.length > 0;
+    }
+
+    /**
+     * Render one frame: main scene → mask pass → outline composite.
+     * Must be called instead of renderer.render() when isActive is true.
+     */
+  }, {
+    key: "render",
+    value: function render() {
+      var sv = this.sceneViewer;
+      var renderer = sv.renderer,
+        scene = sv.scene,
+        camera = sv.camera;
+      if (!renderer || !scene || !camera) return;
+
+      // ── Step 1: Normal scene render — sky, transparency, all unaffected ──
+      renderer.render(scene, camera);
+      if (!this.isActive) return;
+      this._ensureResources();
+      if (!this._maskTarget) return;
+
+      // Stash renderer / scene / camera state we are about to mutate
+      var prevBg = scene.background;
+      var prevOverride = scene.overrideMaterial;
+      var prevLayerMask = camera.layers.mask;
+      var prevAutoClear = renderer.autoClear;
+      var prevClearClr = renderer.getClearColor(new THREE__namespace.Color());
+      var prevClearA = renderer.getClearAlpha();
+
+      // ── Step 2: Render the device silhouette into the private mask target ──
+      scene.background = null; // transparent clear
+      scene.overrideMaterial = this._maskMat; // flat white for all geometry
+      camera.layers.set(OUTLINE_LAYER); // only see the device meshes
+      renderer.setClearColor(0x000000, 0);
+      renderer.autoClear = true;
+      renderer.setRenderTarget(this._maskTarget);
+      renderer.render(scene, camera);
+      renderer.setRenderTarget(null);
+
+      // Restore mutated state
+      scene.background = prevBg;
+      scene.overrideMaterial = prevOverride;
+      camera.layers.mask = prevLayerMask;
+      renderer.setClearColor(prevClearClr, prevClearA);
+
+      // ── Step 3: Composite the outline on top without clearing the framebuffer
+      renderer.autoClear = false;
+      renderer.render(this._overlayScene, this._overlayCamera);
+      renderer.autoClear = prevAutoClear;
+    }
+
+    /**
+     * Call when the canvas is resized to keep the mask target and shader in sync.
+     * @param {number} width
+     * @param {number} height
+     */
+  }, {
+    key: "setSize",
+    value: function setSize(width, height) {
+      if (this._maskTarget) this._maskTarget.setSize(width, height);
+      if (this._overlayMat) {
+        this._overlayMat.uniforms.uInvSize.value.set(1 / width, 1 / height);
+      }
+    }
+  }, {
+    key: "dispose",
+    value: function dispose() {
+      this._clearLayeredMeshes();
+      if (this._maskTarget) {
+        this._maskTarget.dispose();
+        this._maskTarget = null;
+      }
+      if (this._maskMat) {
+        this._maskMat.dispose();
+        this._maskMat = null;
+      }
+      if (this._overlayMat) {
+        this._overlayMat.dispose();
+        this._overlayMat = null;
+      }
+      _superPropGet(IoOutlineManager, "dispose", this, 3)([]);
+    }
+
+    // ─────────────────────────────────────────────────────────────────────────
+    // PRIVATE
+    // ─────────────────────────────────────────────────────────────────────────
+
+    /** Lazy-initialise GPU resources on first use. */
+  }, {
+    key: "_ensureResources",
+    value: function _ensureResources() {
+      if (this._maskTarget) return;
+      var renderer = this.sceneViewer.renderer;
+      if (!renderer) return;
+      var size = renderer.getSize(new THREE__namespace.Vector2());
+      var w = size.x;
+      var h = size.y;
+
+      // Private render target — receives the flat white device silhouette
+      this._maskTarget = new THREE__namespace.WebGLRenderTarget(w, h);
+
+      // Flat white material used during the mask pass
+      this._maskMat = new THREE__namespace.MeshBasicMaterial({
+        color: 0xffffff
+      });
+
+      // Screen-space overlay: reads the mask and draws only the outline pixels
+      this._overlayMat = new THREE__namespace.ShaderMaterial({
+        uniforms: {
+          tMask: {
+            value: this._maskTarget.texture
+          },
+          uInvSize: {
+            value: new THREE__namespace.Vector2(1 / w, 1 / h)
+          }
+        },
+        vertexShader: VERT_SHADER,
+        fragmentShader: FRAG_SHADER,
+        transparent: true,
+        depthTest: false,
+        depthWrite: false
+      });
+      var quad = new THREE__namespace.Mesh(new THREE__namespace.PlaneGeometry(2, 2), this._overlayMat);
+      quad.frustumCulled = false;
+      this._overlayScene = new THREE__namespace.Scene();
+      this._overlayScene.add(quad);
+      this._overlayCamera = new THREE__namespace.OrthographicCamera(-1, 1, 1, -1, 0, 1);
+    }
+
+    /** Remove OUTLINE_LAYER from all tracked meshes and clear the list. */
+  }, {
+    key: "_clearLayeredMeshes",
+    value: function _clearLayeredMeshes() {
+      var _iterator = _createForOfIteratorHelper(this._layeredMeshes),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var _step$value = _step.value,
+            mesh = _step$value.mesh,
+            originalMask = _step$value.originalMask;
+          mesh.layers.mask = originalMask;
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+      this._layeredMeshes = [];
+    }
+  }]);
+}(BaseDisposable);
+
 // ─────────────────────────────────────────────────────────────────────────────
 // Flow-direction helpers (module-level)
 // ─────────────────────────────────────────────────────────────────────────────
@@ -38245,13 +38243,13 @@ var CentralPlantInternals = /*#__PURE__*/function () {
       this.centralPlant.managers.keyboardControlsManager = new KeyboardControlsManager(this.centralPlant.sceneViewer);
       this.centralPlant.managers.pathfindingManager = new PathfindingManager(this.centralPlant.sceneViewer);
       this.centralPlant.managers.pathFlowManager = new PathFlowManager(this.centralPlant.sceneViewer);
-      this.centralPlant.managers.behaviorManager = new BehaviorManager(this.centralPlant.sceneViewer);
       this.centralPlant.managers.sceneOperationsManager = new SceneOperationsManager(this.centralPlant.sceneViewer);
       this.centralPlant.managers.animationManager = new AnimationManager(this.centralPlant.sceneViewer);
       this.centralPlant.managers.cameraControlsManager = new CameraControlsManager(this.centralPlant.sceneViewer);
       this.centralPlant.managers.componentDragManager = new ComponentDragManager(this.centralPlant.sceneViewer);
       this.centralPlant.managers.viewport2DManager = new Viewport2DManager(this.centralPlant.sceneViewer);
       this.centralPlant.managers.ioAnimationManager = new IoAnimationManager(this.centralPlant.sceneViewer);
+      this.centralPlant.managers.ioOutlineManager = new IoOutlineManager(this.centralPlant.sceneViewer);
 
       // All managers are now stored in the managers collection and will be attached via attachToComponent()
     }
@@ -39022,7 +39020,7 @@ var CentralPlantInternals = /*#__PURE__*/function () {
         return false;
       }
       try {
-        var _componentData$childr, _componentData$childr2, _this$centralPlant$sc7, _componentData$childr3, _componentData$defaul;
+        var _componentData$childr, _componentData$childr2, _this$centralPlant$sc7, _componentData$childr3;
         // Generate a unique component ID if not provided
         var componentId = options.customId || this.generateUniqueComponentId(libraryId);
 
@@ -39254,20 +39252,25 @@ var CentralPlantInternals = /*#__PURE__*/function () {
           }
         }
 
-        // Register default behaviors for smart components so the BehaviorManager
-        // responds to tooltip-driven state changes immediately after drop.
-        // (The scene-load path uses _processBehaviors instead, which runs on loadSceneData.)
-        if ((_componentData$defaul = componentData.defaultBehaviors) !== null && _componentData$defaul !== void 0 && _componentData$defaul.length) {
-          var _this$centralPlant$sc9, _som$registerBehavior;
-          var som = (_this$centralPlant$sc9 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc9 === void 0 ? void 0 : _this$centralPlant$sc9.sceneOperationsManager;
-          som === null || som === void 0 || (_som$registerBehavior = som.registerBehaviorsForComponentInstance) === null || _som$registerBehavior === void 0 || _som$registerBehavior.call(som, componentData, componentId);
-        }
-
         // Notify the component manager about the new component
         if (componentManager.registerComponent) {
           componentManager.registerComponent(componentModel);
         }
 
+        // Pre-warm the filtered bounding-box cache for smart components so the
+        // first selection is instant.  Deferred to idle time so it does not
+        // block the current frame.
+        if (componentData.isSmart) {
+          var warmFn = function warmFn() {
+            return computeFilteredBoundingBoxCached(componentModel, ['io-device', 'connector']);
+          };
+          if (typeof requestIdleCallback !== 'undefined') {
+            requestIdleCallback(warmFn);
+          } else {
+            setTimeout(warmFn, 0);
+          }
+        }
+
         // EMIT COMPONENT ADDED EVENT
         // This allows UI components (like SceneHierarchy) to update reactively
         if (this.centralPlant.sceneViewer.emit) {
@@ -39321,18 +39324,18 @@ var CentralPlantInternals = /*#__PURE__*/function () {
   }, {
     key: "deleteComponent",
     value: function deleteComponent(componentId) {
-      var _this$centralPlant$sc0;
+      var _this$centralPlant$sc9;
       // Check if component manager is available
-      var componentManager = (_this$centralPlant$sc0 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc0 === void 0 ? void 0 : _this$centralPlant$sc0.componentManager;
+      var componentManager = (_this$centralPlant$sc9 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc9 === void 0 ? void 0 : _this$centralPlant$sc9.componentManager;
       if (!componentManager) {
         console.error('❌ deleteComponent(): Component manager not available');
         return false;
       }
       try {
-        var _this$centralPlant$sc1, _this$centralPlant$sc10, _sceneData$scene2, _sceneData$scene3;
+        var _this$centralPlant$sc0, _this$centralPlant$sc1, _sceneData$scene2, _sceneData$scene3;
         console.log("\uD83D\uDDD1\uFE0F deleteComponent(): Deleting component ".concat(componentId));
-        var threeScene = (_this$centralPlant$sc1 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc1 === void 0 ? void 0 : _this$centralPlant$sc1.scene;
-        var sceneData = (_this$centralPlant$sc10 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc10 === void 0 ? void 0 : _this$centralPlant$sc10.currentSceneData;
+        var threeScene = (_this$centralPlant$sc0 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc0 === void 0 ? void 0 : _this$centralPlant$sc0.scene;
+        var sceneData = (_this$centralPlant$sc1 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc1 === void 0 ? void 0 : _this$centralPlant$sc1.currentSceneData;
 
         // Step 1: Resolve the actual Three.js UUID from componentId.
         // The UI emits object.name (e.g. "Pump (PUMP-1)") as the selection ID, but
@@ -39547,7 +39550,7 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
    * Initialize the CentralPlant manager
    * 
    * @constructor
-   * @version 0.3.26
+   * @version 0.3.28
    * @updated 2025-10-22
    * 
    * @description Creates a new CentralPlant instance and initializes internal managers and utilities.
@@ -40581,107 +40584,6 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
       };
     }
 
-    // ─────────────────────────────────────────────────────────────────────────
-    // BEHAVIORS API
-    // ─────────────────────────────────────────────────────────────────────────
-
-    /**
-     * Get all behavior definitions currently stored in the BehaviorManager.
-     * @returns {Array<Object>} Array of behavior definition objects, or empty array.
-     * @example
-     * const behaviors = centralPlant.getBehaviors()
-     * behaviors.forEach(b => console.log(b.id, b.input, b.output))
-     */
-  }, {
-    key: "getBehaviors",
-    value: function getBehaviors() {
-      var _this$sceneViewer4;
-      var bm = (_this$sceneViewer4 = this.sceneViewer) === null || _this$sceneViewer4 === void 0 || (_this$sceneViewer4 = _this$sceneViewer4.managers) === null || _this$sceneViewer4 === void 0 ? void 0 : _this$sceneViewer4.behaviorManager;
-      if (!bm) {
-        console.warn('⚠️ getBehaviors(): BehaviorManager not available');
-        return [];
-      }
-      return bm.getBehaviors();
-    }
-
-    /**
-     * Add a behavior definition at runtime.
-     * @param {Object} behaviorDef - Full behavior definition object (must have unique `id`)
-     * @returns {boolean} True if added successfully, false otherwise
-     * @example
-     * centralPlant.addBehavior({
-     *   id: 'my-behavior',
-     *   input: { attachment: 'device-01', dataPoint: 'boolean-status-01' },
-     *   output: { attachment: 'light-01', child: 'indicator-mesh-01' },
-     *   conditions: [{ when: 'dataPoint.value === true', actions: [{ set: 'material.emissiveIntensity', value: 1.0 }] }]
-     * })
-     */
-  }, {
-    key: "addBehavior",
-    value: function addBehavior(behaviorDef) {
-      var _this$sceneViewer5, _this$sceneViewer6;
-      var bm = (_this$sceneViewer5 = this.sceneViewer) === null || _this$sceneViewer5 === void 0 || (_this$sceneViewer5 = _this$sceneViewer5.managers) === null || _this$sceneViewer5 === void 0 ? void 0 : _this$sceneViewer5.behaviorManager;
-      if (!bm) {
-        console.warn('⚠️ addBehavior(): BehaviorManager not available');
-        return false;
-      }
-      // Also persist into currentSceneData so export includes it
-      if ((_this$sceneViewer6 = this.sceneViewer) !== null && _this$sceneViewer6 !== void 0 && _this$sceneViewer6.currentSceneData) {
-        if (!Array.isArray(this.sceneViewer.currentSceneData.behaviors)) {
-          this.sceneViewer.currentSceneData.behaviors = [];
-        }
-        this.sceneViewer.currentSceneData.behaviors.push(behaviorDef);
-      }
-      return bm.addBehavior(behaviorDef);
-    }
-
-    /**
-     * Remove a behavior definition by id.
-     * @param {string} behaviorId
-     * @returns {boolean} True if removed, false if not found
-     * @example
-     * centralPlant.removeBehavior('my-behavior')
-     */
-  }, {
-    key: "removeBehavior",
-    value: function removeBehavior(behaviorId) {
-      var _this$sceneViewer7, _this$sceneViewer8;
-      var bm = (_this$sceneViewer7 = this.sceneViewer) === null || _this$sceneViewer7 === void 0 || (_this$sceneViewer7 = _this$sceneViewer7.managers) === null || _this$sceneViewer7 === void 0 ? void 0 : _this$sceneViewer7.behaviorManager;
-      if (!bm) {
-        console.warn('⚠️ removeBehavior(): BehaviorManager not available');
-        return false;
-      }
-      // Also remove from currentSceneData
-      if ((_this$sceneViewer8 = this.sceneViewer) !== null && _this$sceneViewer8 !== void 0 && (_this$sceneViewer8 = _this$sceneViewer8.currentSceneData) !== null && _this$sceneViewer8 !== void 0 && _this$sceneViewer8.behaviors) {
-        var idx = this.sceneViewer.currentSceneData.behaviors.findIndex(function (b) {
-          return b.id === behaviorId;
-        });
-        if (idx !== -1) this.sceneViewer.currentSceneData.behaviors.splice(idx, 1);
-      }
-      return bm.removeBehavior(behaviorId);
-    }
-
-    /**
-     * Simulate an IO device state value arriving and trigger any matching behaviors.
-     * Useful for live testing in the UI or for integration with real data feeds.
-     * @param {string} attachmentId - The attachment id of the input io-device
-     * @param {string} stateId      - The state id on that device
-     * @param {*}      value        - The new state value
-     * @example
-     * centralPlant.triggerState('pump-push-button-01', 'power', true)
-     */
-  }, {
-    key: "triggerState",
-    value: function triggerState(attachmentId, stateId, value, parentUuid) {
-      var _this$sceneViewer9;
-      var bm = (_this$sceneViewer9 = this.sceneViewer) === null || _this$sceneViewer9 === void 0 || (_this$sceneViewer9 = _this$sceneViewer9.managers) === null || _this$sceneViewer9 === void 0 ? void 0 : _this$sceneViewer9.behaviorManager;
-      if (!bm) {
-        console.warn('⚠️ triggerState(): BehaviorManager not available');
-        return;
-      }
-      bm.triggerState(attachmentId, stateId, value, parentUuid);
-    }
-
     /**
      * Set the state of an I/O device instance in the Three.js scene.
      *
@@ -40714,15 +40616,9 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
   }, {
     key: "setIoDeviceState",
     value: function setIoDeviceState(attachmentId, stateId, value, parentUuid) {
-      var _this$sceneViewer0, _this$sceneViewer1, _this$sceneViewer10;
-      var bm = (_this$sceneViewer0 = this.sceneViewer) === null || _this$sceneViewer0 === void 0 || (_this$sceneViewer0 = _this$sceneViewer0.managers) === null || _this$sceneViewer0 === void 0 ? void 0 : _this$sceneViewer0.behaviorManager;
-      if (!bm) {
-        console.warn('⚠️ setIoDeviceState(): BehaviorManager not available');
-        return false;
-      }
-
+      var _this$sceneViewer4, _this$sceneViewer5, _this$sceneViewer6;
       // 1. Persist via state adapter if one has been configured
-      var stateAdapter = (_this$sceneViewer1 = this.sceneViewer) === null || _this$sceneViewer1 === void 0 || (_this$sceneViewer1 = _this$sceneViewer1.managers) === null || _this$sceneViewer1 === void 0 || (_this$sceneViewer1 = _this$sceneViewer1.componentTooltipManager) === null || _this$sceneViewer1 === void 0 ? void 0 : _this$sceneViewer1._stateAdapter;
+      var stateAdapter = (_this$sceneViewer4 = this.sceneViewer) === null || _this$sceneViewer4 === void 0 || (_this$sceneViewer4 = _this$sceneViewer4.managers) === null || _this$sceneViewer4 === void 0 || (_this$sceneViewer4 = _this$sceneViewer4.componentTooltipManager) === null || _this$sceneViewer4 === void 0 ? void 0 : _this$sceneViewer4._stateAdapter;
       if (stateAdapter !== null && stateAdapter !== void 0 && stateAdapter.setState) {
         var scopedKey = parentUuid ? "".concat(parentUuid, "::").concat(attachmentId) : attachmentId;
         try {
@@ -40732,11 +40628,11 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
         }
       }
 
-      // 2. Apply Three.js behavior changes
-      bm.triggerState(attachmentId, stateId, value, parentUuid);
+      // 2. Apply io-animation changes
+      (_this$sceneViewer5 = this.sceneViewer) === null || _this$sceneViewer5 === void 0 || (_this$sceneViewer5 = _this$sceneViewer5.managers) === null || _this$sceneViewer5 === void 0 || (_this$sceneViewer5 = _this$sceneViewer5.ioAnimationManager) === null || _this$sceneViewer5 === void 0 || _this$sceneViewer5.triggerState(attachmentId, stateId, value, parentUuid);
 
       // 3. Emit event for host apps that don't use the state adapter (e.g. cp3d-viewer)
-      (_this$sceneViewer10 = this.sceneViewer) === null || _this$sceneViewer10 === void 0 || _this$sceneViewer10.emit('io-device-state-changed', {
+      (_this$sceneViewer6 = this.sceneViewer) === null || _this$sceneViewer6 === void 0 || _this$sceneViewer6.emit('io-device-state-changed', {
         attachmentId: attachmentId,
         stateId: stateId,
         value: value,
@@ -40758,8 +40654,8 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
   }, {
     key: "getSceneAttachments",
     value: function getSceneAttachments() {
-      var _this$sceneViewer11;
-      var scene = (_this$sceneViewer11 = this.sceneViewer) === null || _this$sceneViewer11 === void 0 ? void 0 : _this$sceneViewer11.scene;
+      var _this$sceneViewer7;
+      var scene = (_this$sceneViewer7 = this.sceneViewer) === null || _this$sceneViewer7 === void 0 ? void 0 : _this$sceneViewer7.scene;
       if (!scene) return [];
       var results = [];
       scene.traverse(function (obj) {
@@ -42564,7 +42460,7 @@ var sceneViewer = /*#__PURE__*/function (_BaseDisposable) {
               this.centralPlant.attachToComponent();
 
               // Sync our managers tracking object after attachment
-              managerKeys = ['threeJSResourceManager', 'performanceMonitorManager', 'settingsManager', 'sceneExportManager', 'componentManager', 'sceneInitializationManager', 'environmentManager', 'keyboardControlsManager', 'pathfindingManager', 'pathFlowManager', 'behaviorManager', 'ioAnimationManager', 'sceneOperationsManager', 'animationManager', 'cameraControlsManager', 'componentDragManager', 'tooltipsManager', 'componentTooltipManager']; // Populate our managers tracking object
+              managerKeys = ['threeJSResourceManager', 'performanceMonitorManager', 'settingsManager', 'sceneExportManager', 'componentManager', 'sceneInitializationManager', 'environmentManager', 'keyboardControlsManager', 'pathfindingManager', 'pathFlowManager', 'ioAnimationManager', 'ioOutlineManager', 'sceneOperationsManager', 'animationManager', 'cameraControlsManager', 'componentDragManager', 'tooltipsManager', 'componentTooltipManager']; // Populate our managers tracking object
               managerKeys.forEach(function (key) {
                 if (_this2[key]) {
                   _this2.managers[key] = _this2[key];
@@ -42752,7 +42648,21 @@ var sceneViewer = /*#__PURE__*/function (_BaseDisposable) {
       }
 
       // Update camera aspect ratio
-      this.camera.aspect = width / height;
+      if (this.camera.isPerspectiveCamera) {
+        this.camera.aspect = width / height;
+      } else if (this.camera.isOrthographicCamera) {
+        var _this$camera$userData;
+        var aspect = width / height;
+        var extents = (_this$camera$userData = this.camera.userData) === null || _this$camera$userData === void 0 ? void 0 : _this$camera$userData._orthoHalfExtents;
+        if (extents) {
+          var frustumHalfH = Math.max(extents.halfH, extents.halfW / aspect);
+          var frustumHalfW = frustumHalfH * aspect;
+          this.camera.left = -frustumHalfW;
+          this.camera.right = frustumHalfW;
+          this.camera.top = frustumHalfH;
+          this.camera.bottom = -frustumHalfH;
+        }
+      }
       this.camera.updateProjectionMatrix();
 
       // Update renderer size (updateStyle=true to sync canvas CSS)
@@ -42879,6 +42789,45 @@ var sceneViewer = /*#__PURE__*/function (_BaseDisposable) {
           if (_this4.componentTooltipManager) {
             _this4.componentTooltipManager.toggleIODeviceBinaryState(ioDeviceObject);
           }
+        },
+        onIODeviceDrag: function onIODeviceDrag(ioDeviceObject, signedDelta, isStart) {
+          if (isStart) {
+            var _ioDeviceObject$userD, _this4$managers$ioAni, _this4$managers, _this4$managers2;
+            // Resolve parentUuid by walking up to the host component.
+            // Use userData.originalUuid (the custom componentId) because that
+            // is what IoAnimationManager uses as the map key — NOT obj.uuid.
+            var parentUuid = null;
+            var obj = ioDeviceObject.parent;
+            while (obj) {
+              var _obj$userData;
+              if (((_obj$userData = obj.userData) === null || _obj$userData === void 0 ? void 0 : _obj$userData.objectType) === 'component') {
+                parentUuid = obj.userData.originalUuid || obj.uuid;
+                break;
+              }
+              obj = obj.parent;
+            }
+            var attachmentId = (_ioDeviceObject$userD = ioDeviceObject.userData) === null || _ioDeviceObject$userD === void 0 ? void 0 : _ioDeviceObject$userD.attachmentId;
+            // When animated meshes are available, outline ONLY them so their
+            // silhouette is isolated and the outline ring is visible around
+            // them specifically (not swallowed by the larger device body).
+            // Fall back to the whole device group when none are registered.
+            var animatedMeshes = attachmentId && parentUuid ? (_this4$managers$ioAni = (_this4$managers = _this4.managers) === null || _this4$managers === void 0 || (_this4$managers = _this4$managers.ioAnimationManager) === null || _this4$managers === void 0 ? void 0 : _this4$managers.getAnimatedMeshes(parentUuid, attachmentId)) !== null && _this4$managers$ioAni !== void 0 ? _this4$managers$ioAni : [] : [];
+            var targets = animatedMeshes.length > 0 ? animatedMeshes : [ioDeviceObject];
+            (_this4$managers2 = _this4.managers) === null || _this4$managers2 === void 0 || (_this4$managers2 = _this4$managers2.ioOutlineManager) === null || _this4$managers2 === void 0 || _this4$managers2.setTargets(targets);
+          }
+          if (!_this4.componentTooltipManager) return;
+          if (isStart) {
+            _this4.componentTooltipManager.startIODeviceDrag(ioDeviceObject);
+          } else {
+            _this4.componentTooltipManager.updateIODeviceDrag(signedDelta);
+          }
+        },
+        onIODeviceDragEnd: function onIODeviceDragEnd(ioDeviceObject) {
+          var _this4$managers3;
+          (_this4$managers3 = _this4.managers) === null || _this4$managers3 === void 0 || (_this4$managers3 = _this4$managers3.ioOutlineManager) === null || _this4$managers3 === void 0 || _this4$managers3.setTargets([]);
+          if (_this4.componentTooltipManager) {
+            _this4.componentTooltipManager.endIODeviceDrag();
+          }
         }
       });
 
@@ -48229,7 +48178,6 @@ var rendering3D = /*#__PURE__*/Object.freeze({
 });
 
 exports.AnimationManager = AnimationManager;
-exports.BehaviorManager = BehaviorManager;
 exports.CACHE_EXPIRY = CACHE_EXPIRY;
 exports.CACHE_NAME_PREFIX = CACHE_NAME_PREFIX;
 exports.CacheManager = CacheManager;