@ifc-lite/viewer 1.16.0 → 1.17.0

package/src/components/viewer/useRenderUpdates.ts

@@ -4,7 +4,10 @@
 
 /**
  * Render updates hook for the 3D viewport
- * Handles visibility/selection/section/hover state re-render effects
+ * Handles visibility/selection/section/hover state re-render effects.
+ *
+ * These effects update refs and request a render — the animation loop
+ * picks up the new state on the next frame.
  */
 
 import { useEffect, type MutableRefObject } from 'react';
@@ -56,7 +59,6 @@ export function useRenderUpdates(params: UseRenderUpdatesParams): void {
     isInitialized,
     theme,
     clearColorRef,
-    visualEnhancementRef,
     hiddenEntities,
     isolatedEntities,
     selectedEntityId,
@@ -66,14 +68,8 @@ export function useRenderUpdates(params: UseRenderUpdatesParams): void {
     sectionPlane,
     sectionRange,
     coordinateInfo,
-    hiddenEntitiesRef,
-    isolatedEntitiesRef,
-    selectedEntityIdRef,
-    selectedModelIndexRef,
-    selectedEntityIdsRef,
     sectionPlaneRef,
     sectionRangeRef,
-    activeToolRef,
     drawing2D,
     show3DOverlay,
     showHiddenLines,
@@ -81,20 +77,8 @@ export function useRenderUpdates(params: UseRenderUpdatesParams): void {
 
   // Theme-aware clear color update
   useEffect(() => {
-    // Update clear color when theme changes
     clearColorRef.current = getThemeClearColor(theme as 'light' | 'dark');
-    // Re-render with new clear color
-    const renderer = rendererRef.current;
-    if (renderer && isInitialized) {
-      renderer.render({
-        hiddenIds: hiddenEntitiesRef.current,
-        isolatedIds: isolatedEntitiesRef.current,
-        selectedId: selectedEntityIdRef.current,
-        selectedModelIndex: selectedModelIndexRef.current,
-        clearColor: clearColorRef.current,
-        visualEnhancement: visualEnhancementRef.current,
-      });
-    }
+    rendererRef.current?.requestRender();
   }, [theme, isInitialized]);
 
   // 2D section overlay: upload drawing data to renderer when available
@@ -102,16 +86,13 @@ export function useRenderUpdates(params: UseRenderUpdatesParams): void {
     const renderer = rendererRef.current;
     if (!renderer || !isInitialized) return;
 
-    // Only show overlay when section tool is active, we have a drawing, AND 3D overlay is enabled
     if (activeTool === 'section' && drawing2D && drawing2D.cutPolygons.length > 0 && show3DOverlay) {
-      // Convert Drawing2D format to renderer format
       const polygons: CutPolygon2D[] = drawing2D.cutPolygons.map((cp) => ({
         polygon: cp.polygon,
         ifcType: cp.ifcType,
-        expressId: cp.entityId,  // DrawingPolygon uses entityId
+        expressId: cp.entityId,
       }));
 
-      // Include linework from the generated drawing on the section plane overlay.
       const lines: DrawingLine2D[] = drawing2D.lines
         .filter((line) => showHiddenLines || line.visibility !== 'hidden')
         .map((line) => ({
@@ -119,36 +100,19 @@ export function useRenderUpdates(params: UseRenderUpdatesParams): void {
           category: line.category,
         }));
 
-      // Upload to renderer - will be drawn on the section plane
-      // Pass sectionRange to match exactly what render() uses for section plane position
       renderer.uploadSection2DOverlay(
         polygons,
         lines,
         sectionPlane.axis,
         sectionPlane.position,
-        sectionRangeRef.current ?? undefined,  // Same range as section plane
+        sectionRangeRef.current ?? undefined,
         sectionPlane.flipped
       );
     } else {
-      // Clear overlay when not in section mode, no drawing, or overlay disabled
       renderer.clearSection2DOverlay();
     }
 
-    // Re-render to show/hide overlay
-    renderer.render({
-      hiddenIds: hiddenEntitiesRef.current,
-      isolatedIds: isolatedEntitiesRef.current,
-      selectedId: selectedEntityIdRef.current,
-      selectedIds: selectedEntityIdsRef.current,
-      selectedModelIndex: selectedModelIndexRef.current,
-      clearColor: clearColorRef.current,
-      visualEnhancement: visualEnhancementRef.current,
-      sectionPlane: activeTool === 'section' ? {
-        ...sectionPlane,
-        min: sectionRangeRef.current?.min,
-        max: sectionRangeRef.current?.max,
-      } : undefined,
-    });
+    renderer.requestRender();
   }, [drawing2D, activeTool, sectionPlane, isInitialized, coordinateInfo, show3DOverlay, showHiddenLines]);
 
   // Re-render when visibility, selection, or section plane changes
@@ -156,21 +120,7 @@ export function useRenderUpdates(params: UseRenderUpdatesParams): void {
     const renderer = rendererRef.current;
     if (!renderer || !isInitialized) return;
 
-    renderer.render({
-      hiddenIds: hiddenEntities,
-      isolatedIds: isolatedEntities,
-      selectedId: selectedEntityId,
-      selectedIds: selectedEntityIds,
-      selectedModelIndex,
-      clearColor: clearColorRef.current,
-      visualEnhancement: visualEnhancementRef.current,
-      sectionPlane: activeTool === 'section' ? {
-        ...sectionPlane,
-        min: sectionRange?.min,
-        max: sectionRange?.max,
-      } : undefined,
-      buildingRotation: coordinateInfo?.buildingRotation,
-    });
+    renderer.requestRender();
   }, [hiddenEntities, isolatedEntities, selectedEntityId, selectedEntityIds, selectedModelIndex, isInitialized, sectionPlane, activeTool, sectionRange, coordinateInfo?.buildingRotation]);
 }
 

package/src/components/viewer/useTouchControls.ts

@@ -37,6 +37,7 @@ export interface UseTouchControlsParams {
   sectionPlaneRef: MutableRefObject<SectionPlane>;
   sectionRangeRef: MutableRefObject<{ min: number; max: number } | null>;
   geometryRef: MutableRefObject<MeshData[] | null>;
+  isInteractingRef: MutableRefObject<boolean>;
   handlePickForSelection: (pickResult: PickResult | null) => void;
   getPickOptions: () => { isStreaming: boolean; hiddenIds: Set<number>; isolatedIds: Set<number> | null };
 }
@@ -56,6 +57,7 @@ export function useTouchControls(params: UseTouchControlsParams): void {
     sectionPlaneRef,
     sectionRangeRef,
     geometryRef,
+    isInteractingRef,
     handlePickForSelection,
     getPickOptions,
   } = params;
@@ -90,22 +92,38 @@ export function useTouchControls(params: UseTouchControlsParams): void {
         };
         touchState.didMove = false;
 
-        // Set orbit pivot to what user touches (same as mouse click behavior)
+        // Set orbit pivot to the 3D point under the finger.
+        // On miss, place pivot at current distance along the finger ray.
         const rect = canvas.getBoundingClientRect();
-        const x = touchState.touches[0].clientX - rect.left;
-        const y = touchState.touches[0].clientY - rect.top;
-
-        // Uses visibility filtering so hidden elements don't affect orbit pivot
-        const pickResult = await renderer.pick(x, y, getPickOptions());
-        if (pickResult !== null) {
-          const center = getEntityCenter(geometryRef.current, pickResult.expressId);
+        const tx = touchState.touches[0].clientX - rect.left;
+        const ty = touchState.touches[0].clientY - rect.top;
+        const hit = renderer.raycastScene(tx, ty, {
+          hiddenIds: hiddenEntitiesRef.current,
+          isolatedIds: isolatedEntitiesRef.current,
+        });
+        if (hit?.intersection) {
+          camera.setOrbitCenter(hit.intersection.point);
+        } else if (selectedEntityIdRef.current) {
+          const center = getEntityCenter(geometryRef.current, selectedEntityIdRef.current);
           if (center) {
-            camera.setOrbitPivot(center);
+            camera.setOrbitCenter(center);
           } else {
-            camera.setOrbitPivot(null);
+            camera.setOrbitCenter(null);
           }
         } else {
-          camera.setOrbitPivot(null);
+          const ray = camera.unprojectToRay(tx, ty, canvas.width, canvas.height);
+          const target = camera.getTarget();
+          const toTarget = {
+            x: target.x - ray.origin.x,
+            y: target.y - ray.origin.y,
+            z: target.z - ray.origin.z,
+          };
+          const d = Math.max(1, toTarget.x * ray.direction.x + toTarget.y * ray.direction.y + toTarget.z * ray.direction.z);
+          camera.setOrbitCenter({
+            x: ray.origin.x + ray.direction.x * d,
+            y: ray.origin.y + ray.direction.y * d,
+            z: ray.origin.z + ray.direction.z * d,
+          });
         }
       } else if (touchState.touches.length === 1) {
         // Single touch after multi-touch - just update center for orbit
@@ -144,19 +162,8 @@ export function useTouchControls(params: UseTouchControlsParams): void {
           x: touchState.touches[0].clientX,
           y: touchState.touches[0].clientY,
         };
-        renderer.render({
-          hiddenIds: hiddenEntitiesRef.current,
-          isolatedIds: isolatedEntitiesRef.current,
-          selectedId: selectedEntityIdRef.current,
-          selectedModelIndex: selectedModelIndexRef.current,
-          clearColor: clearColorRef.current,
-          isInteracting: true,
-          sectionPlane: activeToolRef.current === 'section' ? {
-            ...sectionPlaneRef.current,
-            min: sectionRangeRef.current?.min,
-            max: sectionRangeRef.current?.max,
-          } : undefined,
-        });
+        isInteractingRef.current = true;
+        renderer.requestRender();
       } else if (touchState.touches.length === 2) {
         const dx1 = touchState.touches[1].clientX - touchState.touches[0].clientX;
         const dy1 = touchState.touches[1].clientY - touchState.touches[0].clientY;
@@ -174,19 +181,8 @@ export function useTouchControls(params: UseTouchControlsParams): void {
 
         touchState.lastDistance = distance;
         touchState.lastCenter = { x: centerX, y: centerY };
-        renderer.render({
-          hiddenIds: hiddenEntitiesRef.current,
-          isolatedIds: isolatedEntitiesRef.current,
-          selectedId: selectedEntityIdRef.current,
-          selectedModelIndex: selectedModelIndexRef.current,
-          clearColor: clearColorRef.current,
-          isInteracting: true,
-          sectionPlane: activeToolRef.current === 'section' ? {
-            ...sectionPlaneRef.current,
-            min: sectionRangeRef.current?.min,
-            max: sectionRangeRef.current?.max,
-          } : undefined,
-        });
+        isInteractingRef.current = true;
+        renderer.requestRender();
       }
     };
 
@@ -196,9 +192,16 @@ export function useTouchControls(params: UseTouchControlsParams): void {
       const wasMultiTouch = touchState.multiTouch;
       touchState.touches = Array.from(e.touches);
 
+      // Only clear interaction when all fingers are lifted (gesture truly ended).
+      // Clearing earlier would briefly drop interaction mode during 2-finger → 1-finger
+      // transitions, triggering an expensive full-quality render mid-gesture.
+      if (touchState.touches.length === 0 && isInteractingRef.current) {
+        isInteractingRef.current = false;
+        renderer.requestRender();
+      }
+
       if (touchState.touches.length === 0) {
         camera.stopInertia();
-        camera.setOrbitPivot(null);
 
         // Tap-to-select: detect quick tap without significant movement
         const tapDuration = Date.now() - touchState.tapStartTime;
@@ -208,13 +211,12 @@ export function useTouchControls(params: UseTouchControlsParams): void {
         // - Was a single-finger touch (not after multi-touch gesture)
         // - Tap was quick (< 300ms)
         // - Didn't move significantly
-        // - Tool supports selection (not orbit/pan/walk/measure)
+        // - Tool supports selection (not pan/walk/measure)
         if (
           previousTouchCount === 1 &&
           !wasMultiTouch &&
           tapDuration < 300 &&
           !touchState.didMove &&
-          tool !== 'orbit' &&
           tool !== 'pan' &&
           tool !== 'walk' &&
           tool !== 'measure'
@@ -232,14 +234,27 @@ export function useTouchControls(params: UseTouchControlsParams): void {
       }
     };
 
+    // Also reset interaction on touchcancel — mobile browsers can cancel
+    // gestures (system gestures, tab switch, lost focus) without touchend.
+    const handleTouchCancel = () => {
+      if (isInteractingRef.current) {
+        isInteractingRef.current = false;
+        renderer.requestRender();
+      }
+      touchState.touches = [];
+      touchState.multiTouch = false;
+    };
+
     canvas.addEventListener('touchstart', handleTouchStart);
     canvas.addEventListener('touchmove', handleTouchMove);
     canvas.addEventListener('touchend', handleTouchEnd);
+    canvas.addEventListener('touchcancel', handleTouchCancel);
 
     return () => {
       canvas.removeEventListener('touchstart', handleTouchStart);
       canvas.removeEventListener('touchmove', handleTouchMove);
       canvas.removeEventListener('touchend', handleTouchEnd);
+      canvas.removeEventListener('touchcancel', handleTouchCancel);
     };
   }, [isInitialized]);
 }

package/src/hooks/bcfIdLookup.ts

@@ -0,0 +1,70 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
+
+/**
+ * Shared BCF ID lookup utilities.
+ *
+ * Provides conversion between IFC GlobalId strings and expressIds,
+ * accounting for multi-model federation offsets and single-model fallback.
+ */
+
+import type { FederatedModel, IfcDataStore } from '@/store/types';
+
+export interface IdLookupResult {
+  expressId: number;
+  modelId: string;
+}
+
+/**
+ * Convert IFC GlobalId string to expressId (with model offset for federation).
+ * Searches federated models first, then falls back to the legacy single-model store.
+ */
+export function globalIdToExpressId(
+  globalIdString: string,
+  models: Map<string, FederatedModel>,
+  ifcDataStore: IfcDataStore | null | undefined,
+): IdLookupResult | null {
+  // Multi-model path
+  for (const [modelId, model] of models.entries()) {
+    const localExpressId = model.ifcDataStore?.entities?.getExpressIdByGlobalId(globalIdString);
+    if (localExpressId !== undefined && localExpressId > 0) {
+      const offset = model.idOffset ?? 0;
+      return { expressId: localExpressId + offset, modelId };
+    }
+  }
+  // Single-model fallback
+  if (models.size === 0 && ifcDataStore?.entities) {
+    const localExpressId = ifcDataStore.entities.getExpressIdByGlobalId(globalIdString);
+    if (localExpressId !== undefined && localExpressId > 0) {
+      return { expressId: localExpressId, modelId: 'legacy' };
+    }
+  }
+  return null;
+}
+
+/**
+ * Convert expressId to IFC GlobalId string (reversing federation offset).
+ * Searches federated models first, then falls back to the legacy single-model store.
+ */
+export function expressIdToGlobalId(
+  expressId: number,
+  models: Map<string, FederatedModel>,
+  ifcDataStore: IfcDataStore | null | undefined,
+): string | null {
+  // Multi-model path: search federated models
+  for (const model of models.values()) {
+    const offset = model.idOffset ?? 0;
+    const localExpressId = expressId - offset;
+    if (localExpressId > 0 && localExpressId <= (model.maxExpressId ?? Infinity)) {
+      const globalIdString = model.ifcDataStore?.entities?.getGlobalId(localExpressId);
+      if (globalIdString) return globalIdString;
+    }
+  }
+  // Single-model fallback: use legacy ifcDataStore directly
+  if (models.size === 0 && ifcDataStore?.entities) {
+    const globalIdString = ifcDataStore.entities.getGlobalId(expressId);
+    if (globalIdString) return globalIdString;
+  }
+  return null;
+}

package/src/hooks/useBCF.ts

@@ -22,6 +22,10 @@ import {
   type ViewerBounds,
 } from '@ifc-lite/bcf';
 import type { Renderer } from '@ifc-lite/renderer';
+import {
+  globalIdToExpressId as globalIdToExpressIdLookup,
+  expressIdToGlobalId as expressIdToGlobalIdLookup,
+} from './bcfIdLookup';
 
 // ============================================================================
 // Types
@@ -122,6 +126,8 @@ export function useBCF(options: UseBCFOptions = {}): UseBCFResult {
 
   // Get coordinate info for bounds
   const models = useViewerStore((s) => s.models);
+  // Legacy single-model data store (used when models Map is empty)
+  const ifcDataStore = useViewerStore((s) => s.ifcDataStore);
 
   /**
    * Get the canvas element (local ref or global)
@@ -225,22 +231,9 @@ export function useBCF(options: UseBCFOptions = {}): UseBCFResult {
    * Handles multi-model federation by finding the correct model and subtracting offset
    */
   const expressIdToGlobalId = useCallback(
-    (expressId: number): string | null => {
-      for (const model of models.values()) {
-        const offset = model.idOffset ?? 0;
-        const localExpressId = expressId - offset;
-
-        // Check if this expressId belongs to this model's range
-        if (localExpressId > 0 && localExpressId <= (model.maxExpressId ?? Infinity)) {
-          const globalIdString = model.ifcDataStore?.entities?.getGlobalId(localExpressId);
-          if (globalIdString) {
-            return globalIdString;
-          }
-        }
-      }
-      return null;
-    },
-    [models]
+    (expressId: number): string | null =>
+      expressIdToGlobalIdLookup(expressId, models, ifcDataStore),
+    [models, ifcDataStore]
   );
 
   /**
@@ -248,21 +241,9 @@ export function useBCF(options: UseBCFOptions = {}): UseBCFResult {
    * Returns { expressId, modelId } or null if not found
    */
   const globalIdToExpressId = useCallback(
-    (globalIdString: string): { expressId: number; modelId: string } | null => {
-      for (const [modelId, model] of models.entries()) {
-        const localExpressId = model.ifcDataStore?.entities?.getExpressIdByGlobalId(globalIdString);
-        if (localExpressId !== undefined && localExpressId > 0) {
-          // Add model offset for federation
-          const offset = model.idOffset ?? 0;
-          return {
-            expressId: localExpressId + offset,
-            modelId,
-          };
-        }
-      }
-      return null;
-    },
-    [models]
+    (globalIdString: string): { expressId: number; modelId: string } | null =>
+      globalIdToExpressIdLookup(globalIdString, models, ifcDataStore),
+    [models, ifcDataStore]
   );
 
   /**

package/src/hooks/useIfcCache.ts

@@ -17,7 +17,7 @@ import {
   type GeometryData,
 } from '@ifc-lite/cache';
 import { SpatialHierarchyBuilder, StepTokenizer, buildCompactEntityIndex, extractLengthUnitScale, type IfcDataStore } from '@ifc-lite/parser';
-import { buildSpatialIndex } from '@ifc-lite/spatial';
+import { buildSpatialIndexGuarded } from '../utils/loadingUtils.js';
 import type { MeshData } from '@ifc-lite/geometry';
 
 import { useShallow } from 'zustand/react/shallow';
@@ -191,25 +191,7 @@ export function useIfcCache() {
         // Set data store
         setIfcDataStore(dataStore);
 
-        // Build spatial index in background (non-blocking)
-        if (meshes.length > 0) {
-          const buildIndex = () => {
-            try {
-              const spatialIndex = buildSpatialIndex(meshes);
-              dataStore.spatialIndex = spatialIndex;
-              setIfcDataStore({ ...dataStore });
-            } catch (err) {
-              console.warn('[useIfcCache] Failed to build spatial index:', err);
-            }
-          };
-
-          if ('requestIdleCallback' in window) {
-            (window as any).requestIdleCallback(buildIndex, { timeout: 2000 });
-          } else {
-            // Fallback for browsers without requestIdleCallback
-            setTimeout(buildIndex, 100);
-          }
-        }
+        buildSpatialIndexGuarded(meshes, dataStore, setIfcDataStore);
       } else {
         setIfcDataStore(dataStore);
       }

package/src/hooks/useIfcFederation.ts

@@ -16,7 +16,7 @@ import { useViewerStore, type FederatedModel, type SchemaVersion } from '../stor
 import { IfcParser, detectFormat, parseIfcx, parseFederatedIfcx, type IfcDataStore, type FederatedIfcxParseResult } from '@ifc-lite/parser';
 import { GeometryProcessor, GeometryQuality, type MeshData, type CoordinateInfo } from '@ifc-lite/geometry';
 import { IfcQuery } from '@ifc-lite/query';
-import { buildSpatialIndex } from '@ifc-lite/spatial';
+import { buildSpatialIndexGuarded } from '../utils/loadingUtils.js';
 import { loadGLBToMeshData } from '@ifc-lite/cache';
 
 import { getDynamicBatchConfig } from '../utils/ifcConfig.js';
@@ -333,16 +333,6 @@ export function useIfcFederation() {
           }
         }
 
-        // Build spatial index
-        if (allMeshes.length > 0) {
-          try {
-            const spatialIndex = buildSpatialIndex(allMeshes);
-            parsedDataStore.spatialIndex = spatialIndex;
-          } catch (err) {
-            console.warn('[useIfc] Failed to build spatial index:', err);
-          }
-        }
-
         parsedGeometry = {
           meshes: allMeshes,
           totalVertices: allMeshes.reduce((sum, m) => sum + m.positions.length / 3, 0),
@@ -463,6 +453,10 @@ export function useIfcFederation() {
         }
       }
 
+      // Build spatial index AFTER ID offset + RTC alignment so it stores
+      // correct globalIds and final world-space positions.
+      buildSpatialIndexGuarded(parsedGeometry.meshes, parsedDataStore, setIfcDataStore);
+
       // Create the federated model with offset info
       const federatedModel: FederatedModel = {
         id: modelId,