@ifc-lite/viewer 1.21.0 → 1.22.1

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

@@ -0,0 +1,180 @@
+/* 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/. */
+
+/**
+ * Federation alignment controls — surfaces per-model alignment status, anchor
+ * selection, and an explicit "Re-align federation" action.
+ *
+ * Lives inside GeoreferencingPanel (one instance per model). When only one
+ * model is loaded the controls are hidden — alignment is a federation concept.
+ */
+
+import { useCallback, useMemo, useState } from 'react';
+import { Anchor, RefreshCw, AlertTriangle, Check } from 'lucide-react';
+import { useViewerStore } from '@/store';
+import { useIfc } from '@/hooks/useIfc';
+import { toast } from '@/components/ui/toast';
+import { getEffectiveGeoreference } from '@/lib/geo/effective-georef';
+import type { IfcDataStore } from '@ifc-lite/parser';
+import type { FederatedModel } from '@/store/types';
+
+export interface FederationAlignmentControlsProps {
+  modelId: string;
+}
+
+function statusLabel(status: FederatedModel['federationAlignmentStatus']): {
+  text: string;
+  tone: 'anchor' | 'ok' | 'warn' | 'neutral';
+  icon: typeof Check;
+} {
+  switch (status) {
+    case 'anchor':
+      return { text: 'Federation anchor', tone: 'anchor', icon: Anchor };
+    case 'same-crs':
+      return { text: 'Aligned (same CRS)', tone: 'ok', icon: Check };
+    case 'reprojected':
+      return { text: 'Reprojected to anchor CRS', tone: 'ok', icon: Check };
+    case 'identity':
+      return { text: 'Aligned (identity)', tone: 'ok', icon: Check };
+    case 'failed':
+      return { text: 'Alignment failed', tone: 'warn', icon: AlertTriangle };
+    case 'none':
+    case undefined:
+      return { text: 'Not aligned', tone: 'neutral', icon: Anchor };
+  }
+}
+
+const toneClasses = {
+  anchor: 'border-amber-300 dark:border-amber-700 bg-amber-50 dark:bg-amber-950/40 text-amber-800 dark:text-amber-200',
+  ok: 'border-emerald-300 dark:border-emerald-700 bg-emerald-50 dark:bg-emerald-950/40 text-emerald-800 dark:text-emerald-200',
+  warn: 'border-red-300 dark:border-red-700 bg-red-50 dark:bg-red-950/40 text-red-800 dark:text-red-200',
+  neutral: 'border-zinc-300 dark:border-zinc-700 bg-zinc-50 dark:bg-zinc-900 text-zinc-600 dark:text-zinc-400',
+} as const;
+
+export function FederationAlignmentControls({ modelId }: FederationAlignmentControlsProps) {
+  const models = useViewerStore((s) => s.models);
+  const anchorModelIdOverride = useViewerStore((s) => s.anchorModelIdOverride);
+  const setAnchorModelIdOverride = useViewerStore((s) => s.setAnchorModelIdOverride);
+  const georefMutations = useViewerStore((s) => s.georefMutations);
+  useViewerStore((s) => s.mutationVersion);
+  const { realignFederation } = useIfc();
+  const [busy, setBusy] = useState(false);
+
+  // The "effective anchor" matches findReferenceGeorefModel in useIfcFederation:
+  // honour the override if it points to a model with a valid (non-site) georef,
+  // otherwise pick the earliest-loaded model with one. Federation status alone
+  // is not enough — a model can be loaded standalone with status='none' and
+  // would otherwise show up as a fake anchor in the badge.
+  const hasValidGeoref = useCallback(
+    (model: FederatedModel | undefined): boolean => {
+      if (!model?.ifcDataStore) return false;
+      const eff = getEffectiveGeoreference(
+        model.ifcDataStore as IfcDataStore,
+        model.geometryResult?.coordinateInfo,
+        georefMutations.get(model.id),
+      );
+      return Boolean(
+        eff?.projectedCRS?.name && eff.mapConversion && eff.source !== 'siteLocation',
+      );
+    },
+    [georefMutations],
+  );
+
+  const effectiveAnchorId = useMemo<string | null>(() => {
+    if (anchorModelIdOverride && hasValidGeoref(models.get(anchorModelIdOverride))) {
+      return anchorModelIdOverride;
+    }
+    const sorted = Array.from(models.entries()).sort(
+      ([, a], [, b]) => (a.loadedAt ?? 0) - (b.loadedAt ?? 0),
+    );
+    for (const [id, model] of sorted) {
+      if (hasValidGeoref(model)) return id;
+    }
+    return null;
+  }, [models, anchorModelIdOverride, hasValidGeoref]);
+
+  const thisModel = models.get(modelId);
+  if (!thisModel) return null;
+  if (models.size < 2) return null;
+
+  const isAnchor = effectiveAnchorId === modelId;
+  const status: FederatedModel['federationAlignmentStatus'] = isAnchor
+    ? 'anchor'
+    : thisModel.federationAlignmentStatus ?? 'none';
+  const badge = statusLabel(status);
+  const Icon = badge.icon;
+
+  const handleSetAnchor = useCallback(() => {
+    setAnchorModelIdOverride(modelId);
+  }, [modelId, setAnchorModelIdOverride]);
+
+  const handleClearAnchor = useCallback(() => {
+    setAnchorModelIdOverride(null);
+  }, [setAnchorModelIdOverride]);
+
+  const handleRealign = useCallback(async () => {
+    setBusy(true);
+    try {
+      await realignFederation();
+    } catch (error) {
+      // realignFederation's happy path uses toast for per-model status; if
+      // the orchestrator itself throws (e.g. proj4 grid loader rejects), the
+      // async click handler would otherwise surface an unhandled rejection
+      // with no user feedback. Catch + log + toast so the failure mode is
+      // visible and the spinner clears.
+      console.error('[FederationAlignmentControls] re-align failed:', error);
+      toast.error(
+        error instanceof Error
+          ? `Re-align failed: ${error.message}`
+          : 'Re-align failed.',
+      );
+    } finally {
+      setBusy(false);
+    }
+  }, [realignFederation]);
+
+  return (
+    <div className="px-2 py-1.5 border-b border-zinc-100 dark:border-zinc-900">
+      <div className="flex items-center gap-2 flex-wrap">
+        <div
+          className={`inline-flex items-center gap-1 px-1.5 py-0.5 border text-[10px] font-medium ${toneClasses[badge.tone]}`}
+        >
+          <Icon className="h-2.5 w-2.5" />
+          <span>{badge.text}</span>
+        </div>
+        {!isAnchor && (
+          <button
+            type="button"
+            onClick={handleSetAnchor}
+            className="inline-flex items-center gap-1 px-1.5 py-0.5 text-[10px] text-teal-600 dark:text-teal-400 hover:text-teal-800 dark:hover:text-teal-300 border border-teal-300/50 dark:border-teal-700/50 hover:bg-teal-50 dark:hover:bg-teal-950/50 transition-colors"
+            title="Use this model as the federation anchor. Click 'Re-align' afterwards to apply."
+          >
+            <Anchor className="h-2.5 w-2.5" />
+            Make anchor
+          </button>
+        )}
+        {isAnchor && anchorModelIdOverride === modelId && (
+          <button
+            type="button"
+            onClick={handleClearAnchor}
+            className="inline-flex items-center gap-1 px-1.5 py-0.5 text-[10px] text-zinc-600 dark:text-zinc-400 hover:text-zinc-800 dark:hover:text-zinc-200 border border-zinc-300/50 dark:border-zinc-700/50 hover:bg-zinc-50 dark:hover:bg-zinc-900 transition-colors"
+            title="Stop pinning this model as the anchor; revert to the default (earliest-loaded with georef)."
+          >
+            Unpin
+          </button>
+        )}
+        <button
+          type="button"
+          onClick={handleRealign}
+          disabled={busy}
+          className="inline-flex items-center gap-1 px-1.5 py-0.5 text-[10px] text-zinc-700 dark:text-zinc-300 hover:text-zinc-900 dark:hover:text-zinc-100 border border-zinc-300/50 dark:border-zinc-700/50 hover:bg-zinc-50 dark:hover:bg-zinc-900 transition-colors disabled:opacity-50 disabled:cursor-not-allowed ml-auto"
+          title="Re-bake every model's geometry against the current anchor."
+        >
+          <RefreshCw className={`h-2.5 w-2.5 ${busy ? 'animate-spin' : ''}`} />
+          Re-align
+        </button>
+      </div>
+    </div>
+  );
+}

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

@@ -15,9 +15,16 @@ import { computeAngleToGridNorth, type GeoreferenceInfo, type MapConversion, typ
 import { useViewerStore } from '@/store';
 import type { CoordinateInfo, GeometryResult } from '@ifc-lite/geometry';
 import { EpsgLookupDialog, type EpsgResult } from './EpsgLookupDialog';
+import { FederationAlignmentControls } from './FederationAlignmentControls';
+import { PrecisionGridBadge } from './PrecisionGridBadge';
 import { LocationMap, type PickedPosition } from './LocationMap';
-import { findClampAnchorY } from '@/lib/geo/clamp-anchor';
-import { detectScaleUnitMismatch, mergeMapConversion, mergeProjectedCRS } from '@/lib/geo/effective-georef';
+import { computeOrthogonalHeightForBaseAltitude } from '@/lib/geo/cesium-placement';
+import {
+  detectScaleUnitMismatch,
+  mergeMapConversion,
+  mergeProjectedCRS,
+  supportsStandardGeoreferencing,
+} from '@/lib/geo/effective-georef';
 import { useIfc } from '@/hooks/useIfc';
 import { toast } from '@/components/ui/toast';
 
@@ -335,9 +342,8 @@ export function GeoreferencingPanel({ georef, modelId, enableEditing, schemaVers
   const setGeorefField = useViewerStore(s => s.setGeorefField);
   const setGeorefFields = useViewerStore(s => s.setGeorefFields);
   const cesiumEnabled = useViewerStore(s => s.cesiumEnabled);
-  const terrainClamp = useViewerStore(s => s.cesiumTerrainClamp);
-  const setCesiumTerrainClamp = useViewerStore(s => s.setCesiumTerrainClamp);
   const cesiumTerrainHeight = useViewerStore(s => s.cesiumTerrainHeight);
+  const cesiumTerrainSource = useViewerStore(s => s.cesiumTerrainSource);
   const cesiumSourceModelId = useViewerStore(s => s.cesiumSourceModelId);
   const models = useViewerStore(s => s.models);
   const loading = useViewerStore(s => s.loading);
@@ -351,7 +357,8 @@ export function GeoreferencingPanel({ georef, modelId, enableEditing, schemaVers
   useViewerStore(s => s.mutationVersion);
 
   const mutations = modelId ? georefMutations?.get(modelId) : undefined;
-  const supportsStandardGeoreferencing = !schemaVersion?.toUpperCase().includes('2X3');
+  const isLegacySiteGeoreference = georef?.source === 'siteLocation';
+  const canUseStandardGeoreferencing = supportsStandardGeoreferencing(schemaVersion, georef);
 
   const mergedCRS = useMemo((): ProjectedCRS | undefined => {
     return mergeProjectedCRS(georef?.projectedCRS, mutations?.projectedCRS, lengthUnitScale ?? 1);
@@ -382,13 +389,6 @@ export function GeoreferencingPanel({ georef, modelId, enableEditing, schemaVers
     return 'm';
   }, [mergedCRS?.mapUnit]);
 
-  // Convert meters to map units (Cesium always returns meters)
-  const metersToMapUnit = useCallback((meters: number): number => {
-    if (mapUnitSuffix === 'ftUS') return meters / 0.3048006096;
-    if (mapUnitSuffix === 'ft') return meters / 0.3048;
-    return meters; // already meters
-  }, [mapUnitSuffix]);
-
   /**
    * Given a target world altitude (metres) for the model's ground floor
    * (the storey nearest elevation 0, falling back to bounds.min.y when
@@ -400,14 +400,14 @@ export function GeoreferencingPanel({ georef, modelId, enableEditing, schemaVers
    * world position as toggling the clamp.
    */
   const oHeightForBaseAltitude = useCallback((targetBaseAltitude: number): number => {
-    const bounds = coordinateInfo?.originalBounds;
-    const anchorY = findClampAnchorY(bounds, storeyElevations);
-    const shiftY = coordinateInfo?.originShift?.y ?? 0;
-    // RTC offset is in IFC Z-up; viewer Y-up takes its Z component.
-    const rtcYupY = coordinateInfo?.wasmRtcOffset?.z ?? 0;
-    const targetOHeightMeters = targetBaseAltitude - shiftY - rtcYupY - anchorY;
-    return Math.round(metersToMapUnit(targetOHeightMeters) * 100) / 100;
-  }, [coordinateInfo, storeyElevations, metersToMapUnit]);
+    return computeOrthogonalHeightForBaseAltitude({
+      coordinateInfo,
+      projectedCRS: mergedCRS,
+      lengthUnitScale: lengthUnitScale ?? 1,
+      storeyElevations,
+      targetBaseAltitude,
+    });
+  }, [coordinateInfo, mergedCRS, lengthUnitScale, storeyElevations]);
 
   const isMutated = useCallback((entity: 'projectedCRS' | 'mapConversion', field: string): boolean => {
     if (!mutations) return false;
@@ -467,14 +467,8 @@ export function GeoreferencingPanel({ georef, modelId, enableEditing, schemaVers
       ? mergedCRS?.[field as keyof ProjectedCRS]
       : mergedConversion?.[field as keyof MapConversion];
     setGeorefField(modelId, entity, field, value, oldValue as string | number | undefined);
-    // Editing OrthogonalHeight implies "I want this exact altitude" — auto
-    // -release the terrain clamp so the new value actually takes effect
-    // (with clamp on, placement is locked to terrain regardless of oHeight).
-    if (entity === 'mapConversion' && field === 'orthogonalHeight' && terrainClamp) {
-      setCesiumTerrainClamp(false);
-    }
     requestAlignmentReload();
-  }, [modelId, setGeorefField, mergedCRS, mergedConversion, requestAlignmentReload, terrainClamp, setCesiumTerrainClamp]);
+  }, [modelId, setGeorefField, mergedCRS, mergedConversion, requestAlignmentReload]);
 
   // Handle angle edit: compute and set both XAxisAbscissa and XAxisOrdinate
   const handleAngleChange = useCallback((abscissa: number, ordinate: number) => {
@@ -557,18 +551,7 @@ export function GeoreferencingPanel({ georef, modelId, enableEditing, schemaVers
   }, [modelId, setGeorefFields, mergedCRS, mergedConversion, mutations, initializeMapConversionDefaults, requestAlignmentReload]);
 
   const hasData = mergedCRS || mergedConversion;
-  const editable = enableEditing && !!modelId && supportsStandardGeoreferencing;
-
-  if (enableEditing && !supportsStandardGeoreferencing) {
-    return (
-      <div className="px-2 py-1.5 flex items-center gap-2">
-        <Globe className="h-3 w-3 text-zinc-400" />
-        <span className="text-[10px] text-zinc-500 dark:text-zinc-400">
-          Georeferencing editing requires IFC4 or newer. IFC2X3 does not support IfcProjectedCRS or IfcMapConversion.
-        </span>
-      </div>
-    );
-  }
+  const editable = enableEditing && !!modelId && canUseStandardGeoreferencing;
 
   // When no georef data exists, show "Add Georeferencing" in edit mode
   if (!hasData && !georef?.hasGeoreference) {
@@ -616,6 +599,24 @@ export function GeoreferencingPanel({ georef, modelId, enableEditing, schemaVers
           </div>
         </div>
       )}
+      {/* Only flag the legacy-site / unsupported-schema state when there is
+          actually nothing extractable to show. If we have a projectedCRS or
+          mapConversion (even partially), the data sections below speak for
+          themselves — the schema notice is just noise that contradicts the
+          live data the properties panel already renders. */}
+      {!canUseStandardGeoreferencing && !mergedCRS && !mergedConversion && (
+        <div className="px-3 py-1.5 flex items-center gap-2 border-b border-zinc-100 dark:border-zinc-900">
+          <Globe className="h-3 w-3 text-zinc-400 shrink-0" />
+          <span className="text-[10px] text-zinc-500 dark:text-zinc-400">
+            {isLegacySiteGeoreference
+              ? 'Showing legacy IfcSite geolocation from IFC2X3. This view is read-only.'
+              : 'Georeferencing editing requires IFC4 or newer. IFC2X3 does not support IfcProjectedCRS or IfcMapConversion.'}
+          </span>
+        </div>
+      )}
+      {/* Federation alignment badge + anchor / re-align controls.
+          Hidden when only one model is loaded — alignment is a federation concept. */}
+      {modelId && models.size > 1 && <FederationAlignmentControls modelId={modelId} />}
       {/* CRS summary — always visible */}
       <div className="px-2 py-1.5 flex items-center gap-2">
         <Globe className="h-3 w-3 text-teal-500 shrink-0" />
@@ -628,6 +629,7 @@ export function GeoreferencingPanel({ georef, modelId, enableEditing, schemaVers
         {mergedCRS?.description && (
           <span className="text-[10px] font-mono text-teal-500/60 truncate">{mergedCRS.description}</span>
         )}
+        {mergedCRS?.name && <PrecisionGridBadge crsName={mergedCRS.name} />}
         {editable && (
           <EpsgLookupDialog onSelect={handleEpsgSelect}>
             <button className="flex items-center gap-1 text-[9px] text-teal-500 hover:text-teal-700 dark:hover:text-teal-300 transition-colors ml-auto shrink-0">
@@ -751,28 +753,25 @@ export function GeoreferencingPanel({ georef, modelId, enableEditing, schemaVers
         </div>
       )}
 
-      {/* Terrain clamp toggle — only when Cesium overlay is active */}
+      {/* Sampled surface height — only when Cesium overlay is active */}
       {cesiumEnabled && isActiveCesiumModel && mergedConversion && (
         <div className="px-3 py-1.5 border-t border-zinc-100 dark:border-zinc-900 space-y-1">
           <div className="flex items-center gap-2">
             <Mountain className="h-3 w-3 text-teal-500 shrink-0" />
-            <label className="flex items-center gap-1.5 cursor-pointer flex-1">
-              <input
-                type="checkbox"
-                checked={terrainClamp}
-                onChange={(e) => setCesiumTerrainClamp(e.target.checked)}
-                className="accent-teal-500 h-3 w-3"
-              />
-              <span className="text-[10px] text-zinc-600 dark:text-zinc-400">Clamp to terrain</span>
-            </label>
+            <span className="text-[10px] text-zinc-600 dark:text-zinc-400 flex-1">Visible surface height</span>
             {cesiumTerrainHeight !== null ? (
-              <span className="text-[9px] font-mono text-teal-500">
+              <span className="text-[9px] font-mono text-teal-500" title={cesiumTerrainSource ?? undefined}>
                 {cesiumTerrainHeight.toFixed(1)} m
               </span>
             ) : (
               <span className="text-[9px] font-mono text-zinc-400">querying...</span>
             )}
           </div>
+          {cesiumTerrainSource && (
+            <div className="ml-5 text-[9px] text-zinc-500 dark:text-zinc-400">
+              sampled via {cesiumTerrainSource}
+            </div>
+          )}
           {cesiumTerrainHeight !== null && editable && modelId && (
             <div className="flex items-center gap-1 ml-5">
               <button
@@ -780,7 +779,7 @@ export function GeoreferencingPanel({ georef, modelId, enableEditing, schemaVers
                 className="text-[9px] text-teal-500 hover:text-teal-700 dark:hover:text-teal-300 transition-colors flex items-center gap-0.5"
               >
                 <Mountain className="h-2.5 w-2.5" />
-                Set OrthogonalHeight to {cesiumTerrainHeight.toFixed(1)} m
+                Set OrthogonalHeight to sampled terrain height ({cesiumTerrainHeight.toFixed(1)} m)
               </button>
             </div>
           )}
@@ -809,6 +808,7 @@ function TerrainHeightButton({ modelId, editable, onApply }: {
 }) {
   const cesiumEnabled = useViewerStore(s => s.cesiumEnabled);
   const terrainHeight = useViewerStore(s => s.cesiumTerrainHeight);
+  const terrainSource = useViewerStore(s => s.cesiumTerrainSource);
   const sourceModelId = useViewerStore(s => s.cesiumSourceModelId);
 
   // Only show when this panel's model is the active Cesium model
@@ -828,7 +828,10 @@ function TerrainHeightButton({ modelId, editable, onApply }: {
           <span>{terrainHeight.toFixed(1)} m</span>
         </button>
       </TooltipTrigger>
-      <TooltipContent>Set OrthogonalHeight to Cesium terrain elevation ({terrainHeight.toFixed(1)} m)</TooltipContent>
+      <TooltipContent>
+        Set OrthogonalHeight to sampled terrain height ({terrainHeight.toFixed(1)} m
+        {terrainSource ? ` via ${terrainSource}` : ''})
+      </TooltipContent>
     </Tooltip>
   );
 }

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

@@ -124,7 +124,12 @@ export function ModelMetadataPanel({ model }: { model: FederatedModel }) {
         </div>
       </div>
 
-      <ScrollArea className="flex-1">
+      {/* `min-h-0` is required: without it `flex-1` falls back to
+          min-height:auto and the ScrollArea grows past the panel's
+          height instead of constraining the inner viewport, so the map
+          (and any tall content underneath) overflowed past the right
+          panel's clip box. */}
+      <ScrollArea className="flex-1 min-h-0">
         {/* File Information */}
         <div className="border-b border-zinc-200 dark:border-zinc-800">
           <div className="p-3 bg-zinc-50 dark:bg-zinc-900/50">
@@ -172,49 +177,11 @@ export function ModelMetadataPanel({ model }: { model: FederatedModel }) {
           </div>
         )}
 
-        {/* Entity Statistics */}
-        <div className="border-b border-zinc-200 dark:border-zinc-800">
-          <div className="p-3 bg-zinc-50 dark:bg-zinc-900/50">
-            <h4 className="font-bold text-xs uppercase tracking-wide text-zinc-700 dark:text-zinc-300">
-              Statistics
-            </h4>
-          </div>
-          <div className="divide-y divide-zinc-100 dark:divide-zinc-900">
-            <div className="flex items-center gap-3 px-3 py-2">
-              <Database className="h-3.5 w-3.5 text-zinc-400 shrink-0" />
-              <span className="text-xs text-zinc-500">Total Entities</span>
-              <span className="text-xs font-mono text-zinc-900 dark:text-zinc-100 ml-auto">
-                {dataStore?.entityCount?.toLocaleString() ?? 'N/A'}
-              </span>
-            </div>
-            <div className="flex items-center gap-3 px-3 py-2">
-              <Layers className="h-3.5 w-3.5 text-zinc-400 shrink-0" />
-              <span className="text-xs text-zinc-500">Building Storeys</span>
-              <span className="text-xs font-mono text-zinc-900 dark:text-zinc-100 ml-auto">
-                {stats.storeys}
-              </span>
-            </div>
-            <div className="flex items-center gap-3 px-3 py-2">
-              <Building2 className="h-3.5 w-3.5 text-zinc-400 shrink-0" />
-              <span className="text-xs text-zinc-500">Elements with Geometry</span>
-              <span className="text-xs font-mono text-zinc-900 dark:text-zinc-100 ml-auto">
-                {stats.elementsWithGeometry.toLocaleString()}
-              </span>
-            </div>
-            <div className="flex items-center gap-3 px-3 py-2">
-              <Hash className="h-3.5 w-3.5 text-zinc-400 shrink-0" />
-              <span className="text-xs text-zinc-500">Max Express ID</span>
-              <span className="text-xs font-mono text-zinc-900 dark:text-zinc-100 ml-auto">
-                {model.maxExpressId.toLocaleString()}
-              </span>
-            </div>
-          </div>
-        </div>
-
-        {/* Georeferencing */}
-        <GeoreferencingPanel georef={georef} modelId={model.id} enableEditing schemaVersion={model.schemaVersion} coordinateInfo={model.geometryResult?.coordinateInfo} geometryResult={model.geometryResult} lengthUnitScale={unitInfo?.scale} />
-
-        {/* IfcProject Data */}
+        {/* IfcProject Data — placed near the top so the model's name,
+            description, and project-level psets are the first thing users
+            see after file info. Previously the section was at the bottom
+            of the panel (below the map), which buried critical project
+            identity below scrollable georeferencing content. */}
         {projectData && (
           <div className="border-b border-zinc-200 dark:border-zinc-800">
             <div className="p-3 bg-zinc-50 dark:bg-zinc-900/50">
@@ -262,6 +229,50 @@ export function ModelMetadataPanel({ model }: { model: FederatedModel }) {
             )}
           </div>
         )}
+
+        {/* Entity Statistics */}
+        <div className="border-b border-zinc-200 dark:border-zinc-800">
+          <div className="p-3 bg-zinc-50 dark:bg-zinc-900/50">
+            <h4 className="font-bold text-xs uppercase tracking-wide text-zinc-700 dark:text-zinc-300">
+              Statistics
+            </h4>
+          </div>
+          <div className="divide-y divide-zinc-100 dark:divide-zinc-900">
+            <div className="flex items-center gap-3 px-3 py-2">
+              <Database className="h-3.5 w-3.5 text-zinc-400 shrink-0" />
+              <span className="text-xs text-zinc-500">Total Entities</span>
+              <span className="text-xs font-mono text-zinc-900 dark:text-zinc-100 ml-auto">
+                {dataStore?.entityCount?.toLocaleString() ?? 'N/A'}
+              </span>
+            </div>
+            <div className="flex items-center gap-3 px-3 py-2">
+              <Layers className="h-3.5 w-3.5 text-zinc-400 shrink-0" />
+              <span className="text-xs text-zinc-500">Building Storeys</span>
+              <span className="text-xs font-mono text-zinc-900 dark:text-zinc-100 ml-auto">
+                {stats.storeys}
+              </span>
+            </div>
+            <div className="flex items-center gap-3 px-3 py-2">
+              <Building2 className="h-3.5 w-3.5 text-zinc-400 shrink-0" />
+              <span className="text-xs text-zinc-500">Elements with Geometry</span>
+              <span className="text-xs font-mono text-zinc-900 dark:text-zinc-100 ml-auto">
+                {stats.elementsWithGeometry.toLocaleString()}
+              </span>
+            </div>
+            <div className="flex items-center gap-3 px-3 py-2">
+              <Hash className="h-3.5 w-3.5 text-zinc-400 shrink-0" />
+              <span className="text-xs text-zinc-500">Max Express ID</span>
+              <span className="text-xs font-mono text-zinc-900 dark:text-zinc-100 ml-auto">
+                {model.maxExpressId.toLocaleString()}
+              </span>
+            </div>
+          </div>
+        </div>
+
+        {/* Georeferencing — kept at the bottom because it embeds a
+            tall location map; placing it earlier would push the
+            statistics + project metadata below the fold. */}
+        <GeoreferencingPanel georef={georef} modelId={model.id} enableEditing schemaVersion={model.schemaVersion} coordinateInfo={model.geometryResult?.coordinateInfo} geometryResult={model.geometryResult} lengthUnitScale={unitInfo?.scale} />
       </ScrollArea>
     </div>
   );

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

@@ -0,0 +1,125 @@
+/* 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/. */
+
+/**
+ * Small badge in the GeoreferencingPanel header that tells the user
+ * whether their CRS is using a precision NTv2/GeoTIFF datum-shift grid
+ * (sub-decimeter accuracy) or the +towgs84 fallback (up to ~120 m error
+ * for Bessel-based national grids like RD/NL, OSGB/UK, MGI/AT).
+ *
+ * Re-checks on a short interval so it flips from "loading" → "loaded"
+ * after the grid finishes downloading without forcing the parent to
+ * re-render.
+ */
+
+import { useEffect, useState } from 'react';
+import { CheckCircle2, AlertTriangle, Loader2 } from 'lucide-react';
+import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
+import {
+  PRECISION_GRIDS,
+  hasFailedPrecisionGrid,
+  hasLoadedPrecisionGrid,
+} from '@/lib/geo/precision-grids';
+
+interface PrecisionGridBadgeProps {
+  crsName: string | undefined;
+}
+
+function extractEpsgCode(crsName: string | undefined): string | null {
+  if (!crsName) return null;
+  const match = crsName.match(/EPSG[:\s]*(\d+)/i);
+  return match ? match[1] : null;
+}
+
+type BadgeState = 'loading' | 'loaded' | 'failed';
+
+export function PrecisionGridBadge({ crsName }: PrecisionGridBadgeProps) {
+  const code = extractEpsgCode(crsName);
+  const spec = code ? PRECISION_GRIDS[code] : undefined;
+  const [state, setState] = useState<BadgeState>(() => {
+    if (!spec) return 'loading';
+    if (hasLoadedPrecisionGrid(code!)) return 'loaded';
+    if (hasFailedPrecisionGrid(code!)) return 'failed';
+    return 'loading';
+  });
+
+  useEffect(() => {
+    if (!spec || state !== 'loading') return;
+    // Poll every 250ms until the grid loader settles (success or failure).
+    // Cheap — PRECISION_GRIDS lookup is O(1) and most CRSs never trigger
+    // this path. Stops as soon as the grid resolves or the component
+    // unmounts.
+    const id = setInterval(() => {
+      if (hasLoadedPrecisionGrid(code!)) {
+        setState('loaded');
+      } else if (hasFailedPrecisionGrid(code!)) {
+        setState('failed');
+      }
+    }, 250);
+    return () => clearInterval(id);
+  }, [spec, state, code]);
+
+  // CRS without a registered precision grid — accuracy depends entirely on
+  // whether its +towgs84 is good (ETRS89/WGS84-aligned CRSs: yes; old
+  // Bessel/Airy national grids: no). Don't show a badge for these.
+  if (!spec) return null;
+
+  if (state === 'loaded') {
+    return (
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <span className="inline-flex items-center gap-1 px-1.5 py-0.5 text-[9px] font-medium border border-emerald-300/60 dark:border-emerald-700/60 bg-emerald-50 dark:bg-emerald-950/40 text-emerald-700 dark:text-emerald-300 shrink-0">
+            <CheckCircle2 className="h-2.5 w-2.5" />
+            grid
+          </span>
+        </TooltipTrigger>
+        <TooltipContent side="bottom" className="text-xs max-w-xs">
+          <div>Precision NTv2/GeoTIFF grid loaded for {spec.region}.</div>
+          <div className="mt-1 text-[10px] opacity-80">
+            Sub-decimeter datum-shift accuracy via{' '}
+            <code className="font-mono">{spec.filename}</code>.
+          </div>
+        </TooltipContent>
+      </Tooltip>
+    );
+  }
+
+  if (state === 'failed') {
+    return (
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <span className="inline-flex items-center gap-1 px-1.5 py-0.5 text-[9px] font-medium border border-red-300/60 dark:border-red-700/60 bg-red-50 dark:bg-red-950/40 text-red-700 dark:text-red-300 shrink-0">
+            <AlertTriangle className="h-2.5 w-2.5" />
+            grid failed
+          </span>
+        </TooltipTrigger>
+        <TooltipContent side="bottom" className="text-xs max-w-xs">
+          <div>Precision grid fetch failed for {spec.region}.</div>
+          <div className="mt-1 text-[10px] opacity-80">
+            Falling back to +towgs84 approximation. Check network access to{' '}
+            <code className="font-mono">cdn.proj.org</code>.
+          </div>
+        </TooltipContent>
+      </Tooltip>
+    );
+  }
+
+  return (
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <span className="inline-flex items-center gap-1 px-1.5 py-0.5 text-[9px] font-medium border border-amber-300/60 dark:border-amber-700/60 bg-amber-50 dark:bg-amber-950/40 text-amber-700 dark:text-amber-300 shrink-0">
+          <Loader2 className="h-2.5 w-2.5 animate-spin" />
+          loading grid
+        </span>
+      </TooltipTrigger>
+      <TooltipContent side="bottom" className="text-xs max-w-xs">
+        <div>Fetching precision grid for {spec.region}…</div>
+        <div className="mt-1 text-[10px] opacity-80">
+          Until it arrives, placement uses the +towgs84 approximation (off by
+          up to ~120 m for this CRS).
+        </div>
+      </TooltipContent>
+    </Tooltip>
+  );
+}

package/src/components/viewer/properties/raw-step-format.ts

@@ -22,6 +22,7 @@
  */
 
 import type { IfcAttributeValue } from '@ifc-lite/mutations';
+import { safeUtf8Decode } from '@ifc-lite/data';
 
 /**
  * Tokenize the inside of a STEP entity body (`,`-separated arguments)
@@ -86,9 +87,10 @@ export function extractRawStepTokens(
   byteLength: number,
 ): string[] | null {
   if (byteLength <= 0) return null;
-  const text = new TextDecoder().decode(
-    buffer.subarray(byteOffset, byteOffset + byteLength),
-  );
+  // safeUtf8Decode handles SAB-backed source buffers (the parser
+  // keeps `dataStore.source` SAB-backed for zero-copy worker sharing,
+  // and Firefox/Chrome reject `TextDecoder.decode()` on SAB views).
+  const text = safeUtf8Decode(buffer, byteOffset, byteOffset + byteLength);
   // Match #N=TYPE( ... ) — the trailing `;` is optional in case the
   // ref slice doesn't include it.
   const match = text.match(/^#\d+\s*=\s*[A-Z0-9_]+\(([\s\S]*)\)\s*;?\s*$/i);