@ifc-lite/viewer 1.25.2 → 1.27.0

package/src/components/viewer/Viewport.tsx

@@ -45,6 +45,8 @@ import {
   useSymbolicAnnotationsRichData,
   type SectionClipForGrid,
 } from '../../hooks/useSymbolicAnnotations.js';
+import { useAlignmentLines3D } from '../../hooks/useAlignmentLines3D.js';
+import { useGridLines3D } from '../../hooks/useGridLines3D.js';
 
 interface ViewportProps {
   geometry: MeshData[] | null;
@@ -652,19 +654,43 @@ export function Viewport({
           calculateScale();
         },
         frameSelection: () => {
-          // Frame selection - zoom to fit selected element
-          const selectedId = selectedEntityIdRef.current;
+          // Frame the current selection. Prefer the full multi-selection set
+          // (Ctrl-click, box-select, a clash pair) so the camera encloses EVERY
+          // selected element; fall back to the single primary id. The set is
+          // kept in sync with selection (cleared on a plain click), so the
+          // union is always an accurate frame of what's highlighted.
           const geom = geometryRef.current;
-          if (selectedId !== null && geom) {
-            const bounds = getEntityBounds(geom, selectedId);
-            if (bounds) {
-              camera.frameBounds(bounds.min, bounds.max, 300);
-              calculateScale();
+          const set = selectedEntityIdsRef.current;
+          const single = selectedEntityIdRef.current;
+          const ids = set && set.size > 0
+            ? Array.from(set)
+            : single !== null ? [single] : [];
+          if (!geom || ids.length === 0) {
+            console.warn('[Viewport] frameSelection: No selection or geometry');
+            return;
+          }
+          let min: { x: number; y: number; z: number } | null = null;
+          let max: { x: number; y: number; z: number } | null = null;
+          for (const id of ids) {
+            const b = getEntityBounds(geom, id);
+            if (!b) continue;
+            if (!min || !max) {
+              min = { x: b.min.x, y: b.min.y, z: b.min.z };
+              max = { x: b.max.x, y: b.max.y, z: b.max.z };
             } else {
-              console.warn('[Viewport] frameSelection: Could not get bounds for selected element');
+              min.x = Math.min(min.x, b.min.x);
+              min.y = Math.min(min.y, b.min.y);
+              min.z = Math.min(min.z, b.min.z);
+              max.x = Math.max(max.x, b.max.x);
+              max.y = Math.max(max.y, b.max.y);
+              max.z = Math.max(max.z, b.max.z);
             }
+          }
+          if (min && max) {
+            camera.frameBounds(min, max, 300);
+            calculateScale();
           } else {
-            console.warn('[Viewport] frameSelection: No selection or geometry');
+            console.warn('[Viewport] frameSelection: Could not get bounds for selected element');
           }
         },
         orbit: (deltaX: number, deltaY: number) => {
@@ -862,6 +888,34 @@ export function Viewport({
     }
   }, [annotationVertices3D, isInitialized]);
 
+  // IfcAlignment centerlines render as thin lines (not a ribbon mesh), always
+  // on — see useAlignmentLines3D. Upload/clear mirrors the annotation overlay;
+  // a separate renderer buffer keeps alignment visibility independent.
+  const alignmentVertices3D = useAlignmentLines3D();
+  useEffect(() => {
+    const renderer = rendererRef.current;
+    if (!renderer || !isInitialized) return;
+    if (alignmentVertices3D.length === 0) {
+      renderer.clearAlignmentLines3D();
+    } else {
+      renderer.uploadAlignmentLines3D(alignmentVertices3D);
+    }
+  }, [alignmentVertices3D, isInitialized]);
+
+  // Structural-grid (IfcGridAxis) lines, gated by the `ifcGrid` type-visibility
+  // toggle (issue #967). Parsed once per source + cached; only the upload/clear
+  // is toggled so flipping visibility doesn't re-parse.
+  const gridVertices3D = useGridLines3D();
+  useEffect(() => {
+    const renderer = rendererRef.current;
+    if (!renderer || !isInitialized) return;
+    if (!ifcGridVisible || gridVertices3D.length === 0) {
+      renderer.clearGridLines3D();
+    } else {
+      renderer.uploadGridLines3D(gridVertices3D);
+    }
+  }, [gridVertices3D, ifcGridVisible, isInitialized]);
+
   // Upload IfcAnnotation text + fill data for the WebGPU symbolic overlay
   // pipelines. Map the hook's per-annotation records into the SymbolicFillInput
   // / SymbolicTextInput shape the renderer expects. Empty arrays clear cleanly.
@@ -1056,6 +1110,7 @@ export function Viewport({
     geometryContentVersion,
     coordinateInfo,
     isStreaming,
+    modelCount: modelIdToIndex?.size ?? 0,
     geometryBoundsRef,
     pendingColorUpdates,
     pendingMeshColorUpdates,

package/src/components/viewer/ViewportContainer.tsx

@@ -39,6 +39,26 @@ const DEFAULT_COORDINATE_INFO: CoordinateInfo = {
   hasLargeCoordinates: false,
 };
 
+type Vec3Bounds = { min: { x: number; y: number; z: number }; max: { x: number; y: number; z: number } };
+
+/** True for a real (non-placeholder, non-degenerate) bounds box. */
+function isUsableBounds(b: Vec3Bounds | undefined): b is Vec3Bounds {
+  if (!b) return false;
+  return (
+    b.max.x > b.min.x || b.max.y > b.min.y || b.max.z > b.min.z
+  );
+}
+
+/** Axis-aligned union of two bounds boxes (either may be undefined). */
+function unionBounds(acc: Vec3Bounds | undefined, b: Vec3Bounds | undefined): Vec3Bounds | undefined {
+  if (!isUsableBounds(b)) return acc;
+  if (!acc) return { min: { ...b.min }, max: { ...b.max } };
+  return {
+    min: { x: Math.min(acc.min.x, b.min.x), y: Math.min(acc.min.y, b.min.y), z: Math.min(acc.min.z, b.min.z) },
+    max: { x: Math.max(acc.max.x, b.max.x), y: Math.max(acc.max.y, b.max.y), z: Math.max(acc.max.z, b.max.z) },
+  };
+}
+
 export function ViewportContainer() {
   // Drive Stacked / Solo / Exploded level display from the slice.
   // Mount-once hook — it self-gates on mode + gap + model changes.
@@ -121,7 +141,16 @@ export function ViewportContainer() {
     if (storeModels.size > 1) {
       let totalVertices = 0;
       let totalTriangles = 0;
-      let mergedCoordinateInfo: CoordinateInfo | undefined;
+      // The merged coordinateInfo must cover ALL visible models, not just the
+      // first one — the renderer fits the camera to `shiftedBounds`, so a
+      // first-wins box left every model after the first off-screen (it only
+      // showed its 2D grid overlay). Union the bounds across visible models;
+      // keep the first model's frame metadata (originShift / RTC) since
+      // federated models share a coordinate frame.
+      let baseCoordInfo: CoordinateInfo | undefined;
+      let unionedShifted: Vec3Bounds | undefined;
+      let unionedOriginal: Vec3Bounds | undefined;
+      let anyLargeCoords = false;
       let shouldRebuild = false;
 
       if (mergedLengthsRef.current.size !== storeModels.size) {
@@ -142,8 +171,12 @@ export function ViewportContainer() {
         const meshCount = model.visible ? (modelGeometry?.meshes.length ?? 0) : 0;
         totalVertices += model.visible ? (modelGeometry?.totalVertices ?? 0) : 0;
         totalTriangles += model.visible ? (modelGeometry?.totalTriangles ?? 0) : 0;
-        if (!mergedCoordinateInfo && model.visible && modelGeometry?.coordinateInfo) {
-          mergedCoordinateInfo = modelGeometry.coordinateInfo;
+        if (model.visible && modelGeometry?.coordinateInfo) {
+          const ci = modelGeometry.coordinateInfo;
+          if (!baseCoordInfo) baseCoordInfo = ci;
+          anyLargeCoords = anyLargeCoords || !!ci.hasLargeCoordinates;
+          unionedShifted = unionBounds(unionedShifted, ci.shiftedBounds);
+          unionedOriginal = unionBounds(unionedOriginal, ci.originalBounds);
         }
 
         if (
@@ -187,6 +220,15 @@ export function ViewportContainer() {
         }
       }
 
+      const mergedCoordinateInfo: CoordinateInfo | undefined = baseCoordInfo
+        ? {
+            ...baseCoordInfo,
+            originalBounds: unionedOriginal ?? baseCoordInfo.originalBounds,
+            shiftedBounds: unionedShifted ?? baseCoordInfo.shiftedBounds,
+            hasLargeCoordinates: anyLargeCoords,
+          }
+        : undefined;
+
       return {
         meshes: mergedCacheRef.current,
         totalVertices,

package/src/components/viewer/bcf/BCFOverlay.tsx

@@ -128,7 +128,7 @@ export function BCFOverlay() {
   const bcfProject = useViewerStore((s) => s.bcfProject);
   const activeTopicId = useViewerStore((s) => s.activeTopicId);
   const setActiveTopic = useViewerStore((s) => s.setActiveTopic);
-  const setBcfPanelVisible = useViewerStore((s) => s.setBcfPanelVisible);
+  const openWorkspacePanel = useViewerStore((s) => s.openWorkspacePanel);
   const models = useViewerStore((s) => s.models);
   const loading = useViewerStore((s) => s.loading);
   const ifcDataStore = useViewerStore((s) => s.ifcDataStore);
@@ -239,10 +239,11 @@ export function BCFOverlay() {
     if (!overlay) return;
     return overlay.onMarkerClick((topicGuid) => {
       setActiveTopic(topicGuid);
-      const panelVisible = useViewerStore.getState().bcfPanelVisible;
-      if (!panelVisible) setBcfPanelVisible(true);
+      // Open BCF exclusively so clicking a marker brings it to the front over any
+      // other right panel (e.g. clash), instead of leaving it behind.
+      openWorkspacePanel('bcf');
     });
-  }, [overlayReady, setActiveTopic, setBcfPanelVisible]);
+  }, [overlayReady, setActiveTopic, openWorkspacePanel]);
 
   return (
     <div

package/src/components/viewer/lists/ColumnHeaderMenu.tsx

@@ -0,0 +1,84 @@
+/* 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/. */
+
+/**
+ * Per-column actions menu for the Lists results table header. Brings
+ * grouping / aggregation / sorting onto the table itself so the user never
+ * has to round-trip through the list settings.
+ */
+
+import { ArrowUp, ArrowDown, Group, Ungroup, Sigma, Palette, MoreVertical } from 'lucide-react';
+import {
+  DropdownMenu,
+  DropdownMenuTrigger,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuCheckboxItem,
+  DropdownMenuSeparator,
+} from '@/components/ui/dropdown-menu';
+import { cn } from '@/lib/utils';
+
+interface ColumnHeaderMenuProps {
+  isNumeric: boolean;
+  isGroupedBy: boolean;
+  isSummed: boolean;
+  active: boolean;
+  onSort: (dir: 'asc' | 'desc') => void;
+  onToggleGroup: () => void;
+  onToggleSum: () => void;
+  onColorBy: () => void;
+}
+
+export function ColumnHeaderMenu({
+  isNumeric, isGroupedBy, isSummed, active,
+  onSort, onToggleGroup, onToggleSum, onColorBy,
+}: ColumnHeaderMenuProps) {
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <button
+          aria-label="Column options"
+          onClick={(e) => e.stopPropagation()}
+          className={cn(
+            'shrink-0 rounded-sm p-0.5 transition-opacity hover:text-foreground',
+            active
+              ? 'text-primary opacity-100'
+              : 'text-muted-foreground opacity-0 group-hover/col:opacity-100 data-[state=open]:opacity-100',
+          )}
+        >
+          <MoreVertical className="h-3 w-3" />
+        </button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="start" className="w-52">
+        <DropdownMenuItem className="gap-2 text-xs" onClick={() => onSort('asc')}>
+          <ArrowUp className="h-3.5 w-3.5" /> Sort ascending
+        </DropdownMenuItem>
+        <DropdownMenuItem className="gap-2 text-xs" onClick={() => onSort('desc')}>
+          <ArrowDown className="h-3.5 w-3.5" /> Sort descending
+        </DropdownMenuItem>
+        <DropdownMenuSeparator />
+        <DropdownMenuItem className="gap-2 text-xs" onClick={onToggleGroup}>
+          {isGroupedBy
+            ? (<><Ungroup className="h-3.5 w-3.5" /> Remove grouping</>)
+            : (<><Group className="h-3.5 w-3.5" /> Group by this column</>)}
+        </DropdownMenuItem>
+        <DropdownMenuCheckboxItem
+          className="text-xs"
+          checked={isSummed}
+          disabled={!isNumeric}
+          onCheckedChange={onToggleSum}
+        >
+          <span className="flex items-center gap-2">
+            <Sigma className="h-3.5 w-3.5" />
+            {isNumeric ? 'Sum / total this column' : 'Sum (numeric only)'}
+          </span>
+        </DropdownMenuCheckboxItem>
+        <DropdownMenuSeparator />
+        <DropdownMenuItem className="gap-2 text-xs" onClick={onColorBy}>
+          <Palette className="h-3.5 w-3.5" /> Colour by this column
+        </DropdownMenuItem>
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}