@ifc-lite/viewer 1.18.0 → 1.19.0

package/dist/assets/{server-client-ncOQVNso.js → server-client-BB6cMAXE.js}

@@ -1,4 +1,4 @@
-import { _ as de, __tla as __tla_0 } from "./exporters-B_OBqIyD.js";
+import { _ as de, __tla as __tla_0 } from "./exporters-BraHBeoi.js";
 let We, je;
 let __tla = Promise.all([
     (()=>{

package/dist/assets/{wasm-bridge-DyfBSB8z.js → wasm-bridge-CAYCUHbE.js}

@@ -1 +1 @@
-import{I as f,a as m}from"./exporters-B_OBqIyD.js";import"./bcf-DOG9_WPX.js";import"./zip-DBEtpeu6.js";import"./cesium-DUOzBlqv.js";import"./arrow-CZ5kQ26f.js";class b{bridge;initialized=!1;constructor(){this.bridge=new f}async init(){this.initialized||(await this.bridge.init(),this.initialized=!0)}isInitialized(){return this.initialized}toIfcContent(e){return typeof e=="string"?e:new TextDecoder().decode(e)}async processGeometry(e){this.initialized||await this.init(),performance.now();const i=new m(this.bridge.getApi(),this.toIfcContent(e)),r=i.collectMeshes(),s=i.getBuildingRotation();performance.now();let o=0,n=0;for(const a of r)o+=a.positions.length/3,n+=a.indices.length/3;return{meshes:r,totalVertices:o,totalTriangles:n,coordinateInfo:{originShift:{x:0,y:0,z:0},originalBounds:{min:{x:0,y:0,z:0},max:{x:0,y:0,z:0}},shiftedBounds:{min:{x:0,y:0,z:0},max:{x:0,y:0,z:0}},hasLargeCoordinates:!1,buildingRotation:s}}}async processGeometryStreaming(e,i){this.initialized||await this.init();const r=performance.now(),s=new m(this.bridge.getApi(),this.toIfcContent(e));let o=0,n=0,c=0;try{for await(const t of s.collectMeshesStreaming(50)){if(t&&typeof t=="object"&&"type"in t&&t.type==="colorUpdate")continue;const l=t;o+=l.length;for(const g of l)n+=g.positions.length/3,c+=g.indices.length/3;i.onBatch?.({meshes:l,progress:{processed:o,total:o,currentType:"processing"}})}}catch(t){throw i.onError?.(t instanceof Error?t:new Error(String(t))),t}const d=performance.now()-r,h={totalMeshes:o,totalVertices:n,totalTriangles:c,parseTimeMs:d*.3,geometryTimeMs:d*.7};return i.onComplete?.(h),h}getApi(){return this.bridge.getApi()}}export{b as WasmBridge};
+import{I as f,a as m}from"./exporters-BraHBeoi.js";import"./bcf-DOG9_WPX.js";import"./zip-DBEtpeu6.js";import"./cesium-DUOzBlqv.js";import"./arrow-CZ5kQ26f.js";class b{bridge;initialized=!1;constructor(){this.bridge=new f}async init(){this.initialized||(await this.bridge.init(),this.initialized=!0)}isInitialized(){return this.initialized}toIfcContent(e){return typeof e=="string"?e:new TextDecoder().decode(e)}async processGeometry(e){this.initialized||await this.init(),performance.now();const i=new m(this.bridge.getApi(),this.toIfcContent(e)),r=i.collectMeshes(),s=i.getBuildingRotation();performance.now();let o=0,n=0;for(const a of r)o+=a.positions.length/3,n+=a.indices.length/3;return{meshes:r,totalVertices:o,totalTriangles:n,coordinateInfo:{originShift:{x:0,y:0,z:0},originalBounds:{min:{x:0,y:0,z:0},max:{x:0,y:0,z:0}},shiftedBounds:{min:{x:0,y:0,z:0},max:{x:0,y:0,z:0}},hasLargeCoordinates:!1,buildingRotation:s}}}async processGeometryStreaming(e,i){this.initialized||await this.init();const r=performance.now(),s=new m(this.bridge.getApi(),this.toIfcContent(e));let o=0,n=0,c=0;try{for await(const t of s.collectMeshesStreaming(50)){if(t&&typeof t=="object"&&"type"in t&&t.type==="colorUpdate")continue;const l=t;o+=l.length;for(const g of l)n+=g.positions.length/3,c+=g.indices.length/3;i.onBatch?.({meshes:l,progress:{processed:o,total:o,currentType:"processing"}})}}catch(t){throw i.onError?.(t instanceof Error?t:new Error(String(t))),t}const d=performance.now()-r,h={totalMeshes:o,totalVertices:n,totalTriangles:c,parseTimeMs:d*.3,geometryTimeMs:d*.7};return i.onComplete?.(h),h}getApi(){return this.bridge.getApi()}}export{b as WasmBridge};

package/dist/index.html

@@ -50,19 +50,19 @@
   <meta name="theme-color" content="#7aa2f7">
   <meta name="msapplication-TileColor" content="#1a1b26">
   <meta name="msapplication-TileImage" content="/favicon-192x192-cropped.png">
-  <script type="module" crossorigin src="/assets/index-BKq-M3Mk.js"></script>
+  <script type="module" crossorigin src="/assets/index-BOi3BuUI.js"></script>
   <link rel="modulepreload" crossorigin href="/assets/arrow-CZ5kQ26f.js">
   <link rel="modulepreload" crossorigin href="/assets/cesium-DUOzBlqv.js">
   <link rel="modulepreload" crossorigin href="/assets/zip-DBEtpeu6.js">
   <link rel="modulepreload" crossorigin href="/assets/bcf-DOG9_WPX.js">
-  <link rel="modulepreload" crossorigin href="/assets/exporters-B_OBqIyD.js">
+  <link rel="modulepreload" crossorigin href="/assets/exporters-BraHBeoi.js">
   <link rel="modulepreload" crossorigin href="/assets/lens-CSASnhAL.js">
-  <link rel="modulepreload" crossorigin href="/assets/sandbox-jez21HtV.js">
+  <link rel="modulepreload" crossorigin href="/assets/sandbox-Baez7n-t.js">
   <link rel="modulepreload" crossorigin href="/assets/drawing-2d-DoxKMqbO.js">
-  <link rel="modulepreload" crossorigin href="/assets/server-client-ncOQVNso.js">
+  <link rel="modulepreload" crossorigin href="/assets/server-client-BB6cMAXE.js">
   <link rel="modulepreload" crossorigin href="/assets/ids-DQ5jY0E8.js">
   <link rel="stylesheet" crossorigin href="/assets/cesium-ADbP7waU.css">
-  <link rel="stylesheet" crossorigin href="/assets/index-COnQRuqY.css">
+  <link rel="stylesheet" crossorigin href="/assets/index-0XpVr_S5.css">
 </head>
 <body>
   <div id="root"></div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ifc-lite/viewer",
-  "version": "1.18.0",
+  "version": "1.19.0",
   "description": "IFC-Lite viewer application",
   "type": "module",
   "dependencies": {
@@ -52,19 +52,20 @@
     "@ifc-lite/drawing-2d": "^1.15.3",
     "@ifc-lite/encoding": "^1.14.6",
     "@ifc-lite/export": "^1.18.0",
-    "@ifc-lite/geometry": "^1.16.6",
+    "@ifc-lite/geometry": "^1.17.0",
     "@ifc-lite/ids": "^1.14.10",
     "@ifc-lite/lens": "^1.14.4",
     "@ifc-lite/lists": "^1.14.10",
     "@ifc-lite/mutations": "^1.15.0",
-    "@ifc-lite/parser": "^2.2.0",
+    "@ifc-lite/parser": "^2.3.0",
+    "@ifc-lite/pointcloud": "^0.2.0",
     "@ifc-lite/query": "^1.14.7",
-    "@ifc-lite/renderer": "^1.17.0",
+    "@ifc-lite/renderer": "^1.18.0",
     "@ifc-lite/sandbox": "^1.15.0",
-    "@ifc-lite/server-client": "^1.15.3",
     "@ifc-lite/sdk": "^1.15.0",
+    "@ifc-lite/server-client": "^1.15.3",
     "@ifc-lite/spatial": "^1.14.5",
-    "@ifc-lite/wasm": "^1.16.7"
+    "@ifc-lite/wasm": "^1.16.8"
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4.1.18",

package/src/components/viewer/MainToolbar.tsx

@@ -425,6 +425,7 @@ export function MainToolbar({ onShowShortcuts }: MainToolbarProps = {} as MainTo
     // Filter to supported files (IFC, IFCX, GLB)
     const supportedFiles = Array.from(files).filter(
       f => f.name.endsWith('.ifc') || f.name.endsWith('.ifcx') || f.name.endsWith('.glb')
+        || f.name.toLowerCase().endsWith('.las') || f.name.toLowerCase().endsWith('.laz') || f.name.toLowerCase().endsWith('.ply') || f.name.toLowerCase().endsWith('.pcd') || f.name.toLowerCase().endsWith('.e57')
     );
 
     if (supportedFiles.length === 0) return;
@@ -465,6 +466,7 @@ export function MainToolbar({ onShowShortcuts }: MainToolbarProps = {} as MainTo
     // Filter to supported files (IFC, IFCX, GLB)
     const supportedFiles = Array.from(files).filter(
       f => f.name.endsWith('.ifc') || f.name.endsWith('.ifcx') || f.name.endsWith('.glb')
+        || f.name.toLowerCase().endsWith('.las') || f.name.toLowerCase().endsWith('.laz') || f.name.toLowerCase().endsWith('.ply') || f.name.toLowerCase().endsWith('.pcd') || f.name.toLowerCase().endsWith('.e57')
     );
 
     if (supportedFiles.length === 0) return;
@@ -779,7 +781,7 @@ export function MainToolbar({ onShowShortcuts }: MainToolbarProps = {} as MainTo
         id="file-input-open"
         ref={fileInputRef}
         type="file"
-        accept=".ifc,.ifcx,.glb"
+        accept=".ifc,.ifcx,.glb,.las,.laz,.ply,.pcd,.e57"
         multiple
         onChange={handleFileSelect}
         className="hidden"
@@ -787,7 +789,7 @@ export function MainToolbar({ onShowShortcuts }: MainToolbarProps = {} as MainTo
       <input
         ref={addModelInputRef}
         type="file"
-        accept=".ifc,.ifcx,.glb"
+        accept=".ifc,.ifcx,.glb,.las,.laz,.ply,.pcd,.e57"
         multiple
         onChange={handleAddModelSelect}
         className="hidden"

package/src/components/viewer/PointCloudPanel.tsx

@@ -0,0 +1,174 @@
+/* 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/. */
+
+/**
+ * Compact panel that exposes point cloud rendering controls (color mode,
+ * size mode, point size, EDL). Renders only when point cloud assets are
+ * loaded — sits over the canvas without affecting layout for IFC-only
+ * models.
+ */
+
+import { useViewerStore } from '@/store';
+import type { PointColorModeUi, PointSizeModeUi } from '@/store/slices/pointCloudSlice';
+import { cn } from '@/lib/utils';
+
+const COLOR_MODES: Array<{ value: PointColorModeUi; label: string; hint: string }> = [
+  { value: 'rgb',            label: 'RGB',            hint: 'Per-point colour from the source' },
+  { value: 'classification', label: 'Classification', hint: 'ASPRS class palette (ground, vegetation, building...)' },
+  { value: 'intensity',      label: 'Intensity',      hint: 'Greyscale ramp from per-point intensity' },
+  { value: 'height',         label: 'Height',         hint: 'Cool-warm ramp by Y-up world height' },
+  { value: 'fixed',          label: 'Solid',          hint: 'Single colour override' },
+];
+
+const SIZE_MODES: Array<{ value: PointSizeModeUi; label: string; hint: string }> = [
+  { value: 'fixed-px',       label: 'Fixed',    hint: 'Always render at the slider value (in pixels)' },
+  { value: 'attenuated',     label: 'Auto',     hint: 'Adaptive (closer = bigger), clamped to the slider as max' },
+  { value: 'adaptive-world', label: 'World',    hint: 'Pure world-space radius — splat covers N mm in source space' },
+];
+
+export interface PointCloudPanelProps {
+  /** Number of currently-loaded point cloud assets — panel hides when 0. */
+  assetCount: number;
+}
+
+export function PointCloudPanel({ assetCount }: PointCloudPanelProps) {
+  const colorMode = useViewerStore((s) => s.pointCloudColorMode);
+  const setColorMode = useViewerStore((s) => s.setPointCloudColorMode);
+  const sizeMode = useViewerStore((s) => s.pointCloudSizeMode);
+  const setSizeMode = useViewerStore((s) => s.setPointCloudSizeMode);
+  const pointSize = useViewerStore((s) => s.pointCloudPointSize);
+  const setPointSize = useViewerStore((s) => s.setPointCloudPointSize);
+  const worldRadius = useViewerStore((s) => s.pointCloudWorldRadius);
+  const setWorldRadius = useViewerStore((s) => s.setPointCloudWorldRadius);
+  const edlEnabled = useViewerStore((s) => s.pointCloudEdlEnabled);
+  const setEdlEnabled = useViewerStore((s) => s.setPointCloudEdlEnabled);
+  const edlStrength = useViewerStore((s) => s.pointCloudEdlStrength);
+  const setEdlStrength = useViewerStore((s) => s.setPointCloudEdlStrength);
+
+  if (assetCount <= 0) return null;
+
+  return (
+    <div className="absolute bottom-4 left-4 z-10 pointer-events-auto bg-background/90 backdrop-blur-sm rounded-lg border shadow-lg p-2 flex flex-col gap-2 min-w-[200px]">
+      <div className="flex items-center justify-between gap-2">
+        <span className="text-[10px] font-semibold uppercase tracking-wider text-muted-foreground">
+          Point Cloud
+        </span>
+        <span className="text-[10px] text-muted-foreground">
+          {assetCount} asset{assetCount === 1 ? '' : 's'}
+        </span>
+      </div>
+
+      {/* Color mode */}
+      <div className="flex flex-col gap-0.5">
+        <span className="text-[9px] uppercase text-muted-foreground tracking-wider">Colour</span>
+        {COLOR_MODES.map((mode) => {
+          const active = colorMode === mode.value;
+          return (
+            <button
+              key={mode.value}
+              aria-pressed={active}
+              onClick={() => setColorMode(mode.value)}
+              title={mode.hint}
+              className={cn(
+                'flex items-center gap-2 px-2 py-1 rounded text-xs transition-colors text-left',
+                active
+                  ? 'bg-teal-600 text-white'
+                  : 'text-muted-foreground hover:bg-muted hover:text-foreground',
+              )}
+            >
+              {mode.label}
+            </button>
+          );
+        })}
+      </div>
+
+      {/* Size mode */}
+      <div className="flex flex-col gap-0.5">
+        <span className="text-[9px] uppercase text-muted-foreground tracking-wider">Size</span>
+        <div className="grid grid-cols-3 gap-0.5">
+          {SIZE_MODES.map((mode) => {
+            const active = sizeMode === mode.value;
+            return (
+              <button
+                key={mode.value}
+                aria-pressed={active}
+                onClick={() => setSizeMode(mode.value)}
+                title={mode.hint}
+                className={cn(
+                  'px-1.5 py-1 rounded text-[11px] transition-colors',
+                  active
+                    ? 'bg-teal-600 text-white'
+                    : 'text-muted-foreground hover:bg-muted hover:text-foreground',
+                )}
+              >
+                {mode.label}
+              </button>
+            );
+          })}
+        </div>
+        <label className="flex items-center gap-2 mt-1">
+          <span className="text-[10px] text-muted-foreground w-8 shrink-0">{pointSize.toFixed(0)}px</span>
+          <input
+            type="range"
+            min={1}
+            max={20}
+            step={1}
+            value={pointSize}
+            onChange={(e) => setPointSize(Number(e.target.value))}
+            className="flex-1 h-1 accent-teal-600 cursor-pointer"
+            title="Splat size in pixels (or upper cap in Auto mode)"
+          />
+        </label>
+        {sizeMode !== 'fixed-px' && (
+          <label className="flex items-center gap-2">
+            <span className="text-[10px] text-muted-foreground w-8 shrink-0">
+              {(worldRadius * 1000).toFixed(0)}mm
+            </span>
+            <input
+              type="range"
+              min={1}
+              max={100}
+              step={1}
+              value={Math.round(worldRadius * 1000)}
+              onChange={(e) => setWorldRadius(Number(e.target.value) / 1000)}
+              className="flex-1 h-1 accent-teal-600 cursor-pointer"
+              title="World-space splat radius in millimetres"
+            />
+          </label>
+        )}
+      </div>
+
+      {/* EDL */}
+      <div className="flex flex-col gap-0.5">
+        <label className="flex items-center justify-between gap-2 cursor-pointer">
+          <span className="text-[9px] uppercase text-muted-foreground tracking-wider">EDL</span>
+          <input
+            type="checkbox"
+            checked={edlEnabled}
+            onChange={(e) => setEdlEnabled(e.target.checked)}
+            className="accent-teal-600"
+            title="Eye-Dome Lighting — adds depth perception via screen-space depth gradient"
+          />
+        </label>
+        {edlEnabled && (
+          <label className="flex items-center gap-2">
+            <span className="text-[10px] text-muted-foreground w-8 shrink-0">
+              {edlStrength.toFixed(1)}
+            </span>
+            <input
+              type="range"
+              min={0}
+              max={3}
+              step={0.1}
+              value={edlStrength}
+              onChange={(e) => setEdlStrength(Number(e.target.value))}
+              className="flex-1 h-1 accent-teal-600 cursor-pointer"
+              title="EDL strength multiplier"
+            />
+          </label>
+        )}
+      </div>
+    </div>
+  );
+}

package/src/components/viewer/Viewport.tsx

@@ -8,7 +8,7 @@
 
 import { useCallback, useEffect, useRef, useState, useMemo } from 'react';
 import { Renderer, type VisualEnhancementOptions } from '@ifc-lite/renderer';
-import type { MeshData, CoordinateInfo } from '@ifc-lite/geometry';
+import type { MeshData, CoordinateInfo, PointCloudAsset } from '@ifc-lite/geometry';
 import { useViewerStore, resolveEntityRef, type MeasurePoint, type SnapVisualization } from '@/store';
 import {
   useSelectionState,
@@ -36,6 +36,8 @@ import { useTouchControls, type TouchState } from './useTouchControls.js';
 import { useKeyboardControls } from './useKeyboardControls.js';
 import { useAnimationLoop } from './useAnimationLoop.js';
 import { useGeometryStreaming } from './useGeometryStreaming.js';
+import { usePointCloudSync } from './usePointCloudSync.js';
+import { usePointCloudLifecycle } from './usePointCloudLifecycle.js';
 import { useRenderUpdates } from './useRenderUpdates.js';
 
 interface ViewportProps {
@@ -43,6 +45,8 @@ interface ViewportProps {
   /** Monotonic counter that increments when geometry changes — used to trigger
    *  streaming effects even when the geometry array reference is stable. */
   geometryVersion?: number;
+  /** Point cloud assets aggregated across visible federated models. */
+  pointClouds?: ReadonlyArray<PointCloudAsset> | null;
   coordinateInfo?: CoordinateInfo;
   computedIsolatedIds?: Set<number> | null;
   modelIdToIndex?: Map<string, number>;
@@ -56,6 +60,7 @@ interface ViewportProps {
 export function Viewport({
   geometry,
   geometryVersion,
+  pointClouds,
   coordinateInfo,
   computedIsolatedIds,
   modelIdToIndex,
@@ -856,6 +861,18 @@ export function Viewport({
     onGeometryReleased,
   });
 
+  usePointCloudSync({
+    rendererRef,
+    isInitialized,
+    pointClouds,
+    hasMeshes: (geometry?.length ?? 0) > 0,
+  });
+
+  usePointCloudLifecycle({
+    rendererRef,
+    isInitialized,
+  });
+
   useRenderUpdates({
     rendererRef,
     isInitialized,

package/src/components/viewer/ViewportContainer.tsx

@@ -20,8 +20,10 @@ import { openIfcFileDialog } from '@/services/file-dialog';
 import { logToDesktopTerminal } from '@/services/desktop-logger';
 import { cacheFileBlobs, formatFileSize, getCachedFile, getRecentFiles, recordRecentFiles, type RecentFileEntry } from '@/lib/recent-files';
 import { isTauri } from '@/lib/platform';
+import { toast } from '@/components/ui/toast';
+import { describeUnsupportedFormat } from '@/hooks/ingest/pointCloudIngest';
 import { Upload, MousePointer, Layers, Info, Command, AlertTriangle, ChevronDown, ExternalLink, Plus, Clock3 } from 'lucide-react';
-import type { MeshData, CoordinateInfo, GeometryResult } from '@ifc-lite/geometry';
+import type { MeshData, CoordinateInfo, GeometryResult, PointCloudAsset } from '@ifc-lite/geometry';
 import { type IfcDataStore } from '@ifc-lite/parser';
 import { getEffectiveGeoreference } from '@/lib/geo/effective-georef';
 
@@ -174,6 +176,30 @@ export function ViewportContainer() {
     return geometryResult;
   }, [storeModels, geometryResult, modelIdToIndex]);
 
+  /**
+   * Aggregate point clouds across visible models.
+   *
+   * Phase 0: identity-stamping with modelIndex. Returns the same array
+   * reference when nothing has changed so the consumer effect skips work.
+   */
+  const mergedPointClouds = useMemo(() => {
+    const collected: PointCloudAsset[] = [];
+    if (storeModels.size > 0) {
+      for (const [modelId, model] of storeModels) {
+        if (!model.visible) continue;
+        const assets = model.geometryResult?.pointClouds;
+        if (!assets || assets.length === 0) continue;
+        const modelIndex = modelIdToIndex.get(modelId) ?? 0;
+        for (const asset of assets) {
+          collected.push(asset.modelIndex === modelIndex ? asset : { ...asset, modelIndex });
+        }
+      }
+    } else if (geometryResult?.pointClouds) {
+      collected.push(...geometryResult.pointClouds);
+    }
+    return collected;
+  }, [storeModels, geometryResult, modelIdToIndex]);
+
   // Extract georeferencing info merged with any live mutations (for Cesium overlay).
   // Reacts to: model load, Cesium toggle, and every georef field edit.
   const georef = useMemo(() => {
@@ -281,12 +307,22 @@ export function ViewportContainer() {
       return;
     }
 
-    // Filter to supported files (IFC, IFCX, GLB)
-    const supportedFiles = Array.from(e.dataTransfer.files).filter(
+    // Filter to supported files (IFC, IFCX, GLB, point clouds)
+    const allDropped = Array.from(e.dataTransfer.files);
+    const supportedFiles = allDropped.filter(
       f => f.name.endsWith('.ifc') || f.name.endsWith('.ifcx') || f.name.endsWith('.glb')
+        || f.name.toLowerCase().endsWith('.las') || f.name.toLowerCase().endsWith('.laz') || f.name.toLowerCase().endsWith('.ply') || f.name.toLowerCase().endsWith('.pcd') || f.name.toLowerCase().endsWith('.e57')
     );
 
-    if (supportedFiles.length === 0) return;
+    if (supportedFiles.length === 0) {
+      // Tell the user *why* — common case is a Recap project / SketchUp
+      // file dropped because they assumed our viewer would understand it.
+      const explained = allDropped.find((f) => describeUnsupportedFormat(f.name));
+      if (explained) {
+        toast.error(`${explained.name}: ${describeUnsupportedFormat(explained.name)}`);
+      }
+      return;
+    }
 
     recordRecentFiles(supportedFiles.map((file) => ({ name: file.name, size: file.size })));
     void cacheFileBlobs(supportedFiles);
@@ -318,6 +354,7 @@ export function ViewportContainer() {
     // Filter to supported files (IFC, IFCX, GLB)
     const supportedFiles = Array.from(files).filter(
       f => f.name.endsWith('.ifc') || f.name.endsWith('.ifcx') || f.name.endsWith('.glb')
+        || f.name.toLowerCase().endsWith('.las') || f.name.toLowerCase().endsWith('.laz') || f.name.toLowerCase().endsWith('.ply') || f.name.toLowerCase().endsWith('.pcd') || f.name.toLowerCase().endsWith('.e57')
     );
 
     if (supportedFiles.length === 0) return;
@@ -529,7 +566,7 @@ export function ViewportContainer() {
         <input
           ref={fileInputRef}
           type="file"
-          accept=".ifc,.ifcx,.glb"
+          accept=".ifc,.ifcx,.glb,.las,.laz,.ply,.pcd,.e57"
           multiple
           onChange={handleFileSelect}
           className="hidden"
@@ -845,6 +882,7 @@ export function ViewportContainer() {
       <Viewport
         geometry={filteredGeometry}
         geometryVersion={geometryVersion}
+        pointClouds={mergedPointClouds}
         coordinateInfo={mergedGeometryResult?.coordinateInfo}
         computedIsolatedIds={computedIsolatedIds}
         modelIdToIndex={modelIdToIndex}

package/src/components/viewer/ViewportOverlays.tsx

@@ -22,10 +22,11 @@ import { goHomeFromStore } from '@/store/homeView';
 import { useIfc } from '@/hooks/useIfc';
 import { cn } from '@/lib/utils';
 import { isTauri } from '@/lib/platform';
-
-const isDesktop = isTauri();
 import { ViewCube, type ViewCubeRef } from './ViewCube';
 import { AxisHelper, type AxisHelperRef } from './AxisHelper';
+import { PointCloudPanel } from './PointCloudPanel';
+
+const isDesktop = isTauri();
 
 export function ViewportOverlays({ hideViewCube = false }: { hideViewCube?: boolean } = {}) {
   const selectedStoreys = useViewerStore((s) => s.selectedStoreys);
@@ -149,6 +150,7 @@ export function ViewportOverlays({ hideViewCube = false }: { hideViewCube?: bool
 
   return (
     <>
+      <PointCloudPanelMount />
       {/* Bottom-right: Cesium settings overlay OR Navigation controls (Cesium is web-only) */}
       {cesiumEnabled && !isDesktop ? (
         <CesiumSettingsOverlay
@@ -314,3 +316,12 @@ function CesiumSettingsOverlay({
     </div>
   );
 }
+
+/**
+ * Tiny indirection so the panel can subscribe to its own slice without
+ * pulling extra state into the parent overlay component.
+ */
+function PointCloudPanelMount() {
+  const count = useViewerStore((s) => s.pointCloudAssetCount);
+  return <PointCloudPanel assetCount={count} />;
+}

package/src/components/viewer/tools/AddElementOverlay.tsx

@@ -51,14 +51,54 @@ export function AddElementOverlay() {
   // hover points each frame. The tick state is just a number that
   // forces a re-render; the projection itself is read fresh from the
   // store callback.
+  //
+  // Two perf gates:
+  //  1. Skip the loop entirely when there's nothing to project.
+  //     pendingPoints / hoverPoint / autoSpacePreview already trigger
+  //     React re-renders via the store, so the only reason we'd need
+  //     a per-frame tick is to track the camera while content exists.
+  //  2. Only re-render when the camera actually moved since last tick.
+  //     A held tool with a static camera does ~0 work.
+  const getViewpoint = useViewerStore((s) => s.cameraCallbacks.getViewpoint);
+  const hasOverlayContent =
+    pendingPoints.length > 0 ||
+    hoverPoint !== null ||
+    (autoSpacePreview != null && autoSpacePreview.outlines.length > 0);
   const [frameTick, setFrameTick] = useState(0);
   const rafRef = useRef<number | null>(null);
+  const lastViewpointRef = useRef<{
+    px: number; py: number; pz: number;
+    tx: number; ty: number; tz: number;
+    fov: number;
+  } | null>(null);
   useEffect(() => {
     if (activeTool !== 'addElement') return;
+    if (!hasOverlayContent) return;
     let mounted = true;
     const loop = () => {
       if (!mounted) return;
-      setFrameTick((t) => (t + 1) & 0xffff);
+      const vp = getViewpoint?.();
+      if (vp) {
+        const last = lastViewpointRef.current;
+        const moved =
+          !last ||
+          last.px !== vp.position.x || last.py !== vp.position.y || last.pz !== vp.position.z ||
+          last.tx !== vp.target.x  || last.ty !== vp.target.y  || last.tz !== vp.target.z  ||
+          last.fov !== vp.fov;
+        if (moved) {
+          lastViewpointRef.current = {
+            px: vp.position.x, py: vp.position.y, pz: vp.position.z,
+            tx: vp.target.x,   ty: vp.target.y,   tz: vp.target.z,
+            fov: vp.fov,
+          };
+          setFrameTick((t) => (t + 1) & 0xffff);
+        }
+      } else {
+        // Fallback for environments without getViewpoint — preserves the
+        // pre-fix behaviour of an unconditional tick so the projection
+        // can't get stuck stale.
+        setFrameTick((t) => (t + 1) & 0xffff);
+      }
       rafRef.current = requestAnimationFrame(loop);
     };
     rafRef.current = requestAnimationFrame(loop);
@@ -66,8 +106,9 @@ export function AddElementOverlay() {
       mounted = false;
       if (rafRef.current !== null) cancelAnimationFrame(rafRef.current);
       rafRef.current = null;
+      lastViewpointRef.current = null;
     };
-  }, [activeTool]);
+  }, [activeTool, hasOverlayContent, getViewpoint]);
 
   const projection = useMemo(
     () => makeProjection(projectToScreen),

package/src/components/viewer/usePointCloudLifecycle.ts

@@ -0,0 +1,64 @@
+/* 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/. */
+
+/**
+ * Tear down streamed point cloud GPU resources when a model is removed.
+ *
+ * Streamed assets (LAS/LAZ) live in a separate ownership bucket on the
+ * renderer (see `PointCloudRenderer`'s `'streamed'` owner tag), so they
+ * survive `setPointClouds` calls. That isolation cuts both ways: nothing
+ * else clears them, so when a model is removed we have to do it here or
+ * the GPU buffers leak for the rest of the session.
+ *
+ * The hook tracks the previous set of `(modelId → handleId)` pairs and,
+ * on every store change, frees the handles for models that disappeared.
+ * Pure cleanup — no state mutation.
+ */
+
+import { useEffect, useRef, type MutableRefObject } from 'react';
+import type { Renderer } from '@ifc-lite/renderer';
+import { useViewerStore } from '@/store';
+
+export interface UsePointCloudLifecycleParams {
+  rendererRef: MutableRefObject<Renderer | null>;
+  isInitialized: boolean;
+}
+
+export function usePointCloudLifecycle(params: UsePointCloudLifecycleParams): void {
+  const { rendererRef, isInitialized } = params;
+  const models = useViewerStore((s) => s.models);
+  const decCount = useViewerStore((s) => s.incrementPointCloudAssetCount);
+  const previousRef = useRef<Map<string, number>>(new Map());
+
+  useEffect(() => {
+    if (!isInitialized) return;
+    const renderer = rendererRef.current;
+    if (!renderer) return;
+
+    const current = new Map<string, number>();
+    for (const [modelId, model] of models) {
+      if (typeof model.pointCloudHandleId === 'number') {
+        current.set(modelId, model.pointCloudHandleId);
+      }
+    }
+
+    // Dispose handles whose model disappeared OR whose model still
+    // exists but was rebound to a new handle (e.g. the user reloaded
+    // the same file and got a fresh streaming session). Without the
+    // rebind branch the old GPU buffers stay allocated for the rest
+    // of the session.
+    for (const [modelId, handleId] of previousRef.current) {
+      const nextHandle = current.get(modelId);
+      if (nextHandle !== handleId) {
+        renderer.removePointCloudAsset({ id: handleId });
+        decCount(-1);
+      }
+    }
+
+    previousRef.current = current;
+    renderer.requestRender();
+  }, [models, isInitialized, rendererRef, decCount]);
+}
+
+export default usePointCloudLifecycle;