@2112-lab/central-plant 0.3.25 → 0.3.27

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

@@ -1,4 +1,4 @@
-import { createClass as _createClass, objectSpread2 as _objectSpread2, createForOfIteratorHelper as _createForOfIteratorHelper, typeof as _typeof, toConsumableArray as _toConsumableArray, classCallCheck as _classCallCheck, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { createClass as _createClass, objectSpread2 as _objectSpread2, createForOfIteratorHelper as _createForOfIteratorHelper, typeof as _typeof, slicedToArray as _slicedToArray, toConsumableArray as _toConsumableArray, classCallCheck as _classCallCheck, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import * as THREE from 'three';
 import { CentralPlantValidator } from './centralPlantValidator.js';
 import { createTransformControls } from '../managers/controls/transformControlsManager.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()
     }
@@ -1124,15 +1127,40 @@ var CentralPlantInternals = /*#__PURE__*/function () {
 
         // Add attached IO device models for smart components
         if (componentData.isSmart && componentData.attachedDevices) {
+          var _this$centralPlant$sc8;
           attachIODevicesToComponent(componentModel, componentData, modelPreloader, componentId);
+
+          // Register animation configs so IoAnimationManager can respond to state changes
+          var ioAnimMgr = (_this$centralPlant$sc8 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc8 === void 0 || (_this$centralPlant$sc8 = _this$centralPlant$sc8.managers) === null || _this$centralPlant$sc8 === void 0 ? void 0 : _this$centralPlant$sc8.ioAnimationManager;
+          if (ioAnimMgr) {
+            var _loop = function _loop() {
+              var _modelPreloader$compo;
+              var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
+                attachmentId = _Object$entries$_i[0],
+                attachment = _Object$entries$_i[1];
+              var deviceData = (_modelPreloader$compo = modelPreloader.componentDictionary) === null || _modelPreloader$compo === void 0 ? void 0 : _modelPreloader$compo[attachment.deviceId];
+              if (!(deviceData !== null && deviceData !== void 0 && deviceData.animationConfig)) return 1; // continue
+              var deviceRoot = null;
+              componentModel.traverse(function (obj) {
+                var _obj$userData2;
+                if (!deviceRoot && ((_obj$userData2 = obj.userData) === null || _obj$userData2 === void 0 ? void 0 : _obj$userData2.attachmentId) === attachmentId) deviceRoot = obj;
+              });
+              if (deviceRoot) {
+                ioAnimMgr.loadAnimations(attachmentId, deviceData.animationConfig, deviceRoot, componentId);
+              }
+            };
+            for (var _i = 0, _Object$entries = Object.entries(componentData.attachedDevices); _i < _Object$entries.length; _i++) {
+              if (_loop()) continue;
+            }
+          }
         }
 
         // 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$sc8, _som$registerBehavior;
-          var som = (_this$centralPlant$sc8 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc8 === void 0 ? void 0 : _this$centralPlant$sc8.sceneOperationsManager;
+          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);
         }
 
@@ -1141,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) {
@@ -1194,18 +1236,18 @@ var CentralPlantInternals = /*#__PURE__*/function () {
   }, {
     key: "deleteComponent",
     value: function deleteComponent(componentId) {
-      var _this$centralPlant$sc9;
+      var _this$centralPlant$sc0;
       // Check if component manager is available
-      var componentManager = (_this$centralPlant$sc9 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc9 === void 0 ? void 0 : _this$centralPlant$sc9.componentManager;
+      var componentManager = (_this$centralPlant$sc0 = this.centralPlant.sceneViewer) === null || _this$centralPlant$sc0 === void 0 ? void 0 : _this$centralPlant$sc0.componentManager;
       if (!componentManager) {
         console.error('❌ deleteComponent(): Component manager not available');
         return false;
       }
       try {
-        var _this$centralPlant$sc0, _this$centralPlant$sc1, _sceneData$scene2, _sceneData$scene3;
+        var _this$centralPlant$sc1, _this$centralPlant$sc10, _sceneData$scene2, _sceneData$scene3;
         console.log("\uD83D\uDDD1\uFE0F deleteComponent(): Deleting component ".concat(componentId));
-        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;
+        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;
 
         // 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
@@ -1249,8 +1291,8 @@ var CentralPlantInternals = /*#__PURE__*/function () {
         // the component (e.g., dynamically added but not yet synced to sceneData)
         if (connectorIds.size === 0 && threeScene) {
           threeScene.traverse(function (obj) {
-            var _obj$userData2, _obj$userData3;
-            if ((obj.uuid === resolvedUuid || ((_obj$userData2 = obj.userData) === null || _obj$userData2 === void 0 ? void 0 : _obj$userData2.originalUuid) === resolvedUuid) && ((_obj$userData3 = obj.userData) === null || _obj$userData3 === void 0 ? void 0 : _obj$userData3.objectType) === 'component') {
+            var _obj$userData3, _obj$userData4;
+            if ((obj.uuid === resolvedUuid || ((_obj$userData3 = obj.userData) === null || _obj$userData3 === void 0 ? void 0 : _obj$userData3.originalUuid) === resolvedUuid) && ((_obj$userData4 = obj.userData) === null || _obj$userData4 === void 0 ? void 0 : _obj$userData4.objectType) === 'component') {
               obj.children.forEach(function (child) {
                 var _child$userData3;
                 if (((_child$userData3 = child.userData) === null || _child$userData3 === void 0 ? void 0 : _child$userData3.objectType) === 'connector') {
@@ -1300,12 +1342,12 @@ var CentralPlantInternals = /*#__PURE__*/function () {
           if (connectorIds.size > 0 && threeScene) {
             var objectsToRemove = [];
             threeScene.traverse(function (obj) {
-              var _obj$uuid, _obj$userData4, _obj$uuid2, _obj$userData5;
-              var isComputedSegment = ((_obj$uuid = obj.uuid) === null || _obj$uuid === void 0 ? void 0 : _obj$uuid.startsWith('SEGMENT-')) && ((_obj$userData4 = obj.userData) === null || _obj$userData4 === void 0 ? void 0 : _obj$userData4.isDeclared) !== true;
-              var isComputedGateway = ((_obj$uuid2 = obj.uuid) === null || _obj$uuid2 === void 0 ? void 0 : _obj$uuid2.includes('Gateway')) && ((_obj$userData5 = obj.userData) === null || _obj$userData5 === void 0 ? void 0 : _obj$userData5.isDeclared) !== true;
+              var _obj$uuid, _obj$userData5, _obj$uuid2, _obj$userData6;
+              var isComputedSegment = ((_obj$uuid = obj.uuid) === null || _obj$uuid === void 0 ? void 0 : _obj$uuid.startsWith('SEGMENT-')) && ((_obj$userData5 = obj.userData) === null || _obj$userData5 === void 0 ? void 0 : _obj$userData5.isDeclared) !== true;
+              var isComputedGateway = ((_obj$uuid2 = obj.uuid) === null || _obj$uuid2 === void 0 ? void 0 : _obj$uuid2.includes('Gateway')) && ((_obj$userData6 = obj.userData) === null || _obj$userData6 === void 0 ? void 0 : _obj$userData6.isDeclared) !== true;
               if (isComputedSegment || isComputedGateway) {
-                var _obj$userData6, _obj$userData7;
-                if (connectorIds.has((_obj$userData6 = obj.userData) === null || _obj$userData6 === void 0 ? void 0 : _obj$userData6.pathFrom) || connectorIds.has((_obj$userData7 = obj.userData) === null || _obj$userData7 === void 0 ? void 0 : _obj$userData7.pathTo)) {
+                var _obj$userData7, _obj$userData8;
+                if (connectorIds.has((_obj$userData7 = obj.userData) === null || _obj$userData7 === void 0 ? void 0 : _obj$userData7.pathFrom) || connectorIds.has((_obj$userData8 = obj.userData) === null || _obj$userData8 === void 0 ? void 0 : _obj$userData8.pathTo)) {
                   objectsToRemove.push(obj);
                 }
               }

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();
+          }
         }
       });
 

package/dist/esm/src/managers/behaviors/IoAnimationManager.js

@@ -70,7 +70,11 @@ var IoAnimationManager = /*#__PURE__*/function (_BaseDisposable) {
       }
       if (entries.length) {
         this._entries.set(key, entries);
-        console.log("[IoAnimationManager] Loaded ".concat(entries.length, " animation(s) for attachment \"").concat(attachmentId, "\" (parent: ").concat(parentUuid, ")"));
+        console.log("[IoAnimationManager] Loaded ".concat(entries.length, " animation(s) for attachment \"").concat(attachmentId, "\" (parent: ").concat(parentUuid, ") \u2014 stateVariables: ").concat(entries.map(function (e) {
+          return e.anim.stateVariable;
+        }).join(', ')));
+      } else {
+        console.warn("[IoAnimationManager] No mesh entries resolved for attachment \"".concat(attachmentId, "\" \u2014 animationConfig had ").concat(anims.length, " entries but none matched a mesh"));
       }
     }
 
@@ -215,6 +219,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.
@@ -446,7 +470,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));
     }
 
     /**

package/dist/esm/src/managers/behaviors/IoOutlineManager.js

@@ -0,0 +1,234 @@
+import { inherits as _inherits, createClass as _createClass, superPropGet as _superPropGet, createForOfIteratorHelper as _createForOfIteratorHelper, classCallCheck as _classCallCheck, callSuper as _callSuper } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import * as THREE from 'three';
+import { BaseDisposable } from '../../core/baseDisposable.js';
+
+/**
+ * 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.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.Vector2());
+      var w = size.x;
+      var h = size.y;
+
+      // Private render target — receives the flat white device silhouette
+      this._maskTarget = new THREE.WebGLRenderTarget(w, h);
+
+      // Flat white material used during the mask pass
+      this._maskMat = new THREE.MeshBasicMaterial({
+        color: 0xffffff
+      });
+
+      // Screen-space overlay: reads the mask and draws only the outline pixels
+      this._overlayMat = new THREE.ShaderMaterial({
+        uniforms: {
+          tMask: {
+            value: this._maskTarget.texture
+          },
+          uInvSize: {
+            value: new THREE.Vector2(1 / w, 1 / h)
+          }
+        },
+        vertexShader: VERT_SHADER,
+        fragmentShader: FRAG_SHADER,
+        transparent: true,
+        depthTest: false,
+        depthWrite: false
+      });
+      var quad = new THREE.Mesh(new THREE.PlaneGeometry(2, 2), this._overlayMat);
+      quad.frustumCulled = false;
+      this._overlayScene = new THREE.Scene();
+      this._overlayScene.add(quad);
+      this._overlayCamera = new THREE.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);
+
+export { IoOutlineManager };