@ifc-lite/viewer 1.17.4 → 1.18.0

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

@@ -0,0 +1,237 @@
+/* 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/. */
+
+/**
+ * Cap-surface appearance controls shown inside the expanded Section panel.
+ *
+ * Layout principle (tight compact panel, ≤ 260 px wide):
+ *   [Display]          Surfaces ⬛   Lines ⬛
+ *   ───────────────────────────────────────────────
+ *   [Hatch]            <pattern select>
+ *   [Colours]          Fill ▣   Hatch ▣
+ *   [Shape]            Spacing __px  Angle __°  Width __px
+ *
+ * Surfaces and Lines toggle independently so users can get a clean
+ * "architectural drawing" look (outlines only), a pure hatched fill, or
+ * the combination. All style inputs are hidden when Surfaces is off.
+ */
+
+import { useCallback, useId } from 'react';
+import { useViewerStore } from '@/store';
+import type { SectionCapHatchId } from '@/store/types';
+
+const PATTERN_LABELS: Record<SectionCapHatchId, string> = {
+  solid:      'Solid fill',
+  diagonal:   'Diagonal',
+  crossHatch: 'Cross-hatch',
+  horizontal: 'Horizontal',
+  vertical:   'Vertical',
+  concrete:   'Concrete',
+  brick:      'Brick',
+  insulation: 'Insulation',
+};
+
+const PATTERN_IDS: SectionCapHatchId[] = [
+  'diagonal', 'crossHatch', 'horizontal', 'vertical',
+  'concrete', 'brick', 'insulation', 'solid',
+];
+
+function rgbaToHex(c: [number, number, number, number]): string {
+  const to2 = (v: number) => Math.round(Math.max(0, Math.min(1, v)) * 255).toString(16).padStart(2, '0');
+  return `#${to2(c[0])}${to2(c[1])}${to2(c[2])}`;
+}
+
+function hexToRgba(hex: string, alpha: number): [number, number, number, number] {
+  const m = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+  if (!m) return [1, 1, 1, alpha];
+  return [
+    parseInt(m[1], 16) / 255,
+    parseInt(m[2], 16) / 255,
+    parseInt(m[3], 16) / 255,
+    alpha,
+  ];
+}
+
+interface DisplayToggleProps {
+  active: boolean;
+  label: string;
+  onToggle: () => void;
+}
+
+function DisplayToggle({ active, label, onToggle }: DisplayToggleProps): React.JSX.Element {
+  return (
+    <button
+      type="button"
+      onClick={onToggle}
+      aria-pressed={active}
+      className={`flex items-center justify-center gap-1.5 px-2 py-1 text-[10px] font-mono uppercase tracking-wide border rounded transition-colors ${
+        active
+          ? 'bg-primary text-primary-foreground border-primary'
+          : 'bg-muted text-muted-foreground border-muted hover:border-foreground/20'
+      }`}
+      title={`${active ? 'Hide' : 'Show'} ${label.toLowerCase()}`}
+    >
+      <span
+        aria-hidden
+        className={`inline-block h-1.5 w-1.5 rounded-full ${active ? 'bg-primary-foreground' : 'bg-muted-foreground'}`}
+      />
+      {label}
+    </button>
+  );
+}
+
+export function SectionCapControls(): React.JSX.Element {
+  const sectionPlane       = useViewerStore((s) => s.sectionPlane);
+  const setShowCap         = useViewerStore((s) => s.setSectionShowCap);
+  const setShowOutlines    = useViewerStore((s) => s.setSectionShowOutlines);
+  const setCapStyle        = useViewerStore((s) => s.setSectionCapStyle);
+
+  const onPattern = useCallback((e: React.ChangeEvent<HTMLSelectElement>) => {
+    setCapStyle({ pattern: e.target.value as SectionCapHatchId });
+  }, [setCapStyle]);
+
+  const onFillColor = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
+    setCapStyle({ fillColor: hexToRgba(e.target.value, sectionPlane.capStyle.fillColor[3]) });
+  }, [setCapStyle, sectionPlane.capStyle.fillColor]);
+
+  const onStrokeColor = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
+    setCapStyle({ strokeColor: hexToRgba(e.target.value, sectionPlane.capStyle.strokeColor[3]) });
+  }, [setCapStyle, sectionPlane.capStyle.strokeColor]);
+
+  const onSpacing = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
+    const v = Number(e.target.value);
+    if (Number.isFinite(v)) setCapStyle({ spacingPx: Math.max(2, v) });
+  }, [setCapStyle]);
+
+  const onAngle = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
+    const deg = Number(e.target.value);
+    if (Number.isFinite(deg)) setCapStyle({ angleRad: (deg * Math.PI) / 180 });
+  }, [setCapStyle]);
+
+  const onWidth = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
+    const v = Number(e.target.value);
+    if (Number.isFinite(v)) setCapStyle({ widthPx: Math.max(1, v) });
+  }, [setCapStyle]);
+
+  const onToggleCap      = useCallback(() => setShowCap(!sectionPlane.showCap), [setShowCap, sectionPlane.showCap]);
+  const onToggleOutlines = useCallback(() => setShowOutlines(!sectionPlane.showOutlines), [setShowOutlines, sectionPlane.showOutlines]);
+
+  const angleDeg = Math.round((sectionPlane.capStyle.angleRad * 180) / Math.PI);
+
+  // Stable ids for label/control association. Multiple instances of the
+  // panel (rare, but possible during HMR) each get their own id namespace.
+  const baseId = useId();
+  const patternId = `${baseId}-pattern`;
+  const fillId    = `${baseId}-fill`;
+  const strokeId  = `${baseId}-stroke`;
+  const spacingId = `${baseId}-spacing`;
+  const angleId   = `${baseId}-angle`;
+  const widthId   = `${baseId}-width`;
+
+  const hatchInputsDisabled = !sectionPlane.showCap;
+
+  return (
+    <div className="mt-3 border-t pt-3 space-y-3">
+      {/* Display toggles — surfaces and lines independently. */}
+      <div>
+        <div className="text-[10px] uppercase tracking-wider text-muted-foreground mb-1.5">Display</div>
+        <div className="grid grid-cols-2 gap-2">
+          <DisplayToggle active={sectionPlane.showCap}      label="Surfaces" onToggle={onToggleCap} />
+          <DisplayToggle active={sectionPlane.showOutlines} label="Lines"    onToggle={onToggleOutlines} />
+        </div>
+      </div>
+
+      {/* Hatch style — disabled visually when surfaces are off. */}
+      <fieldset
+        disabled={hatchInputsDisabled}
+        className={`space-y-2 ${hatchInputsDisabled ? 'opacity-50 pointer-events-none' : ''}`}
+      >
+        <div>
+          <label htmlFor={patternId} className="text-[10px] uppercase tracking-wider text-muted-foreground block mb-1">
+            Hatch pattern
+          </label>
+          <select
+            id={patternId}
+            value={sectionPlane.capStyle.pattern}
+            onChange={onPattern}
+            className="w-full text-xs bg-muted px-2 py-1.5 rounded border-none"
+          >
+            {PATTERN_IDS.map((id) => (
+              <option key={id} value={id}>{PATTERN_LABELS[id]}</option>
+            ))}
+          </select>
+        </div>
+
+        <div className="grid grid-cols-2 gap-2">
+          <label htmlFor={fillId} className="flex items-center gap-2 text-[10px] uppercase tracking-wider text-muted-foreground">
+            <input
+              id={fillId}
+              type="color"
+              value={rgbaToHex(sectionPlane.capStyle.fillColor)}
+              onChange={onFillColor}
+              className="h-5 w-5 rounded cursor-pointer border border-muted"
+              aria-label="Fill colour"
+            />
+            Fill
+          </label>
+          <label htmlFor={strokeId} className="flex items-center gap-2 text-[10px] uppercase tracking-wider text-muted-foreground">
+            <input
+              id={strokeId}
+              type="color"
+              value={rgbaToHex(sectionPlane.capStyle.strokeColor)}
+              onChange={onStrokeColor}
+              className="h-5 w-5 rounded cursor-pointer border border-muted"
+              aria-label="Hatch colour"
+            />
+            Hatch
+          </label>
+        </div>
+
+        <div className="grid grid-cols-3 gap-2">
+          <div>
+            <label htmlFor={spacingId} className="text-[10px] text-muted-foreground block mb-1">Spacing (px)</label>
+            <input
+              id={spacingId}
+              type="number"
+              min="2"
+              max="64"
+              step="1"
+              value={sectionPlane.capStyle.spacingPx}
+              onChange={onSpacing}
+              className="w-full text-xs bg-muted px-1.5 py-0.5 rounded border-none text-right"
+            />
+          </div>
+          <div>
+            <label htmlFor={angleId} className="text-[10px] text-muted-foreground block mb-1">Angle (°)</label>
+            <input
+              id={angleId}
+              type="number"
+              min="-180"
+              max="180"
+              step="5"
+              value={angleDeg}
+              onChange={onAngle}
+              className="w-full text-xs bg-muted px-1.5 py-0.5 rounded border-none text-right"
+            />
+          </div>
+          <div>
+            <label htmlFor={widthId} className="text-[10px] text-muted-foreground block mb-1">Width (px)</label>
+            <input
+              id={widthId}
+              type="number"
+              min="1"
+              max="16"
+              step="0.5"
+              value={sectionPlane.capStyle.widthPx}
+              onChange={onWidth}
+              className="w-full text-xs bg-muted px-1.5 py-0.5 rounded border-none text-right"
+            />
+          </div>
+        </div>
+      </fieldset>
+    </div>
+  );
+}
+
+export default SectionCapControls;

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

@@ -7,17 +7,19 @@
  */
 
 import React, { useCallback, useState } from 'react';
-import { X, Slice, ChevronDown, FileImage } from 'lucide-react';
+import { X, Slice, ChevronDown, FileImage, FlipHorizontal2 } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { useViewerStore } from '@/store';
 import { AXIS_INFO } from './sectionConstants';
 import { SectionPlaneVisualization } from './SectionVisualization';
+import { SectionCapControls } from './SectionCapControls';
 
 export function SectionOverlay() {
   const sectionPlane = useViewerStore((s) => s.sectionPlane);
   const setSectionPlaneAxis = useViewerStore((s) => s.setSectionPlaneAxis);
   const setSectionPlanePosition = useViewerStore((s) => s.setSectionPlanePosition);
   const toggleSectionPlane = useViewerStore((s) => s.toggleSectionPlane);
+  const flipSectionPlane = useViewerStore((s) => s.flipSectionPlane);
   const setActiveTool = useViewerStore((s) => s.setActiveTool);
   const setDrawingPanelVisible = useViewerStore((s) => s.setDrawing2DPanelVisible);
   const drawingPanelVisible = useViewerStore((s) => s.drawing2DPanelVisible);
@@ -83,10 +85,10 @@ export function SectionOverlay() {
 
         {/* Expandable content */}
         {!isPanelCollapsed && (
-          <div className="border-t px-3 pb-3 min-w-64">
+          <div className="border-t px-3 pb-3 min-w-72">
             {/* Direction Selection */}
             <div className="mt-3">
-              <label className="text-xs text-muted-foreground mb-2 block">Direction</label>
+              <div className="text-[10px] uppercase tracking-wider text-muted-foreground mb-1.5">Direction</div>
               <div className="flex gap-1">
                 {(['down', 'front', 'side'] as const).map((axis) => (
                   <Button
@@ -105,16 +107,29 @@ export function SectionOverlay() {
             {/* Position Slider */}
             <div className="mt-3">
               <div className="flex items-center justify-between mb-1">
-                <label className="text-xs text-muted-foreground">Position</label>
-                <input
-                  type="number"
-                  min="0"
-                  max="100"
-                  step="0.1"
-                  value={sectionPlane.position}
-                  onChange={handlePositionChange}
-                  className="w-16 text-xs font-mono bg-muted px-1.5 py-0.5 rounded border-none text-right [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none"
-                />
+                <div className="text-[10px] uppercase tracking-wider text-muted-foreground">Position</div>
+                <div className="flex items-center gap-1">
+                  <Button
+                    variant={sectionPlane.flipped ? 'default' : 'ghost'}
+                    size="icon-sm"
+                    onClick={flipSectionPlane}
+                    aria-pressed={sectionPlane.flipped}
+                    aria-label={sectionPlane.flipped ? 'Unflip cut direction' : 'Flip cut direction'}
+                    title={sectionPlane.flipped ? 'Cut direction is flipped' : 'Flip cut direction'}
+                  >
+                    <FlipHorizontal2 className="h-3 w-3" />
+                  </Button>
+                  <input
+                    type="number"
+                    min="0"
+                    max="100"
+                    step="0.1"
+                    value={sectionPlane.position}
+                    onChange={handlePositionChange}
+                    aria-label="Section plane position percentage"
+                    className="w-16 text-xs font-mono bg-muted px-1.5 py-0.5 rounded border-none text-right [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none"
+                  />
+                </div>
               </div>
               <input
                 type="range"
@@ -123,10 +138,14 @@ export function SectionOverlay() {
                 step="0.1"
                 value={sectionPlane.position}
                 onChange={handlePositionChange}
+                aria-label="Section plane position slider"
                 className="w-full h-2 bg-muted rounded-lg appearance-none cursor-pointer accent-primary"
               />
             </div>
 
+            {/* Cap surface controls (hatch, colour, spacing) */}
+            <SectionCapControls />
+
             {/* Show 2D panel button - only when panel is closed */}
             {!drawingPanelVisible && (
               <div className="mt-3 pt-3 border-t">
@@ -156,12 +175,14 @@ export function SectionOverlay() {
       >
         <span className="font-mono text-xs uppercase tracking-wide">
           {sectionPlane.enabled
-            ? `Cutting ${AXIS_INFO[sectionPlane.axis].label.toLowerCase()} at ${sectionPlane.position.toFixed(1)}%`
-            : 'Preview mode'}
+            ? `Cut ${AXIS_INFO[sectionPlane.axis].label.toLowerCase()} at ${sectionPlane.position.toFixed(1)}%${sectionPlane.flipped ? ' (flipped)' : ''}`
+            : 'Clip off — drag slider to cut'}
         </span>
       </div>
 
-      {/* Enable toggle - brutalist style matching Measure tool */}
+      {/* Enable toggle — when OFF the model is not clipped even though the
+          plane visual is shown. Label is explicit so users don't mistake
+          "Preview" for "nothing will happen". */}
       <div className="pointer-events-auto absolute bottom-4 left-1/2 -translate-x-1/2 z-30">
         <button
           onClick={toggleSectionPlane}
@@ -170,9 +191,9 @@ export function SectionOverlay() {
               ? 'bg-primary text-primary-foreground border-primary'
               : 'bg-zinc-100 dark:bg-zinc-900 text-zinc-500 border-zinc-300 dark:border-zinc-700'
           }`}
-          title="Toggle section plane"
+          title={sectionPlane.enabled ? 'Click to disable the cut' : 'Click to enable the cut'}
         >
-          {sectionPlane.enabled ? 'Cutting' : 'Preview'}
+          {sectionPlane.enabled ? 'Clipping' : 'Clip off'}
         </button>
       </div>
 

package/src/components/viewer/useAnimationLoop.ts

@@ -170,7 +170,15 @@ export function useAnimationLoop(params: UseAnimationLoopParams): void {
           isInteracting: isInteractingRef.current || isAnimating,
           buildingRotation: coordinateInfoRef.current?.buildingRotation,
           sectionPlane: activeToolRef.current === 'section' ? {
-            ...sectionPlaneRef.current,
+            axis: sectionPlaneRef.current.axis,
+            position: sectionPlaneRef.current.position,
+            enabled: sectionPlaneRef.current.enabled,
+            flipped: sectionPlaneRef.current.flipped,
+            // Cap rendering settings — the renderer reads these to draw the
+            // filled, hatched cut surfaces.
+            showCap: sectionPlaneRef.current.showCap,
+            showOutlines: sectionPlaneRef.current.showOutlines,
+            capStyle: sectionPlaneRef.current.capStyle,
             min: sectionRangeRef.current?.min,
             max: sectionRangeRef.current?.max,
           } : undefined,

package/src/components/viewer/useDuplicateShortcut.ts

@@ -0,0 +1,77 @@
+/* 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/. */
+
+/**
+ * Global ⌘D / Ctrl+D shortcut for duplicating the selected entity.
+ *
+ * Lives outside `useKeyboardControls` so the camera-movement loop
+ * stays focused on its job; the duplicate flow doesn't need
+ * keyState tracking or per-frame work, just a one-shot trigger.
+ *
+ * Mirrors the right-click menu's gating: only fires when there's a
+ * selection and the active model has a live mutation view.
+ */
+
+import { useEffect } from 'react';
+import { useViewerStore, resolveEntityRef } from '@/store';
+import { toast } from '@/components/ui/toast';
+
+export function useDuplicateShortcut() {
+  const duplicateEntity = useViewerStore((s) => s.duplicateEntity);
+  const getMutationView = useViewerStore((s) => s.getMutationView);
+  const setSelectedEntityId = useViewerStore((s) => s.setSelectedEntityId);
+
+  useEffect(() => {
+    const handler = (e: KeyboardEvent) => {
+      if (!(e.metaKey || e.ctrlKey)) return;
+      if (e.key !== 'd' && e.key !== 'D') return;
+
+      // Ignore when the user is typing somewhere — Ctrl+D in an
+      // input usually means "delete word forward" or browser-bookmark.
+      const target = e.target as HTMLElement | null;
+      if (
+        target?.tagName === 'INPUT' ||
+        target?.tagName === 'TEXTAREA' ||
+        target?.isContentEditable
+      ) {
+        return;
+      }
+
+      const state = useViewerStore.getState();
+      const selectedId = state.selectedEntityId;
+      if (selectedId === null) return;
+
+      const ref = resolveEntityRef(selectedId);
+      if (!ref) return;
+
+      // Suppress the browser's bookmark default for any duplicate
+      // shortcut we recognise — even when the model has no editable
+      // mutation view, otherwise Ctrl/⌘+D opens the bookmark dialog
+      // while we're "silently no-op'ing" below.
+      e.preventDefault();
+      e.stopPropagation();
+
+      // Match the menu's canEdit gating — silently no-op on
+      // native-metadata models.
+      const view = getMutationView(ref.modelId);
+      if (!view) return;
+
+      // ⌘D + Shift = +Z (up), ⌘D + Alt = +Y (north), default = +X (east).
+      // Power users can chain modifiers without leaving the keyboard;
+      // the menu's chip row covers everyone else.
+      const direction = e.shiftKey ? '+Z' : e.altKey ? '+Y' : '+X';
+
+      const result = duplicateEntity(ref.modelId, ref.expressId, direction);
+      if ('error' in result) {
+        toast.error(`Couldn't duplicate: ${result.error}`);
+      } else {
+        setSelectedEntityId(result.globalId);
+        toast.success(`Duplicated as #${result.expressId} (${direction}) — undo to remove`);
+      }
+    };
+
+    window.addEventListener('keydown', handler);
+    return () => window.removeEventListener('keydown', handler);
+  }, [duplicateEntity, getMutationView, setSelectedEntityId]);
+}

package/src/components/viewer/useMouseControls.ts

@@ -22,6 +22,7 @@ import type {
 import type { MeasurementConstraintEdge, OrthogonalAxis, Vec3 } from '@/store/types.js';
 import { getEntityCenter } from '../../utils/viewportUtils.js';
 import type { MouseHandlerContext } from './mouseHandlerTypes.js';
+import { useViewerStore } from '@/store';
 import {
   handleMeasureDown,
   handleMeasureDrag,
@@ -29,7 +30,7 @@ import {
   handleMeasureUp,
   updateMeasureScreenCoords,
 } from './measureHandlers.js';
-import { handleSelectionClick, handleContextMenu as handleContextMenuSelection } from './selectionHandlers.js';
+import { handleSelectionClick, handleContextMenu as handleContextMenuSelection, handleAddElementHover } from './selectionHandlers.js';
 
 export interface MouseState {
   isDragging: boolean;
@@ -368,6 +369,13 @@ export function useMouseControls(params: UseMouseControlsParams): void {
         if (handleMeasureHover(ctx, x, y)) return;
       }
 
+      // Add-element tool hover preview. Always runs (regardless of
+      // snap toggle) so the live edge/rectangle/polygon overlay can
+      // track the cursor; magnetic snap is layered on when enabled.
+      if (tool === 'addElement' && !mouseState.isDragging) {
+        if (handleAddElementHover(ctx, x, y)) return;
+      }
+
       // Handle orbit/pan for other tools (or measure tool with shift+drag or no active measurement)
       if (mouseState.isDragging && (tool !== 'measure' || !activeMeasurementRef.current)) {
         const dx = e.clientX - mouseState.lastX;

package/src/components/viewer/useRenderUpdates.ts

@@ -77,7 +77,7 @@ export function useRenderUpdates(params: UseRenderUpdatesParams): void {
 
   // Theme-aware clear color update
   useEffect(() => {
-    clearColorRef.current = getThemeClearColor(theme as 'light' | 'dark');
+    clearColorRef.current = getThemeClearColor(theme as 'light' | 'dark' | 'colorful');
     rendererRef.current?.requestRender();
   }, [theme, isInitialized]);
 

package/src/hooks/ids/idsDataAccessor.ts

@@ -19,7 +19,11 @@ import type {
   ParentInfo,
   PartOfRelation,
 } from '@ifc-lite/ids';
-import type { IfcDataStore } from '@ifc-lite/parser';
+import {
+  type IfcDataStore,
+  extractAllEntityAttributes,
+  extractTypeEntityOwnProperties,
+} from '@ifc-lite/parser';
 
 /**
  * Create an IFCDataAccessor from an IfcDataStore
@@ -59,7 +63,26 @@ export function createDataAccessor(
     },
 
     getObjectType(expressId: number): string | undefined {
-      return dataStore.entities?.getObjectType?.(expressId);
+      // Try the pre-computed ObjectType first (works for IfcObject subtypes)
+      const objectType = dataStore.entities?.getObjectType?.(expressId);
+      if (objectType) return objectType;
+
+      // For IfcTypeObject subtypes (IfcWallType, etc.), ObjectType doesn't exist —
+      // we need to extract PredefinedType from entity attributes instead.
+      // Also handles IfcObject subtypes that have PredefinedType at different positions.
+      const allAttrs = extractAllEntityAttributes(dataStore, expressId);
+      const predefinedType = allAttrs.find(a => a.name === 'PredefinedType');
+      if (predefinedType?.value && predefinedType.value !== 'NOTDEFINED') {
+        return predefinedType.value;
+      }
+
+      // If PredefinedType is USERDEFINED or absent, check ObjectType from attributes
+      const objTypeAttr = allAttrs.find(a => a.name === 'ObjectType');
+      if (objTypeAttr?.value) {
+        return objTypeAttr.value;
+      }
+
+      return undefined;
     },
 
     getEntitiesByType(typeName: string): number[] {
@@ -119,29 +142,42 @@ export function createDataAccessor(
 
     getPropertySets(expressId: number): PropertySetInfo[] {
       const propertiesStore = dataStore.properties;
-      if (!propertiesStore) return [];
 
-      // Use getForEntity (returns PropertySet[])
-      const psets = propertiesStore.getForEntity?.(expressId);
-      if (!psets) return [];
-
-      return psets.map((pset) => ({
-        name: pset.name,
-        properties: (pset.properties || []).map((prop) => {
-          // Convert value: ensure it's a primitive type (not array)
-          let value: string | number | boolean | null = null;
-          if (Array.isArray(prop.value)) {
-            value = JSON.stringify(prop.value);
-          } else {
-            value = prop.value as string | number | boolean | null;
-          }
-          return {
-            name: prop.name,
-            value,
-            dataType: String(prop.type || 'IFCLABEL'),
-          };
-        }),
-      }));
+      // Try relationship-based properties first (works for IfcObject instances)
+      const psets = propertiesStore?.getForEntity?.(expressId);
+
+      // Convert property sets to the IDS format
+      const mapPsets = (rawPsets: Array<{ name: string; properties: Array<{ name: string; value: unknown; type: unknown }> }>): PropertySetInfo[] =>
+        rawPsets.map((pset) => ({
+          name: pset.name,
+          properties: (pset.properties || []).map((prop) => {
+            let value: string | number | boolean | null = null;
+            if (Array.isArray(prop.value)) {
+              value = JSON.stringify(prop.value);
+            } else {
+              value = prop.value as string | number | boolean | null;
+            }
+            return {
+              name: prop.name,
+              value,
+              dataType: String(prop.type || 'IFCLABEL'),
+            };
+          }),
+        }));
+
+      if (psets && psets.length > 0) {
+        return mapPsets(psets);
+      }
+
+      // For IfcTypeObject subtypes (IfcWallType, IfcSlabType, etc.),
+      // properties come from the HasPropertySets attribute (index 5),
+      // not from IfcRelDefinesByProperties relationships.
+      const typePsets = extractTypeEntityOwnProperties(dataStore, expressId);
+      if (typePsets.length > 0) {
+        return mapPsets(typePsets);
+      }
+
+      return [];
     },
 
     getClassifications(expressId: number): ClassificationInfo[] {

package/src/hooks/ingest/viewerModelIngest.ts

@@ -3,7 +3,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
 
 import { IfcParser, parseIfcx, type IfcDataStore } from '@ifc-lite/parser';
-import { GeometryProcessor, GeometryQuality, type CoordinateInfo, type GeometryResult, type MeshData } from '@ifc-lite/geometry';
+import { GeometryProcessor, GeometryQuality, type CoordinateInfo, type DynamicBatchConfig, type GeometryResult, type MeshData } from '@ifc-lite/geometry';
 import { loadGLBToMeshData } from '@ifc-lite/cache';
 import type { SchemaVersion } from '../../store/types.js';
 import { calculateMeshBounds, calculateStoreyHeights, createCoordinateInfo, normalizeColor } from '../../utils/localParsingUtils.js';
@@ -44,13 +44,17 @@ export interface StepBufferIngestOptions {
   fileName: string;
   buffer: ArrayBuffer;
   fileSizeMB: number;
-  getDynamicBatchSize: (fileSizeMB: number) => number | { initial: number; subsequent: number };
+  getDynamicBatchSize: (fileSizeMB: number) => number | DynamicBatchConfig;
   onProgress?: (progress: { phase: string; percent: number }) => void;
   onBatch?: (event: StepBatchEvent) => void;
   onColorUpdate?: (updates: Map<number, RgbaColor>) => void;
   onSpatialReady?: (dataStore: IfcDataStore) => void;
   onRtcOffset?: (event: StepRtcOffsetEvent) => void;
   shouldAbort?: () => boolean;
+  /** Shared RTC offset from first federated model (IFC Z-up coords).
+   *  When set, this model uses the same RTC as the first model instead of
+   *  computing its own, ensuring all models share the same coordinate space. */
+  sharedRtcOffset?: { x: number; y: number; z: number };
 }
 
 export interface StepBufferIngestResult extends ViewerModelPayload {
@@ -204,6 +208,7 @@ export async function parseStepBufferViewerModel(options: StepBufferIngestOption
   for await (const event of geometryProcessor.processAdaptive(new Uint8Array(options.buffer), {
     sizeThreshold: 2 * 1024 * 1024,
     batchSize: options.getDynamicBatchSize(options.fileSizeMB),
+    sharedRtcOffset: options.sharedRtcOffset,
   })) {
     if (options.shouldAbort?.()) {
       break;