@ifc-lite/viewer 1.17.2 → 1.17.3

package/src/components/viewer/properties/LocationMap.tsx

@@ -0,0 +1,289 @@
+/* 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/. */
+
+/**
+ * LocationMap — a compact MapLibre GL JS minimap that shows the model's
+ * real-world position derived from IfcMapConversion + IfcProjectedCRS.
+ *
+ * Renders as a collapsible panel below the georeferencing fields.
+ * Includes links to Google Maps, OpenStreetMap, and Google Earth (KMZ export).
+ */
+
+import { useEffect, useRef, useState, useMemo, useCallback } from 'react';
+import { Map as MapIcon, ExternalLink, Loader2, MapPinOff, Globe2 } from 'lucide-react';
+import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
+import type { MapConversion, ProjectedCRS } from '@ifc-lite/parser';
+import type { CoordinateInfo, GeometryResult } from '@ifc-lite/geometry';
+import { GLTFExporter } from '@ifc-lite/export';
+import { reprojectToLatLon, type LatLon } from '@/lib/geo/reproject';
+import { buildKmz, ifcAngleToKmlHeading } from '@/lib/geo/kmz-exporter';
+
+// Lazy-load maplibre-gl to avoid bloating the initial bundle
+let maplibrePromise: Promise<typeof import('maplibre-gl')> | null = null;
+function loadMaplibre() {
+  if (!maplibrePromise) {
+    maplibrePromise = import('maplibre-gl');
+  }
+  return maplibrePromise;
+}
+
+export interface LocationMapProps {
+  mapConversion?: MapConversion;
+  projectedCRS?: ProjectedCRS;
+  /** Coordinate info from the model's GeometryResult (includes bounds and RTC offset) */
+  coordinateInfo?: CoordinateInfo;
+  /** Geometry result for KMZ export (optional — KMZ button hidden if not provided) */
+  geometryResult?: GeometryResult | null;
+}
+
+type MapState = 'idle' | 'loading' | 'ready' | 'error';
+
+export function LocationMap({ mapConversion, projectedCRS, coordinateInfo, geometryResult }: LocationMapProps) {
+  const containerRef = useRef<HTMLDivElement>(null);
+  const mapRef = useRef<InstanceType<typeof import('maplibre-gl').Map> | null>(null);
+  const markerRef = useRef<InstanceType<typeof import('maplibre-gl').Marker> | null>(null);
+
+  const [mapState, setMapState] = useState<MapState>('idle');
+  const [latLon, setLatLon] = useState<LatLon | null>(null);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (!mapConversion || !projectedCRS) {
+      setLatLon(null);
+      setError(null);
+      return;
+    }
+
+    let cancelled = false;
+    setMapState('loading');
+    setError(null);
+
+    reprojectToLatLon(mapConversion, projectedCRS, coordinateInfo).then(result => {
+      if (cancelled) return;
+      if (result) {
+        setLatLon(result);
+        setMapState('ready');
+      } else {
+        setLatLon(null);
+        setError('Could not resolve projection — EPSG code may be unsupported');
+        setMapState('error');
+      }
+    });
+
+    return () => { cancelled = true; };
+  }, [mapConversion, projectedCRS, coordinateInfo]);
+
+  // Initialize/update the map when we have a valid lat/lon
+  useEffect(() => {
+    if (!latLon || !containerRef.current) return;
+
+    let cancelled = false;
+
+    loadMaplibre().then(maplibregl => {
+      if (cancelled || !containerRef.current) return;
+
+      // If map already exists, just fly to new position
+      if (mapRef.current) {
+        mapRef.current.flyTo({ center: [latLon.lon, latLon.lat], zoom: 15, duration: 1200 });
+        if (markerRef.current) {
+          markerRef.current.setLngLat([latLon.lon, latLon.lat]);
+        }
+        return;
+      }
+
+      // Create new map
+      const map = new maplibregl.Map({
+        container: containerRef.current,
+        style: 'https://basemaps.cartocdn.com/gl/positron-gl-style/style.json',
+        center: [latLon.lon, latLon.lat],
+        zoom: 15,
+        attributionControl: false,
+        interactive: true,
+      });
+
+      map.addControl(new maplibregl.NavigationControl({ showCompass: false }), 'top-right');
+      map.addControl(new maplibregl.AttributionControl({ compact: false }), 'bottom-right');
+
+      // Add marker at model location
+      const marker = new maplibregl.Marker({ color: '#14b8a6' })
+        .setLngLat([latLon.lon, latLon.lat])
+        .addTo(map);
+
+      mapRef.current = map;
+      markerRef.current = marker;
+    });
+
+    return () => {
+      cancelled = true;
+    };
+  }, [latLon]);
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      markerRef.current?.remove();
+      markerRef.current = null;
+      mapRef.current?.remove();
+      mapRef.current = null;
+    };
+  }, []);
+
+  const googleMapsUrl = useMemo(() => {
+    if (!latLon) return null;
+    return `https://www.google.com/maps?q=${latLon.lat},${latLon.lon}`;
+  }, [latLon]);
+
+  const openStreetMapUrl = useMemo(() => {
+    if (!latLon) return null;
+    return `https://www.openstreetmap.org/?mlat=${latLon.lat}&mlon=${latLon.lon}#map=17/${latLon.lat}/${latLon.lon}`;
+  }, [latLon]);
+
+  const handleExportKmz = useCallback(() => {
+    if (!latLon || !geometryResult || !mapConversion) return;
+    try {
+      const exporter = new GLTFExporter(geometryResult);
+      const glb = new Uint8Array(exporter.exportGLB({ includeMetadata: true }));
+      const heading = ifcAngleToKmlHeading(mapConversion.xAxisAbscissa, mapConversion.xAxisOrdinate);
+      const kmz = buildKmz({
+        latLon,
+        altitude: mapConversion.orthogonalHeight,
+        heading,
+        glb,
+        name: 'IFC Model',
+      });
+      const blob = new Blob([kmz], { type: 'application/vnd.google-earth.kmz' });
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement('a');
+      a.href = url;
+      a.download = 'model.kmz';
+      a.click();
+      URL.revokeObjectURL(url);
+    } catch (err) {
+      console.error('KMZ export failed:', err);
+    }
+  }, [latLon, geometryResult, mapConversion]);
+
+  const isDarkRef = useRef(false);
+
+  const handleStyleToggle = useCallback(() => {
+    if (!mapRef.current) return;
+    isDarkRef.current = !isDarkRef.current;
+    mapRef.current.setStyle(
+      isDarkRef.current
+        ? 'https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json'
+        : 'https://basemaps.cartocdn.com/gl/positron-gl-style/style.json',
+    );
+    // Re-add marker after style fully loads
+    if (markerRef.current && mapRef.current) {
+      mapRef.current.once('style.load', () => {
+        if (markerRef.current && mapRef.current) {
+          markerRef.current.addTo(mapRef.current);
+        }
+      });
+    }
+  }, []);
+
+  // Nothing to show if no georeferencing data
+  if (!mapConversion || !projectedCRS) {
+    return null;
+  }
+
+  return (
+    <div className="border-t border-zinc-100 dark:border-zinc-900">
+      {/* Header */}
+      <div className="flex items-center gap-2 px-3 py-1.5">
+        <MapIcon className="h-3 w-3 text-teal-500 shrink-0" />
+        <span className="font-bold text-[11px] text-zinc-700 dark:text-zinc-300 uppercase tracking-wide flex-1">
+          Location
+        </span>
+        {latLon && (
+          <span className="text-[10px] font-mono text-teal-600/70 dark:text-teal-500/60">
+            {latLon.lat.toFixed(5)}, {latLon.lon.toFixed(5)}
+          </span>
+        )}
+      </div>
+
+      {/* Map container */}
+      {mapState === 'loading' && (
+        <div className="flex items-center justify-center h-[180px] bg-zinc-50 dark:bg-zinc-900/50">
+          <Loader2 className="h-4 w-4 text-teal-500 animate-spin" />
+          <span className="text-[10px] text-zinc-400 ml-2">Resolving coordinates...</span>
+        </div>
+      )}
+
+      {mapState === 'error' && (
+        <div className="flex items-center justify-center h-[60px] bg-zinc-50 dark:bg-zinc-900/50 gap-2 px-3">
+          <MapPinOff className="h-3.5 w-3.5 text-zinc-400 shrink-0" />
+          <span className="text-[10px] text-zinc-400">{error}</span>
+        </div>
+      )}
+
+      {(mapState === 'ready' || (mapState === 'loading' && latLon)) && (
+        <>
+          <div
+            ref={containerRef}
+            className="h-[180px] w-full [&_.maplibregl-ctrl-attrib]:!text-[7px] [&_.maplibregl-ctrl-attrib]:!bg-white/40 [&_.maplibregl-ctrl-attrib]:dark:!bg-black/30 [&_.maplibregl-ctrl-attrib]:!py-0 [&_.maplibregl-ctrl-attrib]:!px-1 [&_.maplibregl-ctrl-attrib]:!shadow-none [&_.maplibregl-ctrl-attrib]:!text-zinc-400/70 [&_.maplibregl-ctrl-attrib_a]:!text-zinc-400/70 [&_.maplibregl-ctrl-attrib]:!leading-normal"
+            style={{ minHeight: 180 }}
+          />
+
+          {/* Action links */}
+          <div className="flex items-center gap-3 px-3 py-1.5 border-t border-zinc-100 dark:border-zinc-900">
+            {googleMapsUrl && (
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <a
+                    href={googleMapsUrl}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="flex items-center gap-1 text-[10px] text-teal-600 dark:text-teal-400 hover:text-teal-800 dark:hover:text-teal-300 transition-colors"
+                  >
+                    <ExternalLink className="h-2.5 w-2.5" />
+                    Google Maps
+                  </a>
+                </TooltipTrigger>
+                <TooltipContent>Open model location in Google Maps</TooltipContent>
+              </Tooltip>
+            )}
+            {openStreetMapUrl && (
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <a
+                    href={openStreetMapUrl}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="flex items-center gap-1 text-[10px] text-teal-600 dark:text-teal-400 hover:text-teal-800 dark:hover:text-teal-300 transition-colors"
+                  >
+                    <ExternalLink className="h-2.5 w-2.5" />
+                    OpenStreetMap
+                  </a>
+                </TooltipTrigger>
+                <TooltipContent>Open model location in OpenStreetMap</TooltipContent>
+              </Tooltip>
+            )}
+            {geometryResult && (
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <button
+                    onClick={handleExportKmz}
+                    className="flex items-center gap-1 text-[10px] text-teal-600 dark:text-teal-400 hover:text-teal-800 dark:hover:text-teal-300 transition-colors"
+                  >
+                    <Globe2 className="h-2.5 w-2.5" />
+                    Google Earth
+                  </button>
+                </TooltipTrigger>
+                <TooltipContent>Download KMZ to open in Google Earth with model at correct position</TooltipContent>
+              </Tooltip>
+            )}
+            <button
+              onClick={handleStyleToggle}
+              className="ml-auto text-[10px] text-zinc-500 dark:text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-300 transition-colors"
+            >
+              Toggle style
+            </button>
+          </div>
+        </>
+      )}
+    </div>
+  );
+}

package/src/components/viewer/properties/ModelMetadataPanel.tsx

@@ -18,11 +18,11 @@ import {
   Hash,
   Database,
   Building2,
-  Globe,
   Ruler,
 } from 'lucide-react';
 import { ScrollArea } from '@/components/ui/scroll-area';
 import { PropertySetCard } from './PropertySetCard';
+import { GeoreferencingPanel } from './GeoreferencingPanel';
 import type { PropertySet } from './encodingUtils';
 import type { FederatedModel } from '@/store/types';
 import { extractGeoreferencingOnDemand, extractLengthUnitScale, type IfcDataStore } from '@ifc-lite/parser';
@@ -147,7 +147,7 @@ export function ModelMetadataPanel({ model }: { model: FederatedModel }) {
                 {formatDate(model.loadedAt)}
               </span>
             </div>
-            {dataStore && (
+            {dataStore && dataStore.parseTime != null && (
               <div className="flex items-center gap-3 px-3 py-2">
                 <Clock className="h-3.5 w-3.5 text-zinc-400 shrink-0" />
                 <span className="text-xs text-zinc-500">Parse Time</span>
@@ -212,74 +212,7 @@ export function ModelMetadataPanel({ model }: { model: FederatedModel }) {
         </div>
 
         {/* Georeferencing */}
-        {georef && (
-          <div className="border-b border-zinc-200 dark:border-zinc-800">
-            <div className="p-3 bg-teal-50/50 dark:bg-teal-950/20">
-              <div className="flex items-center gap-2">
-                <Globe className="h-3.5 w-3.5 text-teal-600 dark:text-teal-400" />
-                <h4 className="font-bold text-xs uppercase tracking-wide text-teal-700 dark:text-teal-300">
-                  Georeferencing
-                </h4>
-              </div>
-            </div>
-            <div className="divide-y divide-zinc-100 dark:divide-zinc-900">
-              {georef.projectedCRS?.name && (
-                <div className="flex items-center gap-3 px-3 py-2">
-                  <span className="text-xs text-zinc-500 shrink-0">CRS</span>
-                  <span className="text-xs font-mono text-teal-700 dark:text-teal-400 ml-auto truncate max-w-[65%]">
-                    {georef.projectedCRS.name}
-                  </span>
-                </div>
-              )}
-              {georef.projectedCRS?.geodeticDatum && (
-                <div className="flex items-center gap-3 px-3 py-2">
-                  <span className="text-xs text-zinc-500 shrink-0">Geodetic Datum</span>
-                  <span className="text-xs font-mono text-teal-700 dark:text-teal-400 ml-auto">
-                    {georef.projectedCRS.geodeticDatum}
-                  </span>
-                </div>
-              )}
-              {georef.projectedCRS?.mapProjection && (
-                <div className="flex items-center gap-3 px-3 py-2">
-                  <span className="text-xs text-zinc-500 shrink-0">Projection</span>
-                  <span className="text-xs font-mono text-teal-700 dark:text-teal-400 ml-auto truncate max-w-[65%]">
-                    {georef.projectedCRS.mapProjection}
-                  </span>
-                </div>
-              )}
-              {georef.mapConversion && (
-                <>
-                  <div className="flex items-center gap-3 px-3 py-2">
-                    <span className="text-xs text-zinc-500 shrink-0">Eastings</span>
-                    <span className="text-xs font-mono text-teal-700 dark:text-teal-400 ml-auto tabular-nums">
-                      {georef.mapConversion.eastings.toFixed(3)}
-                    </span>
-                  </div>
-                  <div className="flex items-center gap-3 px-3 py-2">
-                    <span className="text-xs text-zinc-500 shrink-0">Northings</span>
-                    <span className="text-xs font-mono text-teal-700 dark:text-teal-400 ml-auto tabular-nums">
-                      {georef.mapConversion.northings.toFixed(3)}
-                    </span>
-                  </div>
-                  <div className="flex items-center gap-3 px-3 py-2">
-                    <span className="text-xs text-zinc-500 shrink-0">Height</span>
-                    <span className="text-xs font-mono text-teal-700 dark:text-teal-400 ml-auto tabular-nums">
-                      {georef.mapConversion.orthogonalHeight.toFixed(3)}
-                    </span>
-                  </div>
-                  {georef.mapConversion.scale != null && georef.mapConversion.scale !== 1.0 && (
-                    <div className="flex items-center gap-3 px-3 py-2">
-                      <span className="text-xs text-zinc-500 shrink-0">Scale</span>
-                      <span className="text-xs font-mono text-teal-700 dark:text-teal-400 ml-auto">
-                        {georef.mapConversion.scale}
-                      </span>
-                    </div>
-                  )}
-                </>
-              )}
-            </div>
-          </div>
-        )}
+        <GeoreferencingPanel georef={georef} modelId={model.id} enableEditing schemaVersion={model.schemaVersion} coordinateInfo={model.geometryResult?.coordinateInfo} geometryResult={model.geometryResult} />
 
         {/* IfcProject Data */}
         {projectData && (

package/src/hooks/bcfIdLookup.ts

@@ -9,7 +9,9 @@
  * accounting for multi-model federation offsets and single-model fallback.
  */
 
-import type { FederatedModel, IfcDataStore } from '@/store/types';
+import type { FederatedModel } from '@/store/types';
+import type { IfcDataStore } from '@ifc-lite/parser';
+import { fromGlobalIdFromModels, toGlobalIdFromModels } from '@/store/globalId';
 
 export interface IdLookupResult {
   expressId: number;
@@ -29,8 +31,10 @@ export function globalIdToExpressId(
   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 };
+      return {
+        expressId: toGlobalIdFromModels(models, modelId, localExpressId),
+        modelId,
+      };
     }
   }
   // Single-model fallback
@@ -52,14 +56,12 @@ export function expressIdToGlobalId(
   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;
-    }
+  // Multi-model path: resolve through the centralized reverse conversion helper
+  const resolved = fromGlobalIdFromModels(models, expressId);
+  if (resolved && resolved.modelId !== 'legacy') {
+    const model = models.get(resolved.modelId);
+    const globalIdString = model?.ifcDataStore?.entities?.getGlobalId(resolved.expressId);
+    if (globalIdString) return globalIdString;
   }
   // Single-model fallback: use legacy ifcDataStore directly
   if (models.size === 0 && ifcDataStore?.entities) {

package/src/hooks/ids/idsColorSystem.ts

@@ -11,6 +11,7 @@
 
 import type { IDSValidationReport } from '@ifc-lite/ids';
 import type { GeometryResult } from '@ifc-lite/geometry';
+import { toGlobalIdFromModels } from '../../store/globalId.js';
 
 /** RGBA color tuple in 0-1 range */
 export type ColorTuple = [number, number, number, number];
@@ -66,10 +67,7 @@ export function buildValidationColorUpdates(
   const globalIdsToUpdate = new Set<number>();
   for (const specResult of report.specificationResults) {
     for (const entityResult of specResult.entityResults) {
-      const model = models.get(entityResult.modelId);
-      const globalId = model
-        ? entityResult.expressId + (model.idOffset ?? 0)
-        : entityResult.expressId;
+      const globalId = toGlobalIdFromModels(models, entityResult.modelId, entityResult.expressId);
       globalIdsToUpdate.add(globalId);
     }
   }
@@ -86,10 +84,7 @@ export function buildValidationColorUpdates(
   // Process all entity results
   for (const specResult of report.specificationResults) {
     for (const entityResult of specResult.entityResults) {
-      const model = models.get(entityResult.modelId);
-      const globalId = model
-        ? entityResult.expressId + (model.idOffset ?? 0)
-        : entityResult.expressId;
+      const globalId = toGlobalIdFromModels(models, entityResult.modelId, entityResult.expressId);
 
       if (entityResult.passed && displayOptions.highlightPassed) {
         colorUpdates.set(globalId, passedClr);

package/src/hooks/useIDS.ts

@@ -213,12 +213,28 @@ export function useIDS(options: UseIDSOptions = {}): UseIDSResult {
   const setSelectedEntityId = useViewerStore((s) => s.setSelectedEntityId);
   const setSelectedEntity = useViewerStore((s) => s.setSelectedEntity);
   const setIsolatedEntities = useViewerStore((s) => s.setIsolatedEntities);
+  const toGlobalId = useViewerStore((s) => s.toGlobalId);
   const cameraCallbacks = useViewerStore((s) => s.cameraCallbacks);
   const geometryResult = useViewerStore((s) => s.geometryResult);
 
   // Ref to store original colors before IDS color overrides
   const originalColorsRef = useRef<Map<number, ColorTuple>>(new Map());
 
+  const toViewerGlobalId = useCallback((modelId: string, expressId: number): number | undefined => {
+    if (
+      modelId === '__legacy__'
+      || modelId === 'legacy'
+      || models.size === 0
+      || (models.size === 1 && !models.has(modelId))
+    ) {
+      return expressId;
+    }
+    if (!models.has(modelId)) {
+      return undefined;
+    }
+    return toGlobalId(modelId, expressId);
+  }, [models, toGlobalId]);
+
   // Ref to access geometryResult without creating callback dependencies (prevents infinite loops)
   const geometryResultRef = useRef(geometryResult);
   geometryResultRef.current = geometryResult;
@@ -357,7 +373,7 @@ export function useIDS(options: UseIDSOptions = {}): UseIDSResult {
 
     // Sync to viewer selection
     // Handle legacy mode vs federation mode
-    const isLegacyMode = modelId === '__legacy__' || models.size === 0;
+    const isLegacyMode = modelId === '__legacy__' || modelId === 'legacy' || models.size === 0;
 
     if (isLegacyMode) {
       // Legacy mode: globalId equals expressId, use 'legacy' for selection
@@ -365,9 +381,9 @@ export function useIDS(options: UseIDSOptions = {}): UseIDSResult {
       // Use 'legacy' as the modelId for PropertiesPanel compatibility
       setSelectedEntity({ modelId: 'legacy', expressId });
     } else {
-      // Federation mode: convert to globalId using model offset
-      const model = models.get(modelId);
-      const globalId = model ? expressId + (model.idOffset ?? 0) : expressId;
+      // Federation mode: use the store helper so ID resolution stays centralized.
+      const globalId = toViewerGlobalId(modelId, expressId);
+      if (globalId == null) return;
       setSelectedEntityId(globalId);
       setSelectedEntity({ modelId, expressId });
     }
@@ -378,7 +394,7 @@ export function useIDS(options: UseIDSOptions = {}): UseIDSResult {
         cameraCallbacks.frameSelection?.();
       }, 50);
     }
-  }, [setIdsActiveEntity, setSelectedEntityId, setSelectedEntity, models, cameraCallbacks]);
+  }, [setIdsActiveEntity, setSelectedEntityId, setSelectedEntity, models, cameraCallbacks, toViewerGlobalId]);
 
   const clearEntitySelection = useCallback(() => {
     setIdsActiveEntity(null);
@@ -462,15 +478,14 @@ export function useIDS(options: UseIDSOptions = {}): UseIDSResult {
       const modelId = key.substring(0, lastColonIndex);
       const expressIdStr = key.substring(lastColonIndex + 1);
       const expressId = parseInt(expressIdStr, 10);
-      const model = models.get(modelId);
-      const globalId = model ? expressId + (model.idOffset ?? 0) : expressId;
-      failedIds.add(globalId);
+      const globalId = toViewerGlobalId(modelId, expressId);
+      if (globalId != null) failedIds.add(globalId);
     }
 
     if (failedIds.size > 0) {
       setIsolatedEntities(failedIds);
     }
-  }, [idsFailedEntityIds, models, setIsolatedEntities]);
+  }, [idsFailedEntityIds, setIsolatedEntities, toViewerGlobalId]);
 
   const isolatePassed = useCallback(() => {
     const passedIds = new Set<number>();
@@ -480,15 +495,14 @@ export function useIDS(options: UseIDSOptions = {}): UseIDSResult {
       const modelId = key.substring(0, lastColonIndex);
       const expressIdStr = key.substring(lastColonIndex + 1);
       const expressId = parseInt(expressIdStr, 10);
-      const model = models.get(modelId);
-      const globalId = model ? expressId + (model.idOffset ?? 0) : expressId;
-      passedIds.add(globalId);
+      const globalId = toViewerGlobalId(modelId, expressId);
+      if (globalId != null) passedIds.add(globalId);
     }
 
     if (passedIds.size > 0) {
       setIsolatedEntities(passedIds);
     }
-  }, [idsPassedEntityIds, models, setIsolatedEntities]);
+  }, [idsPassedEntityIds, setIsolatedEntities, toViewerGlobalId]);
 
   const clearIsolation = useCallback(() => {
     setIsolatedEntities(null);
@@ -632,7 +646,8 @@ export function useIDS(options: UseIDSOptions = {}): UseIDSResult {
           // Find matching model geometry
           for (const modelData of allMeshData) {
             if (modelData.modelId === entity.modelId || allMeshData.length === 1) {
-              const globalExpressId = entity.expressId + modelData.idOffset;
+              const globalExpressId = toViewerGlobalId(entity.modelId, entity.expressId);
+              if (globalExpressId == null) break;
               const bounds = getEntityBounds(
                 modelData.meshes as Parameters<typeof getEntityBounds>[0],
                 globalExpressId,
@@ -700,8 +715,8 @@ export function useIDS(options: UseIDSOptions = {}): UseIDSResult {
           if (!bounds) continue;
 
           // Find the global expressId for isolation (direct Map lookup)
-          const model = models.get(entity.modelId);
-          const globalExpressId = entity.expressId + (model?.idOffset ?? 0);
+          const globalExpressId = toViewerGlobalId(entity.modelId, entity.expressId);
+          if (globalExpressId == null) continue;
 
           // Frame the entity bounds directly via camera (properly centers the object)
           // duration=1 (not 0) because the animator skips updates when duration===0,

package/src/hooks/useIfcFederation.ts

@@ -38,7 +38,7 @@ export interface IfcxDataStore extends IfcDataStore {
   /** Original buffers for re-composition when adding overlays */
   _federatedBuffers?: Array<{ buffer: ArrayBuffer; name: string }>;
   /** Composition statistics */
-  _compositionStats?: { totalNodes: number; layersUsed: number; inheritanceResolutions: number; crossLayerReferences: number };
+  _compositionStats?: { layersUsed: number; inheritanceResolutions: number; crossLayerReferences: number };
   /** Layer info for display */
   _layerInfo?: Array<{ id: string; name: string; meshCount: number }>;
 }
@@ -630,7 +630,7 @@ export function useIfcFederation() {
           name: b.name,
         })),
         _compositionStats: result.compositionStats,
-      } as IfcxDataStore;
+      } as unknown as IfcxDataStore;
 
       // IfcxDataStore extends IfcDataStore (with schemaVersion: 'IFC5'), so this is safe
       setIfcDataStore(dataStore);