@2112-lab/central-plant 0.3.26 → 0.3.27

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

@@ -168,6 +168,169 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
       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$sceneViewer3,
+        _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$sceneViewer3 = this.sceneViewer) === null || _this$sceneViewer3 === void 0 || (_this$sceneViewer3 = _this$sceneViewer3.managers) === null || _this$sceneViewer3 === void 0 ? void 0 : _this$sceneViewer3.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 = _rollupPluginBabelHelpers.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 = _rollupPluginBabelHelpers.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$sceneViewer4, _this$sceneViewer5;
+      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$sceneViewer4 = this.sceneViewer) === null || _this$sceneViewer4 === void 0 || (_this$sceneViewer4 = _this$sceneViewer4.managers) === null || _this$sceneViewer4 === void 0 || (_this$sceneViewer4 = _this$sceneViewer4.behaviorManager) === null || _this$sceneViewer4 === void 0 || _this$sceneViewer4.triggerState(attachmentId, dpId, newVal, parentUuid);
+      (_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, dpId, newVal, parentUuid);
+    }
+
     /**
      * Should be called when an object is selected or deselected.
      * @param {THREE.Object3D|null} object
@@ -281,18 +444,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
@@ -302,7 +465,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
           });
@@ -318,7 +481,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
@@ -389,7 +552,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);
             });
           }
@@ -400,11 +563,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 {
@@ -448,11 +611,11 @@ var ComponentTooltipManager = /*#__PURE__*/function (_BaseDisposable) {
   }, {
     key: "_positionTooltip",
     value: function _positionTooltip() {
-      var _this$sceneViewer3, _this$sceneViewer4;
+      var _this$sceneViewer6, _this$sceneViewer7;
       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$sceneViewer6 = this.sceneViewer) === null || _this$sceneViewer6 === void 0 ? void 0 : _this$sceneViewer6.camera;
+      var renderer = (_this$sceneViewer7 = this.sceneViewer) === null || _this$sceneViewer7 === void 0 ? void 0 : _this$sceneViewer7.renderer;
       if (!container || !camera || !renderer) return;
 
       // Compute bounding box to position above the component
@@ -489,8 +652,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$sceneViewer8;
+      return ((_this$sceneViewer8 = this.sceneViewer) === null || _this$sceneViewer8 === void 0 || (_this$sceneViewer8 = _this$sceneViewer8.renderer) === null || _this$sceneViewer8 === void 0 || (_this$sceneViewer8 = _this$sceneViewer8.domElement) === null || _this$sceneViewer8 === void 0 ? void 0 : _this$sceneViewer8.parentElement) || null;
     }
 
     // -----------------------------------------------------------------------
@@ -512,10 +675,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');
@@ -527,18 +690,18 @@ 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);
+          var _this5$_stateAdapter, _this5$selectedObject, _this5$sceneViewer, _this5$sceneViewer2;
+          (_this5$_stateAdapter = _this5._stateAdapter) === null || _this5$_stateAdapter === void 0 || _this5$_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 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.behaviorManager) === null || _this5$sceneViewer === void 0 || _this5$sceneViewer.triggerState(originalAttachmentId || scopedAttachmentId, dpId, newVal, parentUuid);
+          (_this5$sceneViewer2 = _this5.sceneViewer) === null || _this5$sceneViewer2 === void 0 || (_this5$sceneViewer2 = _this5$sceneViewer2.managers) === null || _this5$sceneViewer2 === void 0 || (_this5$sceneViewer2 = _this5$sceneViewer2.ioAnimationManager) === null || _this5$sceneViewer2 === void 0 || _this5$sceneViewer2.triggerState(originalAttachmentId || scopedAttachmentId, dpId, newVal, parentUuid);
         });
         row.appendChild(ctrl);
         this._stateElements.set(key, {
@@ -547,9 +710,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';
@@ -694,7 +857,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
@@ -703,8 +866,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);
       });
     }
   }]);

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

@@ -77,7 +77,7 @@ var ModelManager = /*#__PURE__*/function () {
     key: "loadLibraryModel",
     value: function () {
       var _loadLibraryModel = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.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 _rollupPluginBabelHelpers.regenerator().w(function (_context2) {
           while (1) switch (_context2.n) {
             case 0:
@@ -174,6 +174,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 boundingBoxUtils.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:

package/dist/cjs/src/utils/boundingBoxUtils.js

@@ -233,6 +233,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(_rollupPluginBabelHelpers.construct(THREE__namespace.Vector3, _rollupPluginBabelHelpers.toConsumableArray(cache.min)), _rollupPluginBabelHelpers.construct(THREE__namespace.Vector3, _rollupPluginBabelHelpers.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;
@@ -246,7 +274,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 = {
@@ -256,33 +284,6 @@ function createSelectionBoxHelpers(object) {
       excludeTypes: excludeTypes
     };
     helpers.push(componentHelper);
-
-    // 2. Create individual helpers for each io-device
-    var _iterator2 = _rollupPluginBabelHelpers.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);
@@ -306,11 +307,11 @@ function createSelectionBoxHelpers(object) {
  * @param {THREE.Scene} scene - The scene (for finding objects by uuid)
  */
 function updateSelectionBoxHelpers(helpers, selectedObjects, scene) {
-  var _iterator3 = _rollupPluginBabelHelpers.createForOfIteratorHelper(helpers),
-    _step3;
+  var _iterator2 = _rollupPluginBabelHelpers.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,
@@ -333,29 +334,26 @@ 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();
   }
 }
 
 exports.computeFilteredBoundingBox = computeFilteredBoundingBox;
+exports.computeFilteredBoundingBoxCached = computeFilteredBoundingBoxCached;
 exports.computeIODeviceBoundingBoxes = computeIODeviceBoundingBoxes;
 exports.createSelectionBoxHelpers = createSelectionBoxHelpers;
 exports.updateSelectionBoxHelpers = updateSelectionBoxHelpers;

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

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

package/dist/esm/src/core/centralPlantInternals.js

@@ -24,8 +24,10 @@ import { SceneTooltipsManager } from '../managers/scene/sceneTooltipsManager.js'
 import { ComponentTooltipManager } from '../managers/scene/componentTooltipManager.js';
 import { Viewport2DManager } from '../managers/scene/viewport2DManager.js';
 import { IoAnimationManager } from '../managers/behaviors/IoAnimationManager.js';
+import { IoOutlineManager } from '../managers/behaviors/IoOutlineManager.js';
 import { generateUuidFromName, getHardcodedUuid, findObjectByHardcodedUuid, generateUniqueComponentId } from '../utils/nameUtils.js';
 import { attachIODevicesToComponent } from '../utils/ioDeviceUtils.js';
+import { computeFilteredBoundingBoxCached } from '../utils/boundingBoxUtils.js';
 import modelPreloader from '../rendering/modelPreloader.js';
 
 // ─────────────────────────────────────────────────────────────────────────────
@@ -150,6 +152,7 @@ var CentralPlantInternals = /*#__PURE__*/function () {
       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()
     }
@@ -1166,6 +1169,20 @@ var CentralPlantInternals = /*#__PURE__*/function () {
           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) {

package/dist/esm/src/core/sceneViewer.js

@@ -98,7 +98,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', 'behaviorManager', '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];
@@ -286,7 +286,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)
@@ -413,6 +427,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();
+          }
         }
       });