npm - @ifc-lite/viewer - Versions diffs - 1.14.3 → 1.14.4 - Mend

@ifc-lite/viewer 1.14.3 → 1.14.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/dist/assets/{native-bridge-DtcJqlOi.js → native-bridge-DAOWftxE.js} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { _ as c, __tla as __tla_0 } from "./index-Be6XjVeM.js";
+import { _ as c, __tla as __tla_0 } from "./index-DX-Qf5fA.js";
 let m;
 let __tla = Promise.all([
     (()=>{

package/dist/assets/{wasm-bridge-BJJVu9P2.js → wasm-bridge-D7jYpn8a.js} RENAMED Viewed

	@@ -1 +1 @@
1	- import{I as f,a as m}from"./index-~~Be6XjVeM~~.js";class u{bridge;initialized=!1;constructor(){this.bridge=new f}async init(){this.initialized\|\|(await this.bridge.init(),this.initialized=!0)}isInitialized(){return this.initialized}async processGeometry(s){this.initialized\|\|await this.init(),performance.now();const i=new m(this.bridge.getApi(),s),n=i.collectMeshes(),r=i.getBuildingRotation();performance.now();let e=0,o=0;for(const c of n)e+=c.positions.length/3,o+=c.indices.length/3;return{meshes:n,totalVertices:e,totalTriangles:o,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:r}}}async processGeometryStreaming(s,i){this.initialized\|\|await this.init();const n=performance.now(),r=new m(this.bridge.getApi(),s);let e=0,o=0,a=0;try{for await(const t of r.collectMeshesStreaming(50)){if(t&&typeof t=="object"&&"type"in t&&t.type==="colorUpdate")continue;const l=t;e+=l.length;for(const d of l)o+=d.positions.length/3,a+=d.indices.length/3;i.onBatch?.({meshes:l,progress:{processed:e,total:e,currentType:"processing"}})}}catch(t){throw i.onError?.(t instanceof Error?t:new Error(String(t))),t}const h=performance.now()-n,g={totalMeshes:e,totalVertices:o,totalTriangles:a,parseTimeMs:h.3,geometryTimeMs:h.7};return i.onComplete?.(g),g}getApi(){return this.bridge.getApi()}}export{u as WasmBridge};
1	+ import{I as f,a as m}from"./index-DX-Qf5fA.js";class u{bridge;initialized=!1;constructor(){this.bridge=new f}async init(){this.initialized\|\|(await this.bridge.init(),this.initialized=!0)}isInitialized(){return this.initialized}async processGeometry(s){this.initialized\|\|await this.init(),performance.now();const i=new m(this.bridge.getApi(),s),n=i.collectMeshes(),r=i.getBuildingRotation();performance.now();let e=0,o=0;for(const c of n)e+=c.positions.length/3,o+=c.indices.length/3;return{meshes:n,totalVertices:e,totalTriangles:o,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:r}}}async processGeometryStreaming(s,i){this.initialized\|\|await this.init();const n=performance.now(),r=new m(this.bridge.getApi(),s);let e=0,o=0,a=0;try{for await(const t of r.collectMeshesStreaming(50)){if(t&&typeof t=="object"&&"type"in t&&t.type==="colorUpdate")continue;const l=t;e+=l.length;for(const d of l)o+=d.positions.length/3,a+=d.indices.length/3;i.onBatch?.({meshes:l,progress:{processed:e,total:e,currentType:"processing"}})}}catch(t){throw i.onError?.(t instanceof Error?t:new Error(String(t))),t}const h=performance.now()-n,g={totalMeshes:e,totalVertices:o,totalTriangles:a,parseTimeMs:h.3,geometryTimeMs:h.7};return i.onComplete?.(g),g}getApi(){return this.bridge.getApi()}}export{u as WasmBridge};

package/dist/index.html CHANGED Viewed

@@ -44,8 +44,8 @@
   <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-Be6XjVeM.js"></script>
-  <link rel="stylesheet" crossorigin href="/assets/index-DdwD4c-E.css">
+  <script type="module" crossorigin src="/assets/index-DX-Qf5fA.js"></script>
+  <link rel="stylesheet" crossorigin href="/assets/index-CMQ_Dgkr.css">
 </head>
 <body>
   <div id="root"></div>

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@ifc-lite/viewer",
-  "version": "1.14.3",
+  "version": "1.14.4",
   "description": "IFC-Lite viewer application",
   "type": "module",
   "dependencies": {
@@ -47,18 +47,18 @@
     "@ifc-lite/data": "^1.14.3",
     "@ifc-lite/drawing-2d": "^1.14.3",
     "@ifc-lite/encoding": "^1.14.3",
-    "@ifc-lite/export": "^1.14.3",
+    "@ifc-lite/export": "^1.14.4",
     "@ifc-lite/geometry": "^1.14.3",
     "@ifc-lite/ids": "^1.14.3",
-    "@ifc-lite/lens": "^1.14.3",
     "@ifc-lite/lists": "^1.14.3",
+    "@ifc-lite/lens": "^1.14.3",
     "@ifc-lite/mutations": "^1.14.3",
-    "@ifc-lite/parser": "^1.14.3",
-    "@ifc-lite/query": "^1.14.3",
+    "@ifc-lite/parser": "^2.0.0",
+    "@ifc-lite/query": "^1.14.4",
     "@ifc-lite/renderer": "^1.14.3",
-    "@ifc-lite/sandbox": "^1.14.3",
     "@ifc-lite/server-client": "^1.14.3",
     "@ifc-lite/spatial": "^1.14.3",
+    "@ifc-lite/sandbox": "^1.14.3",
     "@ifc-lite/wasm": "^1.14.3"
   },
   "devDependencies": {

package/src/components/viewer/CommandPalette.tsx CHANGED Viewed

@@ -218,6 +218,7 @@ function activateBottomPanel(panel: 'script' | 'list') {
   s.setListPanelVisible(false);
   if (!isActive) {
+    s.setRightPanelCollapsed(false);
     if (panel === 'script') s.setScriptPanelVisible(true);
     else s.setListPanelVisible(true);
   }

package/src/components/viewer/HierarchyPanel.tsx CHANGED Viewed

@@ -319,27 +319,42 @@ export function HierarchyPanel() {
           setStoreysSelection(storeyIds);
         }
       }
+    } else if (node.type === 'IfcSpace') {
+      const spaceId = node.expressIds[0];
+      const modelId = node.modelIds[0];
+      const globalId = node.globalIds[0] ?? spaceId;
+      setSelectedEntityIds([]);
+      if (modelId && modelId !== 'legacy') {
+        setSelectedEntityId(globalId);
+        setSelectedEntity({ modelId, expressId: spaceId });
+        setActiveModel(modelId);
+      } else {
+        setSelectedEntityId(globalId);
+        setSelectedEntity({ modelId: 'legacy', expressId: spaceId });
+      }
+      if (node.hasChildren) {
+        toggleExpand(node.id);
+      }
     } else if (node.type === 'element') {
       // Element click - select it
-      const elementId = node.expressIds[0];  // Original expressId
+      const elementId = node.expressIds[0];
       const modelId = node.modelIds[0];
+      const globalId = node.globalIds[0] ?? elementId;
       // Clear multi-selection (e.g. from a prior type-group click) so only
       // this single element is highlighted, matching Viewport pick behavior
       setSelectedEntityIds([]);
       if (modelId !== 'legacy') {
-        // Multi-model: need to convert to globalId for renderer
-        const model = models.get(modelId);
-        const globalId = elementId + (model?.idOffset ?? 0);
         setSelectedEntityId(globalId);
         setSelectedEntity({ modelId, expressId: elementId });
         setActiveModel(modelId);
       } else {
-        // Legacy single-model: expressId = globalId (offset is 0)
-        setSelectedEntityId(elementId);
-        // Also set selectedEntity for property panel (was missing, causing blank panel)
-        setSelectedEntity(resolveEntityRef(elementId));
+        setSelectedEntityId(globalId);
+        setSelectedEntity(resolveEntityRef(globalId));
       }
     }
   }, [selectedStoreys, setStoreysSelection, clearStoreySelection, setSelectedEntityId, setSelectedEntityIds, setSelectedEntity, setSelectedEntities, setActiveModel, toggleExpand, unifiedStoreys, models, isolateEntities, getNodeElements, setHierarchyBasketSelection, toGlobalId]);
@@ -352,8 +367,8 @@ export function HierarchyPanel() {
       ? node.expressIds.some(id => selectedStoreys.has(id))
       : node.type === 'IfcBuildingStorey'
         ? selectedStoreys.has(node.expressIds[0])
-        : node.type === 'element'
-          ? selectedEntityId === node.expressIds[0]
+        : node.type === 'IfcSpace' || node.type === 'element'
+          ? selectedEntityId === (node.globalIds[0] ?? node.expressIds[0])
           : node.type === 'ifc-type'
             ? (() => {
                 const typeExpressId = node.entityExpressId;
@@ -369,8 +384,8 @@ export function HierarchyPanel() {
     // Compute visibility inline - for elements check directly, for storeys use getNodeElements
     let nodeHidden = false;
     if (node.type === 'element') {
-      nodeHidden = hiddenEntities.has(node.expressIds[0]);
-    } else if (node.type === 'IfcBuildingStorey' || node.type === 'unified-storey' ||
+      nodeHidden = hiddenEntities.has(node.globalIds[0] ?? node.expressIds[0]);
+    } else if (node.type === 'IfcBuildingStorey' || node.type === 'IfcSpace' || node.type === 'unified-storey' ||
                node.type === 'type-group' || node.type === 'ifc-type' ||
                (node.type === 'model-header' && node.id.startsWith('contrib-'))) {
       const elements = getNodeElements(node);
@@ -385,7 +400,7 @@ export function HierarchyPanel() {
     }
     return { isSelected, nodeHidden, modelVisible };
-  }, [selectedStoreys, selectedEntityId, hiddenEntities, getNodeElements, models]);
+  }, [selectedStoreys, selectedEntityId, hiddenEntities, getNodeElements, models, toGlobalId]);
   if (!ifcDataStore && models.size === 0) {
     return (

package/src/components/viewer/MainToolbar.tsx CHANGED Viewed

@@ -36,7 +36,9 @@ import {
   ClipboardCheck,
   Palette,
   Orbit,
+  Layout,
   LayoutTemplate,
+  FileCode2,
 } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { Separator } from '@/components/ui/separator';
@@ -70,6 +72,7 @@ import { ThemeSwitch } from './ThemeSwitch';
 import { toast } from '@/components/ui/toast';
 type Tool = 'select' | 'pan' | 'orbit' | 'walk' | 'measure' | 'section';
+type WorkspacePanel = 'script' | 'list' | 'bcf' | 'ids' | 'lens';
 // #region FIX: Move ToolButton OUTSIDE MainToolbar to prevent recreation on every render
 // This fixes Radix UI Tooltip's asChild prop becoming stale during re-renders
@@ -176,13 +179,11 @@ export function MainToolbar({ onShowShortcuts }: MainToolbarProps = {} as MainTo
   const toggleTypeVisibility = useViewerStore((state) => state.toggleTypeVisibility);
   const resetViewerState = useViewerStore((state) => state.resetViewerState);
   const bcfPanelVisible = useViewerStore((state) => state.bcfPanelVisible);
-  const toggleBcfPanel = useViewerStore((state) => state.toggleBcfPanel);
   const setBcfPanelVisible = useViewerStore((state) => state.setBcfPanelVisible);
   const idsPanelVisible = useViewerStore((state) => state.idsPanelVisible);
-  const toggleIdsPanel = useViewerStore((state) => state.toggleIdsPanel);
   const setIdsPanelVisible = useViewerStore((state) => state.setIdsPanelVisible);
   const listPanelVisible = useViewerStore((state) => state.listPanelVisible);
-  const toggleListPanel = useViewerStore((state) => state.toggleListPanel);
+  const setListPanelVisible = useViewerStore((state) => state.setListPanelVisible);
   const setRightPanelCollapsed = useViewerStore((state) => state.setRightPanelCollapsed);
   const projectionMode = useViewerStore((state) => state.projectionMode);
   const toggleProjectionMode = useViewerStore((state) => state.toggleProjectionMode);
@@ -193,8 +194,9 @@ export function MainToolbar({ onShowShortcuts }: MainToolbarProps = {} as MainTo
   const toggleBasketPresentationVisible = useViewerStore((state) => state.toggleBasketPresentationVisible);
   // Lens state
   const lensPanelVisible = useViewerStore((state) => state.lensPanelVisible);
-  const toggleLensPanel = useViewerStore((state) => state.toggleLensPanel);
   const setLensPanelVisible = useViewerStore((state) => state.setLensPanelVisible);
+  const scriptPanelVisible = useViewerStore((state) => state.scriptPanelVisible);
+  const setScriptPanelVisible = useViewerStore((state) => state.setScriptPanelVisible);
   // Check which type geometries exist across ALL loaded models (federation-aware).
   // PERF: Use meshes.length as dep proxy instead of full geometryResult, and
@@ -361,6 +363,61 @@ export function MainToolbar({ onShowShortcuts }: MainToolbarProps = {} as MainTo
     goHomeFromStore();
   }, []);
+  const handleToggleBottomPanel = useCallback((panel: 'script' | 'list') => {
+    const isScriptPanel = panel === 'script';
+    const nextScriptVisible = isScriptPanel ? !scriptPanelVisible : false;
+    const nextListVisible = isScriptPanel ? false : !listPanelVisible;
+    setScriptPanelVisible(nextScriptVisible);
+    setListPanelVisible(nextListVisible);
+    if (nextScriptVisible || nextListVisible) {
+      setRightPanelCollapsed(false);
+    }
+  }, [listPanelVisible, scriptPanelVisible, setListPanelVisible, setRightPanelCollapsed, setScriptPanelVisible]);
+  const handleToggleRightPanel = useCallback((panel: 'bcf' | 'ids' | 'lens') => {
+    const nextBcfVisible = panel === 'bcf' ? !bcfPanelVisible : false;
+    const nextIdsVisible = panel === 'ids' ? !idsPanelVisible : false;
+    const nextLensVisible = panel === 'lens' ? !lensPanelVisible : false;
+    setBcfPanelVisible(nextBcfVisible);
+    setIdsPanelVisible(nextIdsVisible);
+    setLensPanelVisible(nextLensVisible);
+    if (nextBcfVisible || nextIdsVisible || nextLensVisible) {
+      setRightPanelCollapsed(false);
+    }
+  }, [
+    bcfPanelVisible,
+    idsPanelVisible,
+    lensPanelVisible,
+    setBcfPanelVisible,
+    setIdsPanelVisible,
+    setLensPanelVisible,
+    setRightPanelCollapsed,
+  ]);
+  const activeWorkspacePanels = useMemo(() => {
+    const panels = new Set<WorkspacePanel>();
+    if (scriptPanelVisible) panels.add('script');
+    if (listPanelVisible) panels.add('list');
+    if (bcfPanelVisible) panels.add('bcf');
+    if (idsPanelVisible) panels.add('ids');
+    if (lensPanelVisible) panels.add('lens');
+    return panels;
+  }, [bcfPanelVisible, idsPanelVisible, lensPanelVisible, listPanelVisible, scriptPanelVisible]);
+  const workspacePanelLabel = useMemo(() => {
+    if (activeWorkspacePanels.size === 0) return null;
+    if (activeWorkspacePanels.size > 1) return 'Multiple Panels';
+    if (activeWorkspacePanels.has('script')) return 'Script Editor';
+    if (activeWorkspacePanels.has('list')) return 'Lists';
+    if (activeWorkspacePanels.has('bcf')) return 'BCF Issues';
+    if (activeWorkspacePanels.has('ids')) return 'IDS Validation';
+    return 'Lens Rules';
+  }, [activeWorkspacePanels]);
   const handleExportGLB = useCallback(() => {
     if (!geometryResult) return;
     try {
@@ -624,76 +681,61 @@ export function MainToolbar({ onShowShortcuts }: MainToolbarProps = {} as MainTo
       <ExportChangesButton />
       {/* ── Panels ── */}
-      {/* BCF Issues Button */}
-      <Tooltip>
-        <TooltipTrigger asChild>
-          <Button
-            variant={bcfPanelVisible ? 'default' : 'ghost'}
-            size="icon-sm"
-            onClick={(e) => {
-              (e.currentTarget as HTMLButtonElement).blur();
-              if (!bcfPanelVisible) {
-                // Close other right-panel content first, then expand
-                setIdsPanelVisible(false);
-                setLensPanelVisible(false);
-                setRightPanelCollapsed(false);
-              }
-              toggleBcfPanel();
-            }}
-            className={cn(bcfPanelVisible && 'bg-primary text-primary-foreground')}
+      <DropdownMenu>
+        <Tooltip>
+          <TooltipTrigger asChild>
+            <DropdownMenuTrigger asChild>
+              <Button
+                variant={activeWorkspacePanels.size > 0 ? 'default' : 'ghost'}
+                size="icon-sm"
+                aria-label={workspacePanelLabel ? `Panels: ${workspacePanelLabel}` : 'Panels'}
+                className={cn(activeWorkspacePanels.size > 0 && 'bg-primary text-primary-foreground')}
+              >
+                <Layout className="h-4 w-4" />
+              </Button>
+            </DropdownMenuTrigger>
+          </TooltipTrigger>
+          <TooltipContent>{workspacePanelLabel ? `Panels: ${workspacePanelLabel}` : 'Panels'}</TooltipContent>
+        </Tooltip>
+        <DropdownMenuContent align="start" className="w-56">
+          <DropdownMenuCheckboxItem
+            checked={activeWorkspacePanels.has('script')}
+            onCheckedChange={() => handleToggleBottomPanel('script')}
           >
-            <MessageSquare className="h-4 w-4" />
-          </Button>
-        </TooltipTrigger>
-        <TooltipContent>BCF Issues</TooltipContent>
-      </Tooltip>
-      {/* IDS Validation Button */}
-      <Tooltip>
-        <TooltipTrigger asChild>
-          <Button
-            variant={idsPanelVisible ? 'default' : 'ghost'}
-            size="icon-sm"
-            onClick={(e) => {
-              (e.currentTarget as HTMLButtonElement).blur();
-              if (!idsPanelVisible) {
-                // Close other right-panel content first, then expand
-                setBcfPanelVisible(false);
-                setLensPanelVisible(false);
-                setRightPanelCollapsed(false);
-              }
-              toggleIdsPanel();
-            }}
-            className={cn(idsPanelVisible && 'bg-primary text-primary-foreground')}
+            <FileCode2 className="h-4 w-4 mr-2" />
+            Script Editor
+          </DropdownMenuCheckboxItem>
+          <DropdownMenuCheckboxItem
+            checked={activeWorkspacePanels.has('list')}
+            onCheckedChange={() => handleToggleBottomPanel('list')}
           >
-            <ClipboardCheck className="h-4 w-4" />
-          </Button>
-        </TooltipTrigger>
-        <TooltipContent>IDS Validation</TooltipContent>
-      </Tooltip>
-      {/* Lists Button */}
-      <Tooltip>
-        <TooltipTrigger asChild>
-          <Button
-            variant={listPanelVisible ? 'default' : 'ghost'}
-            size="icon-sm"
-            onClick={(e) => {
-              (e.currentTarget as HTMLButtonElement).blur();
-              // Close other bottom panels (bottom-panel exclusivity)
-              useViewerStore.getState().setScriptPanelVisible(false);
-              if (!listPanelVisible) {
-                setRightPanelCollapsed(false);
-              }
-              toggleListPanel();
-            }}
-            className={cn(listPanelVisible && 'bg-primary text-primary-foreground')}
+            <FileSpreadsheet className="h-4 w-4 mr-2" />
+            Lists
+          </DropdownMenuCheckboxItem>
+          <DropdownMenuSeparator />
+          <DropdownMenuCheckboxItem
+            checked={activeWorkspacePanels.has('bcf')}
+            onCheckedChange={() => handleToggleRightPanel('bcf')}
           >
-            <FileSpreadsheet className="h-4 w-4" />
-          </Button>
-        </TooltipTrigger>
-        <TooltipContent>Lists</TooltipContent>
-      </Tooltip>
+            <MessageSquare className="h-4 w-4 mr-2" />
+            BCF Issues
+          </DropdownMenuCheckboxItem>
+          <DropdownMenuCheckboxItem
+            checked={activeWorkspacePanels.has('ids')}
+            onCheckedChange={() => handleToggleRightPanel('ids')}
+          >
+            <ClipboardCheck className="h-4 w-4 mr-2" />
+            IDS Validation
+          </DropdownMenuCheckboxItem>
+          <DropdownMenuCheckboxItem
+            checked={activeWorkspacePanels.has('lens')}
+            onCheckedChange={() => handleToggleRightPanel('lens')}
+          >
+            <Palette className="h-4 w-4 mr-2" />
+            Lens Rules
+          </DropdownMenuCheckboxItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
       <Separator orientation="vertical" className="h-6 mx-1" />
@@ -821,30 +863,6 @@ export function MainToolbar({ onShowShortcuts }: MainToolbarProps = {} as MainTo
         </DropdownMenuContent>
       </DropdownMenu>
-      {/* Lens (rule-based filtering) */}
-      <Tooltip>
-        <TooltipTrigger asChild>
-          <Button
-            variant={lensPanelVisible ? 'default' : 'ghost'}
-            size="icon-sm"
-            onClick={(e) => {
-              (e.currentTarget as HTMLButtonElement).blur();
-              if (!lensPanelVisible) {
-                // Close other right-panel content first, then expand
-                setBcfPanelVisible(false);
-                setIdsPanelVisible(false);
-                setRightPanelCollapsed(false);
-              }
-              toggleLensPanel();
-            }}
-            className={cn(lensPanelVisible && 'bg-primary text-primary-foreground')}
-          >
-            <Palette className="h-4 w-4" />
-          </Button>
-        </TooltipTrigger>
-        <TooltipContent>Lens (Color Rules)</TooltipContent>
-      </Tooltip>
       <Separator orientation="vertical" className="h-6 mx-1" />
       {/* ── Camera & View ── */}

package/src/components/viewer/hierarchy/HierarchyNode.tsx CHANGED Viewed

@@ -68,7 +68,8 @@ export function HierarchyNode({
   onRemoveModel,
   onModelHeaderClick,
 }: HierarchyNodeProps) {
-  const Icon = TYPE_ICONS[node.type] || TYPE_ICONS.default;
+  const resolvedType = node.ifcType || node.type;
+  const Icon = TYPE_ICONS[resolvedType] || TYPE_ICONS[node.type] || TYPE_ICONS.default;
   // Model header nodes (for visibility control and expansion)
   if (node.type === 'model-header' && node.id.startsWith('model-')) {
@@ -261,19 +262,25 @@ export function HierarchyNode({
             <Icon className="h-3.5 w-3.5 shrink-0 text-zinc-500 dark:text-zinc-400" />
           </TooltipTrigger>
           <TooltipContent>
-            <p className="text-xs">{node.type}</p>
+            <p className="text-xs">{resolvedType}</p>
           </TooltipContent>
         </Tooltip>
         {/* Name */}
         <span className={cn(
           'flex-1 text-sm truncate ml-1.5',
-          isSpatialContainer(node.type) || node.type === 'IfcBuildingStorey' || node.type === 'unified-storey' || node.type === 'type-group'
+          isSpatialContainer(node.type) || node.type === 'IfcBuildingStorey' || node.type === 'IfcSpace' || node.type === 'unified-storey' || node.type === 'type-group'
             ? 'font-medium text-zinc-900 dark:text-zinc-100'
             : 'text-zinc-700 dark:text-zinc-300',
           nodeHidden && 'line-through decoration-zinc-400 dark:decoration-zinc-600'
         )}>{node.name}</span>
+        {node.ifcType && node.type === 'element' && (
+          <span className="text-[10px] font-mono text-zinc-400 dark:text-zinc-500 truncate max-w-[90px]">
+            {node.ifcType}
+          </span>
+        )}
         {/* Storey Elevation */}
         {node.storeyElevation !== undefined && (
           <Tooltip>

package/src/components/viewer/hierarchy/treeDataBuilder.test.ts ADDED Viewed

@@ -0,0 +1,126 @@
+/* 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/. */
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+import { IfcTypeEnum, type SpatialHierarchy, type SpatialNode } from '@ifc-lite/data';
+import type { IfcDataStore } from '@ifc-lite/parser';
+import { useViewerStore, type FederatedModel } from '@/store';
+import { buildTreeData } from './treeDataBuilder';
+function createSpatialNode(
+  expressId: number,
+  type: IfcTypeEnum,
+  name: string,
+  children: SpatialNode[] = [],
+): SpatialNode {
+  return {
+    expressId,
+    type,
+    name,
+    children,
+    elements: [],
+  };
+}
+function createDataStore(): IfcDataStore {
+  const spaceNode = createSpatialNode(5, IfcTypeEnum.IfcSpace, 'e3035b71');
+  const storeyNode = createSpatialNode(4, IfcTypeEnum.IfcBuildingStorey, 'MY_STOREY', [spaceNode]);
+  const buildingNode = createSpatialNode(3, IfcTypeEnum.IfcBuilding, 'MY_BUILDING', [storeyNode]);
+  const siteNode = createSpatialNode(2, IfcTypeEnum.IfcSite, 'MY_SITE', [buildingNode]);
+  const projectNode = createSpatialNode(1, IfcTypeEnum.IfcProject, 'MY_PROJECT', [siteNode]);
+  const spatialHierarchy: SpatialHierarchy = {
+    project: projectNode,
+    byStorey: new Map([[4, [6, 7]]]),
+    byBuilding: new Map(),
+    bySite: new Map(),
+    bySpace: new Map([[5, [7]]]),
+    storeyElevations: new Map(),
+    storeyHeights: new Map(),
+    elementToStorey: new Map([[6, 4], [7, 4]]),
+    getStoreyElements: () => [],
+    getStoreyByElevation: () => null,
+    getContainingSpace: (elementId: number) => (elementId === 7 ? 5 : null),
+    getPath: () => [],
+  };
+  return {
+    spatialHierarchy,
+    entities: {
+      count: 0,
+      getName: (id: number) => {
+        if (id === 6) return 'Wall';
+        if (id === 7) return '';
+        return '';
+      },
+      getTypeName: (id: number) => {
+        if (id === 6) return 'IfcWall';
+        if (id === 7) return 'IfcWindow';
+        if (id === 5) return 'IfcSpace';
+        return 'Unknown';
+      },
+    },
+  } as unknown as IfcDataStore;
+}
+function createModel(idOffset: number): FederatedModel {
+  return {
+    id: 'model-1',
+    name: 'Model 1',
+    ifcDataStore: createDataStore(),
+    geometryResult: { meshes: [], totalVertices: 0, totalTriangles: 0, coordinateInfo: null as never },
+    visible: true,
+    collapsed: false,
+    schemaVersion: 'IFC4',
+    loadedAt: 1,
+    fileSize: 1,
+    idOffset,
+    maxExpressId: 7,
+  };
+}
+describe('buildTreeData', () => {
+  it('keeps IfcSpace as a spatial node, expands bySpace children, and avoids storey duplicates', () => {
+    useViewerStore.setState({ models: new Map() });
+    useViewerStore.getState().registerModelOffset('tree-test-padding', 99);
+    const idOffset = useViewerStore.getState().registerModelOffset('model-1', 7);
+    const model = createModel(idOffset);
+    useViewerStore.setState({ models: new Map([['model-1', model]]) });
+    const models = new Map<string, FederatedModel>([['model-1', model]]);
+    const expandedNodes = new Set([
+      'root-1',
+      'root-1-2',
+      'root-1-2-3',
+      'root-1-2-3-4',
+      'root-1-2-3-4-5',
+    ]);
+    const nodes = buildTreeData(models, null, expandedNodes, false, []);
+    const storeyNode = nodes.find((node) => node.id === 'root-1-2-3-4');
+    assert.ok(storeyNode);
+    assert.strictEqual(storeyNode.elementCount, 1);
+    const spaceNode = nodes.find((node) => node.id === 'root-1-2-3-4-5');
+    assert.ok(spaceNode);
+    assert.strictEqual(spaceNode.type, 'IfcSpace');
+    assert.deepStrictEqual(spaceNode.expressIds, [5]);
+    assert.deepStrictEqual(spaceNode.globalIds, [105]);
+    assert.strictEqual(spaceNode.elementCount, 1);
+    assert.strictEqual(spaceNode.hasChildren, true);
+    const windowNode = nodes.find((node) => node.id === 'element-model-1-7');
+    assert.ok(windowNode);
+    assert.strictEqual(windowNode.type, 'element');
+    assert.strictEqual(windowNode.ifcType, 'IfcWindow');
+    assert.deepStrictEqual(windowNode.expressIds, [7]);
+    assert.deepStrictEqual(windowNode.globalIds, [107]);
+    assert.strictEqual(windowNode.name, 'IfcWindow #7');
+    assert.strictEqual(nodes.filter((node) => node.id === 'element-model-1-6').length, 1);
+    assert.strictEqual(nodes.filter((node) => node.id === 'element-model-1-7').length, 1);
+  });
+});