@3driseai/3drise-viewer 0.1.4 → 0.1.6

package/dist/hooks/useMaterialApplication.js

@@ -7,9 +7,10 @@
 //
 import { useEffect, useRef } from 'react';
 import { createAndApplyMaterial, MATERIAL_INSTANCE_KEY, MaterialRegistryAPI, ObjectManager, resolveTextures, traverseSkippingEdgesAndEffects } from '@3driseai/3drise-core';
+import { resolveObject3D } from "../utils/resolveObject3D.js";
 // TEST: 0=raw defaults, 1=+DoubleSide, 2=+transparent, 3=+metalness/roughness
 const TEST_MATERIAL_MODE = 1;
-export const useMaterialApplication = (obj, materialSettings, shouldApply3driseMaterial, onApplied) => {
+export const useMaterialApplication = (source, materialSettings, shouldApply3driseMaterial, onApplied) => {
     // Track all material instances we've created so we can release them on change/unmount
     // const { getTypeByName } = useObjectTypes();
     const activeInstancesRef = useRef([]);
@@ -24,6 +25,9 @@ export const useMaterialApplication = (obj, materialSettings, shouldApply3driseM
         return found;
     };
     useEffect(() => {
+        // Read the ref here, not at the call site: effects run after React has
+        // attached refs, so this is the first point the object reliably exists.
+        const obj = resolveObject3D(source);
         if (!obj || !materialSettings || materialSettings.materialType === 'advanced' ||
             materialSettings.materialVariant === '3dRiseShader' || (shouldApply3driseMaterial === false))
             return;
@@ -31,7 +35,7 @@ export const useMaterialApplication = (obj, materialSettings, shouldApply3driseM
         return () => {
             releaseActiveInstances();
         };
-    }, [materialSettings, obj]);
+    }, [materialSettings, source]);
     // Unmount-only cleanup: dispose everything once the mesh leaves the scene.
     useEffect(() => {
         return () => {
@@ -53,29 +57,22 @@ export const useMaterialApplication = (obj, materialSettings, shouldApply3driseM
         activeInstancesRef.current = [];
     };
     const handleSettingsChange = async (obj, materialSettings) => {
-        // console.log('Applying material with settings:', { obj, materialSettings });
         if (!obj || !materialSettings || materialSettings.materialType === 'advanced')
             return;
-        // console.log('Applying material with settings:',obj.name, obj);
         // const originObject: Object3D | null = getOriginObject(obj);
         const applyMaterial = materialSettings.apply !== undefined ? materialSettings.apply : true;
-        // console.log({applyMaterial});
         // If apply is false, restore original materials
         if (!applyMaterial) {
             const objectId = obj.userData?.id;
-            // console.log({objectId})
             if (objectId) {
                 releaseActiveInstances();
                 ObjectManager.restoreOriginalMaterials(objectId);
-                // console.log(`Restored original materials for object ID ${objectId}`);
             }
             onApplied?.();
             return;
         }
         const materialType = MaterialRegistryAPI.getTypeDefinition(materialSettings.materialType);
-        // console.log('Material type definition:', materialType);
         if (!materialType) {
-            console.error(`Material type "${materialSettings.materialType}" not found in registry.`);
             return;
         }
         const firstVariant = Object.keys(materialType.variants)[0];
@@ -84,12 +81,9 @@ export const useMaterialApplication = (obj, materialSettings, shouldApply3driseM
         const resolvedSettings = await resolveTextures(variant, materialSettings);
         // 2. Traverse the object tree and apply material to any child with .material.
         const objectids = materialSettings.objectIds || [];
-        // console.log(originObject)
-        // console.log({ objectids });
         if (obj) {
             if (objectids.length > 0) {
                 let meshes = [];
-                // console.log('Applying material to specific object IDs:', objectids);
                 obj.traverse((child) => {
                     if (child && child.name && objectids.includes(child.name)) {
                         meshes.push(child);
@@ -97,16 +91,13 @@ export const useMaterialApplication = (obj, materialSettings, shouldApply3driseM
                 });
                 meshes.forEach(mesh => mesh.traverse((child) => {
                     if (child && child.material) {
-                        // console.log('Applying material to child:', child.name);
                         applyMaterialToChild(child, variant, resolvedSettings);
                     }
                 }));
                 return;
             }
             traverseSkippingEdgesAndEffects(obj, true, (child) => {
-                // console.log('Traversing child:', child.name, child);
                 if (child && child.material) {
-                    // console.log('Applying material to child:');
                     applyMaterialToChild(child, variant, resolvedSettings);
                 }
             });
@@ -139,8 +130,7 @@ export const useMaterialApplication = (obj, materialSettings, shouldApply3driseM
             // else if (TEST_MATERIAL_MODE === 3) {
             //   object.material = new MeshStandardMaterial({ side: DoubleSide, transparent: true, metalness: 0.5, roughness: 0.5 });
             //   return;
-            // }
-            // console.log(`Applying material to object ${object.name} with variant "${variant}" and settings:`, resolvedSettings);
+            // } 
             const materialInstance = createAndApplyMaterial(variant, resolvedSettings);
             // materialInstance.material.side = FrontSide; // Default to FrontSide; specific variants can override to DoubleSide in their defaultSettings
             // Assign to the object
@@ -151,7 +141,6 @@ export const useMaterialApplication = (obj, materialSettings, shouldApply3driseM
             object.userData[MATERIAL_INSTANCE_KEY] = materialInstance;
         }
         catch (error) {
-            console.error(`Failed to apply material "${variant}" to object:`, error);
         }
     };
 };

package/dist/hooks/useMaterialOptions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMaterialOptions.d.ts","sourceRoot":"","sources":["../../src/hooks/useMaterialOptions.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAE7G,KAAK,oBAAoB,GAAG,OAAO,CAAC,UAAU,CAAC,OAAO,mBAAmB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC;AAEtG,MAAM,WAAW,wBAAwB;IACrC,YAAY,EAAE,oBAAoB,CAAC;IACnC,eAAe,EAAE,MAAM,CAAC;IACxB,mBAAmB,EAAE,aAAa,CAAC;IACnC,cAAc,EAAE,aAAa,CAAC;IAC9B,gBAAgB,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IACvD,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD;AAED,eAAO,MAAM,kBAAkB,GAAI,iBAAiB,gBAAgB,EAAE,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,KAAK,IAAI,EAAE,aAAY,iBAA0B,EAAE,cAAa,WAAqB,KAAG,wBAkH9M,CAAC"}
+{"version":3,"file":"useMaterialOptions.d.ts","sourceRoot":"","sources":["../../src/hooks/useMaterialOptions.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAE7G,KAAK,oBAAoB,GAAG,OAAO,CAAC,UAAU,CAAC,OAAO,mBAAmB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC;AAEtG,MAAM,WAAW,wBAAwB;IACrC,YAAY,EAAE,oBAAoB,CAAC;IACnC,eAAe,EAAE,MAAM,CAAC;IACxB,mBAAmB,EAAE,aAAa,CAAC;IACnC,cAAc,EAAE,aAAa,CAAC;IAC9B,gBAAgB,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IACvD,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD;AAED,eAAO,MAAM,kBAAkB,GAAI,iBAAiB,gBAAgB,EAAE,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,KAAK,IAAI,EAAE,aAAY,iBAA0B,EAAE,cAAa,WAAqB,KAAG,wBA4G9M,CAAC"}

package/dist/hooks/useMaterialOptions.js

@@ -12,7 +12,6 @@ export const useMaterialOptions = (initialSettings, onSettingsChange, objectType
     // updates or edge-type resets). Without this, the dropdowns stay stale after
     // any external materialType / materialVariant change.
     useEffect(() => {
-        // console.log('useMaterialOptions - syncing with new initialSettings:', initialSettings);
         const newType = initialSettings.materialType || 'basic';
         setSelectedType(newType);
         const variants = MaterialRegistryAPI.getVariants(newType);
@@ -64,11 +63,9 @@ export const useMaterialOptions = (initialSettings, onSettingsChange, objectType
         label: variant
     }));
     const handleTypeChange = (type) => {
-        // console.log('Material type changed to:', type);
         setSelectedType(type);
         const availableVariants = MaterialRegistryAPI.getVariants(type);
         const defaultVariant = availableVariants[0];
-        // console.log({defaultVariant})
         setSelectedVariant(defaultVariant);
         // Auto-select first variant when type changes
         if (defaultVariant) {
@@ -76,7 +73,6 @@ export const useMaterialOptions = (initialSettings, onSettingsChange, objectType
         }
     };
     const handleVariantChange = (variant) => {
-        console.log('Material variant changed to:', variant);
         setSelectedVariant(variant);
         handleMaterialUpdate(selectedType, variant);
     };
@@ -86,7 +82,6 @@ export const useMaterialOptions = (initialSettings, onSettingsChange, objectType
         try {
             const variantDefinition = MaterialRegistryAPI.getVariantDefinition(variant);
             if (!variantDefinition) {
-                console.warn(`Variant definition for "${variant}" not found.`);
                 return;
             }
             // Start fresh from the new variant's defaults — this ensures
@@ -104,7 +99,6 @@ export const useMaterialOptions = (initialSettings, onSettingsChange, objectType
             onSettingsChange(newSettings);
         }
         catch (error) {
-            console.error('Error updating material:', error);
         }
     };
     return {

package/dist/hooks/useMeshController.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMeshController.d.ts","sourceRoot":"","sources":["../../src/hooks/useMeshController.ts"],"names":[],"mappings":"AACA,wBAAgB,iBAAiB,IAAI,GAAG,CAqKvC;AACD,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"useMeshController.d.ts","sourceRoot":"","sources":["../../src/hooks/useMeshController.ts"],"names":[],"mappings":"AACA,wBAAgB,iBAAiB,IAAI,GAAG,CAqJvC;AACD,eAAe,iBAAiB,CAAC"}

package/dist/hooks/useMeshController.js

@@ -6,9 +6,7 @@ export function useMeshController() {
         wireframe: { value: false },
     };
     // const createMeshes = (meshes: BaseMeshOptions[]): CreatedObjectSettings[] => {
-    //   console.log("Creating meshes with data:", meshes);
     //   const createdObjectsSettings: CreatedObjectSettings[] = [];
-    //   // console.log("createMeshes...", meshes);
     //   if (!Array.isArray(meshes)) return [];
     //   meshes.forEach(mesh => {
     //     try {
@@ -19,7 +17,6 @@ export function useMeshController() {
     //         id,
     //         type: meshType
     //       };
-    //       // console.log({ meshData });
     //       // let createdObject: CreatedRef | null = ;
     //       const createdObject: CreatedRef = {
     //         id,
@@ -50,19 +47,14 @@ export function useMeshController() {
     //           active: true
     //         }));
     //       }
-    //       // console.log("Created object settings:", createdObjectSettings);
     //       createdObjectsSettings.push(createdObjectSettings);
-    //         console.log("Created mesh:", createdObject.name);
     //     } catch (error) {
-    //       console.error(`Error creating mesh of type ${(mesh as any).type}:`, error);
     //     }
     //   });
     //   return createdObjectsSettings;
     // }
     const createObjects = (objects) => {
-        console.log("Creating meshes with data:", objects);
         const createdObjectsSettings = [];
-        // console.log("createMeshes...", meshes);
         if (!Array.isArray(objects))
             return [];
         objects.forEach(object => {
@@ -80,7 +72,6 @@ export function useMeshController() {
                     type: objectType,
                     id,
                 };
-                console.log({ meshData });
                 // let createdObject: CreatedRef | null = ;
                 const meshCreationResult = createMeshByType(meshData);
                 if (!meshCreationResult)
@@ -90,7 +81,6 @@ export function useMeshController() {
                     name: object.name || `mesh-${id}`,
                     object: meshCreationResult.mesh
                 };
-                console.log("Created object:", createdObject);
                 createdObject && ObjectManager.addObject(createdObject);
                 if (!createdObject)
                     return;
@@ -104,12 +94,9 @@ export function useMeshController() {
                 };
                 if (object.animations) {
                 }
-                // console.log("Created object settings:", createdObjectSettings);
                 createdObjectsSettings.push(createdObjectSettings);
-                console.log("Created mesh:", createdObject.name);
             }
             catch (error) {
-                console.error(`Error creating mesh of type ${object.type}:`, error);
             }
         });
         return createdObjectsSettings;
@@ -117,11 +104,9 @@ export function useMeshController() {
     const createMaterialSettings = (meshData) => {
         // let materialVariant = 'Standard';
         // if (!meshData.material) {
-        //   console.warn("Mesh data is missing material property:", meshData);
         //   // return;
         // }
         // if (!meshData.material.variant) {
-        //   console.warn("Mesh data is missing material variant:", meshData);
         //   // return;
         // }
         const materialVariant = meshData.material &&
@@ -144,7 +129,6 @@ export function useMeshController() {
                 ...materialInstance.settings
             };
         }
-        // console.log("Default settings for material ", materialVariant, ":", defaultSettings);
         Object.keys(meshData.material || {}).forEach(key => {
             if (defaultSettings[key]) {
                 defaultSettings[key] = meshData.material[key];

package/dist/hooks/useObjectAnimation.d.ts

@@ -1,13 +1,24 @@
 import type { CreatedObjectSettings } from '@3driseai/3drise-core';
 import type { UseContinuousEffectsResult } from './useContinuousEffects';
 import type { UseInteractionEffectsResult } from './useInteractionEffects';
-import { Object3D } from "three";
+import type { Object3DSource } from '../utils/resolveObject3D';
 interface UseObjectAnimationOptions {
     enabled?: boolean;
     hovered?: boolean;
 }
 interface UseObjectAnimationResult extends UseContinuousEffectsResult, UseInteractionEffectsResult {
 }
-export declare const useObjectAnimation: (objectSettings: CreatedObjectSettings | null, animateMaterial: boolean, options?: UseObjectAnimationOptions, ref?: Object3D) => UseObjectAnimationResult | null;
+/**
+ * Drive every continuous animation for one scene object.
+ *
+ * Pass the **ref** the caller put on its own group. The hooks below read
+ * `.current` inside useFrame, so the object resolves as soon as React attaches
+ * it — no re-render required, and no per-render scene traversal.
+ *
+ * With no `object` at all, the object is looked up by id once, from inside the
+ * frame loop, as a fallback for callers that only hold settings. That path
+ * needs `SceneStore.scene` to be populated (see `useRegisterScene`).
+ */
+export declare const useObjectAnimation: (objectSettings: CreatedObjectSettings | null, animateMaterial: boolean, options?: UseObjectAnimationOptions, object?: Object3DSource) => UseObjectAnimationResult | null;
 export {};
 //# sourceMappingURL=useObjectAnimation.d.ts.map

package/dist/hooks/useObjectAnimation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useObjectAnimation.d.ts","sourceRoot":"","sources":["../../src/hooks/useObjectAnimation.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAEnE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,wBAAwB,CAAC;AAEzE,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,yBAAyB,CAAC;AAE3E,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,UAAU,yBAAyB;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,UAAU,wBAAyB,SAAQ,0BAA0B,EAAE,2BAA2B;CACjG;AASD,eAAO,MAAM,kBAAkB,GAAI,gBAAgB,qBAAqB,GAAG,IAAI,EAAE,iBAAiB,OAAO,EAAE,UAAS,yBAA8B,EAAE,MAAM,QAAQ,KAAG,wBAAwB,GAAG,IAwB/L,CAAC"}
+{"version":3,"file":"useObjectAnimation.d.ts","sourceRoot":"","sources":["../../src/hooks/useObjectAnimation.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAEnE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,wBAAwB,CAAC;AAEzE,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,yBAAyB,CAAC;AAE3E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAE/D,UAAU,yBAAyB;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,UAAU,wBAAyB,SAAQ,0BAA0B,EAAE,2BAA2B;CACjG;AAGD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,kBAAkB,GAAI,gBAAgB,qBAAqB,GAAG,IAAI,EAAE,iBAAiB,OAAO,EAAE,UAAS,yBAA8B,EAAE,SAAS,cAAc,KAAG,wBAAwB,GAAG,IAexM,CAAC"}

package/dist/hooks/useObjectAnimation.js

@@ -1,35 +1,33 @@
+import { useRef } from 'react';
+import { useFrame } from '@react-three/fiber';
 import { findById } from '@3driseai/3drise-core';
 import { useContinuousEffects } from "./useContinuousEffects.js";
 import { useMouseMove } from "./useInteractionEffects.js";
 import { useSequenceAnimation } from "./useSequenceAnimation.js";
-const DEBUG_OBJECT_ANIMATION = false;
-const debugLog = (...args) => {
-    if (DEBUG_OBJECT_ANIMATION) {
-        console.log('[useObjectAnimation]', ...args);
-    }
-};
-export const useObjectAnimation = (objectSettings, animateMaterial, options = {}, ref) => {
+/**
+ * Drive every continuous animation for one scene object.
+ *
+ * Pass the **ref** the caller put on its own group. The hooks below read
+ * `.current` inside useFrame, so the object resolves as soon as React attaches
+ * it — no re-render required, and no per-render scene traversal.
+ *
+ * With no `object` at all, the object is looked up by id once, from inside the
+ * frame loop, as a fallback for callers that only hold settings. That path
+ * needs `SceneStore.scene` to be populated (see `useRegisterScene`).
+ */
+export const useObjectAnimation = (objectSettings, animateMaterial, options = {}, object) => {
     const { enabled = true, hovered = false } = options;
-    const objectRef = ref || findById(objectSettings?.id);
-    // console.log(objectSettings?.id, objectRef);
-    // debugLog('hook run', {
-    //   objectId: objectSettings?.id,
-    //   hasRefArg: !!ref,
-    //   resolvedObject: objectRef ? { name: objectRef.name, id: objectRef.userData?.id } : null,
-    //   enabled,
-    //   hovered,
-    //   animateMaterial,
-    // });
-    if (!objectRef) {
-        debugLog('No object ref found, skipping animation setup', {
-            name: objectSettings?.meshSettings.name,
-            hasRefArg: !!ref,
-        });
-        // return null;
-    }
-    // console.log(hovered)
-    const continuousResult = useContinuousEffects(objectSettings, { enabled, animateMaterial, hovered }, objectRef);
-    const mouseMoveResult = useMouseMove(objectSettings, { enabled, animateMaterial }, objectRef);
-    useSequenceAnimation(objectSettings?.id, objectRef);
+    // Fallback for ref-less callers. Resolved in the frame loop rather than
+    // during render, because at render time the object is not in the scene yet.
+    const fallbackRef = useRef(null);
+    useFrame(() => {
+        if (object || fallbackRef.current || !objectSettings?.id)
+            return;
+        fallbackRef.current = findById(objectSettings.id);
+    });
+    const source = object ?? fallbackRef;
+    const continuousResult = useContinuousEffects(objectSettings, { enabled, animateMaterial, hovered }, source);
+    const mouseMoveResult = useMouseMove(objectSettings, { enabled, animateMaterial }, source);
+    useSequenceAnimation(objectSettings?.id, source);
     return { ...continuousResult, ...mouseMoveResult };
 };

package/dist/hooks/useObjectEdges.d.ts

@@ -1,3 +1,4 @@
 import type { ObjectEdges } from '@3driseai/3drise-core';
-export declare function useObjectEdges(objectId: string, edgesSettings: ObjectEdges): void;
+import type { Object3DSource } from '../utils/resolveObject3D';
+export declare function useObjectEdges(objectId: string, edgesSettings: ObjectEdges, objectSource?: Object3DSource): void;
 //# sourceMappingURL=useObjectEdges.d.ts.map

package/dist/hooks/useObjectEdges.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useObjectEdges.d.ts","sourceRoot":"","sources":["../../src/hooks/useObjectEdges.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAiKzD,wBAAgB,cAAc,CAAC,QAAQ,EAAE,MAAM,EAAE,aAAa,EAAE,WAAW,GAAG,IAAI,CAkCjF"}
+{"version":3,"file":"useObjectEdges.d.ts","sourceRoot":"","sources":["../../src/hooks/useObjectEdges.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAGzD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAiK/D,wBAAgB,cAAc,CAAC,QAAQ,EAAE,MAAM,EAAE,aAAa,EAAE,WAAW,EAAE,YAAY,CAAC,EAAE,cAAc,GAAG,IAAI,CA6ChH"}

package/dist/hooks/useObjectEdges.js

@@ -1,8 +1,9 @@
-import { useEffect, useMemo, useRef } from 'react';
+import { useEffect, useMemo, useRef, useState } from 'react';
 import { BoxGeometry, BufferGeometry, CylinderGeometry, EdgesGeometry, Group, LineSegments, Mesh, MeshBasicMaterial, Points, PointsMaterial, Quaternion, Vector3, Float32BufferAttribute, } from 'three';
 import { useFrame } from '@react-three/fiber';
 import { collectMeshes, computeThreshold, buildSubdividedEdgeGeometry, EDGES_GROUP_KEY, animateUniforms, cacheChildrenWithMaterials, findById } from '@3driseai/3drise-core';
 import { useMaterialApplication } from './useMaterialApplication.js';
+import { resolveObject3D } from '../utils/resolveObject3D.js';
 ;
 // import { animateUniforms, cacheChildrenWithMaterials } from "~/utils/materialUtils";
 const DEFAULT_TUBE_RADIUS = 0.01;
@@ -162,9 +163,20 @@ function disposeGroup(group) {
     });
 }
 // ─── Hook ─────────────────────────────────────────────────────────────────────
-export function useObjectEdges(objectId, edgesSettings) {
+export function useObjectEdges(objectId, edgesSettings, objectSource) {
     const childrenWithMaterialsRef = useRef([]);
-    const object = findById(objectId);
+    const edgesEnabled = !!edgesSettings?.enabled;
+    // Resolved in an effect, never during render: a ref only attaches after the
+    // render that mounts it, and findById is a full scene traverse. Gating on
+    // `enabled` keeps the many objects with no edges from paying for it at all.
+    const [object, setObject] = useState(null);
+    useEffect(() => {
+        if (!edgesEnabled) {
+            setObject(null);
+            return;
+        }
+        setObject(resolveObject3D(objectSource) ?? findById(objectId));
+    }, [edgesEnabled, objectId, objectSource]);
     const edgesGroup = useMemo(() => {
         if (!object || !edgesSettings.enabled)
             return null;

package/dist/hooks/useObjectEffects.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useObjectEffects.d.ts","sourceRoot":"","sources":["../../src/hooks/useObjectEffects.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,MAAM,WAAW,kBAAkB;IAC/B,cAAc,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC5B,eAAe,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CAChC;AAED,MAAM,WAAW,sBAAsB;IACnC,YAAY,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3E,qBAAqB,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACpF,iBAAiB,EAAE,CAAC,MAAM,EAAE,QAAQ,KAAK,IAAI,CAAC;IAC9C,UAAU,EAAE,CAAC,MAAM,EAAE,QAAQ,KAAK,IAAI,CAAC;IACvC,UAAU,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC;IAC5C,SAAS,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC;CAC9C;AAED,MAAM,WAAW,sBAAuB,SAAQ,sBAAsB;IAClE,cAAc,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC;IACpD,eAAe,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC;CACxD;AAED;;GAEG;AACH,wBAAgB,gBAAgB,IAAI,sBAAsB,CAoJzD;AACD,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"useObjectEffects.d.ts","sourceRoot":"","sources":["../../src/hooks/useObjectEffects.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,MAAM,WAAW,kBAAkB;IAC/B,cAAc,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC5B,eAAe,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CAChC;AAED,MAAM,WAAW,sBAAsB;IACnC,YAAY,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3E,qBAAqB,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACpF,iBAAiB,EAAE,CAAC,MAAM,EAAE,QAAQ,KAAK,IAAI,CAAC;IAC9C,UAAU,EAAE,CAAC,MAAM,EAAE,QAAQ,KAAK,IAAI,CAAC;IACvC,UAAU,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC;IAC5C,SAAS,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC;CAC9C;AAED,MAAM,WAAW,sBAAuB,SAAQ,sBAAsB;IAClE,cAAc,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC;IACpD,eAAe,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC;CACxD;AAED;;GAEG;AACH,wBAAgB,gBAAgB,IAAI,sBAAsB,CAgJzD;AACD,eAAe,gBAAgB,CAAC"}

package/dist/hooks/useObjectEffects.js

@@ -18,7 +18,6 @@ export function useObjectEffects() {
     // Vanish Effect
     // ============================================================================
     const vanishObject = useCallback((object, duration = 1.0, ease = "power2.inOut") => {
-        console.log('[useObjectEffects] vanishObject:', object.uuid);
         object.traverse((child) => {
             if (child.isMesh) {
                 const mesh = child;
@@ -44,7 +43,6 @@ export function useObjectEffects() {
         vanishedObjects.current.add(object.uuid);
     }, []);
     const restoreVanishedObject = useCallback((object, duration = 1.0, ease = "power2.inOut") => {
-        console.log('[useObjectEffects] restoreVanishedObject:', object.uuid);
         object.visible = true;
         object.traverse((child) => {
             if (child.isMesh) {
@@ -72,7 +70,6 @@ export function useObjectEffects() {
     // Glow Effect
     // ============================================================================
     const animateGlowEffect = useCallback((object) => {
-        console.log('[useObjectEffects] animateGlowEffect:', object.uuid);
         object.traverse((child) => {
             if (child.isMesh) {
                 const mesh = child;
@@ -105,7 +102,6 @@ export function useObjectEffects() {
         glowingObjects.current.add(object.uuid);
     }, []);
     const removeGlow = useCallback((object) => {
-        console.log('[useObjectEffects] removeGlow:', object.uuid);
         object.traverse((child) => {
             if (child.isMesh) {
                 const mesh = child;

package/dist/hooks/useRegisterScene.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Publish the surrounding canvas's scene and renderer to `SceneStore`.
+ *
+ * `SceneStore` backs the id-based lookups in `findById` / `findByName`, which
+ * click interactions use to target objects *other* than the one clicked. It was
+ * previously only ever populated by `SceneBuilder`, so those lookups returned
+ * null for anything rendered into a host application's own <Canvas>.
+ *
+ * Call this from any component that renders 3dRise content inside a canvas it
+ * does not own. Must be called inside a <Canvas>.
+ *
+ * Note that `SceneStore` is a module-level singleton: with several independent
+ * canvases on one page, the last one mounted wins.
+ */
+export declare function useRegisterScene(): void;
+export default useRegisterScene;
+//# sourceMappingURL=useRegisterScene.d.ts.map

package/dist/hooks/useRegisterScene.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRegisterScene.d.ts","sourceRoot":"","sources":["../../src/hooks/useRegisterScene.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AACH,wBAAgB,gBAAgB,IAAI,IAAI,CAcvC;AAED,eAAe,gBAAgB,CAAC"}

package/dist/hooks/useRegisterScene.js

@@ -0,0 +1,33 @@
+import { useEffect } from 'react';
+import { useThree } from '@react-three/fiber';
+import { SceneStore } from '@3driseai/3drise-core';
+/**
+ * Publish the surrounding canvas's scene and renderer to `SceneStore`.
+ *
+ * `SceneStore` backs the id-based lookups in `findById` / `findByName`, which
+ * click interactions use to target objects *other* than the one clicked. It was
+ * previously only ever populated by `SceneBuilder`, so those lookups returned
+ * null for anything rendered into a host application's own <Canvas>.
+ *
+ * Call this from any component that renders 3dRise content inside a canvas it
+ * does not own. Must be called inside a <Canvas>.
+ *
+ * Note that `SceneStore` is a module-level singleton: with several independent
+ * canvases on one page, the last one mounted wins.
+ */
+export function useRegisterScene() {
+    const scene = useThree(state => state.scene);
+    const gl = useThree(state => state.gl);
+    useEffect(() => {
+        SceneStore.scene = scene;
+        SceneStore.gl = gl;
+        return () => {
+            // Only clear what we set — another canvas may have taken over.
+            if (SceneStore.scene === scene)
+                SceneStore.scene = null;
+            if (SceneStore.gl === gl)
+                SceneStore.gl = null;
+        };
+    }, [scene, gl]);
+}
+export default useRegisterScene;

package/dist/hooks/useSequenceAnimation.d.ts

@@ -1,4 +1,4 @@
-import type { Object3D } from "three";
+import type { Object3DSource } from '../utils/resolveObject3D';
 /**
  * useSequenceAnimation
  *
@@ -9,6 +9,6 @@ import type { Object3D } from "three";
  * Designed to be called inside useObjectAnimation so that AnimatedObject stays
  * a thin group wrapper.
  */
-export declare const useSequenceAnimation: (objectId: string | undefined, objectRef: Object3D | null | undefined) => void;
+export declare const useSequenceAnimation: (objectId: string | undefined, objectSource?: Object3DSource) => void;
 export default useSequenceAnimation;
 //# sourceMappingURL=useSequenceAnimation.d.ts.map

package/dist/hooks/useSequenceAnimation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSequenceAnimation.d.ts","sourceRoot":"","sources":["../../src/hooks/useSequenceAnimation.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AA2BtC;;;;;;;;;GASG;AACH,eAAO,MAAM,oBAAoB,GAAI,UAAU,MAAM,GAAG,SAAS,EAAE,WAAW,QAAQ,GAAG,IAAI,GAAG,SAAS,KAAG,IAyN3G,CAAC;AACF,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"useSequenceAnimation.d.ts","sourceRoot":"","sources":["../../src/hooks/useSequenceAnimation.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAqB/D;;;;;;;;;GASG;AACH,eAAO,MAAM,oBAAoB,GAAI,UAAU,MAAM,GAAG,SAAS,EAAE,eAAe,cAAc,KAAG,IA6JlG,CAAC;AACF,eAAe,oBAAoB,CAAC"}