@ifc-lite/viewer 1.17.2 → 1.17.4

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/components/viewer/selectionHandlers.ts

@@ -39,22 +39,23 @@ export async function handleSelectionClick(ctx: MouseHandlerContext, e: MouseEve
   const now = Date.now();
   const timeSinceLastClick = now - ctx.lastClickTimeRef.current;
   const clickPos = { x, y };
-
   if (ctx.lastClickPosRef.current &&
     timeSinceLastClick < 300 &&
     Math.abs(clickPos.x - ctx.lastClickPosRef.current.x) < 5 &&
     Math.abs(clickPos.y - ctx.lastClickPosRef.current.y) < 5) {
+    const pickOptions = ctx.getPickOptions();
     // Double-click - isolate element
     // Uses visibility filtering so only visible elements can be selected
-    const pickResult = await renderer.pick(x, y, ctx.getPickOptions());
+    const pickResult = await renderer.pick(x, y, pickOptions);
     if (pickResult) {
       ctx.handlePickForSelection(pickResult);
     }
     ctx.lastClickTimeRef.current = 0;
     ctx.lastClickPosRef.current = null;
   } else {
+    const pickOptions = ctx.getPickOptions();
     // Single click - uses visibility filtering so only visible elements can be selected
-    const pickResult = await renderer.pick(x, y, ctx.getPickOptions());
+    const pickResult = await renderer.pick(x, y, pickOptions);
 
     // Multi-selection with Ctrl/Cmd
     if (e.ctrlKey || e.metaKey) {

package/src/components/viewer/useAnimationLoop.ts

@@ -29,6 +29,8 @@ export interface UseAnimationLoopParams {
   lastFrameTimeRef: MutableRefObject<number>;
   mouseIsDraggingRef: MutableRefObject<boolean>;
   activeToolRef: MutableRefObject<string>;
+  /** When set, clips model below this Y value (terrain clipping for Cesium overlay). */
+  terrainClipYRef: MutableRefObject<number | null>;
   hiddenEntitiesRef: MutableRefObject<Set<number>>;
   isolatedEntitiesRef: MutableRefObject<Set<number> | null>;
   selectedEntityIdRef: MutableRefObject<number | null>;
@@ -62,6 +64,7 @@ export function useAnimationLoop(params: UseAnimationLoopParams): void {
     lastFrameTimeRef,
     mouseIsDraggingRef,
     activeToolRef,
+    terrainClipYRef,
     hiddenEntitiesRef,
     isolatedEntitiesRef,
     selectedEntityIdRef,
@@ -171,6 +174,7 @@ export function useAnimationLoop(params: UseAnimationLoopParams): void {
             min: sectionRangeRef.current?.min,
             max: sectionRangeRef.current?.max,
           } : undefined,
+          terrainClipY: terrainClipYRef.current ?? undefined,
         });
         lastRenderTime = currentTime;
       }

package/src/components/viewer/useGeometryStreaming.ts

@@ -21,6 +21,7 @@
 import { useEffect, useRef, type MutableRefObject } from 'react';
 import type { Renderer } from '@ifc-lite/renderer';
 import type { MeshData, CoordinateInfo } from '@ifc-lite/geometry';
+import { logToDesktopTerminal } from '@/services/desktop-logger';
 
 export interface UseGeometryStreamingParams {
   rendererRef: MutableRefObject<Renderer | null>;
@@ -37,6 +38,8 @@ export interface UseGeometryStreamingParams {
   clearPendingMeshColorUpdates: () => void;
   clearPendingColorUpdates: () => void;
   clearColorRef: MutableRefObject<[number, number, number, number]>;
+  releaseGeometryAfterFinalize?: boolean;
+  onGeometryReleased?: () => void;
 }
 
 // Default bounds used when geometry is cleared
@@ -47,6 +50,11 @@ const DEFAULT_BOUNDS = {
 
 const MAX_VALID_COORD = 10000;
 
+function traceGeometrySync(message: string): void {
+  console.log(`[GeomSync] ${message}`);
+  void logToDesktopTerminal('info', `[GeomSync] ${message}`);
+}
+
 export function useGeometryStreaming(params: UseGeometryStreamingParams): void {
   const {
     rendererRef,
@@ -61,6 +69,8 @@ export function useGeometryStreaming(params: UseGeometryStreamingParams): void {
     clearPendingMeshColorUpdates,
     clearPendingColorUpdates,
     clearColorRef,
+    releaseGeometryAfterFinalize = false,
+    onGeometryReleased,
   } = params;
 
   // ─── Tracking refs ───────────────────────────────────────────────────
@@ -71,6 +81,33 @@ export function useGeometryStreaming(params: UseGeometryStreamingParams): void {
   const finalBoundsRefittedRef = useRef(false);
   const cameraSnapshotRef = useRef<{ px: number; py: number; pz: number; tx: number; ty: number; tz: number } | null>(null);
   const prevIsStreamingRef = useRef(isStreaming);
+  const queuePumpTimerRef = useRef<ReturnType<typeof globalThis.setTimeout> | null>(null);
+
+  // Only activate the timer-based queue pump when the tab is background-throttled
+  // (rAF stops firing). In the foreground, the animation loop already drains the
+  // queue every frame — a parallel setTimeout(0) pump doubles the GPU work and
+  // hurts Chrome (Dawn) where each buffer op is an IPC round-trip.
+  const ensureQueuePump = () => {
+    if (queuePumpTimerRef.current !== null) return;
+    if (!globalThis.document?.hidden) return; // rAF is active — let the animation loop drain
+    queuePumpTimerRef.current = globalThis.setTimeout(() => {
+      queuePumpTimerRef.current = null;
+      const renderer = rendererRef.current;
+      if (!renderer || !isInitialized) return;
+      const device = renderer.getGPUDevice();
+      const pipeline = renderer.getPipeline();
+      const scene = renderer.getScene();
+      if (!device || !pipeline || !scene.hasQueuedMeshes()) return;
+      const flushed = scene.flushPending(device, pipeline);
+      if (flushed) {
+        renderer.clearCaches();
+        renderer.requestRender();
+      }
+      if (scene.hasQueuedMeshes()) {
+        ensureQueuePump();
+      }
+    }, 0);
+  };
 
   // ─── Main geometry effect ────────────────────────────────────────────
   // Runs on every geometry change (new file, incremental batch, visibility toggle).
@@ -81,6 +118,7 @@ export function useGeometryStreaming(params: UseGeometryStreamingParams): void {
     // Geometry cleared/null — reset so next load is fresh
     if (!geometry) {
       if (lastGeometryLengthRef.current > 0 || lastGeometryRef.current !== null) {
+        traceGeometrySync(`geometry cleared lastLength=${lastGeometryLengthRef.current}`);
         lastGeometryLengthRef.current = 0;
         lastGeometryRef.current = null;
         processedMeshIdsRef.current.clear();
@@ -121,7 +159,9 @@ export function useGeometryStreaming(params: UseGeometryStreamingParams): void {
     }
 
     if (isNewFile) {
+      traceGeometrySync(`new file currentLength=${currentLength} lastLength=${lastLength} releaseAfterFinalize=${releaseGeometryAfterFinalize}`);
       scene.clear();
+      scene.setEphemeralStreamingMode(releaseGeometryAfterFinalize);
       processedMeshIdsRef.current.clear();
       cameraFittedRef.current = false;
       finalBoundsRefittedRef.current = false;
@@ -132,14 +172,18 @@ export function useGeometryStreaming(params: UseGeometryStreamingParams): void {
       geometryBoundsRef.current = { ...DEFAULT_BOUNDS };
     } else if (!isIncremental && currentLength !== lastLength) {
       if (currentLength < lastLength) {
+        traceGeometrySync(`geometry rebuilt after shrink currentLength=${currentLength} lastLength=${lastLength}`);
         // Length decreased (model hidden) — rebuild scene, keep camera
         scene.clear();
+        scene.setEphemeralStreamingMode(releaseGeometryAfterFinalize);
         processedMeshIdsRef.current.clear();
         lastGeometryLengthRef.current = 0;
         lastGeometryRef.current = geometry;
       } else {
+        traceGeometrySync(`geometry rebuilt after replace currentLength=${currentLength} lastLength=${lastLength} releaseAfterFinalize=${releaseGeometryAfterFinalize}`);
         // New file while another was open — full reset
         scene.clear();
+        scene.setEphemeralStreamingMode(releaseGeometryAfterFinalize);
         processedMeshIdsRef.current.clear();
         cameraFittedRef.current = false;
         finalBoundsRefittedRef.current = false;
@@ -193,6 +237,10 @@ export function useGeometryStreaming(params: UseGeometryStreamingParams): void {
         if (isStreaming) {
           // Queue for the animation loop — zero GPU work here.
           scene.queueMeshes(newMeshes);
+          // Desktop benchmark windows can become background-throttled, which
+          // stalls requestAnimationFrame-based draining. Keep a timer-based
+          // pump active so large native loads still finish offscreen.
+          ensureQueuePump();
         } else {
           // Non-streaming: process immediately (visibility toggles, etc.)
           scene.appendToBatches(newMeshes, device, pipeline, false);
@@ -230,66 +278,105 @@ export function useGeometryStreaming(params: UseGeometryStreamingParams): void {
     renderer.requestRender();
   }, [geometry, geometryVersion, coordinateInfo, isInitialized, isStreaming]);
 
+  useEffect(() => {
+    return () => {
+      if (queuePumpTimerRef.current !== null) {
+        globalThis.clearTimeout(queuePumpTimerRef.current);
+        queuePumpTimerRef.current = null;
+      }
+    };
+  }, []);
+
   // ─── Streaming complete: finalize + bounds refit ─────────────────────
   useEffect(() => {
     const renderer = rendererRef.current;
     if (!renderer || !isInitialized) return;
 
     if (prevIsStreamingRef.current && !isStreaming) {
-      // Flush any remaining queued meshes synchronously before finalize
-      const device = renderer.getGPUDevice();
-      const pipeline = renderer.getPipeline();
       const scene = renderer.getScene();
-      if (device && pipeline && scene.hasQueuedMeshes()) {
-        scene.flushPending(device, pipeline);
-      }
-
+      traceGeometrySync(
+        `stream transition complete geometryLength=${geometry?.length ?? 0} queued=${scene.hasQueuedMeshes()} batches=${scene.getBatchedMeshes().length}`
+      );
       renderer.requestRender();
 
-      // Defer heavy work so the browser processes pending input events first.
-      // Streaming fragments keep rendering until proper batches replace them.
       const capturedGeometry = geometry;
-      const timer = setTimeout(() => {
-        const r = rendererRef.current;
-        if (!r) return;
-
-        console.log('[GeomStream] Streaming ended — starting finalize');
-
-        // Compute exact bounds and refit camera (fast ~15ms scan)
-        if (cameraFittedRef.current && !finalBoundsRefittedRef.current && capturedGeometry && capturedGeometry.length > 0) {
-          const t0 = performance.now();
-          const exactBounds = computeBounds(capturedGeometry);
-          console.log(`[GeomStream] computeBounds: ${(performance.now() - t0).toFixed(0)}ms`);
-          if (exactBounds) {
-            if (!userMovedCamera(r, cameraSnapshotRef.current)) {
-              r.getCamera().fitToBounds(exactBounds.min, exactBounds.max);
+      let timeoutId: ReturnType<typeof globalThis.setTimeout> | null = null;
+      let rafId: number | null = null;
+
+      const startFinalize = () => {
+        timeoutId = globalThis.setTimeout(() => {
+          const r = rendererRef.current;
+          if (!r) return;
+
+          console.log('[GeomStream] Streaming ended — starting finalize');
+          traceGeometrySync(
+            `finalize start geometryLength=${capturedGeometry?.length ?? 0} releaseAfterFinalize=${releaseGeometryAfterFinalize}`
+          );
+
+          // Compute exact bounds and refit camera (fast ~15ms scan)
+          if (cameraFittedRef.current && !finalBoundsRefittedRef.current && capturedGeometry && capturedGeometry.length > 0) {
+            const t0 = performance.now();
+            const exactBounds = computeBounds(capturedGeometry);
+            console.log(`[GeomStream] computeBounds: ${(performance.now() - t0).toFixed(0)}ms`);
+            if (exactBounds) {
+              if (!userMovedCamera(r, cameraSnapshotRef.current)) {
+                r.getCamera().fitToBounds(exactBounds.min, exactBounds.max);
+              }
+              geometryBoundsRef.current = exactBounds;
+              finalBoundsRefittedRef.current = true;
             }
-            geometryBoundsRef.current = exactBounds;
-            finalBoundsRefittedRef.current = true;
           }
-        }
 
-        // Time-sliced finalize: rebuild proper batches in ~8ms chunks
-        const dev = r.getGPUDevice();
-        const pipe = r.getPipeline();
-        if (dev && pipe) {
-          const t0 = performance.now();
-          r.getScene().finalizeStreamingAsync(dev, pipe).then(() => {
-            const batchCount = r.getScene().getBatchedMeshes().length;
-            let totalIdx = 0;
-            for (const b of r.getScene().getBatchedMeshes()) totalIdx += b.indexCount;
-            console.log(`[GeomStream] finalizeStreamingAsync complete: ${(performance.now() - t0).toFixed(0)}ms → ${batchCount} consolidated batches, ${(totalIdx / 3 / 1e6).toFixed(1)}M triangles`);
+          // Time-sliced finalize: rebuild proper batches in ~8ms chunks
+          if (releaseGeometryAfterFinalize) {
+            r.getScene().finishEphemeralStreaming();
+            onGeometryReleased?.();
             r.clearCaches();
             r.requestRender();
-          });
+            traceGeometrySync(`ephemeral finalize complete batches=${r.getScene().getBatchedMeshes().length}`);
+            return;
+          }
+
+          const dev = r.getGPUDevice();
+          const pipe = r.getPipeline();
+          if (dev && pipe) {
+            const t0 = performance.now();
+            r.getScene().finalizeStreamingAsync(dev, pipe).then(() => {
+              const batchCount = r.getScene().getBatchedMeshes().length;
+              let totalIdx = 0;
+              for (const b of r.getScene().getBatchedMeshes()) totalIdx += b.indexCount;
+              console.log(`[GeomStream] finalizeStreamingAsync complete: ${(performance.now() - t0).toFixed(0)}ms → ${batchCount} consolidated batches, ${(totalIdx / 3 / 1e6).toFixed(1)}M triangles`);
+              traceGeometrySync(
+                `finalize complete elapsed=${(performance.now() - t0).toFixed(0)}ms batches=${batchCount} queued=${r.getScene().hasQueuedMeshes()}`
+              );
+              r.clearCaches();
+              r.requestRender();
+            });
+          }
+        }, 0);
+      };
+
+      const waitForQueueDrain = () => {
+        const currentRenderer = rendererRef.current;
+        if (!currentRenderer) return;
+        if (!currentRenderer.getScene().hasQueuedMeshes()) {
+          startFinalize();
+          return;
         }
-      }, 0);
+        currentRenderer.requestRender();
+        rafId = requestAnimationFrame(waitForQueueDrain);
+      };
+
+      waitForQueueDrain();
 
       prevIsStreamingRef.current = isStreaming;
-      return () => clearTimeout(timer);
+      return () => {
+        if (timeoutId !== null) globalThis.clearTimeout(timeoutId);
+        if (rafId !== null) cancelAnimationFrame(rafId);
+      };
     }
     prevIsStreamingRef.current = isStreaming;
-  }, [isStreaming, isInitialized]);
+  }, [isStreaming, isInitialized, releaseGeometryAfterFinalize, onGeometryReleased]);
 
   // ─── Mesh color updates (style/material deferred colors) ─────────────
   useEffect(() => {

package/src/components/viewer/useMouseControls.ts

@@ -129,6 +129,8 @@ export interface UseMouseControlsParams {
   RENDER_THROTTLE_MS_SMALL: number;
   RENDER_THROTTLE_MS_LARGE: number;
   RENDER_THROTTLE_MS_HUGE: number;
+  /** When true, wheel zoom uses unrestricted pure-dolly mode (Cesium) */
+  fastZoomRef: MutableRefObject<boolean>;
 }
 
 export function useMouseControls(params: UseMouseControlsParams): void {
@@ -476,7 +478,8 @@ export function useMouseControls(params: UseMouseControlsParams): void {
       const rect = canvas.getBoundingClientRect();
       const mouseX = e.clientX - rect.left;
       const mouseY = e.clientY - rect.top;
-      camera.zoom(e.deltaY, false, mouseX, mouseY, canvas.width, canvas.height);
+      const fastZoom = e.shiftKey || params.fastZoomRef.current;
+      camera.zoom(e.deltaY, false, mouseX, mouseY, canvas.width, canvas.height, fastZoom);
 
       isInteractingRef.current = true;
       renderer.requestRender();

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);