@2112-lab/central-plant 0.1.87 → 0.1.90

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

@@ -19,7 +19,7 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
    * Initialize the CentralPlant manager
    * 
    * @constructor
-   * @version 0.1.87
+   * @version 0.1.90
    * @updated 2025-10-22
    * 
    * @description Creates a new CentralPlant instance and initializes internal managers and utilities.
@@ -1519,6 +1519,50 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
       }
       return removeComponentFromDictionary;
     }()
+    /**
+     * Get library IDs from scene data that are missing from the component dictionary
+     * @param {Object} sceneData - Scene JSON data to analyze
+     * @returns {string[]} Array of library IDs that are not in the current component dictionary
+     * @description Analyzes scene data to find components whose libraryId is not present in the
+     * component dictionary. This is useful for detecting S3 components that need to be fetched
+     * before importing a scene.
+     * @example
+     * // Check for missing components before import
+     * const missingIds = centralPlant.getMissingLibraryIds(sceneJson);
+     * if (missingIds.length > 0) {
+     *   // Fetch missing S3 components
+     *   await fetchS3Components(missingIds);
+     *   await centralPlant.extendComponentDictionary(fetchedComponents);
+     * }
+     * // Now safe to import
+     * await centralPlant.importScene(sceneJson);
+     */
+    )
+  }, {
+    key: "getMissingLibraryIds",
+    value: function getMissingLibraryIds(sceneData) {
+      var _sceneData$scene, _this$managers$compon;
+      if (!(sceneData !== null && sceneData !== void 0 && (_sceneData$scene = sceneData.scene) !== null && _sceneData$scene !== void 0 && _sceneData$scene.children) || !Array.isArray(sceneData.scene.children)) {
+        return [];
+      }
+      var componentDictionary = ((_this$managers$compon = this.managers.componentDataManager) === null || _this$managers$compon === void 0 ? void 0 : _this$managers$compon.componentDictionary) || {};
+      var missingIds = [];
+      sceneData.scene.children.forEach(function (child) {
+        var _child$userData;
+        var libraryId = (_child$userData = child.userData) === null || _child$userData === void 0 ? void 0 : _child$userData.libraryId;
+        if (libraryId && !componentDictionary[libraryId]) {
+          // Only add unique IDs
+          if (!missingIds.includes(libraryId)) {
+            missingIds.push(libraryId);
+          }
+        }
+      });
+      if (missingIds.length > 0) {
+        console.log("\uD83D\uDD0D Found ".concat(missingIds.length, " missing library IDs in scene data:"), missingIds);
+      }
+      return missingIds;
+    }
+
     /**
      * Select an object (component, connector, or gateway) in the scene by its ID
      * @param {string} objectId - The UUID or name of the object to select
@@ -1555,7 +1599,6 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
      *   centralPlant.selectComponent(targetObject.uuid);
      * }
      */
-    )
   }, {
     key: "selectComponent",
     value: function selectComponent(objectId) {
@@ -1584,8 +1627,8 @@ var CentralPlant = /*#__PURE__*/function (_BaseDisposable) {
       // If still not found, try finding by originalUuid in userData
       if (!targetObject) {
         this.sceneViewer.scene.traverse(function (child) {
-          var _child$userData;
-          if (((_child$userData = child.userData) === null || _child$userData === void 0 ? void 0 : _child$userData.originalUuid) === objectId) {
+          var _child$userData2;
+          if (((_child$userData2 = child.userData) === null || _child$userData2 === void 0 ? void 0 : _child$userData2.originalUuid) === objectId) {
             targetObject = child;
             return;
           }

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

@@ -27,6 +27,7 @@ var sceneTooltipsManager = require('../managers/scene/sceneTooltipsManager.js');
 var componentTooltipManager = require('../managers/scene/componentTooltipManager.js');
 var viewport2DManager = require('../managers/scene/viewport2DManager.js');
 var nameUtils = require('../utils/nameUtils.js');
+var ioDeviceUtils = require('../utils/ioDeviceUtils.js');
 var modelPreloader = require('../rendering/modelPreloader.js');
 
 function _interopNamespace(e) {
@@ -1078,7 +1079,7 @@ var CentralPlantInternals = /*#__PURE__*/function () {
 
         // Add attached IO device models for smart components
         if (componentData.isSmart && componentData.attachedDevices) {
-          this._attachIODevicesToComponent(componentModel, componentData, modelPreloader, componentId);
+          ioDeviceUtils.attachIODevicesToComponent(componentModel, componentData, modelPreloader, componentId);
         }
 
         // Notify the component manager about the new component
@@ -1131,95 +1132,6 @@ var CentralPlantInternals = /*#__PURE__*/function () {
       }
     }
 
-    /**
-     * Attach IO device models to a smart component from cached models.
-     * Each device referenced in componentData.attachedDevices is looked up
-     * in the model preloader cache, cloned, positioned, and added as a child.
-     * @param {THREE.Object3D} componentModel - The parent component model
-     * @param {Object} componentData - Component dictionary entry (has attachedDevices)
-     * @param {Object} modelPreloader - ModelPreloader instance
-     * @param {string} parentComponentId - The parent component's UUID
-     * @private
-     */
-  }, {
-    key: "_attachIODevicesToComponent",
-    value: function _attachIODevicesToComponent(componentModel, componentData, modelPreloader, parentComponentId) {
-      var attachedDevices = componentData.attachedDevices;
-      console.log("\uD83D\uDD0C addComponent(): Attaching ".concat(Object.keys(attachedDevices).length, " IO devices to smart component"));
-      for (var _i = 0, _Object$entries = Object.entries(attachedDevices); _i < _Object$entries.length; _i++) {
-        var _Object$entries$_i = _rollupPluginBabelHelpers.slicedToArray(_Object$entries[_i], 2),
-          attachmentId = _Object$entries$_i[0],
-          attachment = _Object$entries$_i[1];
-        try {
-          var _modelPreloader$compo, _deviceData$ioConfig, _deviceData$ioConfig2, _deviceData$ioConfig3, _attachment$attachmen;
-          var deviceData = (_modelPreloader$compo = modelPreloader.componentDictionary) === null || _modelPreloader$compo === void 0 ? void 0 : _modelPreloader$compo[attachment.deviceId];
-          if (!deviceData || !deviceData.modelKey) {
-            console.warn("\u26A0\uFE0F IO device ".concat(attachment.deviceId, " not found in dictionary, skipping"));
-            continue;
-          }
-          var cachedDevice = modelPreloader.getCachedModelWithDimensions(deviceData.modelKey, attachment.deviceId);
-          if (!cachedDevice) {
-            console.warn("\u26A0\uFE0F IO device model not in cache: ".concat(deviceData.modelKey, ", skipping"));
-            continue;
-          }
-
-          // Clone so each component instance owns its own io-device subtree and materials.
-          // Without this, all placed copies of the same smart component share the cached
-          // object, causing material mutations (from behaviors) to bleed across instances.
-          var deviceModel = cachedDevice.clone();
-          deviceModel.traverse(function (child) {
-            if (child.isMesh && child.material) {
-              child.material = Array.isArray(child.material) ? child.material.map(function (m) {
-                return m.clone();
-              }) : child.material.clone();
-            }
-          });
-
-          // Name the device model
-          deviceModel.name = "".concat(attachment.attachmentLabel || 'IO Device', " (").concat(attachmentId, ")");
-
-          // Set user data for identification — include ioConfig data points so the
-          // component tooltip can render state displays without an extra lookup.
-          deviceModel.userData = {
-            objectType: 'io-device',
-            deviceId: attachment.deviceId,
-            attachmentId: attachmentId,
-            attachmentLabel: attachment.attachmentLabel,
-            parentComponentId: parentComponentId,
-            deviceName: deviceData.name || '',
-            // Snapshot of the device's data point definitions (stateType, stateConfig, direction, etc.)
-            // ioConfig can use either 'states' (preferred) or legacy 'dataPoints' as the array key
-            dataPoints: ((_deviceData$ioConfig = deviceData.ioConfig) === null || _deviceData$ioConfig === void 0 ? void 0 : _deviceData$ioConfig.states) || ((_deviceData$ioConfig2 = deviceData.ioConfig) === null || _deviceData$ioConfig2 === void 0 ? void 0 : _deviceData$ioConfig2.dataPoints) || [],
-            // Device-level I/O direction: 'input' means the user can write state via the tooltip
-            ioDirection: ((_deviceData$ioConfig3 = deviceData.ioConfig) === null || _deviceData$ioConfig3 === void 0 ? void 0 : _deviceData$ioConfig3.direction) || 'output',
-            // Signal wiring sourced from this attachment (for state propagation reference)
-            signalOutputs: attachment.signalOutputs || []
-          };
-
-          // Position at the attachment point
-          if ((_attachment$attachmen = attachment.attachmentPoint) !== null && _attachment$attachmen !== void 0 && _attachment$attachmen.position) {
-            var pos = attachment.attachmentPoint.position;
-            deviceModel.position.set(pos.x || 0, pos.y || 0, pos.z || 0);
-          }
-
-          // IO device models are authored at the same real-world unit scale
-          // as the host component, so keep them at their natural (1:1) size.
-          // Note: attachmentPoint.scale is the connector marker sphere size,
-          // NOT a desired device model scale.
-          deviceModel.scale.setScalar(1);
-
-          // Add as child of the component
-          componentModel.add(deviceModel);
-          console.log("\u2705 Attached IO device: ".concat(attachment.attachmentLabel || attachment.deviceId, " at"), {
-            position: deviceModel.position,
-            scale: deviceModel.scale
-          });
-        } catch (err) {
-          console.error("\u274C Error attaching IO device ".concat(attachment.deviceId, ":"), err);
-        }
-      }
-    }
-
     /**
      * Delete a component from the scene by componentId (internal implementation)
      * @param {string} componentId - The UUID of the component to delete

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

@@ -821,7 +821,7 @@ var CentralPlantValidator = /*#__PURE__*/function () {
     key: "validateImportedSceneData",
     value: function validateImportedSceneData(sceneData) {
       var results = [];
-      var hardcodedVersion = "2.1";
+      var hardcodedVersion = "2.3";
 
       // Version validation - MUST be the value of hardcodedVersion
       if (!sceneData.version || sceneData.version !== hardcodedVersion) {

package/dist/cjs/src/managers/components/componentDataManager.js

@@ -845,6 +845,7 @@ var ComponentDataManager = /*#__PURE__*/function (_BaseDisposable) {
         id: key,
         name: component.name,
         type: ((_component$metadata = component.metadata) === null || _component$metadata === void 0 ? void 0 : _component$metadata.type) || 'Component',
+        assetType: component.assetType || null,
         category: component.category,
         modelKey: component.modelKey,
         modelType: component.modelType,
@@ -853,10 +854,12 @@ var ComponentDataManager = /*#__PURE__*/function (_BaseDisposable) {
         // Preserve S3 metadata
         isS3Component: component.isS3Component,
         s3Path: component.s3Path,
-        preLoad: component.preLoad
+        preLoad: component.preLoad,
+        preCache: component.preCache
       };
       return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, baseData), {}, {
         metadata: component.metadata || {},
+        ioConfig: component.ioConfig || null,
         boundingBox: component.boundingBox || null,
         adaptedBoundingBox: component.adaptedBoundingBox || null,
         children: component.children || [],

package/dist/cjs/src/managers/components/componentManager.js

@@ -97,12 +97,16 @@ var ComponentManager = /*#__PURE__*/function () {
               componentMesh.position.set(position.x, position.y, position.z);
 
               // Set userData for the component including dimensions
-              componentMesh.userData = _rollupPluginBabelHelpers.objectSpread2({
+              componentMesh.userData = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({
                 libraryId: componentData.libraryId,
                 objectType: 'component',
                 originalUuid: uuid
               }, ((_gltfScene$userData = gltfScene.userData) === null || _gltfScene$userData === void 0 ? void 0 : _gltfScene$userData.dimensions) && {
                 dimensions: gltfScene.userData.dimensions
+              }), libraryComponent.isS3Component && {
+                isS3Component: true,
+                s3Path: libraryComponent.s3Path,
+                componentKey: libraryComponent.componentKey
               });
 
               // Also ensure dimensions are preserved in the userData

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

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var THREE = require('three');
+var ioDeviceUtils = require('../../utils/ioDeviceUtils.js');
 var modelPreloader = require('../../rendering/modelPreloader.js');
 
 function _interopNamespace(e) {
@@ -109,6 +110,11 @@ var ModelManager = /*#__PURE__*/function () {
                 libraryModel.add(connector);
               });
 
+              // Attach IO devices for smart components (import flow)
+              if (componentData.isSmart && componentData.attachedDevices) {
+                ioDeviceUtils.attachIODevicesToComponent(libraryModel, componentData, modelPreloader["default"], originalProps.uuid);
+              }
+
               // Replace mesh in scene
               this._replaceMeshInScene(targetMesh, libraryModel, originalProps.parent, component);
               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"));
@@ -185,7 +191,7 @@ var ModelManager = /*#__PURE__*/function () {
     value: (function () {
       var _getLibraryModel2 = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee2(modelKey, libraryId) {
         var _this2 = this;
-        var gltfScene, preloaderStatus, modelPath, gltf, _t2, _t3;
+        var gltfScene, preloaderStatus, modelPath, gltf, _t2, _t3, _t4;
         return _rollupPluginBabelHelpers.regenerator().w(function (_context2) {
           while (1) switch (_context2.n) {
             case 0:
@@ -222,25 +228,47 @@ var ModelManager = /*#__PURE__*/function () {
               console.warn("\u26A0\uFE0F Preloading failed:", _t2);
             case 6:
               _context2.p = 6;
+              if (!modelPreloader["default"].urlResolver) {
+                _context2.n = 11;
+                break;
+              }
+              _context2.p = 7;
+              _context2.n = 8;
+              return modelPreloader["default"].urlResolver(modelKey);
+            case 8:
+              modelPath = _context2.v;
+              console.log("\uD83D\uDD17 Resolved URL for ".concat(modelKey));
+              _context2.n = 10;
+              break;
+            case 9:
+              _context2.p = 9;
+              _t3 = _context2.v;
+              console.warn("\u26A0\uFE0F URL resolver failed for ".concat(modelKey, ", falling back to local path:"), _t3);
+              modelPath = "".concat(modelPreloader["default"].modelsBasePath).concat(modelKey);
+            case 10:
+              _context2.n = 12;
+              break;
+            case 11:
               modelPath = "".concat(modelPreloader["default"].modelsBasePath).concat(modelKey);
+            case 12:
               console.log("\uD83D\uDCC2 Fallback loading from: ".concat(modelPath));
-              _context2.n = 7;
+              _context2.n = 13;
               return new Promise(function (resolve, reject) {
                 _this2.sceneViewer.gltfLoader.load(modelPath, resolve, undefined, reject);
               });
-            case 7:
+            case 13:
               gltf = _context2.v;
               if (libraryId) {
                 modelPreloader["default"].cacheModel(modelKey, gltf.scene.clone(), libraryId);
               }
               return _context2.a(2, gltf.scene);
-            case 8:
-              _context2.p = 8;
-              _t3 = _context2.v;
-              console.error("Failed to load model ".concat(modelKey, ":"), _t3);
+            case 14:
+              _context2.p = 14;
+              _t4 = _context2.v;
+              console.error("Failed to load model ".concat(modelKey, ":"), _t4);
               return _context2.a(2, null);
           }
-        }, _callee2, null, [[6, 8], [2, 5]]);
+        }, _callee2, null, [[7, 9], [6, 14], [2, 5]]);
       }));
       function _getLibraryModel(_x4, _x5) {
         return _getLibraryModel2.apply(this, arguments);
@@ -339,7 +367,7 @@ var ModelManager = /*#__PURE__*/function () {
     key: "verifyModelPreloaderCache",
     value: (function () {
       var _verifyModelPreloaderCache = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee3() {
-        var preloaderStatus, _t4;
+        var preloaderStatus, _t5;
         return _rollupPluginBabelHelpers.regenerator().w(function (_context3) {
           while (1) switch (_context3.n) {
             case 0:
@@ -362,8 +390,8 @@ var ModelManager = /*#__PURE__*/function () {
               break;
             case 3:
               _context3.p = 3;
-              _t4 = _context3.v;
-              console.warn('⚠️ Model preloading failed, some models may load directly:', _t4);
+              _t5 = _context3.v;
+              console.warn('⚠️ Model preloading failed, some models may load directly:', _t5);
             case 4:
               return _context3.a(2, preloaderStatus);
           }
@@ -382,7 +410,7 @@ var ModelManager = /*#__PURE__*/function () {
     key: "preloadMissingModels",
     value: (function () {
       var _preloadMissingModels = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee4(data, componentDictionary) {
-        var _data$scene, _data$scene2, requiredModels, preloaderStatus, cachedModels, missingModels, basePath, modelUrls, _iterator, _step, modelKey, _t5, _t6;
+        var _data$scene, _data$scene2, requiredModels, preloaderStatus, cachedModels, missingModels, basePath, modelUrls, _iterator, _step, modelKey, _t6, _t7;
         return _rollupPluginBabelHelpers.regenerator().w(function (_context4) {
           while (1) switch (_context4.n) {
             case 0:
@@ -477,8 +505,8 @@ var ModelManager = /*#__PURE__*/function () {
               break;
             case 7:
               _context4.p = 7;
-              _t5 = _context4.v;
-              console.warn("\u274C Failed to preload missing model ".concat(modelKey, ":"), _t5);
+              _t6 = _context4.v;
+              console.warn("\u274C Failed to preload missing model ".concat(modelKey, ":"), _t6);
             case 8:
               _context4.n = 4;
               break;
@@ -487,8 +515,8 @@ var ModelManager = /*#__PURE__*/function () {
               break;
             case 10:
               _context4.p = 10;
-              _t6 = _context4.v;
-              _iterator.e(_t6);
+              _t7 = _context4.v;
+              _iterator.e(_t7);
             case 11:
               _context4.p = 11;
               _iterator.f();
@@ -593,7 +621,7 @@ var ModelManager = /*#__PURE__*/function () {
     key: "loadComponentDictionary",
     value: (function () {
       var _loadComponentDictionary = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee6() {
-        var response, dict, _t7;
+        var response, dict, _t8;
         return _rollupPluginBabelHelpers.regenerator().w(function (_context6) {
           while (1) switch (_context6.n) {
             case 0:
@@ -611,8 +639,8 @@ var ModelManager = /*#__PURE__*/function () {
               return _context6.a(2, dict);
             case 3:
               _context6.p = 3;
-              _t7 = _context6.v;
-              console.warn('⚠️ Could not load component dictionary:', _t7);
+              _t8 = _context6.v;
+              console.warn('⚠️ Could not load component dictionary:', _t8);
               return _context6.a(2, {});
           }
         }, _callee6, null, [[0, 3]]);

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

@@ -212,7 +212,8 @@ var SceneOperationsManager = /*#__PURE__*/function () {
       return createSceneMaterials;
     }()
     /**
-     * Helper function to create geometries from component library
+     * Helper function to create geometries for connectors and gateways
+     * Components use GLB geometry directly, no placeholder needed
      */
     )
   }, {
@@ -227,7 +228,7 @@ var SceneOperationsManager = /*#__PURE__*/function () {
         return geometries;
       }
 
-      // Create geometries based on component library bounding boxes instead of JSON scene.geometries
+      // Create geometries only for connectors and gateways (components use GLB geometry)
       data.scene.children.forEach(function (child) {
         var _child$userData, _child$userData2;
         // Skip manual segments - they create their own geometry
@@ -236,42 +237,28 @@ var SceneOperationsManager = /*#__PURE__*/function () {
           console.log("\u23ED\uFE0F Skipping geometry creation for manual segment: ".concat(child.uuid));
           return;
         }
-        if ((_child$userData2 = child.userData) !== null && _child$userData2 !== void 0 && _child$userData2.libraryId && componentDictionary[child.userData.libraryId]) {
-          var component = componentDictionary[child.userData.libraryId];
-          var boundingBox = component.boundingBox;
 
-          // Create a box geometry based on the component's bounding box
-          var geometry = new THREE__namespace.BoxGeometry(boundingBox.x || 1, boundingBox.y || 1, boundingBox.z || 1);
+        // Skip components - they will use GLB geometry directly
+        if ((_child$userData2 = child.userData) !== null && _child$userData2 !== void 0 && _child$userData2.libraryId) {
+          return;
+        }
 
-          // Use the child's geometry UUID as the key
-          geometries[child.userData.libraryId] = geometry;
-          console.log("\uD83D\uDCE6 Created placeholder geometry for ".concat(child.userData.libraryId, ":"), boundingBox);
-        } else {
-          // For non-library objects (connectors, gateways), create shared sphere geometry
-          var isConnectorOrGateway = child.uuid && (child.uuid.toLowerCase().includes('connector') || child.uuid.toLowerCase().includes('gateway'));
-          console.log("createSceneGeometries child:", child);
-          if (isConnectorOrGateway) {
-            // Check if position exists and is not at origin
-            if (child.position && !(child.position.x == 0 && child.position.y == 0 && child.position.z == 0)) {
-              // Determine if this is a gateway or connector
-              var isGateway = child.uuid.toLowerCase().includes('gateway');
-              var geometryKey = isGateway ? 'GATEWAY_SPHERE' : 'CONNECTOR_GATEWAY_SPHERE';
-              if (!geometries[geometryKey]) {
-                // Match computed gateway size (0.15) for gateways, keep 0.1 for connectors
-                var sphereRadius = isGateway ? 0.15 : 0.1;
-                geometries[geometryKey] = new THREE__namespace.SphereGeometry(sphereRadius, 16, 16);
-                console.log("\uD83D\uDD2E Created shared sphere geometry for ".concat(isGateway ? 'gateways' : 'connectors', " (radius: ").concat(sphereRadius, ")"));
-              }
+        // For non-library objects (connectors, gateways), create shared sphere geometry
+        var isConnectorOrGateway = child.uuid && (child.uuid.toLowerCase().includes('connector') || child.uuid.toLowerCase().includes('gateway'));
+        console.log("createSceneGeometries child:", child);
+        if (isConnectorOrGateway) {
+          // Check if position exists and is not at origin
+          if (child.position && !(child.position.x == 0 && child.position.y == 0 && child.position.z == 0)) {
+            // Determine if this is a gateway or connector
+            var isGateway = child.uuid.toLowerCase().includes('gateway');
+            var geometryKey = isGateway ? 'GATEWAY_SPHERE' : 'CONNECTOR_GATEWAY_SPHERE';
+            if (!geometries[geometryKey]) {
+              // Match computed gateway size (0.15) for gateways, keep 0.1 for connectors
+              var sphereRadius = isGateway ? 0.15 : 0.1;
+              geometries[geometryKey] = new THREE__namespace.SphereGeometry(sphereRadius, 16, 16);
+              console.log("\uD83D\uDD2E Created shared sphere geometry for ".concat(isGateway ? 'gateways' : 'connectors', " (radius: ").concat(sphereRadius, ")"));
             }
           }
-          // else {
-          //   // Default fallback geometry
-          //   const geometryKey = child.geometry || 'FALLBACK_BOX'
-          //   if (!geometries[geometryKey]) {
-          //     geometries[geometryKey] = new THREE.BoxGeometry(1, 1, 1)
-          //     console.log(`📦 Created fallback box geometry`)
-          //   }
-          // }
         }
       });
       return geometries;
@@ -1035,7 +1022,8 @@ var SceneOperationsManager = /*#__PURE__*/function () {
     key: "_createBasicSceneObjects",
     value: (function () {
       var _createBasicSceneObjects2 = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee6(data) {
-        var _this4 = this;
+        var _this$sceneViewer$cen,
+          _this4 = this;
         var componentDictionary, _yield$this$createSce, materials, crosscubeTextureSet, geometries, libraryObjectsToReplace;
         return _rollupPluginBabelHelpers.regenerator().w(function (_context6) {
           while (1) switch (_context6.n) {
@@ -1046,20 +1034,33 @@ var SceneOperationsManager = /*#__PURE__*/function () {
               }
               throw new Error('Invalid scene data structure: data.scene.children must be an array');
             case 1:
+              // Use the extended component dictionary (includes S3 components) if available,
+              // otherwise fall back to loading from static file
+              componentDictionary = (_this$sceneViewer$cen = this.sceneViewer.centralPlant) === null || _this$sceneViewer$cen === void 0 || (_this$sceneViewer$cen = _this$sceneViewer$cen.managers) === null || _this$sceneViewer$cen === void 0 || (_this$sceneViewer$cen = _this$sceneViewer$cen.componentDataManager) === null || _this$sceneViewer$cen === void 0 ? void 0 : _this$sceneViewer$cen.componentDictionary;
+              if (componentDictionary) {
+                _context6.n = 3;
+                break;
+              }
+              console.log('⚠️ Extended dictionary not available, loading from static file');
               _context6.n = 2;
               return this.modelManager.loadComponentDictionary();
             case 2:
               componentDictionary = _context6.v;
+              _context6.n = 4;
+              break;
+            case 3:
+              console.log("\u2705 Using extended component dictionary (".concat(Object.keys(componentDictionary).length, " components)"));
+            case 4:
               // Inject connector children from component dictionary into scene data
               this._injectConnectorChildrenFromDictionary(data, componentDictionary);
 
               // Ensure models are preloaded
-              _context6.n = 3;
+              _context6.n = 5;
               return this.modelManager.preloadMissingModels(data, componentDictionary);
-            case 3:
-              _context6.n = 4;
+            case 5:
+              _context6.n = 6;
               return this.createSceneMaterials(data);
-            case 4:
+            case 6:
               _yield$this$createSce = _context6.v;
               materials = _yield$this$createSce.materials;
               crosscubeTextureSet = _yield$this$createSce.crosscubeTextureSet;

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

@@ -0,0 +1,104 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+
+/**
+ * IO Device Utilities
+ * Shared utility functions for attaching IO devices to smart components.
+ * Used by both drag-and-drop (addComponent) and import (loadLibraryModel) flows.
+ */
+
+/**
+ * Attach IO device models to a smart component from cached models.
+ * Each device referenced in componentData.attachedDevices is looked up
+ * in the model preloader cache, cloned, positioned, and added as a child.
+ * 
+ * @param {THREE.Object3D} componentModel - The parent component model
+ * @param {Object} componentData - Component dictionary entry (has attachedDevices)
+ * @param {Object} modelPreloader - ModelPreloader instance with cache and componentDictionary
+ * @param {string} parentComponentId - The parent component's UUID
+ * @returns {void}
+ */
+function attachIODevicesToComponent(componentModel, componentData, modelPreloader, parentComponentId) {
+  var attachedDevices = componentData.attachedDevices;
+  if (!attachedDevices || Object.keys(attachedDevices).length === 0) {
+    return;
+  }
+  console.log("\uD83D\uDD0C attachIODevicesToComponent(): Attaching ".concat(Object.keys(attachedDevices).length, " IO devices to smart component"));
+  for (var _i = 0, _Object$entries = Object.entries(attachedDevices); _i < _Object$entries.length; _i++) {
+    var _Object$entries$_i = _rollupPluginBabelHelpers.slicedToArray(_Object$entries[_i], 2),
+      attachmentId = _Object$entries$_i[0],
+      attachment = _Object$entries$_i[1];
+    try {
+      var _modelPreloader$compo, _deviceData$ioConfig, _deviceData$ioConfig2, _deviceData$ioConfig3, _attachment$attachmen;
+      var deviceData = (_modelPreloader$compo = modelPreloader.componentDictionary) === null || _modelPreloader$compo === void 0 ? void 0 : _modelPreloader$compo[attachment.deviceId];
+      if (!deviceData || !deviceData.modelKey) {
+        console.warn("\u26A0\uFE0F IO device ".concat(attachment.deviceId, " not found in dictionary, skipping"));
+        continue;
+      }
+      var cachedDevice = modelPreloader.getCachedModelWithDimensions(deviceData.modelKey, attachment.deviceId);
+      if (!cachedDevice) {
+        console.warn("\u26A0\uFE0F IO device model not in cache: ".concat(deviceData.modelKey, ", skipping"));
+        continue;
+      }
+
+      // Clone so each component instance owns its own io-device subtree and materials.
+      // Without this, all placed copies of the same smart component share the cached
+      // object, causing material mutations (from behaviors) to bleed across instances.
+      var deviceModel = cachedDevice.clone();
+      deviceModel.traverse(function (child) {
+        if (child.isMesh && child.material) {
+          child.material = Array.isArray(child.material) ? child.material.map(function (m) {
+            return m.clone();
+          }) : child.material.clone();
+        }
+      });
+
+      // Name the device model
+      deviceModel.name = "".concat(attachment.attachmentLabel || 'IO Device', " (").concat(attachmentId, ")");
+
+      // Set user data for identification — include ioConfig data points so the
+      // component tooltip can render state displays without an extra lookup.
+      deviceModel.userData = {
+        objectType: 'io-device',
+        deviceId: attachment.deviceId,
+        attachmentId: attachmentId,
+        attachmentLabel: attachment.attachmentLabel,
+        parentComponentId: parentComponentId,
+        deviceName: deviceData.name || '',
+        // Snapshot of the device's data point definitions (stateType, stateConfig, direction, etc.)
+        // ioConfig can use either 'states' (preferred) or legacy 'dataPoints' as the array key
+        dataPoints: ((_deviceData$ioConfig = deviceData.ioConfig) === null || _deviceData$ioConfig === void 0 ? void 0 : _deviceData$ioConfig.states) || ((_deviceData$ioConfig2 = deviceData.ioConfig) === null || _deviceData$ioConfig2 === void 0 ? void 0 : _deviceData$ioConfig2.dataPoints) || [],
+        // Device-level I/O direction: 'input' means the user can write state via the tooltip
+        ioDirection: ((_deviceData$ioConfig3 = deviceData.ioConfig) === null || _deviceData$ioConfig3 === void 0 ? void 0 : _deviceData$ioConfig3.direction) || 'output',
+        // Signal wiring sourced from this attachment (for state propagation reference)
+        signalOutputs: attachment.signalOutputs || []
+      };
+
+      // Position at the attachment point
+      if ((_attachment$attachmen = attachment.attachmentPoint) !== null && _attachment$attachmen !== void 0 && _attachment$attachmen.position) {
+        var pos = attachment.attachmentPoint.position;
+        deviceModel.position.set(pos.x || 0, pos.y || 0, pos.z || 0);
+      }
+
+      // IO device models are authored at the same real-world unit scale
+      // as the host component, so keep them at their natural (1:1) size.
+      // Note: attachmentPoint.scale is the connector marker sphere size,
+      // NOT a desired device model scale.
+      deviceModel.scale.setScalar(1);
+
+      // Add as child of the component
+      componentModel.add(deviceModel);
+      console.log("\u2705 Attached IO device: ".concat(attachment.attachmentLabel || attachment.deviceId, " at"), {
+        position: deviceModel.position,
+        scale: deviceModel.scale
+      });
+    } catch (err) {
+      console.error("\u274C Error attaching IO device ".concat(attachment.deviceId, ":"), err);
+    }
+  }
+}
+
+exports.attachIODevicesToComponent = attachIODevicesToComponent;